摘要：
flex布局 flex是flexible Box的缩写,为"弹性布局" 用,来为盒状模型提供最大的灵活性,任何一个容器都可以指定为flex布局。 ●当我们为父盒子设为flex布局以后,元素的float、 clear 和vertical-align属性将失效。 ●伸缩布局=弹性布局=伸缩盒布局=弹性盒 阅读全文
摘要：
盒子模型 盒模型：分为内容（content）、填充（padding）、边界（margin）、边框（border）四个部分 传统盒子模型（W3C标准盒模型content-box）：盒子的宽度 = CSS中设置的width + border + padding CSS3盒子模型（IE盒模型border- 阅读全文
摘要：
动画 动画的基本使用 制作动画分为两步： 1.先定义动画 2.再使用（调用动画） 1.用keyframes定义动画 @keyframes 动画名称{ 0%{ width: 100px; } 100%{ width: 200px; } } 动画序列 ●0%是动画的开始, 100%是动画的完成。这样的规 阅读全文
摘要：
2D转换 移动translate 2D移动是2D转换里面的一种功能，可以改变元素在页面中的位置，类似定位 1.语法 transform: translate(x,y); 或者分开写 transform: translateX(n) ; transform: translateY(n) ; 2.重点 阅读全文
摘要：
CSS3选择器 CSS3属性选择器 选择符 简介 E[att] 选择具有att属性的E元素 E[att="val"] 选择具有att属性，且属性值为val的E元素 E[att^="val"] 匹配具有att属性，且值以val开头的E元素 E[att$="val"] 匹配具有att属性，且值以val结 阅读全文
摘要：
H5新增语义化标签 ●header(头部标签) ●nav(导航标签) ●article(内容标签) ●section(块级标签) ●aside(侧边栏标签) ●footer(尾部标签) ●这种语义化标准主要针对搜索引擎的 ●这些新标签页面中可以使用多次的 ●在IE9中,需要把这些元素转换为块级元素 阅读全文
摘要：
我们用css边框可以模拟三角效果 1.宽度高度为0 2.我们4个边框都要写，只保留需要的边框颜色，其余的不能省略,都改为transparent透明就好了 3.为照顾兼容性低版本的浏览器，加上font-size: 0; line-hpeight: 0; <!DOCTYPE html> <html la 阅读全文
摘要：
单行 /*1.先强制一行内显示文本*/ white-space: nowrap; /*2.超出的部分隐藏*/ overflow: hidden; /*3.文字用省略号替代超出的部分*/ text-overflow: ellipsis; 多行 /*1.将对象作为弹性伸缩盒子模型显示*/ display 阅读全文
摘要：
vertical-align：垂直对齐 ●有宽度的块级元素居中对齐，是margin: 0 auto; ●让这字居中对齐,是text-align: center; vertical-align垂直对齐，它只针对于行内元素或者行内块元素 vertical-align : baseline| top| m 阅读全文
摘要：
CSS布局的三种机制 CSS提供3种机制来设置盒子的摆放位置，分别是普通流（标准流）、浮动和定位。 1.普通流(标准流) 块级元素会独占一行,从上向下顺序排列; ■常用元素: div、 hr、 p、h1~h6、 ul、ol、dl、form、table 行内元素会按照顺序，从左到右顺序排列 阅读全文