xml:從數據角度來說,是數據的存儲和傳遞方式
xml文件規則:
1.xml語言沒有固定標簽和屬性,都是自定義的(要說明)
將HTML的語法用xml的嚴格標準去寫,這樣的文檔被稱為“xhtml”文檔
xhtml:
1.將單標簽使用"/"結束:即<hr>→<hr/>
2.將無值的屬性改寫為有值:讓其值等于其屬下名就可以:即 noshade="noshade"
3.標簽都使用小寫,屬性都加引號(單雙引號都可以)標簽別錯位書寫
網頁的文檔類型
一個html文件的第一行代碼通常就是用來聲明網頁文檔類型,格式如下:
<!doctype 聲明語句>
文檔類型(DTD):不同的HTML的版本
鏈接標簽
<a href="設定鏈接的目標網頁文件 url" target="設定要打開該網頁的瀏覽窗口的名字" >內容部分</a>
其中url就是“網頁網址的意思”。
瀏覽器窗口通常是有名字的。
內部固定名字和含義的窗口:
_blank:新的窗口(空白窗口)
_self: 當前網頁本身的窗口
_parent: 當前窗口的“上一級”窗口
_top:當前窗口所在的窗口層級中最頂層的窗口
在新窗口打開
url 值“鏈接地址”,通??梢苑忠幌虑樾危? 1.絕對地址:通過該設定的地址就可以直接找到所需的網頁地址。
①本地絕對地址,形式類似:file:///D:/abc/def/hij.html
②互聯網絕對地址,形式類似:http://www.abc.com/def/hij.html
2.相對地址:需要通過所設定的地址加上當前網頁本身的地址結合才能找到需要的網頁文件
相對地址是指相對于當前網頁的本身的地址來找出正確的地址
① ./ ——代表本身的地址(當前地址),及當前網頁地址,通??梢允÷? ② ../ ——代表當前網頁地址的“上一層”地址(路徑)
③ / ——代表當前網頁的最頂層路徑,這在web應用中才有效。
鏈接的變種形式:錨點
錨點其實是指一個網頁中的某個位置。
錨點的作用:讓用戶在一個比較長的網頁中可以快速定位其所需要的內容(位置)。
錨點的實現:由兩個a標簽配合使用:
設定錨點鏈接:<a href="#錨點名">內容部分</a>
設定錨點的名字(錨的位置):<a name="錨點名"></a>
錨點的應用——返回頂部
回到頂部
鏈接的其他應用:
發送郵件:
<a href=”mailto:12500791@qq.com”>無聊的時候給我 Email</a>
文件下載:
<a href=”文件的路徑url”>點我下載</a>
其他相關標簽:
link:用于引入其他文件,主要是css文件。
base:用于設定當前網頁中的所有a鏈接的目標打開窗口:<base tareget=”_blank” />
這兩個標簽都在head標簽中使用。
圖片標簽
<img src="圖片文件路徑 url" alt=”設定圖片的描述”
width=”100” height=”50” border=”1” align=”left || center || right” />
alt屬性:主要給搜索引擎使用使索搜引擎可以“識別”該圖的具體內容。
border:用于設定圖片的邊框線的“粗細”,單位還是px。
align:用于設定圖片的定位方式:靠左,劇中,靠右
圖像映射:指在一張圖片上,產生多個不同的鏈接
圖像映射技術需要使用一張圖片,以及一個可以對該圖片進行“區域劃分”的map標簽實現,劃分出的每個“小”區域可以單獨設定
鏈接。 設定的小區塊可以有3種形狀:
矩形:
<areashape="rect" coords="矩形的左上角坐標和右下角坐標" href="01圖片標記.html" >
圓形:
<area shape="circle" coords="圓心的坐標和半徑" href="01圖片標記.html">
多邊形:
<area shape="poly"coords="連續的點的坐標"href="01圖片標記.html" >
ps:在計算機中,通常坐標都是以“左上角”為原點,向右為x正方向,向下為y正方向。
圖片映射技術
表格:將一定范圍的區域劃分為“行列對齊”的若干個“格子”的一種技術。
表格的三個標簽:
<table>
<tr>
<td>這個td中才是放置具體“內容部分”的區域</td>
</tr>
</table>
table:用于“聲明”一個表格
tr:用于設定一個表格中的“一行”,多行就使用多個tr配 對。
td:用于設定一個行中的“一列”(單元格),多個列就使用多個td。
th:用于設定一個“標題單元格”。只要可以用td,就可以用td。
一個表格可以有多行,一個行可以有多列。
表格中的單元格可以進行“合并”操作,是通過td上的兩個屬性來實現。
table常用屬性:
width:
height:
border:設定表格的邊框線,其實會應用整個表格的 所有“邊框線”(每個單元格)
cellpadding: 設定單元格中的內容與單元格的邊框線之間的“間距”,單位是px
cellspacing: 設定相鄰的兩個元格的邊框線之間的“間距”,單位是px
bgcolor=”yellow” 設定表格的總體上的背景顏色
background=”圖片地址url”: 設定表格的總體上的背景圖
caption:設定標題文字
align=”left // center // right”: 設定表格總體上的定位方式。
bordercolor:設定邊框線的顏色
td常用屬性:
width:
heigh
bgcolor=”yellow” 設定單元格的背景顏色
background=”圖片地址url”: 設定單元格的背景圖
align=”left // center // right”: 設定單元格中的內容的水平對齊方式
valign=”top // middle // bottom”: 設定單元格中的內容的垂直對齊方式
colspan=”5”: 表示該單元格會水平向右邊合并5個“原始單元格”,其本身相當于“跨”5個列。
rowspan=”3”: 表示該單元格會垂直向下邊合并3個“原始單元格”,其本身相當于“跨”3個行。
表格區域劃分
thead:代表表格的“頭部”區域
tbody:代表表格的“中部”區域(主體區域)
tfoot:代表表格的“尾部”區域,同樣可以放tr。
表格案例
顯示效果
常用字符實體
字符實體其實就是用某種特殊的符號來代表某種具有特定含義的字符。
字符實體
ps:<pre>想寫的代碼</pre>