Web-9月12日筆記
屬性繼承:明明是在父級上設置樣式,結果後代也跟著變化,這就是屬性繼承。
瀏覽器默認字體大小是16px/16像素,谷歌最小字體是10px,其他瀏覽器是12px。
auto(自適應,一般做屬性值,可居中)
選擇器:
通配符選擇器:用星號表示(*)
標簽選擇器,class選擇器,id選擇器,後代選擇器,子代選擇器,交集選擇器
background屬性:
引入外部資源的3種方式: href,src,url
背景顏色:background-color:red; 簡寫:backgroun:red;(colo可以省略。)
背景字體大小:background-size:屬性值; 背景位置:background-position:20px 20px/top left;(可用數值或者百分比表示,也可用英語表示)
背景圖片:background-image:url(圖片路徑);簡寫:background:url(圖片路徑)
背景平鋪:background-repeat:no-repeat/repat-x/repeat-y(不平鋪/水平平鋪/垂直平鋪)
背景屬性總體簡寫:background:red url(圖片路徑) no-repeat 20px 20px ;(顏色 圖片路徑 平鋪屬性 背景位置值)
範例:
<!DOCTYPE html>
<html>
<head>
<meta charset="UFT-8">
<title>網頁的標題</title>
<style>
div{ width:1000px;
height:500px;
border:1px solid red;
background-image:url(圖片路徑)
background-color:red;(背景顏色)
background-position:20px 20px/50% 50%/right top(第一個數值表示的是圖片向水平方向移動,第二個數值表示的是圖片向垂直方向移動/百分比是根據父元素的寬和高計算/還可以根據英文來確定背景位置)
background-repeat:no-repeat/repeat-x/repeat-y(背景平鋪方式:不平鋪/水平平鋪/垂直平鋪)
}
</style>
</head>
<body>
<div>
你好,世界
</div>
</body>
</html>
Web-9月12日筆記