1卿啡、HTML&Css簡(jiǎn)介,學(xué)習(xí)路徑
課件簡(jiǎn)介章節(jié)
2、HTML常用標(biāo)簽
2-1:開(kāi)發(fā)工具(Hbuilder憨奸,vsCode等),個(gè)人習(xí)慣使用Hbuilder
2-2:HTML基本結(jié)構(gòu)
2-3:常用標(biāo)簽(標(biāo)題標(biāo)簽凿试,段落標(biāo)簽排宰,換行標(biāo)簽,水平線標(biāo)簽那婉,加粗板甘,斜體,)
2-4:圖像標(biāo)簽(<img />)
2-5:相對(duì)路徑和絕對(duì)路徑
相對(duì)路徑:相對(duì)于當(dāng)前資源所在位置的路徑
3详炬、列表
3-1:無(wú)序列表
3-2:有序列表
3-3:自定義列表
4盐类、CSS的基本語(yǔ)法:
4-1:基本語(yǔ)法結(jié)構(gòu):要使樣式生效,需要放在<style>標(biāo)簽內(nèi)部呛谜,方可生效
4-2:CSS選擇器
4-2-1:標(biāo)簽選擇器:
4-2-2:類選擇器:
4-2-3:ID選擇器:
4-2-4:后代選擇器:(外層標(biāo)簽寫(xiě)前面在跳,內(nèi)層標(biāo)簽寫(xiě)里邊,中間用空格分開(kāi)隐岛,故:呢層標(biāo)簽為外層的后代)
? ? ? ? ? 交集選擇器:由兩個(gè)選擇器直接連接構(gòu)成猫妙,選中二者各自元素范圍的交集,第一個(gè)必須是標(biāo)簽選擇器礼仗,第? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 二個(gè)必須是類選擇器或者ID選擇器吐咳,選擇器之間不能有空格,必須連續(xù)書(shū)寫(xiě)
? ? ? ? ? 并集選擇器:多個(gè)選擇器通過(guò)逗號(hào)連接而成
5元践、HTML中引入CSS樣式????
5-1:行內(nèi)樣式:? ??使用style屬性引入CSS樣式
5-2:內(nèi)部樣式表:CSS代碼寫(xiě)在<head>的<style>標(biāo)簽中
? ? ? ?優(yōu)點(diǎn):方便在同頁(yè)面中修改樣式
? ? ? ? 缺點(diǎn):不利于在多頁(yè)面間共享復(fù)用代碼及維護(hù)韭脊,對(duì)內(nèi)容與樣式的分離也不夠徹底
5-3:外部樣式表:CSS代碼保存在擴(kuò)展名為.css的樣式表中
? ? 5-3-1:鏈入式:
? ? 5-3-2:導(dǎo)入式:
兩者的區(qū)別在哪兒:使用鏈接方式時(shí),會(huì)在裝載頁(yè)面主體部分之前裝載css文件单旁,這樣顯示出來(lái)的網(wǎng)頁(yè)從一開(kāi)始? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 就是帶有樣式,導(dǎo)入式沪羔,會(huì)在整個(gè)頁(yè)面裝載完成后再裝載css文件,對(duì)于有的瀏覽器來(lái)說(shuō),在? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?一些情況下蔫饰,如果網(wǎng)頁(yè)文件的體積比較大琅豆,則會(huì)出現(xiàn)先顯示無(wú)樣式頁(yè)面,閃一下之后再出現(xiàn)? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 設(shè)置樣式后的效果篓吁。
5-4:CSS繼承
子標(biāo)簽可以繼承父標(biāo)簽的樣式風(fēng)格茫因,子標(biāo)簽的樣式不會(huì)影響父標(biāo)簽的樣式風(fēng)格
5-5:CSS的優(yōu)先級(jí)
內(nèi)聯(lián)樣式表(標(biāo)簽內(nèi)部)> 嵌入樣式表(當(dāng)前文件中)> 外部樣式表(外部文件中)。
6杖剪、字體樣式冻押、文本樣式、偽類
font簡(jiǎn)寫(xiě)順序盛嘿,字體屬性的順序:字體風(fēng)格→字體粗細(xì)→字體大小→字體類型
其中洛巢,字體大小和字體類型必須要寫(xiě),其他兩個(gè)可以不寫(xiě)省略
文本樣式: