web標準教程，幫你走進web標準設計的世界第一講

2024-07-11 08:26:31

字體：大中小

來源：轉載

供稿：網友

一個網頁的架構：聲明，頭部，主體，結束

復制代碼

代碼如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
//聲明的一些規范，初學者不必去理會，該部分會自動生成
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
/**
*http-equiv="Content-Type" 表示描述文檔類型
*content="text/HTML; 文檔類型mime類型，這里為html,如果JS就是*text/javascript，
*charset=utf-8 頁面字符集，編碼，eg:gb2312,iso-8859-1,utf-8
*建議統一采用utf-8
*/
<title>無標題文檔</title>
//一個網頁的標題
</head>
<body>
</body>
</html>

我要主要講解的是主體部分，在這過程成中會對其他部分有一定的講解和延伸。

在講body之前，我先講一下html標簽的大體分類。主要是為接下來講解網頁的基本結構做鋪墊。

html標簽大體分為：塊級元素和內聯元素，那么何為塊級元素何為內聯元素呢？

塊級元素：直白的說就是一塊區域，獨立占用一行空間的元素，如：div，p。

內聯元素：與塊級元素不同，就是不能占據一行空間的元素，如a，span。

我說的可能不是很專業，目的只是初學者便于理解。

舉個例子，大家就懂啦（這里我只寫了body中的內容，其他的內容大家自己補充）：

復制代碼

代碼如下:
<body>
<div>我是塊級元素，我獨占一塊空間</div>
<div>我是塊級元素，我獨占一塊空間</div>
<span>我是內聯元素元素，我不獨占一塊空間</span>*****
<span>我是內聯元素元素，我不獨占一塊空間</span>
</body>

運行結果：

<body>
2 <div id="page">
3 //我是最外層！包裹這整個網頁的皮，也有人給我起名字為wrapper
4
5     <div id="header">
6         //我是頭部！
7
8     </div>
9
10     <div id="content">
11         //我是內容！
12
13     </div>
14

上一篇：CSS多瀏覽器兼容性(IE和Firefox)技巧大全推薦

下一篇：具有Float屬性的元素依然居中