国产一级a片免费看高清,亚洲熟女中文字幕在线视频,黄三级高清在线播放,免费黄色视频在线看

打開APP
userphoto
未登錄

開通VIP,暢享免費(fèi)電子書等14項(xiàng)超值服

開通VIP
HTML語言編寫指南 - 阮一峰的網(wǎng)絡(luò)日志

HTML是一種標(biāo)簽語言,通過在內(nèi)容上附加各種標(biāo)簽,達(dá)到在瀏覽器中正確展示的目的。正確地編寫HTML,不僅是制作網(wǎng)頁的必要條件,也是對網(wǎng)頁進(jìn)一步處理、添加CSS和Javascript效果的前提。

編寫HTML語言的關(guān)鍵,就是把標(biāo)簽用對,使它能夠正確傳達(dá)語義信息,不要使用無含義或錯誤含義的標(biāo)簽。下面就是一份我整理的HTML語言的編寫指南。

一、塊級元素

div

含義:頁面內(nèi)容的一個獨(dú)立組成部分。

常見的用途有三種:1)劃分頁首、頁尾、頁邊欄或?qū)Ш綑诘鹊龋?)表示頁面的分欄;3)將文章進(jìn)一步分成幾個部分,比如正文、評論、文章的元數(shù)據(jù)等等。

示例:

<div id="header">頁面的頭部</div>

h1, h2, h3, h4, h5, h6

含義:內(nèi)容的標(biāo)題。

h1是最高一級的標(biāo)題,下一層標(biāo)題使用h2,依次類推。除了h1以外,其他5個級別標(biāo)題在一個頁面中都可以出現(xiàn)多次,h1只能出現(xiàn)一次。

示例:

<h1>一級標(biāo)題</h1>

<h2>二級標(biāo)題</h2>

p

含義:表示段落。

它是文章內(nèi)容的基本組成部分,也可以用來表示詩歌中的一節(jié)。p與div的主要區(qū)別是,前者表示文本段落,后者表示更廣義的段落。

在P標(biāo)簽中,不應(yīng)該再包含其他塊級元素。此外,也不應(yīng)該使用空的p標(biāo)簽。

示例:

<p>這是一個段落。</p>

blockquote

含義:表示一段引用自其他來源的獨(dú)立文本。

它引用的文本通常有一定的長度,以塊級元素的形式出現(xiàn)。

blockquote應(yīng)該總是與cite標(biāo)簽配合使用,cite用來指明引用材料的來源。

示例:

<blockquote>
不是在沉默中爆發(fā),就是在沉默中滅亡。
<cite>魯迅《為了忘卻的紀(jì)念》</cite>
</blockquote>

在瀏覽器的默認(rèn)樣式中,blockquote有文本縮進(jìn)的效果,但是不要單單因?yàn)檫@個原因,而使用它。

blockquote有兩個屬性,第一個是cite屬性,用來指明引用材料的URI地址;第二個是title屬性,用于提供引用材料的相關(guān)信息。

示例:

<blockquote cite="http://w3c.org/" title="文章的標(biāo)題,作者,發(fā)表日期">“我正在此處引用W3C的標(biāo)準(zhǔn)?!?lt;/blockquote>

二、行內(nèi)元素

a

含義:與href屬性搭配使用時,鏈接至外部鏈接,或者同一頁的某個錨點(diǎn)。

示例:

<a href="chapter2.html">第二章</a>

abbr

含義:表示內(nèi)容是某個術(shù)語或短語的縮寫形式,它有一個title屬性,用來指明縮寫所代表的原始詞組。

示例:

<abbr title="Europe">Eur</abbr>

acronym

含義:表示內(nèi)容是一個詞組的首字母簡稱,比如BBC、WTO。

它有一個title屬性,用來指明屬性所代表的原始詞組。

acronym與abbr的主要區(qū)別是,前者往往是一個可以獨(dú)立使用的詞,而后者不是。這意味著acronym肯定是abbr,但是abbr不一定是acronym。

示例:

<acronym title="World Wide Web">WWW</acronym>

em

含義:表示強(qiáng)調(diào)。

em所指明的內(nèi)容,應(yīng)該比其周圍的內(nèi)容更重要。

注意,如果你只是想表示斜體或者引用書名,那就不要使用em標(biāo)簽,而是用CSS命令(font-style:italic)。

示例:

<em>我正在強(qiáng)調(diào)這句話。</em>

strong

含義:表示比em更強(qiáng)的強(qiáng)調(diào)。

示例:

<strong>我正在以更大的強(qiáng)度,強(qiáng)調(diào)這句話。</strong>

address

含義:表示某個特定文檔或文檔的某個部分的聯(lián)系信息或聯(lián)絡(luò)方式。

注意:1)所有的聯(lián)絡(luò)方式都可以用這個標(biāo)簽表示,而不僅僅是地址。2)它是一個塊級元素,不要用它來單獨(dú)標(biāo)識某個Email地址或電話號碼。

示例:

<address>
<a href="../People/張三/">張三</a>,
<a href="../People/李四/">李四</a>,
$ 日期:1999/12/24 23:37:50 $
</address>

cite

含義:表示引述的來源。

它用來指明書目信息、個人引語、或者參考文獻(xiàn)中的外部資源。

示例:

<cite>《哈利波特系列小說》</cite>的作者是J.K.羅琳。

dfn

含義:用來表示一個定義。

示例:

<dfn>Internet Explorer</dfn>是最常見的瀏覽器。

del

含義:表示該信息已被刪除。

通常用于日期和時間,表示文檔已經(jīng)發(fā)生了變化。

ins

含義:與del的作用正好相反,表示修訂后插入的內(nèi)容。

code

含義:表示程序代碼。

samp

含義:表示程序代碼的輸出結(jié)果。

kbd

含義:表示由用戶鍵入的文本。

它很少使用,但是在某些場合,你想演示如何使用一個程序,它就會有用。它通常與code和samp結(jié)合使用。

var

含義:表示程序中的變量或參數(shù),與code, samp, kbd結(jié)合使用。

q

含義:表示一個較短的引語。

注意:瀏覽器對這個標(biāo)簽的支持很不好,因此不推薦使用。

sub/sup

含義:表示下標(biāo)/上標(biāo)。

span

含義:用來標(biāo)識其他標(biāo)簽不適合表示的內(nèi)容,是一個通用型的行內(nèi)標(biāo)簽。

三、列表元素

ul, ol, li

含義:表示一組相同格式的信息。

當(dāng)你有一張清單的時候,就應(yīng)該使用列表元素。ul是無序列表,通常前面有一個強(qiáng)調(diào)符號;ol是有序列表,前面通常采用數(shù)字編號。

dl, dd, dt

含義:表示一個術(shù)語列表。

dt表示術(shù)語,dd表示該術(shù)語的定義,可以為單個術(shù)語提供多個定義。

示例:

<dl>
<dt>虛懷</dt>
<dd>胸襟寬大,虛心謙退</dd>
<dt>虛榮</dt>
<dd>表面上的榮耀;虛假的榮名</dd>
<dt>虛構(gòu)</dt>
<dd>憑想像編造出來</dd>
</dl>

四、表格元素

參見我整理的《精通HTML表格的使用》一文。

五、分割元素

br

含義:表示換行。

注意,除了少數(shù)場合(比如詩歌中的分行),應(yīng)該盡量避免使用這個標(biāo)簽,因?yàn)樗]有特別的語義含義,而且分行的視覺效果完全可以通過p標(biāo)簽、列表標(biāo)簽和CSS命令達(dá)到。

hr

含義:表示兩個部分之間用一根水平直線分割。

事實(shí)上,不用這個標(biāo)簽,也有辦法顯示水平直線。這個標(biāo)簽的唯一優(yōu)勢,也許就是在沒有CSS的場合,它可以產(chǎn)生視覺分割的效果。

六、不建議使用的元素

以下的標(biāo)簽都沒有明確的語義,只涉及到視覺效果,很可能在以后版本的HTML語言中被廢除。建議不要使用。

* big
* small
* b
* i
* tt
* pre

七、已經(jīng)被廢除的標(biāo)簽

下面的標(biāo)簽已經(jīng)被廢除,不應(yīng)該繼續(xù)使用了。

* applet
* center
* font
* dir
* isindex
* menu
* s
* strike
* u

[參考文獻(xiàn)]

* Semantics, HTML, XHTML, and Structure
* Guide to Semantic Use of HTML Elements
* mozilla.org Markup Reference

本站僅提供存儲服務(wù),所有內(nèi)容均由用戶發(fā)布,如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請點(diǎn)擊舉報。
打開APP,閱讀全文并永久保存 查看更多類似文章
猜你喜歡
類似文章
這樣去寫你的HTML
HTML5 標(biāo)簽大全
用途相似的標(biāo)簽:cite,q與blockquote
HTML 引用
Bootstrap研究3
第二節(jié),Bootstrap排版樣式
更多類似文章 >>
生活服務(wù)
分享 收藏 導(dǎo)長圖 關(guān)注 下載文章
綁定賬號成功
后續(xù)可登錄賬號暢享VIP特權(quán)!
如果VIP功能使用有故障,
可點(diǎn)擊這里聯(lián)系客服!

聯(lián)系客服