盒子模型 CSS传统的盒子模型 (content + padding + border) 盒子的Width : content_width + 左右padding + 左右border 在css3 中 型添加了盒子模型属性 （box sizing） box sizing : content box ...
分类：
其他好文 时间：
2019-12-21 20:59:28
阅读次数：
70
最近在维护一些老的项目，需要兼容ie7 ，css3就不能用了，这里总结一下碰到的问题及解决方案。 1、盒模型 ie7、8 的盒模型都是 box-sizing为content-box的盒模型，这里在做的时候就要注意 2、display：inline-block 碰到使用块级元素的场景 有兼容写法 *d ...
分类：
其他好文 时间：
2019-12-20 11:44:22
阅读次数：
94
CSS自定义属性（变量）CSSbox-sizing属性允许我们在元素的总宽度和高度中包含填充和边框。没有CSSbox-sizing属性默认情况下，元素的宽度和高度计算如下：width+padding+border=元素的实际宽度height+padding+border=元素的实际高度这意味着：当您设置元素的宽度/高度时，元素通常看起来比您设置的大（因为元素的边框和填充被添加到元素的指定宽度/高度
分类：
Web程序 时间：
2019-12-19 23:37:14
阅读次数：
130
<!DOCTYPE html> <html> <!-- author : wsj aim : bky date : 2019-12 bug : no --> <body> <style> .father{ width: 100%; box-sizing: border-box; column-cou ...
分类：
其他好文 时间：
2019-12-19 18:54:36
阅读次数：
86
盒子的组成： 外边距：margin 一个元素与另一个元素的距离 边框：border 内边距：padding 内容：content 标准盒：总宽度=width+左右内边距+左右边框 总高度=height+上下内边距+上下内边距 IE盒：box-sizing:border-box; 设置的宽高是总的宽高 ...
分类：
其他好文 时间：
2019-12-16 22:09:16
阅读次数：
91
栅格系统布局主要被绑定在Bootstrap之类的框架上 ，那么我们如果不需要接入整个框架，做一个自己的栅格化的布局该怎么做呢？ 1.容器container ，设置box-sizing：border-box；设置整个布局的宽度通常为100%为例； 2.行row，防止溢出行 需要清楚浮动clear：bo ...
分类：
其他好文 时间：
2019-12-15 18:12:00
阅读次数：
146
问题box-sizing 触发 结构 <div class="wrapper"> <!-- 头部--> <header class="clearfix"> <h2 class="fl">家电</h2> <span class="nav fr"> <a href="">热门</a> <a href=" ...
分类：
其他好文 时间：
2019-11-24 17:26:05
阅读次数：
65
重要内容处设置断点breakpoint CSS * { margin: 0; box-sizing: border-box; border: 0; padding: 0; font-weight: bold; } body { text-align: center; } .container { m ...
分类：
其他好文 时间：
2019-11-23 10:10:10
阅读次数：
110
border-box告诉浏览器去理解你设置的边框和内边距的值是包含在width内的。 换句话说，如果你将一个元素的width设为100px,那么这100px会包含它的border和padding，内容区的实际宽度会是width减去border + padding的计算值。 如何计算的？ width ...
分类：
Web程序 时间：
2019-11-22 01:02:02
阅读次数：
96
一、% 理解： %号是CSS中的常用单位，它是相对于父容器而言的。如:一个父容器的宽是100px,给它的子元素一个10%，那么子元素的宽就是100px的10% 10px。 效果图： （利用%设置了li 的宽） 代码： <!DOCTYPE html> <html lang="en"> <head> < ...
分类：
Web程序 时间：
2019-11-17 10:40:48
阅读次数：
53
