欧美超薄遮肉裤|古代打板子视频|驴一样的女婿全文免费阅读|无人区卡一卡二入口|动漫视频网站|抖音王大炮资源|色愁愁久久久

text-overflow

語法:

text-overflow:clip | ellipsis

默認(rèn)值clip

適用于:塊級容器元素

繼承性:無

動畫性:否

計(jì)算值:指定值

取值:

clip:
當(dāng)內(nèi)聯(lián)內(nèi)容溢出塊容器時(shí),將溢出部分裁切掉。
ellipsis:
當(dāng)內(nèi)聯(lián)內(nèi)容溢出塊容器時(shí),將溢出部分替換為(...)。

說明:

當(dāng)塊容器 <' overflow '> 為非visible時(shí),定義內(nèi)聯(lián)內(nèi)容溢出其塊容器是否截?cái)嗷蛘咛砑?...)及自定義字符
  • 要使得 <' text-overflow '> 屬性生效,塊容器必須顯式定義 <' overflow '> 為非visible值,同時(shí)顯式或者隱式的定義 <' width '> 為非auto值, <' white-space '> 為nowrap值。

    用代碼來解釋這段話:

    case 1:

    <style> .demo p{overflow:hidden;width:200px;white-space:nowrap;text-overflow:ellipsis;} </style> <div id="y38czr3" class="demo"> <p>這是一句非常非常長的話,被用來做text-overflow屬性測試。</p> </div>

    case 1,我們將text-overflow生效必備的3個屬性: <' overflow '> , <' width '> 和 <' white-space '> 都直接定義在了內(nèi)聯(lián)內(nèi)容的父級塊容器上

    case 2:

    <style> .demo{width:200px;white-space:nowrap;} .demo p{overflow:hidden;text-overflow:ellipsis;} </style> <div id="izgnxu3" class="demo"> <p>這是一句非常非常長的話,被用來做text-overflow屬性測試。</p> </div>

    case 2,我們將 <' width '> 和 <' white-space '> 定義在了更外層的塊容器上,但case 1和case 2的效果是一樣的。因?yàn)檫@2個屬性可以被繼承

  • 對應(yīng)的腳本特性為textOverflow

兼容性:

  • 淺綠 = 支持
  • 紅色 = 不支持
  • 粉色 = 部分支持
Values IE Firefox Chrome Safari Opera iOS Safari Android Browser Android Chrome
Basic Support 6.0+ 2.0-6.0 4.0+ 6.0+ 15.0+ 6.0+ 2.1+ 18.0+
7.0+

示例: