<!DOCTYPE html> <html lang="en"> <head > <meta charset="UTF-8"> <title>aaa</title> </head> <body bgcolor="#7358ff" text="black" > <!--body標籤的 bgcolor屬性設置背景顏色,text屬性字體顏色, 重點:body標籤的背景圖片可以由 background屬性設置。 background="xxx.jpg" 但是body標籤設置 背景顏色,字體顏色,背景圖片 不要跟div弄混,不一樣的, div需要在style裏設置。body也有style屬性,應該也可以跟div一樣用style設置 顏色值3種格式 第一種就是#ffffff 六位十六位表示RGB 第二種是直接以名字 black white 第三種是這樣 rgb(255,255,255) --> <div style="background-color: rgb(200,150,250);width:255px;height:255px"> aaaa </div> <!-- div的背景顏色由style裏設置,可以直接寫在style屬性裏,但是一般都是在css文件裏設置 background-color:設置顏色 --> <div style="color: blanchedalmond ;font-size:3em; font-family:Times; font-style: oblique; font-weight: 900; background-image:url(68.jpg);width: 1000px;height: 1000px; "> aaa </div> <!-- div的背景圖片 background-image:url(/a/b/xx.jpg) div的字顏色 color:black; div的字大小 font-size:100px; 可以用px 也就是像素設置,但是一般都用em單位來設置字體大小, 1em=16像素 1em 等於當前的字體尺寸。如果一個元素的 font-size 爲 16 像素,那麼對於該元素,1em 就等於 16 像素。在設置字體大小時,em 的值會相對於父元素的字體大小改變。 瀏覽器中默認的文本大小是 16 像素。因此 1em 的默認尺寸是 16 像素。 可以使用下面這個公式將像素轉換爲 em:pixels/16=em (注:16 等於父元素的默認字體大小,假設父元素的 font-size 爲 20px,那麼公式需改爲:pixels/20=em) 父元素也就是包含這個元素的元素 在所有瀏覽器中均有效的方案是爲 body 元素(父元素)以百分比設置默認的 font-size 值: 實例 body {font-size:100%;} h1 {font-size:3.75em;} h2 {font-size:2.5em;} p {font-size:0.875em;} 也就是說em並不是時刻都是16px 其實這些都寫在了style裏,也就是等於是設置style的屬性,擁有style屬性的任何標籤都可以這樣設置,到時候都可以寫在CSS文件裏。 字體:font-family:(Times, TimesNR, 'New Century Schoolbook', Georgia, 'New York', serif;)設置字體 不是字體有這麼多,而是從第一個開始設置,第一個可以,就用第一個字體,不行就換下一個,最後一個值是都沒有 的話就用系統默認的字體格式。 字體名字有空格或者有其他符號時 需要加單引號或者雙引號。 但是在style屬性裏,因爲已經有了雙引號 就要用單,但是如果是style標籤,那就可以用雙引號 文本是否傾斜:font-style:normal - 文本正常顯示 italic - 文本斜體顯示 oblique - 文本傾斜顯示 文本粗細:font-weight:100 font-weight:normal/bold/lighter 100-900代表了九級的粗度 關鍵字 100 ~ 900 爲字體指定了 9 級加粗度。如果一個字體內置了這些加粗級別, 那麼這些數字就直接映射到預定義的級別,100 對應最細的字體變形,900 對應最粗的字體變形。 數字 400 等價於 normal,而 700 等價於 bold。 使用小型的大寫字母來顯示: font-variant:normal/small-caps --> </body> </html>具體效果如下:
代碼解釋如下:
設置了一下 body的背景顏色
<body bgcolor="#7358ff" text="black" > <!--body標籤的 bgcolor屬性設置背景顏色,text屬性字體顏色, background="xx.jpg" 設置背景圖片 重點:body標籤的背景圖片可以由 background屬性設置。 background="xxx.jpg" 但是body標籤設置 背景顏色,字體顏色,背景圖片 不要跟div弄混,不一樣的, div需要在style裏設置。body也有style屬性,應該也可以跟div一樣用style設置 顏色值有是那種格式, 第一種就是#ffffff 六位十六位表示RGB 第二種是直接以名字 black white 第三種是這樣 rgb(255,255,255) -->需要注意的就是body設置背景顏色 背景圖片 文字顏色 是不用寫在style裏的。顏色值的格式也需要注意一下。
而div則需要寫在style裏,具體的實現也不一樣。
還創建了兩個div,
<div style="background-color: rgb(200,150,250);width:255px;height:255px"> aaaa </div>
<div style="color: blanchedalmond ;font-size:3em; font-family:Times; font-style: oblique; font-weight: 900; background-image:url(68.jpg);width: 1000px;height: 1000px; "> aaa </div>
設置了第一個div的 背景顏色,長寬。都需要寫在style裏。
<!-- div的背景顏色由style裏設置,可以直接寫在style屬性裏,但是一般都是在css文件裏設置 background-color:設置顏色 -->
設置了第二個div的 背景圖片,字體屬性等值。
div的背景圖片 background-image:url(/a/b/xx.jpg) div的字顏色 color:black; div的字大小 font-size:100px; 可以用px 也就是像素設置,但是一般都用em單位來設置字體大小, 1em=16像素 1em 等於當前的字體尺寸。如果一個元素的 font-size 爲 16 像素,那麼對於該元素,1em 就等於 16 像素。在設置字體大小時,em 的值會相對於父元素的字體大小改變。 瀏覽器中默認的文本大小是 16 像素。因此 1em 的默認尺寸是 16 像素。 可以使用下面這個公式將像素轉換爲 em:pixels/16=em (注:16 等於父元素的默認字體大小,假設父元素的 font-size 爲 20px,那麼公式需改爲:pixels/20=em) 父元素也就是包含這個元素的元素 在所有瀏覽器中均有效的方案是爲 body 元素(父元素)以百分比設置默認的 font-size 值: 實例 body {font-size:100%;} h1 {font-size:3.75em;} h2 {font-size:2.5em;} p {font-size:0.875em;} 也就是說em並不是時刻都是16px 其實這些都寫在了style裏,也就是等於是設置style的屬性,擁有style屬性的任何標籤都可以這樣設置,到時候都可以寫在CSS文件裏。 字體:font-family:(Times, TimesNR, 'New Century Schoolbook', Georgia, 'New York', serif;)設置字體 不是字體有這麼多,而是從第一個開始設置,第一個可以,就用第一個字體,不行就換下一個,最後一個值是都沒有 的話就用系統默認的字體格式。 字體名字有空格或者有其他符號時 需要加單引號或者雙引號。 但是在style屬性裏,因爲已經有了雙引號 就要用單,但是如果是style標籤,那就可以用雙引號 文本是否傾斜:font-style:normal - 文本正常顯示 italic - 文本斜體顯示 oblique - 文本傾斜顯示 文本粗細:font-weight:100 font-weight:normal/bold/lighter 100-900代表了九級的粗度 關鍵字 100 ~ 900 爲字體指定了 9 級加粗度。如果一個字體內置了這些加粗級別, 那麼這些數字就直接映射到預定義的級別,100 對應最細的字體變形,900 對應最粗的字體變形。 數字 400 等價於 normal,而 700 等價於 bold。 使用小型的大寫字母來顯示: font-variant:normal/small-caps -->