樣式初始化(reset):
body,h1,h2,h3,h4,h5,h6,p,dl,dd
ul,ol a
liimg
css reset 原則:但凡是瀏覽預設的樣式,都不要使用。
父級 後代{} 後代選擇器
標籤的兩大陣營:
塊級標籤 特徵:預設寬度100%; div
內聯標籤 特徵:內容撐開寬度; span
塊級標籤 display:block; (
* address - 位址* blockquote - 塊引用* center - 舉中對齊塊* dir - 目錄列表
* div - 常用塊級容易,也是css layout的主要標籤* dl - 定義列表* fieldset - form控制組
* form - 互動表單* h1 - 大標題* h2 - 副標題* h3 - 3級標題* h4 - 4級標題* h5 - 5級標題
* h6 - 6級標題* hr - 水平分隔線* isindex - input prompt* menu - 選單列表
* noframes - frames可選內容,(對於不支援frame的瀏覽器顯示此區塊內容
* noscript - )可選指令碼內容(對於不支援script的瀏覽器顯示此內容)
* ol - 排序表單* p - 段落* pre - 格式化文字* table - *** ul - 非排序列表)
特徵:
a 預設寬度100%
b 獨佔一行 ----霸道
c 可以設定寬高
d 支援所有的css
內聯標籤 display:inline(
* a - 錨* abbr - 縮寫* acronym - 首字
* b - 粗體(不推薦)* bdo - bidi override* big - 大字型* br - 換行* cite - 引用
* code - 計算機**(在引用原始碼的時候需要)* dfn - 定義字段* em - 強調* i - 斜體
* font - 字型設定(不推薦)* img - * input - 輸入框* kbd - 定義鍵盤文字
* label - **標籤* q - 短引用* s - 中劃線(不推薦)* samp - 定義範例計算機**
* select - 專案選擇* small - 小字型文字* strike - 中劃線* textarea - 多行文字輸入框
* span - 常用內聯容器,定義文字內區塊* strong - 粗體強調* sub - 下標
* sup - 上標* tt - 電傳文字* u - 下劃線* var - 定義變數 )
特徵:a 內容撐開寬度
b 橫排顯示 ----友好
c 不支援寬高
d 不支援垂直margin
e 上下padding只對自身有效(詭異)
問題:不支援margin auto;
內聯標籤與內聯標籤之間會有間隙(回車和空格會被解析)
display 顯示型別:
block 塊 使元素具備內聯元素的特性
inline 內聯 使元素具備塊元素的特性
inline-block 使元素具備塊及內聯元素的特性
none 不顯示
inline-block 特徵:
a 預設內容撐開寬度
b 橫排顯示 ----友好
c 支援寬高
d 支援margin,padding
問題:
e 不支援margin:auto
f 回車和空格會被解析
text-align文字水平對齊方式
left 左對齊
right 右對齊
center 居中對齊
(對也有效)
對子級inline及inline-block元素有效
CSS初始化樣式
body,ol,ul,h1,h2,h3,h4,h5,h6,p,th,td,dl,dd,form,fieldset,legend,input,textarea,selectbodyaa hoveremliimgtablep body,ul,ol,li,p,h1,h2,h3,h4,h5,h6,form,...
CSS初始化樣式
css為什麼要初始化?建站老手都知道,這是為了考慮到瀏覽器的相容問題,其實不同瀏覽器對有些標籤的預設值是不同的,如果沒對css初始化往往會出現瀏覽器之間的頁面差異。當然,初始化樣式會對seo有一定的影響,但魚和熊掌不可兼得,但力求影響最小的情況下初始化。body,ol,ul,h1,h2,h3,h4,...
CSS樣式初始化
css樣式初始化原因 不同瀏覽器對每種的標籤都有預設的樣式,大部分瀏覽器的預設樣式還有點區別。所以為了保證 讓所有的標籤的預設樣式清零,也就是重置,以便於我們後續的開發和管理,一般都會在 一開始 對所有標籤做一下樣式的 重置操作。比如 body 標籤有預設的margin 8px。ul標籤 有預設的l...