对于一些产品/个人展示用的页面，项目要求是“新颖，酷炫，吊炸天”。所谓的“按钮”其实是指“拥有复杂动画效果的可点击元素”，比如仿安卓Ripple效果的按钮（虽然也可以用button做出来，这里供理解用），拟物的开关等等。在或者是只有部分浏览器支持的新标签/属性：<progress><inputtype="date"/>等等，为了达到浏览器兼容，通常都是用<div>封装。加上现...

方法一：使用定位属性设置父元素为相对定位，给子元素设置绝对定位，left:50%;top:50%;transform:translateX(-50%)translateY(-50%);方案二：使用flex布局实现设置父元素为flex定位，justify-content:center;align-items:center;6.BFC的布局规则，实现原理，可以解决的问题BFC直译为块...

行内元素水平居中：首先看它的父元素是不是块级元素，如果是，则直接给父元素设置text-align:center;如果不是，则先将其父元素设置为块级元素，再给父元素设置text-align:center;块级元素水平居中(定宽度)：1）需要谁居中，给其设置margin:0auto;（作用：使盒子自己居中）2)首先设置父元素为相对定位，再设置子元素为绝对定位，设置子元素的left:5...

1）、static定位(普通流定位)--------------默认定位2）、float定位(浮动定位)例：float:left;有两个取值：left(左浮动)和right(右浮动)。浮动元素会在没有浮动元素的上方，效果上看是遮挡住了没有浮动的元素，有float样式规则的元素是脱离文档流的，它的父元素的高度并不能有它撑开。3）、relative定位(相对定位)position:relati...

伪类的例子有：:hover:active:first-child:visited等。伪元素的例子有：:first-line:first-letter:after:before伪类和伪元素的根本区别在于：它们是否创造了新的元素(抽象)。从我们模仿其意义的角度来看，如果需要添加新元素加以标识的，就是伪元素，反之，如果只需要在既有元素上添加类别的，就是伪类。伪元素在一个选择器里只能出现一次，并且只能出现...

list-style、list-style-type、list-style-position、list-style-image/*定义字符集*/@charset"utf-8"/*导入css文件*/@import"base.css"/*自定义字体*/@font-face{}/*声明CSS3animation动画关键帧*/@keyframesfadeIn{}/*媒体查询*/@media{}

display、margin、border、padding、background、height、min-height、max-height、width、min-width、max-width、overflow、position、top、bottom、left、right、z-index、float、clear、table-layout、vertical-align、page-break-afte...

id选择器：#header{}class选择器：.header{}元素选择器：div{}子选择器：ul>li{}后代选择器：divp{}伪类选择器：:hover、::selection、.action、:first-child、:last-child、:first-of-type、:last-of-type、:nth-of-type(n)、:nth-of-last-type(n)等,例如a:...

IE盒子模型如下图：图中的内层是content依次是contentpaddingborder。通常我们设置背景时就是内容、内边距、边框这三部分。而外边距是透明的，不会遮挡其他元素。元素框的总宽度=width（padding-left+padding-right+border-left+border-right)；元素框的总高度=height（padding-top+padding-bottom...

css盒子模型又称为框模型（BoxModel），包含了元素内容（content）、内边距（padding）、边框（border）、外边距（margin）几个要素。如下图：图中的内层是content依次是paddingbordermargin。通常我们设置背景时就是内容、内边距、边框这三部分，如果border设置颜色的时候会显示boder颜色当boder颜色是透明时会显示background...