CSS经验总结

1、 让div的大小随着内容的变化而变化

div{
    display: inline-block; /* 行内块级元素 */
    width: auto;
    height:auto;
    border: 1px solid #ccc; 
    padding:8px;
}

2、文本自动换行

.text {
    position: relative;
    display: block;
    border-radius:10px;
    max-width: 223px;
    height: auto;
    padding: 11px 20px 19px 17px;
    font-size:14px;
    color:#4a4a4a;
    resize: none;
    word-break: break-all;/*自动换行*/
    word-wrap: break-word;/*以单词换行*/
    white-space: pre-wrap;
    float: left;
}

3、截取字符串

.text{ 
    width:200px;  
    overflow:hidden; 
    white-space:nowrap; 
    text-overflow:ellipsis; 
    text-overflow: ellipsis;/* IE/Safari */ 
    -ms-text-overflow: ellipsis; 
    -o-text-overflow: ellipsis;/* Opera */ 
    -moz-binding: url("ellipsis.xml#ellipsis");/*FireFox*/ 
} 

 

上一篇:关于table表格超长连续字段(长数字和长单词) 破坏表格布局的问题的解决方案


下一篇:React 多行省略的展开与收起