css布局樣式屬性 text overflow

2022-08-03 01:21:08 字數 602 閱讀 8901

當文字過長,需縮略顯示時,使用css屬性【text-overflow】即可滿足需求:

關鍵字: text-overflow:ellipsis

語法:text-overflow : clip | ellipsis

clip :預設值 。不顯示省略標記(...),而是簡單的裁切.

ellipsis: 當物件內文字溢位時顯示省略標記(...).

注意:text-overflow 還只是ie的私有屬性而已,也沒被收錄到w3c標準裡 。

overflow: hidden; text-overflow:ellipsis;white-space:nowrap;一定要一起用

1.一定要給容器定義寬度.

2.如果少了overflow: hidden;文字會橫向撐到容易的外面

3.如果少了white-space:nowrap;文字會把容器的高度往下撐;即使你定義了高度,省略號也不會出現,多餘的文字會被裁切掉

4.如果少了text-overflow:ellipsis;多餘的文字會被裁切掉,就相當於你這樣定義text-overflow:clip.如果容器是table,當文字內容過多時,不換行,而是出現...

tabletd

CSS樣式布局 position屬性

position屬性 用於定義建立元素布局所用的定位型別,該屬性有多個值 值 描述 static 預設值。沒有定位,元素出現在正常流中 忽略 top,bottom,left,right 或者 z index 宣告 relative 生成相對定位的標籤,相對於標籤原來位置進行定位。因此,left 20...

HTML樣式布局css屬性之position定位

屬性 position 定位 上圖是官方的介紹,在實際使用的時候可以通過提示看到還有許多的值可選,例如 ms page ms device fixed webkit sticky initial sticky unset等。1 fixed 英譯 固定的 在官方的介紹中其位置是相對於瀏覽器視窗來定位的...

CSS樣式屬性

position用來設定元素的定位型別,有absolute 絕對定位 relative 相對定位 static 靜態定位,預設值 fixed 固定定位 四種。static 預設。位置設定為 static 的元素,它始終會處於頁面流給予的位置 static 元素會忽略任何 top bottom lef...