小知识点

1.移动端只显示两行文本，多余的用省略号控制

{
  display: -webkit-box;       //弹性盒子模型的声明，子节点将会按照box-flex的值，来分配父标签的宽度(或高度)空间，
                              //参考：http://www.zhangxinxu.com/wordpress/?p=1338
  height: 2.8em;              //一行是1.4em, line-height:1.4em
  overflow: hidden;           //超出部分隐藏
 -webkit-line-clamp: 2;       //显示两行
 -webkit-box-orient: vertical;//文本水平排列
}

目前在webkit内核的浏览器，或者移动端，是可以实现多行文本内容超出点点点，另外在div中有文本，最后是文本用span标签包括起来，如：

<div class="content-text">
     <span>
     点击“互联网个人信用信息服务平台”后，跳转至如下界面，
     </span>
</div>

2.getBoundingClientRect获取的height可能与css设置的height不一致

  参考博客：https://www.cnblogs.com/limeiky/p/6179964.html

 clientTop: //元素的border厚度

offsetTop //元素（不包含边界）到包含该元素块（定位为相对或者绝对）上边界的高度。

3.伪类

 仔细研究博客：http://blog.csdn.net/xxssyyyyssxx/article/details/53127416

4. background-repeat属性

  设置是否及如何重复背景图像，可能的值有：repeat、repeat-x、repeat-y、no-repeat和inherit。

5.overflow 属性 

   元素被裁剪时，怎么展示，有auto,scroll,hidden,visible,inherit五个属性。

6.在内联元素中强制换行

 word-wrap: break-word; 而且内联元素不能缩进。

7.居中

 盒模型的auto属性顺序是从左向右覆盖，它也是对块级元素设置居中的一个方法。

8.text-align属性

它是来设置内联元素居中,对应的垂直对齐vertical-align,该属性定义行内元素的基线相对于该元素所在行的基线的垂直对齐，如果容器布局为flex，那么容器内的vertical-align会失效。

9.外边距合并

水平外边距不能合并，两个垂直外边距相遇，它们将形成一个外边距。这叫做外边距合并！合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。

10.边框宽度不能是百分数

11.去掉input组件中的默认蓝色边框

input,button{
         -webkit-tap-highlight-color: rgba(0, 0, 0, 0);    
         -webkit-user-modify: read-write-plaintext-only;
         outline: none;
    }