关于css方面的技巧
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了关于css方面的技巧相关的知识，希望对你有一定的参考价值。
1.用span完成三角形的写法
span{
display: inline-block;
width: 0px;
height: 0px;
border: 10px solid transparent;
border-top: 10px solid #fff;
}
2.多行文字超出以......的实行显示
p{
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 11;
overflow: hidden;
text-overflow: ellipsis;
}
3.块状元素使vertical-align:middle有效的方法
父元素需要 vertical-align:middle
然后为元素before:{
content: "";
display: inline-block;
vertical-align: middle;
height: 100%;
}
需要居中的元素也vertical-align：middle;
4.元素水平垂直居中的方法
1.ele{
position: absolute;
left: 35%;
top: 55%;
margin-top: -320px;
margin-left: -130px;
}
2.css实现窗口变化时，元素仍然居中
.ele {
width: 50%;
margin: auto;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
}
以上是关于关于css方面的技巧的主要内容，如果未能解决你的问题，请参考以下文章