HTML(一)

語義化

何為語義化?就是說在HTML標記語言中官觅,每一個標記都有特定的語義。選擇合理的標記阐污,不僅讓開發(fā)者容易閱讀代碼休涤,也更方便讓瀏覽器爬蟲抓取我們想讓瀏覽器抓取的內容。也可以說能夠更好的SEO吧。

href和src有何區(qū)別功氨?

href 表示超文本引用(hypertext reference)序苏,指向網(wǎng)絡資源所在位置,建立和當前元素(錨點)或當前文檔(鏈接)之間的鏈接捷凄。
src表示來源地址(source)忱详,指向外部資源的位置,指向的內容將會嵌入到文檔中當前標簽所在位置跺涤。
所以二者之間的區(qū)別一下子就可以看出來了匈睁,href是鏈接,src是插入桶错。
img iframe script 標簽用的是src
a 和 link 用的是 href
引用鏈接

常用的HTML 標簽

style script h1~h6 ul ol li a p img pre form iframe table th tr td br

HTML 標簽嵌套規(guī)則

既然說起嵌套規(guī)則 航唆,那我們就得知道誰和誰進行嵌套。在此之前我們還得先了解啥是標準流院刁。

流:在現(xiàn)實生活中就是流水,在網(wǎng)頁設計中就是指元素(標簽)的排列方式糯钙。
標準流:元素在網(wǎng)頁中就像流水,排在前面的元素(標簽)內容前面出現(xiàn),排在后面的元素(標簽)內容后面出現(xiàn),也可以理解為HTML沒有加CSS之前瀏覽器渲染出來的樣子退腥。在標準流中任岸,網(wǎng)頁元素又可以分為塊元素和行內元素。

其實我們說的嵌套規(guī)則就是指的是元素間嵌套狡刘,而元素又分為塊元素和行元素享潜。他們之間如何嵌套,就有了我們的嵌套規(guī)則嗅蔬。還是老規(guī)矩米碰,解釋一下什么是塊元素和行元素。

常見的塊級元素
DIV P UL OL LI FORM TABLE H1~H6
常見的行內元素
SPAN A LABEL INPUT IMG STRONG EM

他們兩個的區(qū)別

  • 塊級元素一般用來搭建網(wǎng)站架構购城、布局、承載內容虐译。
  • 塊級元素的高度和寬度瘪板,以及邊距和填充都可以起作用。
  • 行內元素的高度和寬度不可以設置漆诽,填充和邊距上下設置無效侮攀,左右有效。(說它無效是指并不是說它的展示效果厢拭,而是指它所占的空間兰英。)
  • 內聯(lián)元素一般用來在網(wǎng)站內容中的某些細節(jié)或者部位,用以“強調供鸠、區(qū)分樣式畦贸、上標、下標、錨點”等等薄坏。
  • 它們可以互相轉換趋厉。display:inline|block。
  • 塊級元素的特點:每一個塊級元素都識從一個新行開始顯示胶坠,其后的元素需要另起一行**君账。
  • 任何不是塊級元素的可見元素都是內聯(lián)元素。

好了 簡單地說了一下塊級元素和內聯(lián)元素沈善,下面我們開始我們的重點-### 嵌套規(guī)則
1.塊級元素可以包含內聯(lián)元素或某些塊級元素乡数,但內聯(lián)元素不能包含塊級元素,它只能包含其它內聯(lián)元素闻牡。
2.塊級元素不能放在p里面净赴。
3.有幾個特殊的塊級元素只能包含內聯(lián)元素,不能包含塊級元素澈侠。如h1,h2,h3,h4,h5,h6,p,dt
4.li內可以包含div
5.塊級元素與塊級元素并列劫侧、內聯(lián)元素與內聯(lián)元素并列。(錯誤的:<div><h2></h2><span></span></div>)哨啃。
有些內容參考以下網(wǎng)址標簽嵌套規(guī)則

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
  • 序言:七十年代末烧栋,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子拳球,更是在濱河造成了極大的恐慌审姓,老刑警劉巖,帶你破解...
    沈念sama閱讀 212,884評論 6 492
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件祝峻,死亡現(xiàn)場離奇詭異魔吐,居然都是意外死亡,警方通過查閱死者的電腦和手機莱找,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,755評論 3 385
  • 文/潘曉璐 我一進店門酬姆,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人奥溺,你說我怎么就攤上這事辞色。” “怎么了浮定?”我有些...
    開封第一講書人閱讀 158,369評論 0 348
  • 文/不壞的土叔 我叫張陵相满,是天一觀的道長。 經(jīng)常有香客問我桦卒,道長立美,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 56,799評論 1 285
  • 正文 為了忘掉前任方灾,我火速辦了婚禮建蹄,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己躲撰,他們只是感情好针贬,可當我...
    茶點故事閱讀 65,910評論 6 386
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著拢蛋,像睡著了一般桦他。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上谆棱,一...
    開封第一講書人閱讀 50,096評論 1 291
  • 那天快压,我揣著相機與錄音,去河邊找鬼垃瞧。 笑死蔫劣,一個胖子當著我的面吹牛,可吹牛的內容都是我干的个从。 我是一名探鬼主播脉幢,決...
    沈念sama閱讀 39,159評論 3 411
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼嗦锐!你這毒婦竟也來了嫌松?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 37,917評論 0 268
  • 序言:老撾萬榮一對情侶失蹤奕污,失蹤者是張志新(化名)和其女友劉穎萎羔,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體碳默,經(jīng)...
    沈念sama閱讀 44,360評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡贾陷,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 36,673評論 2 327
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了嘱根。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片髓废。...
    茶點故事閱讀 38,814評論 1 341
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖该抒,靈堂內的尸體忽然破棺而出慌洪,到底是詐尸還是另有隱情,我是刑警寧澤柔逼,帶...
    沈念sama閱讀 34,509評論 4 334
  • 正文 年R本政府宣布,位于F島的核電站割岛,受9級特大地震影響愉适,放射性物質發(fā)生泄漏。R本人自食惡果不足惜癣漆,卻給世界環(huán)境...
    茶點故事閱讀 40,156評論 3 317
  • 文/蒙蒙 一维咸、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦癌蓖、人聲如沸瞬哼。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,882評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽坐慰。三九已至,卻和暖如春用僧,著一層夾襖步出監(jiān)牢的瞬間结胀,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,123評論 1 267
  • 我被黑心中介騙來泰國打工抚垄, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留柴梆,地道東北人塌忽。 一個月前我還...
    沈念sama閱讀 46,641評論 2 362
  • 正文 我出身青樓,卻偏偏與公主長得像秸抚,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子歹垫,可洞房花燭夜當晚...
    茶點故事閱讀 43,728評論 2 351

推薦閱讀更多精彩內容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案剥汤? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標簽默認的外補...
    _Yfling閱讀 13,743評論 1 92
  • HTML 是用來描述網(wǎng)頁的一種語言。1县钥、HTML 指的是超文本標記語言 (Hyper Text Markup La...
    青春前行閱讀 368評論 0 1
  • 轉載請聲明 原文鏈接地址 關注公眾號獲取更多資訊 第一部分 HTML 第一章 職業(yè)規(guī)劃和前景 職業(yè)方向規(guī)劃定位...
    程序員poetry閱讀 16,527評論 32 459
  • 什么是htmlhtml 是超文本標記語言秀姐,(Hyper Text Markup Language).html文件中...
    dreamscd閱讀 634評論 0 0
  • ?前端面試題匯總 一、HTML和CSS 21 你做的頁面在哪些流覽器測試過若贮?這些瀏覽器的內核分別是什么? ...
    Simon_s閱讀 2,220評論 0 8