




版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請進(jìn)行舉報(bào)或認(rèn)領(lǐng)
文檔簡介
1、HTML與CSS前臺頁面設(shè)計(jì)HTML網(wǎng)頁主體與內(nèi)容標(biāo)記 第4章HTML與CSS前臺頁面設(shè)計(jì)HTML與CSS前臺頁面設(shè)計(jì)第4章 HTML網(wǎng)頁主體與內(nèi)容標(biāo)記 HTML與CSS前臺頁面設(shè)計(jì)本章要點(diǎn) 標(biāo)題與段落標(biāo)記的使用 文本格式標(biāo)記的使用 與標(biāo)記的使用 HTML中特殊字符的使用 http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/www.xunchi- http:/ http:/ http:
2、/ http:/ http:/ http:/ http:/ http:/ http:/ / http:/ http:/ http:/ http:/ http:/ http:/ http:/www.gz- http:/www.gz- http:/ http:/ http:/ http:/ 4.1 標(biāo)題與段落標(biāo)記的使用 4.2 文本格式標(biāo)記的使用 4.3 內(nèi)容(多用途)標(biāo)記 4.4 特殊字符 4.5 綜合實(shí)例第4章 HTML網(wǎng)頁主體與內(nèi)容標(biāo)記 HTML與CSS前臺頁面設(shè)計(jì)4.1 標(biāo)題與段落標(biāo)記的使用 4.1.1 h1、h2、h3、h4、h5與h6一般文章都有標(biāo)
3、題、副標(biāo)題、章和節(jié)等結(jié)構(gòu),HTML中也提供了相應(yīng)的標(biāo)題標(biāo)記,其中n為標(biāo)題的等級,HTML總共提供六個(gè)等級的標(biāo)題,n越小,標(biāo)題字號就越大。hn標(biāo)記一般格式為:標(biāo)題 (n=1,6)說明:的屬性有color、align。分別標(biāo)識標(biāo)題的顏色和位置(左、右、中間)。 HTML與CSS前臺頁面設(shè)計(jì)4.1.2 p為了排列的整齊、清晰,文字段落之間,常用來做標(biāo)記。是HTML格式中特有的段落元素。在HTML格式里不需要在意文章每行的寬度,不必?fù)?dān)心文字是不是太長了而被截掉,它會(huì)根據(jù)窗口的寬度自動(dòng)轉(zhuǎn)折到下一行。因此,在原始文件中的,指出在這兒告一段落,下面的文字另起一段。如果沒有遇到這個(gè)符號,它就會(huì)把所有的文字都擠
4、在一個(gè)段落里,不遇到窗口邊界是不會(huì)換行的。段落標(biāo)記里面可以加入文字,列表,表格等。文件段落的開始由來標(biāo)記,段落的結(jié)束由來標(biāo)記,是可以省略的,因?yàn)橄乱粋€(gè)的開始就意味著上一個(gè)的結(jié)束。標(biāo)記一般格式為:文本說明:標(biāo)簽有一個(gè)常用屬性align,它用來指名字符顯示時(shí)的對齊方式,其值一般有l(wèi)eft(左)、center(中)、right(右)三種。 4.1 標(biāo)題與段落標(biāo)記的使用 HTML與CSS前臺頁面設(shè)計(jì)4.1.3 blockquote標(biāo)記可定義一個(gè)塊引用。與之間的所有文本都會(huì)從常規(guī)文本中分離出來,經(jīng)常會(huì)在左、右兩邊進(jìn)行縮進(jìn),而且有時(shí)會(huì)使用斜體。也就是說,塊引用擁有它們自己的空間。標(biāo)記一般格式為:文本4.1
5、 標(biāo)題與段落標(biāo)記的使用 HTML與CSS前臺頁面設(shè)計(jì)4.1.4 address可定義一個(gè)地址(比如電子郵件地址)。使用它來定義地址、簽名或者文檔的作者身份。不論創(chuàng)建的文檔是簡短扼要還是冗長完整,都應(yīng)該確保每個(gè)文檔都附加了一個(gè)地址,這樣做不僅為讀者提供了反饋的渠道,還可以增加文檔的可信度。標(biāo)記一般格式為:文本 4.1 標(biāo)題與段落標(biāo)記的使用 HTML與CSS前臺頁面設(shè)計(jì)4.1.5 pre標(biāo)記可定義預(yù)格式化的文本。被包圍在標(biāo)記中的文本通常會(huì)保留空格和換行符,而文本也會(huì)呈現(xiàn)為等寬字體。標(biāo)記的一個(gè)常見應(yīng)用就是用來表示計(jì)算機(jī)的源代碼。標(biāo)記一般格式為:文本塊4.1 標(biāo)題與段落標(biāo)記的使用 HTML與CSS前臺
6、頁面設(shè)計(jì)4.2 文本格式標(biāo)記的使用 4.2.1 em標(biāo)記用來表示強(qiáng)調(diào),其文本默認(rèn)樣式為斜體。標(biāo)記一般格式為:文本HTML與CSS前臺頁面設(shè)計(jì)4.2.2 strong標(biāo)記把文本定義為語氣更強(qiáng)的強(qiáng)調(diào)的內(nèi)容。其文本默認(rèn)樣式為粗體。標(biāo)記一般格式為:文本 4.2 文本格式標(biāo)記的使用 HTML與CSS前臺頁面設(shè)計(jì)4.2.3 cite標(biāo)記定義引用??墒褂迷摌?biāo)記對參考文獻(xiàn)的引用進(jìn)行定義,比如書籍或雜志的標(biāo)題。標(biāo)記一般格式為:文本 4.2 文本格式標(biāo)記的使用 HTML與CSS前臺頁面設(shè)計(jì)4.2.4 i與b與標(biāo)記均是字體樣式元素。顯示斜體文本效果,呈現(xiàn)粗體文本效果。與標(biāo)記一般格式為:文本文本 4.2 文本格式標(biāo)記
7、的使用 HTML與CSS前臺頁面設(shè)計(jì)4.2.5 big與small與標(biāo)記也是字體樣式元素。呈現(xiàn)大號字體效果,呈現(xiàn)小號字體效果。與標(biāo)記一般格式為:文本文本4.2 文本格式標(biāo)記的使用 HTML與CSS前臺頁面設(shè)計(jì)4.2.6 tt標(biāo)記呈現(xiàn)類似打字機(jī)或者等寬的文本效果。標(biāo)記一般格式為:文本4.2 文本格式標(biāo)記的使用 HTML與CSS前臺頁面設(shè)計(jì)4.2.7 sup與sub與標(biāo)記均是用于數(shù)學(xué)公式、科學(xué)符號和化學(xué)公式中的標(biāo)記。標(biāo)記可定義上標(biāo)文本,標(biāo)記可定義下標(biāo)文本。標(biāo)記一般格式為:文本 文本說明:與標(biāo)記中的文本內(nèi)容將會(huì)以當(dāng)前文本流中字符高度的一半來顯示,但是與當(dāng)前文本流中文字的字體和字號都是一樣的。標(biāo)記中的
8、文本出現(xiàn)在當(dāng)前文本流的上方,而標(biāo)記中的文本出現(xiàn)在當(dāng)前文本流的下方。4.2 文本格式標(biāo)記的使用 HTML與CSS前臺頁面設(shè)計(jì)4.2.8 q標(biāo)記可定義一個(gè)短塊的引用。標(biāo)記一般格式為:文本說明:與的區(qū)別,標(biāo)記在本質(zhì)上與是一樣的。不同之處在于它們的顯示和應(yīng)用。標(biāo)記用于簡短的行內(nèi)引用。如果需要從周圍內(nèi)容分離出來比較長的部分(通常顯示為縮進(jìn)的塊),請使用標(biāo)記。 4.2 文本格式標(biāo)記的使用 HTML與CSS前臺頁面設(shè)計(jì)4.2.9 dfn標(biāo)記定義一個(gè)項(xiàng)目??蓸?biāo)記那些對特殊術(shù)語或短語的定義。現(xiàn)在流行的瀏覽器通常用斜體來顯示中的文本。標(biāo)記一般格式為:文本 4.2 文本格式標(biāo)記的使用 http:/ http:/ h
9、ttp:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/www.xunchi- http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ / http:/ http:/ http:/ http:/ http:/ http:/ http:/www.gz- http:/www.gz- http:/ http:/ htt
10、p:/ http:/ abbr與acronym標(biāo)記表示一個(gè)縮寫形式,用于表示web頁面上的簡稱。標(biāo)記最初是在 HTML4.0中引入的,表示它所包含的文本是一個(gè)更長的單詞或短語的簡寫形式。瀏覽器可能會(huì)根據(jù)這個(gè)信息改變對這些文本的顯示方式,或者用其他文本代替。標(biāo)記一般格式為:文本簡稱 4.2 文本格式標(biāo)記的使用 HTML與CSS前臺頁面設(shè)計(jì)4.2.11 del與ins標(biāo)記定義文檔中已被刪除的文本。標(biāo)記一般格式為:文本標(biāo)記定義已經(jīng)被插入文檔中的文本。標(biāo)記一般格式為:文本說明:與標(biāo)簽配合使用,來描述文檔中的更新和修正。4.2 文本格式標(biāo)記的使用 HTML與CSS前臺頁面設(shè)計(jì)4.2.12 bdo標(biāo)記可重
11、新定義文字顯示方向。標(biāo)記一般格式為:文本4.2 文本格式標(biāo)記的使用 HTML與CSS前臺頁面設(shè)計(jì)4.2.13 code、kbd、samp與var、與標(biāo)記常用于顯示計(jì)算機(jī)/編程代碼。這幾個(gè)標(biāo)記不只是讓用戶更容易理解和瀏覽的文檔,而且將來某些自動(dòng)系統(tǒng)還可以利用這些恰當(dāng)?shù)臉?biāo)簽,從的文檔中提取信息以及文檔中提到的有用參數(shù)。提供給瀏覽器的語義信息越多,瀏覽器就可以越好地把這些信息展示給用戶。4.2 文本格式標(biāo)記的使用 HTML與CSS前臺頁面設(shè)計(jì)4.2.14 hr標(biāo)記在HTML頁面中創(chuàng)建一條水平線。可以在視覺上將文檔分隔成各個(gè)部分。標(biāo)記一般格式為:4.2 文本格式標(biāo)記的使用 HTML與CSS前臺頁面設(shè)計(jì)
12、4.2.15 marquee滾動(dòng)字幕的使用使得整個(gè)網(wǎng)頁更有動(dòng)感,顯得很有生氣。用HTML的滾動(dòng)字幕標(biāo)簽所需的代碼最少,能夠以較少的下載時(shí)間換來較好的效果。標(biāo)記一般格式為:滾動(dòng)字幕4.2 文本格式標(biāo)記的使用 HTML與CSS前臺頁面設(shè)計(jì)4.3 內(nèi)容(多用途)標(biāo)記4.3.1 divdiv是division的簡寫,division意為分割、區(qū)域。標(biāo)記在HTML中表示一個(gè)塊,標(biāo)記可以把文檔分割為獨(dú)立的、不同的部分,因而該標(biāo)記被稱為區(qū)隔標(biāo)記。可以將它用作Web頁面的組織工具,設(shè)定頁面文字、圖形、圖像、表格等的擺放位置??梢酝ㄟ^CSS樣式(style)為其賦予不同的表現(xiàn)。div標(biāo)記一般格式為:文檔HTML
13、與CSS前臺頁面設(shè)計(jì)4.3.2 span標(biāo)記在HTML中表示一個(gè)組合文檔中的行內(nèi)元素,標(biāo)記可以把一行文檔中的某部分分割為獨(dú)立的區(qū)域,從而實(shí)現(xiàn)某種特定效果,因而該標(biāo)記被稱為行內(nèi)區(qū)隔標(biāo)記。標(biāo)記一般格式為:文檔4.3 內(nèi)容(多用途)標(biāo)記HTML與CSS前臺頁面設(shè)計(jì)4.4 特殊字符特殊字符是指在HTML中具有特別含義的字符,比如小于號就表示HTML標(biāo)記的開始,這個(gè)小于號是不會(huì)顯示在最終看到的網(wǎng)頁里面。那如果希望在網(wǎng)頁中顯示一個(gè)小于號,該怎么辦呢?這時(shí)就需要使用一些特殊的代碼組合來替代。在HTML中特殊字符是不能直接使用的。要使用特殊字符,應(yīng)使用它們的轉(zhuǎn)義序列。在超文本標(biāo)記語言里,一個(gè)特殊字符有兩種表達(dá)
14、方式,即字符轉(zhuǎn)義序列或數(shù)字轉(zhuǎn)義序列。HTML與CSS前臺頁面設(shè)計(jì)所謂字符轉(zhuǎn)義序列,實(shí)際上就是用有意義的名稱來表示特殊字符,通常由前綴“&”,加上字符對應(yīng)的名稱,再加上后綴“;”而組成。其表達(dá)方式如下:&name;其中name是一個(gè)用于表示字符的名稱,它是區(qū)分大小寫的。例如:& lt; font &lgt;顯示為,若直接寫為“則被認(rèn)為是一個(gè)標(biāo)注。4.4 特殊字符HTML與CSS前臺頁面設(shè)計(jì)所謂數(shù)字轉(zhuǎn)義序列,就是用數(shù)字來表示文檔中的特殊字符,通常由前綴“”而組成。其表達(dá)方式如下: D;其中D是一個(gè)十進(jìn)制數(shù)值4.4 特殊字符HTML與CSS前臺頁面設(shè)計(jì)4.5 綜合實(shí)例 本節(jié)將結(jié)合本章所學(xué)的內(nèi)容來
15、制作一個(gè)簡單的關(guān)于HTML文本格式標(biāo)記的網(wǎng)頁。網(wǎng)頁內(nèi)容如圖所示:HTML與CSS前臺頁面設(shè)計(jì)小結(jié) 文本是HTML網(wǎng)頁中的重要內(nèi)容之一,編寫HTML文檔時(shí),可以將文本放置在標(biāo)記之間來設(shè)置文本的格式。設(shè)置文檔中文本的格式內(nèi)容包括分段與換行、設(shè)置段落對齊方式、設(shè)置字體、字號和文本顏色以及設(shè)置字符樣式等。本章學(xué)習(xí)了HTML語言的標(biāo)題與段落標(biāo)記、文本格式中的常用標(biāo)記以及與標(biāo)記,HTML語言中特殊字符的組成結(jié)構(gòu)和使用的方法。使用這些標(biāo)記,告訴Web瀏覽器如何對文本進(jìn)行格式化和顯示,如何對網(wǎng)頁元素進(jìn)行分割和標(biāo)記,以形成文本的布局、文字的格式及美觀簡潔的版面。 HTML與CSS前臺頁面設(shè)計(jì)HTML網(wǎng)頁主體與內(nèi)容標(biāo)記 第4章本章結(jié)束http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/
溫馨提示
- 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
- 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
- 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會(huì)有圖紙預(yù)覽,若沒有圖紙預(yù)覽就沒有圖紙。
- 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
- 5. 人人文庫網(wǎng)僅提供信息存儲(chǔ)空間,僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負(fù)責(zé)。
- 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請與我們聯(lián)系,我們立即糾正。
- 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。
最新文檔
- 河南測繪職業(yè)學(xué)院《現(xiàn)代醫(yī)學(xué)電子儀器原理與設(shè)計(jì)》2023-2024學(xué)年第二學(xué)期期末試卷
- 四川三河職業(yè)學(xué)院《中西醫(yī)臨床基本技能》2023-2024學(xué)年第二學(xué)期期末試卷
- 湖北城市建設(shè)職業(yè)技術(shù)學(xué)院《數(shù)字繪畫基礎(chǔ)》2023-2024學(xué)年第二學(xué)期期末試卷
- 江西婺源茶業(yè)職業(yè)學(xué)院《毛澤東思想和中國特色社會(huì)主義理論體系概論》2023-2024學(xué)年第二學(xué)期期末試卷
- 江西財(cái)經(jīng)大學(xué)《ip設(shè)計(jì)》2023-2024學(xué)年第二學(xué)期期末試卷
- 江蘇省南通市如東縣2024-2025學(xué)年數(shù)學(xué)五下期末監(jiān)測模擬試題含答案
- 四川省阿壩藏族羌族自治州九寨溝縣2025年六年級下學(xué)期5月模擬預(yù)測數(shù)學(xué)試題含解析
- 山東石油化工學(xué)院《金融學(xué)管理》2023-2024學(xué)年第二學(xué)期期末試卷
- 湖北省荊門市重點(diǎn)中學(xué)2025年高三3月適應(yīng)性考試(零模)物理試題含解析
- 湖南中醫(yī)藥高等??茖W(xué)校《寄生蟲學(xué)中醫(yī)文獻(xiàn)檢索》2023-2024學(xué)年第二學(xué)期期末試卷
- (四調(diào))武漢市2025屆高中畢業(yè)生四月調(diào)研考試 數(shù)學(xué)試卷(含答案詳解)
- 2024年中國礦產(chǎn)資源集團(tuán)大數(shù)據(jù)有限公司招聘筆試真題
- 鼠疫防控知識宣傳課件
- 公路工程資料管理辦法
- 記者證考試心理素質(zhì)試題及答案
- 2025年河南機(jī)電職業(yè)學(xué)院單招職業(yè)技能測試題庫及參考答案
- 第11課《山地回憶》課件-2024-2025學(xué)年統(tǒng)編版語文七年級下冊
- 畢業(yè)論文風(fēng)景園林工程與技術(shù)研究進(jìn)展
- 中考復(fù)習(xí)專題—應(yīng)用題
- 微機(jī)ATX電源電路的工作原理與維修
- 外貿(mào)中英文商業(yè)發(fā)票
評論
0/150
提交評論