css常用属性记录

超出换行：

white-space:nowrap;

text-overflow:ellipsis; -o-text-overflow:ellipsis;

overflow:hidden;

背景图片

background:url("/HDWXInternetHospital/fronthtml/img/images/bg1.png") left top no-repeat;
background-size:100% 8rem !important

…………………………………………………………………………………………

常用标题

font-size: 0.75rem;
margin-left: 0.7rem;
line-height: 1.9rem;
text-align: center;
4.5rem;
height: 1.9rem;
background: #EEEEEE;
border-radius: 0.2rem;
margin-right: 0.7rem;

letter-spacing:.05rem;
…………………………………………………………………………………………

自动换行：

100%;
height: auto;
word-wrap:break-word;
word-break:break-all;
overflow: hidden;

…………………………………………………………………………………………

遮罩层：

.modal_back{
display: none;
position: absolute;
top: 0%;
left: 0%;
100%;
height: 100%;
background-color: black;
z-index:2000;
-moz-opacity: 0.4;
opacity:.40;
filter: alpha(opacity=40);
}

…………………………………………………………………………………………

after使用，实现竖线

.hospital-navigation-conent h5:after {
content: '';
position: absolute;
left: 0;
top: 0.83rem;
height: .8rem;
1px;
margin-left: -0.55rem;
display: block;
border-left: 1px solid #f7817d;/** #3499e6;*/
z-index: 15;
}

after使用，实现横线

content: '';
position: absolute;
left: 50%;
transform: translate(-50%,0);
bottom: -.22rem;
1.5rem;
height: 1px;
display: block;
border-bottom: 2px solid #42A0E2;
z-index: 15;

…………………………………………………………………………………………

transform实现旋转

#div2
{
padding:50px;
position: absolute;
border: 1px solid black;
background-color: red;
transform: rotate(45deg);
transform-origin:10% 40%;
-ms-transform: rotate(45deg); /* IE 9 */
-ms-transform-origin:20% 40%; /* IE 9 */
-webkit-transform: rotate(45deg); /* Safari and Chrome */
-webkit-transform-origin:20% 40%; /* Safari and Chrome */
}

Swiper日期滑动
jquery带右侧索引通讯录：
http://blog.csdn.net/ziwoods/article/details/72301537

 超出换行

 

　　

　　

　　

$(".txtScroll-top1 ul li p:nth-child(1)").wordLimit();