摘要:之小白初入江湖超文本標(biāo)記語言簡稱是一種用于創(chuàng)建網(wǎng)頁的標(biāo)準(zhǔn)標(biāo)記語言。描述了一個(gè)網(wǎng)站的結(jié)構(gòu)語義隨著線索的呈現(xiàn),使之成為一種標(biāo)記語言而非編程語言。是塊級元素,是行內(nèi)元素。層疊樣式表簡稱是一種用來為結(jié)構(gòu)化文檔如添加樣式的工具。
HTML & CSS之小白初入江湖 1. HTML
1.1 HTML語義化超文本標(biāo)記語言(HyperText Markup Language, 簡稱HTML)是一種用于創(chuàng)建網(wǎng)頁的標(biāo)準(zhǔn)標(biāo)記語言。HTML是一種基礎(chǔ)技術(shù),常與CSS、JavaScript一起被眾多網(wǎng)站用于設(shè)計(jì)令人賞心悅目的網(wǎng)頁、網(wǎng)頁應(yīng)用程序以及移動應(yīng)用程序的用戶界面。網(wǎng)頁瀏覽器可以讀取HTML文件,并將其渲染成可視化網(wǎng)頁。HTML描述了一個(gè)網(wǎng)站的結(jié)構(gòu)語義隨著線索的呈現(xiàn),使之成為一種標(biāo)記語言而非編程語言。
——維基百科
在HTML中語義化是一個(gè)非常重要的概念。
語義化就是配位,其含義就是用正確的標(biāo)簽做正確的事情。HTML語義化就是通過正確使用標(biāo)簽構(gòu)建頁面以達(dá)到使頁面結(jié)構(gòu)化得目的;便于瀏覽器和搜索引擎解析。搜索引擎的爬蟲依賴于標(biāo)記來確定上下文和各個(gè)關(guān)鍵字的權(quán)重,利于 SEO。并且使閱讀源代碼的人對網(wǎng)站更容易將網(wǎng)站分塊,便于閱讀維護(hù)理解。
用于顯示圖像,常用屬性有
alt 圖像替代文本
width, height 寬和高
ismap 圖像映射
用于構(gòu)造一個(gè)表格
Name: | Age: | Sex: |
---|---|---|
張 | 10 | ? |
趙 | 15 | ? |
王 | 20 | ? |
定義超鏈接實(shí)現(xiàn)頁面跳轉(zhuǎn)
定義錨點(diǎn)實(shí)現(xiàn)書簽功能
點(diǎn)擊跳轉(zhuǎn)到網(wǎng)頁的底部 這里是網(wǎng)頁的底部
type屬性相關(guān)屬性值
button
file
hidden
text
password
radio
checkbox
image
reset
submit
文本輸入?yún)^(qū)使用標(biāo)簽
下拉菜單標(biāo)簽:
em 強(qiáng)調(diào)
strong 比em強(qiáng)調(diào)級別更高
address 定義地址元素
blockquote 定義塊引用,通常情況下會產(chǎn)生縮進(jìn)
cite 通常情況下某段/句話引自某著作,使用此標(biāo)簽
ins 定義被插入文本
del 定義被刪除文本
帶有一定樣式的標(biāo)簽(同時(shí)也帶有語義)b 定義粗體文本
i 斜體
big 大號字體文本
small 小號字體文本
bdo 定義問本顯示方向
sup 上標(biāo)文本
sub 下標(biāo)文本
輸出類標(biāo)簽pre 代碼中樣式原樣輸出
code 代碼文本
var 定義變量
h1~h6標(biāo)簽用于設(shè)置標(biāo)題
div span一級標(biāo)題
...六級標(biāo)題
div與span兩個(gè)標(biāo)簽都是無意義的容器標(biāo)簽。常用于頁面的布局。
div是塊級元素,span是行內(nèi)元素。
層疊樣式表(Cascading Style Sheet,簡稱CSS)是一種用來為結(jié)構(gòu)化文檔如HTML添加樣式的工具。
使用方式CSS使用方式分為三種,它可以直接寫在HTML標(biāo)簽內(nèi)
內(nèi)容
或者寫在style標(biāo)簽內(nèi)
或者通過link標(biāo)簽引入樣式表
選擇器
基本選擇器
id選擇器: #element ?{}
類(class)選擇器: .element ?{}
類型(HTML標(biāo)簽)選擇器: div ?{}
通配符: ? {}
綜合選擇器
后代選擇器:div ?p ?{}
交集選擇器:div.p ?{}
并集選擇器:div,p ?{}
子選擇器: div>p ?{}
相鄰兄弟選擇器:div+p ?{}
普通兄弟選擇器:div~p ?{}
序列選擇器: ul li:last-child; ?ul li:last-child
權(quán)重當(dāng)有不同選擇器的不同樣式作用在同一標(biāo)簽上,通過比較幾個(gè)選擇器的權(quán)重來確定由哪個(gè)選擇器決定顯示的樣式。下面是不同選擇器的權(quán)重量級大小關(guān)系
id選擇器 > 類選擇器 > 類型選擇器
權(quán)重比較過程如下:
id選擇器數(shù)量多的權(quán)重大
id選擇器數(shù)量相等時(shí)類選擇器多的權(quán)重大
前兩個(gè)選擇器數(shù)量各自相同時(shí)類型選擇器數(shù)量多的權(quán)重大
沒有選中標(biāo)簽的選擇器權(quán)重為0
帶有!important屬性的選擇器權(quán)重?zé)o限大(濫用會導(dǎo)致權(quán)重混亂問題)
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://www.ezyhdfw.cn/yun/50911.html
摘要:之小白初入江湖超文本標(biāo)記語言簡稱是一種用于創(chuàng)建網(wǎng)頁的標(biāo)準(zhǔn)標(biāo)記語言。描述了一個(gè)網(wǎng)站的結(jié)構(gòu)語義隨著線索的呈現(xiàn),使之成為一種標(biāo)記語言而非編程語言。是塊級元素,是行內(nèi)元素。層疊樣式表簡稱是一種用來為結(jié)構(gòu)化文檔如添加樣式的工具。 HTML & CSS之小白初入江湖 1. HTML 超文本標(biāo)記語言(HyperText Markup Language, 簡稱HTML)是一種用于創(chuàng)建網(wǎng)頁的標(biāo)準(zhǔn)標(biāo)記語言...
摘要:拿舉例子只想說明你總會在一些陰暗的角落遇到正則表達(dá)式,為了到時(shí)候不至于一頭霧水,我們最好簡單的了解一下正則表達(dá)式的使用。 為什么要學(xué)正則表達(dá)式 很多人對正則表達(dá)式的認(rèn)知只是在進(jìn)行表單驗(yàn)證的時(shí)候在網(wǎng)上搜一段正則表達(dá)式進(jìn)行copy,實(shí)際工作上好像很難遇到大段的正則表達(dá)式 我第一次看到大量的正則使用是在jQuery源碼中,當(dāng)時(shí)看的頭疼只好草草的看下大概思路不了了之,但是到今天我依然不認(rèn)為這種...
摘要:軟件測試江湖也是江湖,也有一些小技巧。以上是在過往測試江湖中個(gè)人總結(jié)的三條小技巧,技巧雖小,但是可以幫助初入測試江湖的小白少走一些彎路,讓個(gè)人的職業(yè)發(fā)展更加順利。 有人的地方就有江湖,有江湖的地方就有恩怨。有的恩怨避無可避,有的本可以避免,只是因?yàn)槟贻p不懂事,不懂得江湖的規(guī)矩,惹下許多的是非。軟件測試江湖也是江湖,也有一些小技巧。 1)Bug記錄技巧showImg(https://se...
摘要:軟件測試江湖也是江湖,也有一些小技巧。以上是在過往測試江湖中個(gè)人總結(jié)的三條小技巧,技巧雖小,但是可以幫助初入測試江湖的小白少走一些彎路,讓個(gè)人的職業(yè)發(fā)展更加順利。 有人的地方就有江湖,有江湖的地方就有恩怨。有的恩怨避無可避,有的本可以避免,只是因?yàn)槟贻p不懂事,不懂得江湖的規(guī)矩,惹下許多的是非。軟件測試江湖也是江湖,也有一些小技巧。 1)Bug記錄技巧showImg(https://se...
閱讀 922·2021-11-25 09:43
閱讀 3741·2021-11-19 09:40
閱讀 966·2021-09-29 09:34
閱讀 1898·2021-09-26 10:21
閱讀 938·2021-09-22 15:24
閱讀 4295·2021-09-22 15:08
閱讀 3323·2021-09-07 09:58
閱讀 2833·2019-08-30 15:55