HTML靜態網頁(標籤、表格)

HTML靜態網頁:字體

打開DREAMWEAVER,新建HTML,以下圖:網站

 

body的屬性:搜索引擎

bgcolor        頁面背景色spa

background       背景壁紙、圖片3d

text           文字顏色htm

topmargin        上邊距blog

leftmargin         左邊距索引

rightmargin      右邊距圖片

bottommargin      下邊距ci

body屬性用法示例:

 

格式控制標籤:

<font color="" face="" size=""></font>

分別控制字體的顏色、字體和大小。

<b></b>        字體加粗

<strong></strong>   字體加粗

<i></i>           傾斜

<em></em>       傾斜

<u></u>        下劃線

<center></center>   居中

<br>或<br/>      至關於回車

&nbsp;         表示空格,Ctrl+shift+space

格式控制標籤使用示例:

 

內容容器標籤:

<h1></h1>      標題,會自動換行。HTML標題是                      

  . . .        經過<h1>到<h6>等標籤來定義的。

<h6></h6>

<p></p>       段落標籤(段落之間空行)

<div></div>      層標籤(默認佔用一行)

<span></span>    層標籤(默認用掉多大空間佔用多大空間)

 

<ol type="1">    有序列表,序號爲1,2,3....,引號中能夠更改序號的形式

  <li>內容<li>

  <li>內容<li>

</ol>         上面的ol改成ul則變爲無序號列表

示例:

 

"../"      表示上級目錄

"./"       表示當前目錄

相對路徑:從當前頁面開始查找。

絕對路徑:從網站的根開始查找。"/",表明網站的根。

 

 

超連接標籤:

<a href="超連接地址" target="_blank">超連接文字</a>    --在新窗口打開

還能夠在當前頁找到目錄點擊目錄上的超連接,自動跳轉到當頁的某一個地方。

示例:

 

圖片標籤:

<img src="圖片地址" alt="文字" width=「」 height=「」 title=「描述文字」 />

高度跟寬度設置一個便可保持原有比例。

alt在圖片沒法加載時,顯示文字,還能夠幫助搜索引擎搜索。

title能夠添加圖片描述,鼠標放在圖片上時能夠顯示描述。

示例:

 

 

 

表格:

<table></table>表格

  width:寬度。能夠用像素或百分比表示。 經常使用960像素。

  border:邊框,經常使用值爲0。

  cellpadding:內容跟邊框的距離,經常使用值爲0。

  cellspacing:單元格與單元格之間的間距,經常使用值爲0。

  algin:對齊方式。

  bgcolor:背景色。

  background:背景圖片。

 

<tr></tr>行

  align:一行內容的水平對齊方式。

  valign:一行內容的垂直對齊方式。

  height:行高。

  bgcolor:背景色。

  background:背景圖片。

 

<td></td>單元格

<th></th>表頭,單元格的內容自動居中、加粗

  align:單元格內容的對齊方式。

  valign:單元格的內容的垂直對齊方式。

  width:單元格寬度。

  height:單元格高度。

  bgcolor:背景色。

  background:背景圖片。  

  內容必須放在單元格里,單元格必須放在行裏,行必須放在表格裏。

  設置單元格行高、列高時,會同時影響對應的行或列。

單元格合併:(建議儘可能用表格嵌套)

  colspan=「n」  合併同一行的單元格(後面寫代碼要減去相對應的列)

  rowspan=「n」  合併同一列單元格(從第二行開始減去相對應的列)

 

表格示例:

相關文章
相關標籤/搜索