网页元素按照类型分为三种类型块状元素（div p ul h1 等）内联元素（span label a strong em 等）内联块状元素（img input 等）块状元素的特征是独占一行，之后的元素也会另起一行，不过块状元素可以通过display:inline,设置为内联元素。内联元素是在一行中， ...
分类：
Web程序 时间：
2017-12-31 02:54:09
阅读次数：
150
flex 基本概念 使用 flex 布局首先要设置父容器 display: flex，然后再设置 justify-content: center 实现水平居中，最后设置 align-items: center 实现垂直居中。 CSS： 是的，flex 的确没有那么简单，这就要从两个基本概念说起了。 ...
分类：
其他好文 时间：
2017-12-30 19:07:55
阅读次数：
232
之前说过了CSS有三种基本的布局机制：普通流、浮动和绝对定位。除非专门指定，否则所有的框都在普通流中定位。而普通流中元素框的位置由元素在HTML中的位置决定。 相对定位 相对定位实际上被看做普通流定位模型中的一部分，因为它是通过设置垂直或者水平位置，让这个元素相对于它原来的位置移动。而且，虽然它从原 ...
分类：
Web程序 时间：
2017-12-28 17:15:49
阅读次数：
184
需求： 图片的宽高是不固定的，但是外部盒子是有固定大小的。 图片的宽度和盒子保持一致，并且是水平居中显示，即两边是裁剪的 图片的高度是由盒子宽度控制的，等比例缩放，多余的被裁减掉 原图： 代码： 效果： 第一种是底部对齐，裁剪顶部 第二种是顶部对齐，裁剪底部 第三种是在固定容器内等比例显示图片 ...
分类：
Web程序 时间：
2017-12-25 18:21:24
阅读次数：
384
ul li { position:relative; display: table; width:3rem; height:3rem; background:url('image/defaultBg.jpg') 0 0/100% 100% no-repeat; float:le... ...
分类：
Web程序 时间：
2017-12-13 23:34:03
阅读次数：
197
利用弹性布局进行垂直居中,要垂直的元素如果很多,可以用一个大的div包裹,然后 bigDiv { display: flex; justify-content: center; //水平居中 align-items: center; //垂直居中 } ...
分类：
Web程序 时间：
2017-12-12 22:16:37
阅读次数：
236
display: block; "块级元素". display: inline; "行内元素". display: none; "在不删除元素的情况下,隐藏元素,不会占据它本来显示的空间" visibility: hidden; "隐藏元素,但是会占据空间" tip:CSS最重要的控制布局的属性di... ...
分类：
Web程序 时间：
2017-12-12 12:25:43
阅读次数：
161
1. 实现DIV水平居中 设置DIV的宽高，使用margin设置边距0 auto，CSS自动算出左右边距，使得DIV居中。 缺点：需要设置div的宽度 2. 实现DIV水平、垂直居中 要让DIV水平和垂直居中，必需知道该DIV得宽度和高度，然后设置位置为绝对位置，距离页面窗口左边框和上边框的距离设置 ...
分类：
其他好文 时间：
2017-12-06 20:07:45
阅读次数：
198
以前总是以为vertical-align与text-align是同样的道理，一个是垂直居中，一个是水平居中，结果在这里一点效果也没有。事实上vertical-align与text-align完全不一样，vertical-align不能这样用。 vertical-align 属性设置元素的垂直对齐方式 ...
分类：
其他好文 时间：
2017-12-06 20:05:56
阅读次数：
147
