資源描述:
《網(wǎng)頁設(shè)計(jì)html+css_常用html標(biāo)記和格式》由會員上傳分享,免費(fèi)在線閱讀,更多相關(guān)內(nèi)容在行業(yè)資料-天天文庫。
1、·13·第2章常用HTML標(biāo)記和格式通過第1章的學(xué)習(xí),對HTML有了一定的認(rèn)識。HTML由標(biāo)記(本書中標(biāo)記與標(biāo)簽是同一概念)組成,其中有單標(biāo)記和雙標(biāo)記之分,大部分以雙標(biāo)記出現(xiàn),即標(biāo)記對(也稱標(biāo)簽對)。而本章要介紹的是應(yīng)用中常用的HTML標(biāo)記和格式,這些知識點(diǎn)往往在網(wǎng)頁中會常用到,也是必須得掌握的知識點(diǎn)之一。在講解過程中分兩部分:標(biāo)記和格式,學(xué)完本章,應(yīng)掌握以下內(nèi)容:標(biāo)題標(biāo)記段落標(biāo)記換行與注釋粗體與斜體刪除線上標(biāo)與下標(biāo)2.1設(shè)置正文的標(biāo)題現(xiàn)在網(wǎng)絡(luò)媒體在新聞傳播中起的作用越來越大,其傳播速度和內(nèi)容豐富程度都超越了
2、傳統(tǒng)媒體。如從現(xiàn)在的門戶網(wǎng)站新聞點(diǎn)擊率上,可以看出網(wǎng)民直接在網(wǎng)上看新聞的熱情。那么新聞的格式中,有新聞主題和新聞內(nèi)容之分,往往新聞主題的字體大小比正文內(nèi)容大,也會看到很大或比較小的標(biāo)題。如果讀者細(xì)心的話,會發(fā)現(xiàn)標(biāo)題從大逐漸變小是有規(guī)律的。2.1.1標(biāo)題設(shè)置的語法本節(jié)來學(xué)習(xí)標(biāo)題的設(shè)置,標(biāo)題的作用是用精簡的文字概括整篇文章的主題,故文字字不能太長,從外表上突出標(biāo)題與內(nèi)容。標(biāo)題的語法很簡單,由雙標(biāo)記組成,在尖括號對里面輸入h加從1到6的任意一個(gè)數(shù)字即可,數(shù)字不同,所表達(dá)的標(biāo)題大小效果也不一樣,其完整標(biāo)題語法如下:<
3、h#>主題文字其中“#”是標(biāo)題里面從1到6數(shù)字的任意的一個(gè),系統(tǒng)一共提供6種標(biāo)題,從數(shù)字1到數(shù)字6,標(biāo)題大小由大到小,即表示不同大小的標(biāo)題。換言之,數(shù)字越大,標(biāo)題字體就越小。·14·2.1.2標(biāo)題設(shè)置經(jīng)典案例――字號由大到小理解了標(biāo)題是由字母H加從1到6的數(shù)字后,下面用實(shí)例來演示這6個(gè)標(biāo)題的效果,代碼2.1表示從H1到H6的標(biāo)題。代碼2.1源代碼第2章六種不同的標(biāo)題.html
標(biāo)題標(biāo)記4、>標(biāo)題h1
標(biāo)題h2
標(biāo)題h3
標(biāo)題h4
標(biāo)題h5
標(biāo)題h6
代碼2.1中,在標(biāo)記對中輸入了6個(gè)不同的標(biāo)題,標(biāo)題從H1到H6,標(biāo)題大小由大變小,效果如圖2.1所示。圖2.1六種標(biāo)題標(biāo)記從圖2.1中可以看到,
雙標(biāo)記里是顯示最大號標(biāo)題的,同理,
雙標(biāo)記里顯示最小號標(biāo)題。根據(jù)實(shí)際需要,在不同正文內(nèi)容的主題下選擇不同大小的標(biāo)題標(biāo)記,注意只選擇一
5、種做標(biāo)題即可,如標(biāo)題h3是文章的標(biāo)題,其他標(biāo)題不用在代碼中出現(xiàn)了,如下面代碼顯示。·15·
這是標(biāo)題h3
這是文章正文字。說明:不是大小的標(biāo)題明顯突出主題重要性,在具體應(yīng)用中選擇不同標(biāo)題會達(dá)不意想不到效果,甚至還可以加上標(biāo)題字體的顏色,可以再設(shè)置標(biāo)題的字體大小和字體類型等,以后將會學(xué)習(xí)到。2.2設(shè)置段落一篇文章由標(biāo)題和正文組成,正文又是由多個(gè)段落組成的,所以可以說段落是構(gòu)成文章的主體。既然一篇文章是由多個(gè)段落組成的,那么又如何區(qū)分段落呢?段落與段落之間有什么不同呢?帶著這些問題來學(xué)習(xí)本小節(jié)的段落
6、標(biāo)記。在學(xué)習(xí)段落與段落的區(qū)別前,先了解段落的基本語法,段落語法代碼是由尖括號對里放置p的雙標(biāo)記來表示,在標(biāo)記對里面放置的內(nèi)容就構(gòu)成了一個(gè)段落。段落完整語法表示如下。
這里表示段落
在
標(biāo)記對中就表示的一個(gè)段落,那么怎樣在一篇文章中存放多個(gè)段落呢?很簡單,每個(gè)標(biāo)簽對就表示一個(gè)段落,有多少段落就有多少
,這就是從代碼上區(qū)別段落與段落的不同。同理,從網(wǎng)頁表現(xiàn)出的效果來看段落,段落與段落間有一行空格不顯示任何內(nèi)容,也就是常??吹叫侣勚械亩温溟g有空行。那么可以利用HTML的段落標(biāo)記來顯
7、示出文章內(nèi)容美觀效果,使用戶對文章理解有層次感。段落不管是在新聞還是書籍中都會出現(xiàn),下面請看段落在網(wǎng)頁中如何表現(xiàn)其效果,如代碼2.2所示。代碼2.2多段落的表示
段落這里表示段落一
段落二
段落三
段落四
代碼2.2中,在存在一行注解和四個(gè)
對,注解在HTML標(biāo)
8、記中用,瀏覽解釋注解行時(shí),不會在網(wǎng)頁中顯示出來,只起注解作用,讓網(wǎng)頁制作者更好地理解HTML代碼,而4個(gè)段落表示由4個(gè)
標(biāo)記對組成的段落,每個(gè)段落都是不同內(nèi)容。當(dāng)然,在瀏覽器中顯示出來的效果就是表達(dá)4個(gè)段落,段落與段落間和空行,效果與正常的換行是不相同的,現(xiàn)在看看各段落的格式和段落間有什么不同吧,·16·如圖2.2所示。圖2.2多段落效果關(guān)于段落中的空格,當(dāng)瀏覽器解釋