html及各瀏覽器默認樣式

/*html標簽默認樣式*/

html, address,blockquote,body, dd, div,dl, dt, fieldset, form,frame, frameset,h1, h2, h3, h4,h5, h6, noframes,ol, p, ul, center,dir, hr, menu, pre { display: block }

/*以上列表元素默認狀態下以塊狀顯示,未顯示的將以內聯元素顯示,該列表針對HTML4版本,部分元素在HTML5中已廢棄*/

li { display: list-item }/*默認以列表顯示*/

head { display: none }/*默認不顯示*/

table { display: table }/*默認為表格顯示*/

tr { display: table-row }/*默認為表格行顯示*/

thead { display: table-header-group }/*默認為表格頭部分組顯示*/

tbody { display: table-row-group }/*默認為表格行分組顯示*/

tfoot { display: table-footer-group }/*默認為表格底部分組顯示*/

col { display: table-column }/*默認為表格列顯示*/

colgroup { display: table-column-group }/*默認為表格列分組顯示*/

td, th { display: table-cell; }/*默認為單元格顯示*/

caption { display: table-caption }/*默認為表格標題顯示*/

th { font-weight: bolder; text-align: center }/*默認為表格標題顯示,呈現加粗居中狀態*/

caption { text-align: center }/*默認為表格標題顯示,呈現居中狀態*/

body { margin: 8px; line-height: 1.12 }

h1 { font-size: 2em; margin: .67em 0 }

h2 { font-size: 1.5em; margin: .75em 0 }

h3 { font-size: 1.17em; margin: .83em 0 }

h4, p, blockquote, ul, fieldset, form, ol, dl, dir, menu { margin: 1.12em 0 }

h5 { font-size: .83em; margin: 1.5em 0 }

h6 { font-size: .75em; margin: 1.67em 0 }

h1, h2, h3, h4, h5, h6, b,strong { font-weight: bolder }

blockquote { margin-left: 40px; margin-right: 40px }

i, cite, em,var, address { font-style: italic }

pre, tt, code, kbd, samp { font-family: monospace }

pre { white-space: pre }

button, textarea, input, object, select { display:inline-block; }

big { font-size: 1.17em }

small, sub, sup { font-size: .83em }

sub { vertical-align: sub }/*定義sub元素默認為下標顯示*/

sup { vertical-align: super }/*定義sub元素默認為上標顯示*/

table { border-spacing: 2px; }

thead, tbody, tfoot { vertical-align: middle }/*定義表頭、主體表、表腳元素默認為垂直對齊*/

td, th { vertical-align: inherit }/*定義單元格、列標題默認為垂直對齊默認為繼承*/

s, strike, del { text-decoration: line-through }/*定義這些元素默認為刪除線顯示*/

hr { border: 1px inset }/*定義分割線默認為1px寬的3D凹邊效果*/

ol, ul, dir, menu, dd { margin-left: 40px }

ol { list-style-type: decimal }

ol ul, ul ol, ul ul, ol ol { margin-top: 0; margin-bottom: 0 }

u, ins { text-decoration: underline }

br:before { content: ""A" }/*定義換行元素的偽對象內容樣式*/

:before, :after { white-space: pre-line }/*定義偽對象空格字符的默認樣式*/

center { text-align: center }

abbr, acronym { font-variant: small-caps; letter-spacing: 0.1em }

:link, :visited { text-decoration: underline }

:focus { outline: thin dotted invert }

/* Begin bidirectionality settings (do not change) */

BDO[DIR="ltr"] { direction: ltr; unicode-bidi: bidi-override}

/*定義BDO元素當其屬性為DIR="ltr"時的默認文本讀寫顯示順序*/

BDO[DIR="rtl"] { direction: rtl; unicode-bidi: bidi-override}

/*定義BDO元素當其屬性為DIR="rtl"時的默認文本讀寫顯示順序*/

*[DIR="ltr"] { direction: ltr; unicode-bidi: embed}

/*定義任何元素當其屬性為DIR="ltr"時的默認文本讀寫顯示順序*/

*[DIR="rtl"] { direction: rtl; unicode-bidi: embed}

/*定義任何元素當其屬性為DIR="rtl"時的默認文本讀寫顯示順序*/

@media print { /*定義標題和列表默認的打印樣式*/

h1 { page-break-before: always }

h1, h2, h3, h4, h5, h6 { page-break-after: avoid }

ul, ol, dl { page-break-before: avoid }

}

/*瀏覽器默認樣式*/

//1、頁邊距

//IE默認為10px,通過body的margin屬性設置

//FF默認為8px,通過body的padding屬性設置

//要清除頁邊距一定要清除這兩個屬性值

body {

margin:0;

padding:0;

}

//2、段間距

//IE默認為19px,通過p的margin-top屬性設置

//FF默認為1.12em,通過p的margin-bottom屬性設

//p默認為塊狀顯示,要清除段間距,一般可以設置

p {

margin-top:0;

margin-bottom:0;

}

//3、標題樣式

//h1~h6默認加粗顯示:font-weight:bold;。

//默認大小請參上表

//還有是這樣的寫的

h1 {font-size:xx-large;}

h2 {font-size:x-large;}

h3 {font-size:large;}

h4 {font-size:medium;}

h5 {font-size:small;}

h6 {font-size:x-small;}

/*個大瀏覽器默認字體大小為16px,即等于medium,h1~h6元素默認以塊狀顯示字體顯示為粗體,要清除標題樣式,一般可以設置*/

hx {

font-weight:normal;

font-size:value;

}

//4、列表樣式

//IE默認為40px,通過ul、ol的margin屬性設置

//FF默認為40px,通過ul、ol的padding屬性設置

//dl無縮進,但起內部的說明元素dd默認縮進40px,而名稱元素dt沒有縮進。

//要清除列表樣式,一般可以設置

ul, ol, dd {

list-style-type:none;

margin-left:0;

padding-left:0;

}

// 元素居中

// IE默認為text-align:center;

// FF默認為margin-left:auto;margin-right:auto;

//5、超鏈接樣式a 樣式默認帶有下劃線,顯示顏色為藍色,被訪問過的超鏈接變紫色,要清除鏈接樣式,一般可以設置

a {

text-decoration:none;

color:#colorname;

}

//6、鼠標樣式

//IE默認為cursor:hand;

//FF默認為cursor:pointer;該聲明在IE中也有效

//7、圖片鏈接樣式

//IE默認為紫色2px的邊框線

//FF默認為藍色2px的邊框線

//要清除圖片鏈接樣式,一般可以設置

img {

border:0;

}

?著作權歸作者所有,轉載或內容合作請聯系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 227,428評論 6 531
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 98,024評論 3 413
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 175,285評論 0 373
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 62,548評論 1 307
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 71,328評論 6 404
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 54,878評論 1 321
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 42,971評論 3 439
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,098評論 0 286
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 48,616評論 1 331
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 40,554評論 3 354
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 42,725評論 1 369
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,243評論 5 355
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 43,971評論 3 345
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,361評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 35,613評論 1 280
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 51,339評論 3 390
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 47,695評論 2 370

推薦閱讀更多精彩內容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標簽默認的外補...
    _Yfling閱讀 13,774評論 1 92
  • 本課來自http://www.imooc.com/learn/9請不要用作商業用途。 HTML5 HTML介紹 H...
    PYLON閱讀 3,269評論 0 5
  • ?前端面試題匯總 一、HTML和CSS 21 你做的頁面在哪些流覽器測試過?這些瀏覽器的內核分別是什么? ...
    Simon_s閱讀 2,224評論 0 8
  • 1.塊級元素和行內元素 塊級(block-level)元素;行內(內聯、inline-level)元素。 塊元素的...
    饑人谷_小侯閱讀 2,024評論 1 4
  • 前有百度首席體驗官PPT做的太low被炮轟 后有員工PPT太丑被辭職 當提及PPT的時候 如果思想還只停留在套模板...
    活動策劃圈閱讀 1,759評論 0 50