| [DHTMLET?](http://www.dhtmlet.com) | [屬性清單?](#)|?相關內容:SEE ALSO------------------------------------------??樣式表偽類 Pseudo-Classes??樣式表偽對象 Pseudo-Elements??樣式表規則 At-Rules??樣式表聲明 Declaration??樣式表屬性 Properties??樣式表單位 Units |
|-----|-----|
Introduction To CSS2樣式表簡介

說明:
本手冊針對的是已有一定網頁設計制作經驗的讀者。其目的是提供最新最全的樣式表內容的快速索引及注釋。所以對于樣式表的基礎知識,在此僅簡單介紹,恕不贅述。
本手冊的升級信息與版權聲明請參閱[關于本書](#)頁面。本手冊中專用詞匯請參閱[中英文詞匯對照表](#)。
限于篇幅,對于一些過于繁雜的相關內容,如動態樣式屬性(Dynamic Properties),濾鏡([Filters](#)),行為([Behaviors](#))請參閱我的其它相關著作。
本書中涉及到的所有HTML對象(Object,Element),HTML特性(Attributes)和屬性(Properties)請參閱我的相關著作。

什么是樣式表
CSS是Cascading Style Sheet 的縮寫。譯作「層疊樣式表單」。是用于(增強)控制網頁樣式并允許將樣式信息與網頁內容分離的一種標記性語言。

如何將樣式表加入您的網頁
你可以用以下三種方式將樣式表加入您的網頁。而最接近目標的樣式定義優先權越高。高優先權樣式將繼承低優先權樣式的未重疊定義但覆蓋重疊的定義。例外請參閱[important](#)聲明。

鏈入外部樣式表文件 (Linking to a Style Sheet)
你可以先建立外部樣式表文件(.css),然后使用HTML的link對象。示例如下:
<head>
<title>title of article</title>
<link rel=stylesheet href="http://www.dhtmlet.com/rainer.css" type="text/css">
</head>
而在XML中,你應該如下例所示在聲明區中加入:
<? xml-stylesheet type="text/css" href="http://www.dhtmlet.com/rainer.css" ?>>

定義內部樣式塊對象 (Embedding a Style Block)
你可以在你的HTML文檔的<HTML>和<BODY>標記之間插入一個<STYLE>...</STYLE>塊對象。 定義方式請參閱[樣式表語法](#)。示例如下:
<html>
<style type="text/css">
<!--
body {font: 10pt "Arial"}
h1 {font: 15pt/17pt "Arial"; font-weight: bold; color: maroon}
h2 {font: 13pt/15pt "Arial"; font-weight: bold; color: blue}
p {font: 10pt/12pt "Arial"; color: black}
-->
</style>
<body>
請注意,這里將style對象的type屬性設置為"text/css",是允許不支持這類型的瀏覽器忽略樣式表單。

內聯定義 (Inline Styles)
內聯定義即是在對象的標記內使用對象的style屬性定義適用其的樣式表屬性。示例如下:
<p style="margin-left: 0.5in; margin-right:0.5in">這一行被增加了左右的外補丁<p>

樣式表語法 (CSS Syntax)
Selector { property: value }
參數說明:
*Selector*?--?[選擇符](#)
*property?:?value*?--?樣式表定義。[屬性](#)和屬性值之間用冒號(:)隔開。定義之間用分號(;)隔開

繼承的值 (The ' Inherit ' Value)
每個屬性都有一個指定的值:Inherit。它的意思是:將父對象的值等同為計算機值得到。這個值通常僅僅是備用的。顯式的聲明它可用來強調。
蘇沈小雨制作?保留所有權利
©2001 rain1977.comer . All rights reserved . Terms of Use .
- 簡介 Introducing
- 樣式表簡介 Introduction to CSS2
- 關于本手冊 About this handbook
- 蘇沈小雨 About rain1977
- 屬性 Properties
- 字體 Font
- font
- color
- font-family
- font-size
- font-size-adjust
- font-stretch
- font-style
- font-weight
- text-decoration
- text-underline-position
- text-shadow
- font-variant
- text-transform
- line-height
- letter-spacing
- word-spacing
- 文本 Text
- text-indent
- text-overflow
- vertical-align
- text-align
- layout-flow
- writing-mode
- direction
- unicode-bidi
- word-break
- line-break
- white-space
- word-wrap
- text-autospace
- text-kashida-space
- text-justify
- ruby-align
- ruby-overhang
- ruby-position
- ime-mode
- layout-grid
- layout-grid-char
- layout-grid-char-spacing
- layout-grid-line
- layout-grid-mode
- layout-grid-type
- 背景 Background
- background
- background-attachment
- background-color
- background-image
- background-position
- background-positionX
- background-positionY
- background-repeat
- layer-background-color
- layer-background-image
- 定位 Positioning
- position
- z-index
- top
- right
- bottom
- left
- 尺寸 Dimensions
- height
- max-height
- min-height
- width
- max-width
- min-width
- 布局 Layout
- clear
- float
- clip
- overflow
- overflow-x
- overflow-y
- display
- visibility
- 外補丁 Margins
- margin
- margin-top
- margin-right
- margin-bottom
- margin-left
- 輪廓 Outlines
- outline
- outline-color
- outline-style
- outline-width
- 邊框 border
- border
- border-color
- border-style
- border-width
- border-top
- border-top-color
- border-top-style
- border-top-width
- border-right
- border-right-color
- border-right-style
- border-right-width
- border-bottom
- border-bottom-color
- border-bottom-style
- border-bottom-width
- border-left
- border-left-color
- border-left-style
- border-left-width
- 內容 Generated Content
- include-source
- quotes
- content
- counter-increment
- counter-reset
- 內補丁 Paddings
- padding
- padding-top
- padding-right
- padding-bottom
- padding-left
- 列表 Lists
- list-style
- list-style-image
- list-style-position
- list-style-type
- marker-offset
- 表格 table
- border-collapse
- border-spacing
- caption-side
- empty-cells
- table-layout
- speak-header
- 滾動條 Scrollbar
- scrollbar-3d-light-color
- scrollbar-highlight-color
- scrollbar-face-color
- scrollbar-arrow-color
- scrollbar-shadow-color
- scrollbar-dark-shadow-color
- scrollbar-base-color
- 打印 Printing
- page
- page-break-after
- page-break-before
- page-break-inside
- marks
- orphans
- size
- widows
- 聲音 Aural
- voice-family
- volume
- elevation
- azimuth
- stress
- richness
- speech-rate
- cue
- cue-after
- cue-before
- pause
- pause-after
- pause-before
- pitch
- pitch-range
- play-during
- speak
- speak-numeral
- speak-punctuation
- 其它 Classification
- cursor
- behavior
- filter
- zoom
- 選擇符 Selectors
- 通配選擇符 Universal Selector
- 類型選擇符 Type Selectors
- 屬性選擇符 Attribute Selectors
- 包含選擇符 Descendant Selectors
- 子對象選擇符 Child Selectors
- ID選擇符 ID Selectors
- 類選擇符 Class Selectors
- 選擇符分組 Grouping
- 偽類 Pseudo-Classes
- :link
- :hover
- :active
- :visited
- :focus
- :first-letter
- :first-line
- :first-child
- :first
- :left
- :right
- :lang
- 偽對象 Pseudo-Elements
- :before
- :after
- 規則 At-Rules
- @import
- @charset
- @font-face
- @fontdef
- @page
- @media
- 聲明 Declaration
- !important
- 單位 Units
- 長度 Length
- px
- em
- ex
- pt
- pc
- in
- mm
- cm
- 顏色 Color
- rgb(RGB)
- #RRGGBB
- Color Name
- 角度 Angle
- deg
- grad
- rad
- 時間 Time
- s
- ms
- 頻率 Frequency
- Hz
- kHz
- 附錄 Appendix
- 顏色表 Color Table
- 設備類型 Media Types
- 字符集識別 Character Set Recognition
- ISO Latin-1字符集 ISO Latin-1 Character Set
- HTML附加命名實體
- 特殊文本和BIDI文本的字符實體