2016.11.16 H5+css3（补充1）

css：UI元素伟类选择器：最常见的错误是认为 p:first-child 之类的选择器会选择 p 元素的第一个子元素。outline（轮廓）是绘制于元素周围的一条线，位于边框边缘的外围，可起到突出元素的作用。outline:#00FF00 dotted thick;（和平常border属性设置一样）。::selection{ 选中改变背景颜色， }（直接::，用，全局。单独选就用选择器）。input中：Email属性判断是否正确。:valid（伪类）（输入合法）：该选择器只能使用到form元素上，例如当input元素带有min、max属性、email领域的值不合法、数字领域的值不是数字时，等等。:invalid（伪类）（输入不合法）。：required（必填项，）。：optional（可输入）。

使用选择器插入内容。：before{content:" 加入内容"（可加入图片，url），其他属性},（counter-increment:hajsq(计数器名称)）.

content：counter：（“  ”）。
文字阴影与自动换行： text-shadow:   ,    ,      （可设置多个阴影）。  word-break（自动换行）。

使用服务器端字体：@font-face{font:family:   ; src:url('')}

多兰布局：  column-count（分栏数） column-width: 10em;/*每栏目的宽度*/    column-gap: 2em;/*每栏目之间的距离*/                  column-rule: 1px solid red;/*分割线*/

盒布局：在css3中使用box属性来盒布局（火狐：display:moz-box  谷歌  webkit-box（在大div中使用））.

弹性盒布局：   display: flex;  flex-direction:row ;//column（大div中） order:1;（2,3  顺序）。使用弹性盒子布局来消除空白： flex: 1;（在每个div中设置）。未使用flex属性的div高度(宽度)是指文本的高度(宽度) 。使用flex属性的div会平分剩余的空间。

指定水平方向与垂直方向的对齐方式： display: flex; justify-content: space-around;/*水平方向的对齐方式*/   /*align-items: baseline;*//*垂直方向上的对齐方式*/ 。使用flex-wrap:wrap/nowrap/wrap-reverse进行换行显示。

@media 设备类型 and （设备特征）{样式代码}。

  对齐方式：顶部对齐vertical-align:top.