文字省略号显示

省略号的颜色，是由父元素的文本颜色决定的，而不是由自身的颜色决定的

max-width: 110px;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
text-overflow: ellipsis;
overflow: hidden;
word-break: break-all;//解决纯数字或者字母不换行问题

背景颜色透明

background: transparent;//透明色
opacity:0;//透明（部分情况会是的点击事件无效）

flex布局 某一项防止被压缩

flex-shrink: 0;

调整竖直高度

vertical-align: 3px;//display: inline-block;可用这个，往上移3px

margin-top:3px;//float:left；的时候可用，更简单

部分圆角

// 左上 右上 右下 左下
border-radius: 0px 6px 6px 0px;

高斯模糊

filter:blur(16rpx);

padding 不会增加区域

box-sizing: border-box;

nth-child是从1开始的

ul li:nth-child(1)

背景图片铺满 css3

background:url('a.png') no-repeat;
background-size:cover;

水平滚动

overflow-x: auto;
white-space:nowrap;
width: auto;

定义手机端整体宽度750rem 代码需要放在body当中

//部分安卓手机获取不到屏幕宽度，需要默认设置一个宽度
<script>
    var _winWidth=document.body.clientWidth || document.documentElement.clientWidth,_style=document.getElementsByTagName("html")[0].style;
    _winWidth >=750 ? _style.fontSize = "100px" : _style.fontSize = _winWidth/7.5 + "px";
</script>

鼠标箭头 css cursor:

auto                    ：标准光标  
default                 ：标准箭头  
pointer, hand           ：手形光标  
wait                    ：等待光标  
text                    ：I形光标  
vertical-text           ：水平I形光标  
no-drop                 ：不可拖动光标  
not-allowed             ：无效光标  
help                    ：帮助光标  
all-scroll              ：三角方向标  
move                    ：移动标  
crosshair               ：十字标  
e-resize                ：east 向右拉动窗口大小的光标，一下都是
n-resize  
nw-resize  
w-resize  
s-resize  
se-resize  
sw-resize

textarea

resize:none

阴影

/* 水平偏移 垂直偏移 模糊度 阴影扩展 阴影颜色 内外阴影（默认是外阴影,inset内阴影） */
box-shadow: 10px 20px 5px 40px black inset;
/* 阴影颜色如果不写 会默认盒子文字的颜色 */
box-shadow: 10px 20px 5px;

/* 文字的阴影 参数比较少 */
/* 水平偏移 垂直偏移 模糊度 阴影颜色（也是可以省略的） */
text-shadow:  10px 20px 5px green;

ul去除小点

ul{list-style: none;}

li横向排列

li{float: left;}

margin

竖直方向会按重叠 水平方向不会重叠