本打算用 <table>標籤代替 <ul><li> 重新實現下中英文切換器,如下表格
這裏面是空白的,無內容 |
【中文】【English】 |
讓 文本 靠頂部 排列用哪個屬性呢?
用的是 vertical-align=text-top
vertical-align:baseline | sub | super | top | text-top | middle | bottom | text-bottom | <percentage> | <length>
取值:
- baseline:
- 將支持valign特性的對象的內容與基線對齊
- sub:
- 垂直對齊文本的下標
- super:
- 垂直對齊文本的上標
- top:
- 將支持valign特性的對象的內容與對象頂端對齊
- text-top:
- 將支持valign特性的對象的文本與對象頂端對齊
- middle:
- 將支持valign特性的對象的內容與對象中部對齊
- bottom:
- 將支持valign特性的對象的文本與對象底端對齊
- text-bottom:
- 將支持valign特性的對象的文本與對象頂端對齊
- <percentage>:
- 用百分比指定由基線算起的偏移量。可以爲負值。基線對於百分數來說就是0%。
- <length>:
- 用長度值指定由基線算起的偏移量。可以爲負值。基線對於數值來說爲0。(CSS2)
text-align
text-align:left | center | right | justify | start | end
默認值:start
取值:
- left:
- 內容左對齊。
- center:
- 內容居中對齊
- right:
- 內容右對齊。
- justify:
- 內容兩端對齊。
- start:
- 內容對齊開始邊界。(CSS3)
- end:
- 內容對齊結束邊界。(CSS3)
Properties 屬性 |
CSS Version 版本 |
Inherit From Parent 繼承性 |
Description 簡介 |
---|---|---|---|
text-indent | CSS1 | 有 | 檢索或設置對象中的文本的縮進 |
text-overflow | CSS3 | 無 | 設置或檢索是否使用一個省略標記(...)標示對象內文本的溢出 |
text-align | CSS1/CSS3 | 有 | 設置或檢索對象中文本的對齊方式 |
text-transform | CSS1/CSS3 | 有 | 檢索或設置對象中的文本的大小寫 |
text-decoration | CSS1/CSS3 | 無 | 複合屬性。檢索或設置對象中的文本的裝飾,如下劃線、閃爍等 |
text-decoration-line | CSS3 | 無 | 檢索或設置對象中的文本裝飾線條的位置。 |
text-decoration-color | CSS3 | 無 | 檢索或設置對象中的文本裝飾線條的顏色。 |
text-decoration-style | CSS3 | 無 | 檢索或設置對象中的文本裝飾線條的形狀。 |
text-shadow | CSS3 | 有 | 設置或檢索對象中文本的文字是否有陰影及模糊效果 |
text-fill-color | CSS3 | 有 | 設置或檢索對象中的文字填充顏色 |
text-stroke | CSS3 | 有 | 複合屬性。設置或檢索對象中的文字的描邊 |
text-stroke-width | CSS3 | 有 | 設置或檢索對象中的文字的描邊厚度 |
text-stroke-color | CSS3 | 有 | 設置或檢索對象中的文字的描邊顏色 |
letter-spacing | CSS1 | 有 | 檢索或設置對象中的文字之間的間隔 |
word-spacing | CSS1 | 有 | 檢索或設置對象中的單詞之間插入的空格數。 |
vertical-align | CSS1/CSS2 | 無 | 設置或檢索對象內容的垂直對其方式 |
word-wrap | CSS3 | 有 | 設置或檢索噹噹前行超過指定容器的邊界時是否斷開轉行 |
white-space | CSS1 | 有 | 設置或檢索對象內空格的處理方式 |
direction | CSS2 | 有 | 檢索或設置文本流的方向 |
unicode-bidi | CSS2 | 無 | 用於同一個頁面裏存在從不同方向讀進的文本顯示。與direction屬性一起使用 |
line-height | CSS1 | 有 | 檢索或設置對象的行高。即字體最底端與字體內部頂端之間的距離 |
tab-size | CSS3 | 有 | 檢索或設置對象中的製表符的長度 |