流体布局容器 容器的width为auto，只是两边加了15px的padding。 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" href="css/bootstr ...
分类：
其他好文 时间：
2019-11-07 12:50:44
阅读次数：
85
PC及移动端页面适配方法 设备屏幕有多种不同的分辨率，页面适配方案有如下几种： 1、全适配：响应式布局+流体布局2、移动端适配： 流体布局+少量响应式 基于rem的布局 流体布局 流体布局，就是使用百分比来设置元素的宽度，元素的高度按实际高度写固定值，流体布局中，元素的边线无法用百分比，可以使用样式 ...
分类：
其他好文 时间：
2019-03-10 09:19:11
阅读次数：
163
浮动布局： dom文档 1： 固定布局： 实现如图 样式: 关键点：box1 和box2设置固定width,浮动， 2：流体布局 和固定布局对比： box1 float left 设置width box2: marign-left 为box1.width (效果和固定效果一样，不截图了) 3：浮动与 ...
分类：
其他好文 时间：
2018-11-19 12:30:49
阅读次数：
167
一、几类视图 内联视图：inline 单行 块级视图：block 换行，有高度 行内块级视图：inline-block 单行，有高度 二、几类布局 块级布局 换行，通过设置 margin 水平居中 source： 浮动布局 单行，类似流体布局 source： 若全为浮动，则父容器会高度塌陷，需要在此 ...
分类：
其他好文 时间：
2018-10-21 19:32:25
阅读次数：
166
一、流体布局 所谓的流体布局，就是用百分比来定义宽度，最外层容器的宽度设置为100%，就可以适配不同的屏幕，子元素按照比例来设置百分比，子元素整体的百分比之和就是100%，但是如果有子元素设置了边框，或者padding，那么整体的宽度就会大于100%，这时，我们可以将盒子的尺寸计算方式设置为从边框计 ...
分类：
移动开发 时间：
2018-09-05 17:39:45
阅读次数：
177
Margin和Padding是我们在网页设计经常使用到的CSS样式，他们分别是间距和填充，一个作用于盒子外面，一个作用于盒子里面，默认的情况下，这些属性的值都会被计算在盒子的面积里面，在网页开发中的流体布局或者是响应式布局中，经常将Margin和Padding设置成百分数，那么到底这个百分数是多少， ...
分类：
其他好文 时间：
2018-02-03 20:00:26
阅读次数：
397
calc()是css3的一个新增的功能，用来指定元素的长度。比如说，你可以使用calc()给元素的border、margin、pading、font-size和width等属性设置动态值。calc()最大的好处就是用在流体布局上，可以通过calc()计算得到元素的宽度。 calc(）语法： 加 （+ ...
分类：
Web程序 时间：
2017-11-21 14:33:43
阅读次数：
240
calc()是css3的一个新增的功能，用来指定元素的长度。比如说，你可以使用calc()给元素的border、margin、pading、font-size和width等属性设置动态值。calc()最大的好处就是用在流体布局上，可以通过calc()计算得到元素的宽度。 calc(）语法： 加 （+ ...
分类：
Web程序 时间：
2017-11-20 17:37:52
阅读次数：
330
浮动及清除浮动 浮动最初的目的：实现文字环绕； 浮动具有破坏性，会破坏父元素高度（类似的还有：display：none；position：absolute/fixed/sticky） 浮动适合流体布局： .mib_head_a { width: 56px; float: left; } /* 下面这 ...
分类：
Web程序 时间：
2017-10-23 19:24:35
阅读次数：
238
1.流体布局 2.圣杯布局 3.双飞翼布局 4.flex布局 5.绝对定位布局 6.table布局 ...
分类：
其他好文 时间：
2017-07-22 18:27:54
阅读次数：
201
