梳理下平时常用css水平垂直居中方式～ 使用flex布局 HTML CSS 利用flex的 垂直居中， 水平居中 利用相对定位和绝对定位的 HTML CSS 相对定位下，使用绝对定位将上下左右都设置为0，再设置 即可实现居中 利用相对定位和绝对定位，再加上外边距和平移的配合 HTML CSS 相对定 ...
分类：
Web程序 时间：
2020-05-04 13:23:36
阅读次数：
77
对比一下常用的三种布局： 1.传统布局方式：利用position属性+display属性+float属性，兼容性最好，但是效率低，麻烦 2.flex布局：效率高，学习成本低，兼容性强 3.grid:翻译网格，grid布局相对于flex布局稍微复杂那么一点点，但grid布局比flex布局更强大。 有一 ...
分类：
其他好文 时间：
2020-05-02 21:00:42
阅读次数：
92
案例基础布局 html <ul class="box"> <li class="item"></li> <li class="item"></li> <li class="item"></li> <li class="item"></li> </ul> css .box{ display: -web ...
分类：
其他好文 时间：
2020-05-02 13:25:00
阅读次数：
55
弹性盒子 使用弹性布局，首先要将父盒子定义为弹性盒子。 display: flex display: inline flex 行级弹性盒子,类似inline block 弹性元素 弹性盒子内的元素称为”弹性元素“。 弹性布局实际上就是要对弹性元素的排列做各种设置。 排列方向 flex directi ...
分类：
Web程序 时间：
2020-05-02 12:17:44
阅读次数：
86
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, ...
分类：
其他好文 时间：
2020-05-01 20:54:41
阅读次数：
68
flex中align-self给指定的iitem(子元素)设置对齐方式 <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, ...
分类：
其他好文 时间：
2020-05-01 20:47:21
阅读次数：
72
代码实现 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style> .f{display:flex;} .f1{flex:1;} .ac{align-items:center;} .w50px{width:50px;} .w100{wi ...
分类：
其他好文 时间：
2020-05-01 14:47:10
阅读次数：
66
1007 素数对猜想 (20分) 让我们定义d?n??为：d?n??=p?n+1???p?n??，其中p?i??是第i个素数。显然有d?1??=1，且对于n>1有d?n??是偶数。“素数对猜想”认为“存在无穷多对相邻且差为2的素数”。 现给定任意正整数N(<10?5??)，请计算不超过N的满足猜想的 ...
分类：
其他好文 时间：
2020-05-01 11:01:56
阅读次数：
44
前言 在本文中将会用Vue完成九宫格拖拽效果，同时介绍一下网格布局。具体代码以及demo可以点以下超链接进入 传送门：Demo以及完整代码连接 效果实例 简单了解Grid布局（网格布局） 什么是网格布局 CSS网格布局（又称“网格”），是一种二维网格布局系统。CSS在处理网页布局方面一直做的不是很好 ...
分类：
其他好文 时间：
2020-04-30 09:53:07
阅读次数：
51
1.在index.wxcss里设置 第三个元素类i3里单独设置 align-items: flex-end; 全部元素设置 align-items: baseline（解释：以文字进行对齐）; 2.在index.wxml里设置 class="item i3" 3.交叉轴上的布局 4.1flex-gr ...
分类：
其他好文 时间：
2020-04-29 17:55:58
阅读次数：
69
