欧美成人精品手机在线观看_69视频国产_动漫精品第一页_日韩中文字幕网 - 日本欧美一区二区

LOGO OA教程 ERP教程 模切知識交流 PMS教程 CRM教程 開發文檔 其他文檔  
 
網站管理員

div或表單table單元格td超出寬度內容自動隱藏的寫法【css代碼實現】

admin
2023年6月27日 11:12 本文熱度 871

很多情況下,在網頁設計時每個模塊的寬度和高度都要固定,然后只需往模塊里更新內容即可,但是如果內容過多,就有可能把模塊撐大,從而使版面錯亂。準對這個情況,網頁設計時就要考慮到,每個模塊的div或table的高寬一定不能因內容過多而變化,這需要在設計上使用一點技巧來實現。本文便介紹一個常用的也是非常簡單的方法,這個方法是通過css代碼來實現的。

css代碼實現div或td超出寬度的內容自動隱藏

大家先看這兩個效果,一個是隱藏超出td寬度的圖片區域,另一個是隱藏超過div寬度的文字。

隱藏超出td寬度的圖片區域

隱藏超過div寬度的文字

實現代碼如下

1、隱藏超出td寬度的圖片區域(或文字)

  • <table style="border:0px;table-layout: fixed;width:600px" ><tbody><tr><td style="overflow: hidden; white-space: nowrap; text-overflow: ellipsis;"><img src="..."></td></tr></tbody></table>

實現的css包含兩個部分,一個是table的css,另一個是td的css。

table的css起到固定的作用,td的css的作用是隱藏超出寬度的內容。

2、隱藏超過div寬度的文字

  • <div style="width:600px;overflow: hidden; white-space: nowrap; text-overflow: ellipsis;">div的內容</div>

div的css跟table和td的css其實是一樣的,div的css里需要加上寬度。


該文章在 2023/6/27 11:12:03 編輯過
關鍵字查詢
相關文章
正在查詢...
點晴ERP是一款針對中小制造業的專業生產管理軟件系統,系統成熟度和易用性得到了國內大量中小企業的青睞。
點晴PMS碼頭管理系統主要針對港口碼頭集裝箱與散貨日常運作、調度、堆場、車隊、財務費用、相關報表等業務管理,結合碼頭的業務特點,圍繞調度、堆場作業而開發的。集技術的先進性、管理的有效性于一體,是物流碼頭及其他港口類企業的高效ERP管理信息系統。
點晴WMS倉儲管理系統提供了貨物產品管理,銷售管理,采購管理,倉儲管理,倉庫管理,保質期管理,貨位管理,庫位管理,生產管理,WMS管理系統,標簽打印,條形碼,二維碼管理,批號管理軟件。
點晴免費OA是一款軟件和通用服務都免費,不限功能、不限時間、不限用戶的免費OA協同辦公管理系統。
Copyright 2010-2025 ClickSun All Rights Reserved