官术网_书友最值得收藏!

3-22 上標<sup>和下標<sub>元素

<sup>元素是上標元素,最常用作數學的次方,例如,X3代表X的三次方。

<sub>元素是下標元素,最常用作化學符號,例如,水的化學符號H2O。

程序實例ch3_25.html:sup和sub元素的應用。

執行結果

3-23 輸出特殊字符

在設計HTML文件時難免會遇上需要輸出空格符或特殊字符的情況,下表是常見的特殊字符及其處理方式。

常見特殊字符及HTML處理方式

程序實例ch3_26.html:測試實體名稱和以編碼方式輸出空格的方法。

執行結果

上述程序第9行“明志科大”與“視覺傳達系”字符串間沒有空格,第10行筆者測試空一格,第11行筆者測試空2格,讀者可以自行比較它們之間的差異。

程序實例ch3_27.html:常見特殊符號輸出的應用,所有特殊符號均使用實體名稱和編碼來輸出。

執行結果

3-24 HTML的樹狀結構

相信讀者學習到此已經具備了一定的HTML程序設計基礎了,在結束本節前,筆者想總結一下HTML文件的結構知識。其實HTML文件就是一個樹狀的文件結構,整個文件的根部就是<html>元素,在這個根部底下分別是<head>元素和<body>元素,而這兩個元素底下又有其他元素。我們通常使用下列名詞定義元素之間的關系。

父元素:假設A元素包含B元素,則稱A元素是B元素的父元素。例如,我們可以說<html>元素是<head>和<body>元素的父元素。

子元素:假設A元素包含B元素,則稱B元素是A元素的子元素。例如,我們可以說<head>和<body>元素是<html>元素的子元素。

在繼續解釋之前,筆者想舉一個更詳細的實例來說明HTML的樹狀結構。

程序實例ch3_28.html:HTML樹狀結構的說明。

執行結果

這個程序的重點并不是上述執行結果,而是意圖呈現整個樹狀結構。如果我們將上述程序依樹狀結構分析,可以繪制出下圖。

由上圖可知父、子元素又衍生出下列關系:

子孫元素:若是A元素是B元素的父元素,則所有B元素的更下層元素皆是A元素的子孫元素。以上圖為例,<meta>、<title>、<header>、<section>、<footer>、<h1>、<p>和<small>皆是<html>的子孫元素。

祖先元素:若是A元素是B元素的父元素,則所有A元素的更上層元素皆是B元素的祖先元素。以上圖為例,<body>元素是<h1>、<h2>、<p>和<small>的祖先元素。

手足元素:若是A元素是B元素和C元素的父元素,則B元素和C元素是手足元素。<header>、<section>和<footer>彼此之間是手足元素。

上述關系是學習HTML布局區塊觀念和各元素間衍生繼承關系的重要知識。

主站蜘蛛池模板: 香港 | 泗洪县| 库车县| 邵东县| 海口市| 博野县| 金湖县| 昌图县| 连城县| 昌图县| 东海县| 东山县| 安丘市| 上杭县| 句容市| 文昌市| 大安市| 阜新市| 宁南县| 长岛县| 和平区| 罗甸县| 四平市| 航空| 依安县| 中阳县| 小金县| 绥德县| 建瓯市| 精河县| 桂林市| 凯里市| 关岭| 永顺县| 西盟| 麻阳| 沧源| 秭归县| 毕节市| 泰州市| 湖南省|