常用CSS属性

常用CSS属性

1.分界线
border-bottom: 


2.边框阴影
box-shadow: 0 0 20px 2px #BEBCBCFF;

3.颜色（淡灰色和白色，常用于背景颜色的对比）
#f5f7fa
#fff

4.文本指定条件省略号显示
overflow-y: hidden;
display: -webkit-box; /*根据不同标签display，有的不用加。或者设置成别的属性，自己可以随便试试*/
-webkit-box-orient: vertical;
text-overflow: ellipsis; /*文字超出部分以省略号显示*/
-webkit-line-clamp: 2; /*这里就是设置超出几行隐藏*/


5.div的子标签在div中居中对齐（前提没有其他布局模式生效）
text-align:center

6.全局居中
position: fixed;
top: 50%;
left: 50%;
transform: translateX(-50%) translateY(-50%);

7.列表滚动显示
overflow:scroll; /*内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。或者overflow:auto;*/

overflow:visible; /*默认值。内容不会被修剪，会呈现在元素框之外。*/
overflow:hidden; /*内容会被修剪，并且其余内容是不可见的。*/
overflow:scroll; /*内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。*/
overflow:auto; /*如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。*/


8.模态框
.mask {
  position: fixed;
  z-index: 1;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  opacity: .5;
  background: #f2f2f2;
  background-repeat: no-repeat;
  background-size: cover;
}
.mapAndInfo {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  z-index: 2;
  width: 1300px;
  height: 750px;
  border-radius: 10px;
  box-shadow: 0 0 20px 2px #BEBCBCFF;
}

9.操作数组
push(item1) 将一个、多个加到末尾，返回新长度。修改原有数组
splice(start, deleteCount [,item1,…])	 start 后面deleteCount个元素被删除（含第 start 位）。若只删除了一个，则返回只包含一个元素的数组。若没有删除元素，则返回空数组。此方法修改原数组。