一. 了解頁(yè)面架構(gòu)
HTML5
二. 了解三種元素
1. 塊元素
div,ul,li,dl,dt,dd,p,h1-h6,blockquote
特點(diǎn):
- 總在新行上開始,占據(jù)一整行
- 默認(rèn)情況下盗扇,其寬度自動(dòng)填滿其父元素寬度
- 寬度始終是與瀏覽器寬度一樣沉填,與內(nèi)容無(wú)關(guān)
- 它可以容納內(nèi)聯(lián)元素和其他塊元素
- display屬性為block
- 塊級(jí)元素的垂直相鄰?fù)膺吘鄊argin會(huì)合并。
2. 內(nèi)聯(lián)元素
a,b,span,img,input,strong,select,label,em,button,textarea
特點(diǎn):
- 和其他元素都在一行上
- 高斑鼻,行高及外邊距和內(nèi)邊距部分可改變
- 寬度只與內(nèi)容有關(guān)
- 行內(nèi)元素只能容納文本或者其他行內(nèi)元素
- display屬性為inline
- 水平方向的padding-left猎荠、padding-right关摇、margin-left、margin-right都產(chǎn)生邊距效果些楣,但豎直方向的padding-top宪睹、padding-bottom、margin-top埋市、margin-bottom卻不會(huì)產(chǎn)生邊距效果命贴。
- 不可以設(shè)置寬高,其寬度隨著內(nèi)容增加污茵,高度隨字體大小而改變葬项,內(nèi)聯(lián)元素可以設(shè)置外邊界,但是外邊界不對(duì)上下起作用襟士,只能對(duì)左右起作用。
3. 空元素
br,meta,hr,link,input,img
特點(diǎn):
- 沒有內(nèi)容的 HTML 內(nèi)容被稱為空元素逆趣∈壤空元素是在開始標(biāo)簽中關(guān)閉的梨州。
三. 了解 CSS 構(gòu)成
css
CSS 文本屬性