寬度自適應：修訂版本之間的差異
出自六年制學程
（→寬度自適應） |
（→無框表格） |
||
| 第 5 行： | 第 5 行： | ||
====無框表格==== | ====無框表格==== | ||
table,th,td 的寬度是自適應的。而整個 table 是可以靠 align 屬性水平置中的。 | table,th,td 的寬度是自適應的。而整個 table 是可以靠 align 屬性水平置中的。 | ||
| + | |||
| + | ====display:table==== | ||
| + | |||
| + | ====display:inline-block==== | ||
| + | 行元素是自適應文本長度的 | ||
====最大寬度與最小寬度==== | ====最大寬度與最小寬度==== | ||
2019年1月20日 (日) 23:09的修訂版本
目錄
寬度自適應
指元素的寬度會隨著內文的多寡而自動調整。
無框表格
table,th,td 的寬度是自適應的。而整個 table 是可以靠 align 屬性水平置中的。
display:table
display:inline-block
行元素是自適應文本長度的
最大寬度與最小寬度
下以下 CSS 指示：
max-width:300px; min-width:100px; word-wrap:break-word;
讓容器伸縮，過長時自動換行。
css3 的 fit-content
對選擇器(如 UL)下以下 CSS 指示：
width:fit-content; width:-moz-fit-content; width:-webkit-fit-content; margin:auto;
對 firefox 與 chrome 分別下寬度自適應的指示，再用 margin:auto; 將邊沿左右平分
