css 常用技巧

文本超出分号：

overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;

overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
word-break: break-all;

-webkit-line-clamp: 2;
-moz-line-clamp: 2;
-o-line-clamp: 2;
-ms-line-clamp: 2;

媒介查询

/* iphone4 */
@media screen and (device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 2){}
/* iphone5 */
@media screen and (device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2){}
屏幕在1200-1500之间
@media screen and (min-width:1200px) and (max-width:1500px){}

禁止IOS滚动条

阻止默认
$("body").on("touchmove",function(event){
event.preventDefault;
}, false)
然后点击取消或者确定时再取消body上的绑定
$("body").off("touchmove")；

li:nth-of-type(odd)单数
li:nth-of-type(even) 偶数
text-decoration:line-through;  上划线
li:last-child  最后一个元素


图片上下居中
display:table-cell;
text-align:center;
vertical-align:middle;

图片上下居中 flaot
.goods_indexTwo a .right{
 width: 126px;
 height: 180px;
 display: flex;
 align-items: center;
}
.goods_indexTwo a .right img{
 width: 126px;
 height: auto;
 display: inline-block;
 vertical-align: middle;
}