階層式樣式表參照
網頁撰寫者可使用階層式樣式表有效地控制文件的外觀。
概觀與教學課程
下列主題提供如何建立階層式樣式表規則,以及如何將規則套用至 HTML 網頁中個別元素的概觀資訊:
瞭解選取器 階層式樣式表的基本建置組塊為樣式規則。選取器能用來「選取」HTML 網頁中的元素,以便設定元素的樣式。沒有選取器便無法判定套用規則的方式。本主題介紹階層式樣式表宣告語法的基本概念,以描述選取器的使用方式。
長度單位參照 本節定義階層式樣式表支援的長度單位。
關於元素置放 大部分的當代瀏覽器都能以 X 與 Y 座標來定位 HTML 元素,並可在沿著 Z 軸 (在網頁文件中以正對及背對檢閱者的方向延伸) 的平面中重疊元素。您可以透過這些功能在網頁中精確地放置元素、影像、控制項或文字。透過使用指令碼來操作定位座標與其他動態樣式,您可以在網頁各處移動元素,建立動畫的效果。動態樣式、定位及透明影像的結合為您提供了豐富多樣的動畫選擇。
色彩 HTML 網頁中的色彩可透過兩種方式來指定:名稱或 RGB 值。
快速模式中的度量單位和位置屬性 動態 HTML (DHTML) 會顯示度量單位與位置屬性,讓您變更網頁中 HTML 元素的大小與位置。當您瞭解這些屬性的本質與對網頁中元素的影響後,便能得心應手地控制網頁的外觀。例如,您可以使用這些屬性來設計類似其他應用程式之文件的網頁,例如 Microsoft Office PowerPoint 或 Microsoft Office Word。
屬性
本節包含支援之階層式樣式表屬性的參照主題。如需階層式樣式表屬性的分類清單,請參閱屬性 (依類別)。
background 最多可設定五個不同的物件背景屬性。
background-attachment 設定將背景影像附加至文件內物件的方式。
background-color 設定物件內容後方的色彩。
background-image 設定物件的背景影像。
background-position 設定物件背景的位置。
background-repeat 設定物件背景影像屬性的並排方式。
border 設定繪製在物件周圍的屬性。
border-collapse 設定值以指出表格的列與儲存格框線是否要結合為單一框線或卸離 (如同在標準 HTML 中)。
border-color 設定物件的框線色彩。
border-style 設定物件上、下、左、右框線的樣式。
border-left 設定物件的上框線屬性。
border-bottom-color 設定物件的下框線色彩。
border-left-color 設定物件的左框線色彩。
border-right-color 設定物件的右框線色彩。
border-top-color 設定物件的上框線色彩。
border-bottom-style 設定物件的下框線樣式。
border-left-style 設定物件的左框線樣式。
border-right-style 設定物件的右框線樣式。
border-top-style 設定物件的上框線樣式。
border-bottom-width 設定物件的下框線寬度。
border-left-width 設定物件的左框線寬度。
border-right-width 設定物件的右框線寬度。
border-top-width 設定物件的上框線寬度。
border-width 設定物件上、下、左、右框線的寬度。
bottom 以文件階層中下一個定位物件的底部為基準,設定物件底部的相對位置。
clear 設定物件是否允許在其左側、右側或兩側使用浮動物件,使下一個物件顯示在浮動物件後面。
clip 設定要顯示定位物件的哪個部分。
color 設定物件的文字色彩。
cursor 設定當指標移到物件上方時顯示的指標類型。
direction 設定物件的讀取順序。
display 設定是否要呈現物件。
font 設定物件的個別字型屬性組合。亦或是從使用者喜好設定中的六個字型當中,設定或擷取一或多個字型。
font-family 設定用於物件中文字的字型名稱。
font-size 設定值以指出用於物件中文字的字型大小。
font-style 將物件的字型樣式設為斜體、標準或傾斜。
font-variant 設定是否使物件的文字成為小型大寫字母。
font-weight 設定物件字型的粗細。
height 設定物件的高度。
left 以文件階層中下一個定位物件的左邊緣為基準,設定物件的相對位置。
letter-spacing 設定物件中字母間的額外間距。
line-height 設定物件中各行的間距。
list-style 最多可設定物件的三個不同 list-style 屬性。
list-style-image 設定值以指出要使用哪個影像當作物件的 list-item 標記。
list-style-position 設定變數以指出如何依照物件內容繪製相對的 list-item 標記。
list-style-type 設定物件之 line-item 標記的預先定義類型。
margin 設定物件上、下、左、右邊界的寬度。
margin-bottom 設定物件的下邊界大小。
margin-left 設定物件的左邊界大小。
margin-right 設定物件的右邊界大小。
margin-top 設定物件的上邊界大小。
max-height 設定元素的高度上限。
max-width 設定元素的寬度上限。
min-height 設定元素的高度下限。
min-width 設定元素的寬度下限。
overflow 設定值以指出當內容超出物件的高度或寬度時,要如何管理物件的內容。
padding 設定插入物件與其邊界間 (若有框線的話,則為物件與其框線間) 的間距。
padding-bottom 設定插入物件之下框線與內容間的間距。
padding-left 設定插入物件之左框線與內容間的間距。
padding-right 設定插入物件之右框線與內容間的間距。
padding-top 設定插入物件之上框線與內容間的間距。
page-break-after 設定值以指出是否在物件後面分頁。
page-break-before 設定值以指出是否在物件前面分頁。
position 設定用於物件的定位類型。
right 以文件階層中下一個定位物件的右邊緣為基準,設定物件的相對位置。
table-layout 設定指出表格版面配置是否要固定的字串。
text-align 設定物件中的文字要靠左對齊、靠右對齊、置中或左右對齊。
text-decoration 設定值以指出是否使物件中的文字閃爍、加上刪除線、頂線或底線裝飾。
text-indent 設定物件中第一行文字的縮排。
text-transform 設定物件中文字的呈現。
top 以文件階層中下一個定位物件的頂端為基準,設定物件的相對位置。
unicode-bidi 設定與雙向 (右至左) 演算法相關的內嵌層級。
vertical-align 設定物件的垂直對齊方式。
visibility 設定是否要顯示物件的內容。
white-space 設定值以指出是否要在物件內自動斷行。
width 設定物件的寬度。
word-spacing 設定物件中單字間的額外間距。
z-index 設定定位物件的堆疊順序。