CSS清除浮動(dòng)與截取文字

1.幾種常用的清除浮動(dòng)方法

<style type="text/css"> 
   .div1{background:#000080;border:1px solid red;}
   .div2{background:#800080;border:1px solid red;height:100px;margin-top:10px}
   
   .left{float:left;width:20%;height:200px;background:#DDD}
   .right{float:right;width:30%;height:80px;background:#DDD}
   
   /*清除浮動(dòng)代碼*/
   .clearfloat:after{display:block;clear:both;content:"";visibility:hidden;height:0}
   .clearfloat{zoom:1}
   </style> 
<div class="div1 clearfloat"> 
<div class="left">Left</div> 
<div class="right">Right</div> 
</div>
<div class="div2">
   div2
   </div>

2.自動(dòng)截取文字,css實(shí)現(xiàn)文字超出顯示省略匯總

單行:
     text-overflow: ellipsis;
     white-space: nowrap;/*禁止自動(dòng)換行*/
     overflow: hidden;
雙行:
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;  // 控制多行的行數(shù)
    -webkit-box-orient: vertical;
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補(bǔ)...
    _Yfling閱讀 14,189評(píng)論 1 92
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML標(biāo)準(zhǔn)。 注意:講述HT...
    kismetajun閱讀 28,868評(píng)論 1 45
  • 1.CSS基本概念 1.1 CSS的定義 CSS(Cascading Style Sheets)層疊樣式表,主要用...
    寥寥十一閱讀 2,081評(píng)論 0 6
  • 人的一生真的說長(zhǎng)不長(zhǎng),說短不短,而我們卻會(huì)在生活里見到無數(shù)的陌生人,他們有的會(huì)讓我們?yōu)橹畠A心,也有的會(huì)讓我...
    芝薇閱讀 1,292評(píng)論 0 0
  • 為什么喜歡酒 倒不是因?yàn)樗芙獬?而是因?yàn)樗芾寺?/div>
    夢(mèng)中隨夢(mèng)境閱讀 169評(píng)論 0 0

友情鏈接更多精彩內(nèi)容