Chapter9 盒模型

CSS將每個(gè)元素看做一個(gè)盒子表示,由內(nèi)容,內(nèi)邊框,外邊框組成。
內(nèi)容可被透明內(nèi)邊框padding包圍,內(nèi)邊框周圍可放一個(gè)可選邊框border,有一個(gè)可選的透明化外邊框(margin)包圍所有部分。
所有元素,甚至inline元素,也被當(dāng)做盒。
外邊距提供元素之間的間距。

.guarantee{ border-color: black; border-width: 1px; border-style: solid; background-color: #a7caca; padding: 25px; margin:30px; color: gray; line-height: 1.9em; font-style: italic; font-family: Georgia,"Times New Roman",Times,serif; background-image: url(images/background.gif); 添加背景圖 background-repeat: no-repeat; 不重復(fù)出現(xiàn)背景圖 background-position: top left; 背景圖位置


background-repeat: repeat; (default) no-repeat; (不重復(fù)) repeat-x; (水平重復(fù)) repeat-y; (垂直重復(fù)) inherit (繼承父級(jí)元素)


background-position: top; left; right; bottom; center;


border-style:solid;dotted;double;dashed;groove;inset;outset;ridge;


border-top/right/left/bottom-color/style/width設(shè)置某一條邊框的屬性


border-radius:15px設(shè)置圓角
border-top/bottom-left/right-radius:3em某個(gè)角設(shè)置圓角


id是一個(gè)元素的唯一標(biāo)識(shí)符,class是一群元素的標(biāo)識(shí)符
但是一個(gè)元素可以既有id,又有class.

class元素的選擇器是.class
id元素的選擇器是#id


多個(gè)樣式表時(shí),后出現(xiàn)的樣式表優(yōu)先。使用多個(gè)樣式表的原因:1.網(wǎng)站不同模塊的需要;2.面向不同瀏覽器。
在指定樣式表的鏈接中,添加media屬性,可以在指定設(shè)備類型是觸發(fā)。
或者直接在CSS 文件中使用@media規(guī)則,使用媒體查詢。
(需要密切關(guān)注指定設(shè)備的最佳時(shí)間)

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

推薦閱讀更多精彩內(nèi)容

  • 各種純css圖標(biāo) CSS3可以實(shí)現(xiàn)很多漂亮的圖形,我收集了32種圖形,在下面列出。直接用CSS3畫出這些圖形,要比...
    劍殘閱讀 9,700評(píng)論 0 8
  • 學(xué)習(xí)CSS的最佳網(wǎng)站沒有之一 http://www.w3school.com.cn/tags/index.asp ...
    Amyyy_閱讀 1,100評(píng)論 0 1
  • 本文為閱讀《Head First HTML 與 CSS》的css部分的讀書筆記,方便回顧書上的知識(shí),另一篇為Hea...
    兼續(xù)閱讀 1,863評(píng)論 0 17
  • 選擇qi:是表達(dá)式 標(biāo)簽選擇器 類選擇器 屬性選擇器 繼承屬性: color,font,text-align,li...
    wzhiq896閱讀 1,805評(píng)論 0 2
  • 兩個(gè)例子: 一姑娘,很多年前數(shù)學(xué)補(bǔ)習(xí)班認(rèn)識(shí)的,后來(lái)見過(guò)面的次數(shù)手指頭都能數(shù)出來(lái),平常壓根不聯(lián)系。就這樣,只要我出去...
    ppprague閱讀 749評(píng)論 0 0