第七章 CSS構造快
7.1 構造樣式規則
每條規則有兩個主要部分:
選擇器selector
聲明塊declarationblock
h1 {
color: red
屬性 值
}
7.2 為樣式規則添加注釋
/**/
7.3 理解繼承
會被集成的屬性:
◎ 文本
? color(顏色,a 元素除外) ? direction(方向)
? font(字體)
? font-family(字體系列) ? font-size(字體大小)
? font-style(用于設置斜體)
? font-variant(用于設置小型大寫字母) ? font-weight(用于設置粗體)
? letter-spacing(字母間距)
? line-height(行高)
? text-align(用于設置對齊方式)
? text-indent(用于設置首行縮進)
? text-transform(用于修改大小寫)
? visibility(可見性)
? white-space(用于指定如何處理空格) ? word-spacing(字間距)
◎ 列表
? list-style(列表樣式)
? list-style-image(用于為列表指定定制的標記) ?
list-style-position(用于確定列表標記的位置) ?
list-style-type(用于設置列表的標記)
◎ 表格
? border-collapse(用于控制表格相鄰單元格的邊框是否合并為單一邊框) ?
border-spacing(用于指定表格邊框之間的空隙大小)
? caption-side(用于設置表格標題的位置)
? empty-cells(用于設置是否顯示表格中的空單元格)
◎ 頁面設置(對于印刷物)
? orphans(用于設置當元素內部發生分頁時在頁面底部需要保留的最少行數) ?
page-break-inside(用于設置元素內部的分頁方式)
? widows(用于設置當元素內部發生分頁時在頁面頂部需要保留的最少行數)
◎ 其他
? cursor(鼠標指針)
? quotes(用于指定引號樣式)
7.4 層疊: 當規則發生沖突時
1. 特殊性
2. 順序
3. 重要性
4. 小結
7.5 屬性的值
1.inherit
2.預定義的值
3.長度和百分數
一個em的長度大約與對應元素的字號相等!
4.純數字
lineheight z-index opacity
5.URL
6.CSS顏色
7.RGB
8.十六進制數
9.更多CSS3提供的指定顏色的方式 RGBA HSLA HSL
HSL 色相 hue 飽和度 saturation 飽和度 lightness亮度
~
第八章 操作樣式表
如何將CSS應用到多個網頁(包括整個網站):
外部樣式表(首選方法)
嵌入式樣式表
內聯樣式(最不可取的方法)
8.1 創建外部樣式表
創建外部樣式表的步驟:
1.在你選擇的文本編輯器中創建一個新文檔。
2.為網頁定義樣式規則,根據需求在CSS中添加注釋
3.將文檔以純文本格式保存在希望放置的目錄中(.css擴展名)
8.2 連接到外部樣式表
<link rel="stylesheet" href="style.css"/>
8.3 創建嵌入式樣式表
<style>
</style>
8.4 應用內聯樣式
style=""
8.5 樣式的層疊和順序
基本規則:在其他條件相同的情況下,越晚出現的樣式表優先級越高。
8.6 使用與媒體相關的樣式表
可以指定一個只用于特定輸出的樣式表,比如用于打印!
link或style元素的開始標簽中添加media="output"
8.7 借鑒他人的靈感
查看其他設計人員的css的代碼