b2b电子商务网站都有哪些

書名： Dreamweaver CS6網頁設計與制作教程
作者名：孟帙穎王寶龍劉靜主編
本章字數： 3558字
更新時間： 2020-05-07 11:29:11

2.4　主體標記之間的常用標記

2.4.1　文字與段落標記

1．標題標記

<H1>　 </H1>:正文的第一級標題標記。此外，還有第二、三、四、五、六級標題標記，分別為<H2>　 </H2>、<H3>　 </H3>、<H4>　 </H4>、<H5>　 </H5>、<H6>　 </H6>。級別越高，文字越小。

六級標題的實例代碼如下，它們在瀏覽器中的顯示效果如圖2-6所示。

<html>
      　<head>
      　　<title>標題標記</title>
      　</head>
<body>
      　　<！--下面是標題標記對-->
      　　<h1>標題h1</h1>
      　　<h2>標題h2</h2>
      　　<h3>標題h3</h3>
      　　<h4>標題h4</h4>
      　　<h5>標題h5</h5>
      　　<h6>標題h6</h6>
      </body>
      </html>

圖　2-6

Hn 可以有對齊屬性，ALIGN=#，“#”表示Left（標題居左）、Center（標題居中）和Right（標題居右）。例如：

<h2 align=center>標題2</h2>

2．段落標記

<p>　 </p>:

說明：p是英文單詞“Paragraph”(段落)的縮寫。<p>標記符用來劃分段落，不同的段落之間會自動換行并有一定的間距。使用p標記符時，可以有多種屬性，比較常用的是Align=#, “#”，可以是Left、Center或Right,其含義分別為：左對齊、居中或右對齊。

<pre>　 </pre>

說明：pre標記符是預格式化標記符。瀏覽器按照編輯文檔時<pre>和</pre>標記符之間字符的位置，將內容毫無變動地顯示出來。換句話說，在html文檔中寫的時候是什么樣，在瀏覽器中顯示的就是什么樣。

3．換行符標記

<br> 換行符標記，可插入一個簡單的換行符。<br> 標簽是空標簽（意味著它沒有結束標簽，因此這是錯誤的：<br></br>）。請注意，<br> 標簽只是簡單地開始新的一行，而當瀏覽器遇到 <p> 標簽時，通常會在相鄰的段落之間插入一些垂直的間距。

4．字體標記

<font>　 </font>:字體標記，用于規定文本的字體、字體尺寸、字體顏色。屬性有face（字體）、size（大小）、color（顏色）。

（1）字體大小：HTML文件可以有7種字號，1號最小，7號最大，默認字號為3，可以用（FONT　SIZE=字號）設置默認字號。設置文本的字號有兩種方法：一種設置絕對字號，（FONT SIZE=字號）；另一種是設置文本的相對字號，（FONT SIZE=±N）。使用第二種方法時，“+”號表示字體變大，“?”表示字體變小。

（2）字體顏色：字體的顏色用（FONT color=#）進行設置，#可以是6位十六制數，分別指定紅、綠、藍的值，也可以使用16種標準顏色。

例如，設置“字體大小和顏色”網頁的代碼如下：

<HTML>
<HEAD>
<TITLE>字體大小和顏色</TITLE>
</HEAD>
<BODY>
<FONT SIZE=5 COLOR=#FF0000>字體大小和顏色</FONT>字體大小和顏色<BR>
<FONT SIZE=2 COLOR=#0000FF>字體大小和顏色</FONT>字體大小和顏色<BR>
<BLINK>閃爍的文本</BLINK>
</BODY>
</HTML>

網頁顯示效果如圖2-7所示。

圖　2-7

5．字體風格

字體風格分為物理風格和邏輯風格兩種。物理風格用來指定字體，主要有<B>黑體、<I>斜體、<U>下劃線、<TT>打字機體等，邏輯風格主要有<EM>強調、<STRONG>特別強調等。如表2-1所示。“字體風格”網頁設置代碼如下，顯示效果如圖2-8所示。

表2-1　文本風格修飾標記

25a

圖　2-8

<html>
<head>
<title>各種字體風格</title>
</head>
<body>
<B>各種字體風格</B>　 各種字體風格<BR>
<I>各種字體風格</I>　 各種字體風格<BR>
<U>各種字體風格</U>　各種字體風格<BR>
<TT>各種字體風格</TT> 各種字體風格<BR>
</body>
</html>

6．添加注釋

由于站點需要經常更新，而且制作時往往是幾個人合作，所以創建的頁面必須要易于維護，而添加注釋是增強文件可讀性的重要手段。HTML中的注釋是由開始標記符<!—和結束標記符-->組成的。這兩個標記符中間的內容就是注釋的內容，它們不會在瀏覽器中顯示。該標記可以添加在HTML代碼的任何位置。下面是一個使用注釋的例子，源代碼如下：

<html>
<head>
<title>添加注釋，但注釋不會被顯示</title>
</head>
<body>
<!--注釋：這是一次添加注釋的測試，本內容將不會在頁面中顯示-->
愉快的網頁學習
</body>
</html>

添加注釋的網頁顯示效果如圖2-9所示。

圖　2-9

2.4.2　列表標記

列表分為項目列表和編號列表，在什么情況下用到這兩個列表呢？讀者在門戶網站上瀏覽新聞時，在網站的新聞列表中，新聞標題前會出現一個小圓點，而有的是有序號的數字，前者表示的是項目列表，后者表示的是編號列表。學習列表的表示，通過代碼可以表現出列表是編號列表還是項目列表。

1．項目列表

所謂項目列表是指在列表中沒有順序可言，表里的每項都是相同的。項目列表的語法分兩部分，格式如下：

<!--下面一行表示項目列表-->
<ul>
  　　　<li>表項一</li>
  　　　<li>表項二</li>
  　　　<li>表項三</li>
</ul>

分析上面代碼，決定項目的是<ul>，而<li>只是里面的一列表項。如果想列出更多的表項，那么就在<ul></ul>里加表項<li></li>即可。

項目列表用法舉例如下：

<html>
<head>
<title>項目列表</title>
</head>
<body>
<ul>
<li>HTML+CSS完全自學手冊
<li>HTML+CSS完全自學手冊
<li>HTML+CSS完全自學手冊
<li>HTML+CSS完全自學手冊
</ul>
</body>
</html>

在項目列表符中間加了4行帶列表項的文字，默認狀態下的項目列表顯示的效果在文本前用圓點表示，即在每項前面顯示一個小圓點。網頁顯示的效果如圖2-10所示。

圖　2-10

2．編號列表

與編號列表對應的是有序列表，表項里不用設置就可以自動按順序排列，初學者乍一看很神奇，現在來揭開其神秘面紗。編號列表用<ol></ol>表示有順序，里面表項符與項目列表一樣的，只代表一個表項而已，在多個表項中，系統自動按順序排列，語法代碼如下：

<!--下面一行表示編號列表-->
<ol>
      　<li>表項一</li>
      　<li>表項二</li>
      　<li>表項三</li>
</ol>

與項目列表相差只是在<ol>上。下面示例的內容與項目列表是一樣的（表項都是一樣），不同的是用<ol></ol>標記對取代了<ul></ul>標記對。

編號列表用法。

<html>
<head>
<title>編號列表</title>
</head>
<body>
<ol>
<li>HTML+CSS完全自學手冊</li>
<li>HTML+CSS完全自學手冊</li>
<li>HTML+CSS完全自學手冊</li>
<li>HTML+CSS完全自學手冊</li>
</ol>
</body>
</html>

與項目列表顯示效果不同的是，編號列表在表項前用數字序號表示，如圖2-11所示。

圖　2-11

提示

項目列表是無序列表，編號列表則是有序列表。項目與編號只相差一個字母，但是有明顯的不同。在編號列表或項目列表中還可以用其他編號或符號取代數字或圓點，“<ol type=#>? </ol>”中#可以有A、a、I、i、1等；<ul type=#>?</ul>中#可以有circle（圓圈）square（正方形）disc（圓點）等。

2.4.3　圖像標記

<IMG />：它是圖像標記。用來加載圖像與GIF動畫。在網頁中加載GIF動畫的方法與加載圖像的方法一樣。GIF動畫文件的擴展名也是.gif，文件格式是GIF89A格式。制作GIF動畫的軟件有很多，例如Fireworks和Ulead GIF Animator 5.0等。

SRC：它是依附于其他標記的一個屬性，依附于<IMG />標記時，用來導入圖像與GIF動畫。其格式如下：

<IMG SRC="圖像文件的目錄與文件名" />

提示

屬性除了src外，還有width（寬）、height（高）、alt（替代文本）等。

設置背景平鋪圖像：使用<BODY>標記中的BACKGROUND屬性，可設置網頁的平鋪背景圖像，其格式如下：

<BODY　BACKGROUND="圖像文件名或URL">

2.4.4　超鏈接標記

1．在同一個網頁中建立鏈接的HTML標記

在同一個網頁文件中建立鏈接，需要做以下工作。

（1）在文件的前面需要列出鏈接的標題文字，它們相當于文章的目錄。同時將這些文字與相應的錨記名稱（即定位名）建立鏈接。所謂“錨記名稱”是指網頁中能被鏈接到的一個特定位置。建立鏈接時，要在錨記名稱前加一個“#”符號，其格式如下:

<A HREF="#錨記名稱">標題名字</A>

（2）為被鏈接的內容起一個名字，該名字叫錨記名稱，錨記名稱的定義要放在相應標題對應的內容前面。其格式如下。

<A NAME="錨記名稱"></A>

2．建立電子郵件鏈接

如果將HREF屬性值指定為“MAILTO:電子郵件地址”，就可以獲得電子郵件鏈接的效果。例如，使用下面的HTML代碼可以設置電子郵件的超鏈接。

<A HREF="MAILTO:shenda@yahoo.com">郵箱地址：shenda@yahoo.com </A>

當瀏覽網頁的用戶單擊了指向電子郵件的超級鏈接后，系統將自動啟動郵件客戶程序（對于安裝了Windows 98/2000以上操作系統的計算機，默認時啟動Outlook Express），并將指定的郵件地址填寫到“收件人”欄中，用戶可以編輯并發送該郵件。

如果是第一次啟動Outlook Express，會要求進行軟件設置。

3．鏈接到其他頁面中的錨點

從一個文件鏈接到另外一個文件，與同一個文件中的鏈接的格式有所不同。那么，能不能使用一個命令，鏈接到其他文件的指定位置呢？

在網頁中建立文字鏈接的HTML代碼是：<A HREF=“被鏈接的文件名或URL”文字</A>。只要將“被鏈接的文件名或URL”替換為“要鏈接的文件名或URL加#加錨記名稱>”即可。例如，<A HREF=“HTMLABC.htm#TT”>天壇</A>標記，即可建立一個到HTMLABC.htm網頁文檔中的“天壇”錨點的鏈接。

2.4.5　表格標記

表格標記在網頁中可以表現出Word中的表格效果，即在Word中要表現的表格效果可以在網頁中顯示，就需要HTML中的表格標記。表格標記不僅僅用于表現表格中的效果，還可以用表格來給網頁布局，布局中的表格是不需要表格中的邊框的，故需要對表格進行設置。

表格標記是HTML常用的標簽，代表在網頁中插入一張表格。表格標記是用table標簽對表示的標簽對，其語法形式如下：

<!--設置表格標記 -->
<table></table>

表格常常是有行和列的，那么，如何在表格內表示行和列呢？這又要另外的代碼：<tr>標簽對表示表行，每出現一個<tr></tr>代表表格的一行；<th>標簽對表示表頭，表頭是在表格上顯示下面列的；<td>標簽對表示表元，表元就是在表格中顯示的每一方格(即單元格)。下列代碼說明表格的基本語法。

<html>
<head>
<title>表格的基本語法</title>
</head>
<body>
      　　　<!--設置表格和邊框-->
      　　　<table border=1>
      　　　　　 <!--設置表格中的表頭 -->
      　　　　　 <tr>
      　　　　　　　　<!--設置表格中的表項 -->
      　　　　　　　　<th>表頭一</th>
      　　　　　　　　<th>表頭二</th>
      　　　　　</tr>
      　　　　　<tr>
      　　　　　　　　<td>表元一</td>
      　　　　　　　　<td>表元二</td>
      　　　　　</tr>
      　　 </table>
</body>
</html>

上面代碼在<table>標簽對中包括兩個行表示符：<tr>標簽對，表示兩行。在第一個行表示符中包括了表頭符，在第二個行表示符中包括了表元表示符。為了顯示表格效果，在表格屬性中加入了border邊框，效果如圖2-12所示。

圖　2-12

提示

在<table>中的<tr>、<th>、<td>是常用的，<th>可以省略，三者都在<table></table>中，不能交叉。它們各自的屬性說明如表2-2～表2-4所示。

表2-2　表格<table>的屬性

30a

表2-3　行<tr>的屬性

30b

表2-4　單元格<td>的屬性

30c

2.4.6　多媒體標記

1．添加背景音樂

使用<BGSOUND>標記可以在網頁中插入背景音樂。<BGSOUND>標記可以放在<HTML>與</HTML>標記內的任何地方。引導音樂文件的屬性是SRC，其格式如下：

<BGSOUND SRC ="文件目錄與文件名或URL">

2．在網頁中插入Flash動畫及其他視頻

在網頁中直接包含多媒體對象最常用的標記是<EMBED>標記。

（1）<EMBED>標記：使用<EMBED>標記，不僅可以在網頁中插入Flash動畫，還可以使用下載并顯示由插件支持的其他多媒體應用程序。使用<EMBED>標記可以在網頁中插入Flash對象，同添加背景音樂的方法一樣，<EMBED>標記可以放在<HTML>與</HTML>標記內的任何地方。引導Flash動畫文件的屬性是SRC，格式如下：

<EMBED SRC ="文件目錄與文件名或URL">

當瀏覽器遇到<EMBED>標記時，會加載其中指定的文件并確定它的MIME類型。MIME信息告知瀏覽器正在下載的文件類型，然后瀏覽器查找與該MIME類型一致的插件。如果有就使用；如果沒有則會顯示一條錯誤信息，并且提示用戶下載該插件。

（2）<EMBED>標記還可以使網頁中包含JavaApple、視頻和音頻等多媒體及其他文件。當瀏覽器遇到<EMBED>標記時，會加載相應的文件，并根據該標記包含屬性的值來顯示它。<EMBED>標記的屬性見表2-5。

表2-5　<EMBED>標記的屬性

31a

3．滾動標記

<marquee>…</marquee>滾動標記又稱為跑馬燈標記。<marquee>標記的屬性見表2-6。

表2-6　<marquee>標記的屬性

31b

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

Dreamweaver CS6網頁設計與制作教程

2.4 主體標記之間的常用標記

2.4.1 文字與段落標記

2.4.2 列表標記

2.4.3 圖像標記

2.4.4 超鏈接標記

2.4.5 表格標記

2.4.6 多媒體標記