常用的HTML標籤和屬性

來源:互聯網
上載者:User

<center>表示絕對置中
<table></table>表格標識的開始和結束

屬性:

  cellpadding=數值單位是像素 定義表元內距

  cellspacing=數值單位是像素 定義表元間距

  border=數值單位是像素 定義表格邊框寬度

  width=數值單位是像素或視窗百分比 定義表格寬度

  background=圖片連結地址 定義表格背景圖

<tr></tr>表格中一個表格行的開始和結束

<td></td>表格中一個表元的開始和結束

<br>強制換行

<font></font>文本標識的開始和結束

屬性:

face=字型

color=顏色

<b></b>加粗文字標識的開始和結束

屬性:

style=font-size:40pt; 用樣式表方式控制字型大小,這裡是40點

<div></div>分區標識的開始和結束

屬性:

align=|center|left|right|水平對齊

<marquee></marquee>動態標識的開始和結束 如標識內放置貼圖格式則可實現圖片滾動

屬性:

scrollamount=1~60 捲動速度

direction=|left|right|up|down| 滾動方向

scrolldelay=滾動延時 單位:毫秒

<P>段落標識

 空格符

<img>貼表徵圖識

屬性:

src=圖片連結地址 貼表徵圖識必備屬性

style=filter:Alpha(opacity=100,style=2);

filter:樣式表濾鏡;

Alpha:透明濾鏡,

opacity:不透明度100(0~100);

style:樣式2(0~3)

rules="none"不顯示內框"

<embed src="…">多媒體檔案標識

屬性:

SRC="FILENAME"
設定音樂檔案的路徑,檔案類型除了可以播放.rm;.mp3;.wav等音頻,還可播放.swf和.mov等視頻。

AUTOSTART=TRUE/FALSE
是否要音樂檔案傳送完就自動播放,TRUE是要,FALSE是不要,預設為FALSE

LOOP=
設定播放重複次數,LOOP=6表示重複6次,true或-1為無限迴圈,false為播放一次即停止。

STARTIME="分:秒"
設定樂曲的開始播放時間,如20秒後播放寫為STARTIME=00:20

VOLUME=0-100
設定音量的大小。如果沒設定的話,就用系統的音量。

WIDTH HEIGHT
設定控制台的大小,都設為0可隱藏播放器

HIDDEN=TRUE
隱藏控制台

CONTROLS=CONSOLE/SMALLCONSOLE
設定控制台的樣子

<bgsound src="…">背景音樂標識,只能用於.wav和.mp3格式。

屬性:

LOOP=
設定播放重複次數,LOOP=6表示重複6次,true或-1為無限迴圈,false為播放一次即停止。

常用代碼彙編

1.標題文字 <h#>..........</h#> #=1~6;h1為最大字,h6為最小字
2.字型變化 <font>..........</font>
【1】字型大小 <font size=#>..........</font> #=1~7;數字愈大字也愈大
【2】指定字型 <font face="字型名稱">..........</font>
【3】文字顏色 <font color=#rrggbb>..........</font> rr:表紅色(red)色碼 gg:表綠色(green)色碼 bb:表藍色(blue)色碼
3.顯示小字型 <small>..........</small>
4.顯示大字型 <big>..........</big>
5.粗體字 <b>..........</b>
6.斜體字 <i>..........</i>
7.打字機字型 <tt>..........</tt>
8.底線 <u>..........</u>
9.刪除線 <strike>..........</strike>
10.下標字 <sub>..........</sub>
11.上標字 <sup>..........</sup>
12.文字閃爍效果 <blink>..........</blink>
13.換行 <br>
14.分段 <p>
15.文字的對齊方向 <p align="#"> #號可為 left:表向靠左對齊(預設值) center:表向中對齊 right:表向靠右對齊 P.S.<p align="#">之後的文字都會以所設的對齊顯示, 直到出現另一個<p align="#">改變其對齊方向,遇到 <hr>或<h#>標籤時會自動設回預設的向靠左對齊。
16.分隔線 <hr>
【1】分隔線的粗細 <hr size=點數>
【2】分隔線的寬度 <hr size=點數或百分比>
【3】分隔線對齊方向 <hr align="#"> #號可為 left:表向靠左對齊(預設值) center:表向中對齊 right:表向靠右對齊
【4】分隔線的顏色 <hr color=#rrggbb>
【5】實心分隔線 <hr noshade>
17.置中對齊 <center>..........</center>
18.依原始樣式顯示 <pre>..........</pre>
19.<body>指令的屬性
【1】背景顏色 -- bgcolor <body bgcolor=#rrggbb>
【2】背景圖案 -- background <body background="圖形檔案名稱">
【3】設定背景圖案不會捲動 -- bgproperties <body bgproperties=fixed>
【4】檔案內容文字的顏色 -- text <body text=#rrggbb>
【5】超連結文字顏色 -- link <body link=#rrggbb>
【6】正被選取的超連結文字顏色 -- vlink <body vlink=#rrggbb>
【7】已連結過的超連結文字顏色 -- alink <body alink=#rrggbb>

一、圖片

1.插入圖片 <img src="圖形檔案名稱">
2.設定圖框 -- border <img src="圖形檔案名稱" border=點數>
3.設定圖形大小 -- width、height <img src="圖形檔案名稱" width=寬度點數 height=高度點數>
4.設定圖形上下左右留空 -- vspace、hspace <img src="圖形檔案名稱" vspace=上下留空點數 hspace=左右留空點數>
5.圖形附註 <img src="圖形檔案名稱" alt="解說文字">
6.預載圖片
<img src="高解析度圖形檔案名稱" lowsrc="低解析度圖形檔案名稱"> P.S.兩個圖的圖形大小最好一致
7.影像地圖(Image Map) <img src="圖形檔案名稱" usemap="#圖的名稱"> <map name="圖的名稱">
<area shape=形狀 coords=地區座標列表 href="連結點之URL">
<area shape=形狀 coords=地區座標列表 href="連結點之URL">
<area shape=形狀 coords=地區座標列表 href="連結點之URL">
<area shape=形狀 coords=地區座標列表 href="連結點之URL"> </map>
【1】定義形狀 -- shape
shape=rect:矩形 shape=circle:圓形 shape=poly:多邊形
【2】定義地區 -- coords
a.矩形:必須使用四個數字,前兩個數字為左上方座標,後兩個數字為右下角座標
例:<area shape=rect coords=100,50,200,75 href="URL">
b.圓形:必須使用三個數字,前兩個數字為圓心的座標,最後一個數字為半徑長度
例:<area shape=circle coords=85,155,30 href="URL">
c.任意圖形(多邊形):將圖形之每一轉折點座標依序填入
例:<area shape=poly coords=232,70,285,70,300,90,250,90,200,78 href="URL"

二、表格相關

1.表格標題
<caption>..........</caption>
表格標題位置 -- align
<caption align="#"> #號可為 top:表標題置於表格上方(預設值)
bottom:表標題置於表格下方
2.定義列 <tr>
3.定義欄位 《1》<td>:靠左對齊
《2》<th>:靠中對齊ⅱ粗體
【1】水平位置 -- align <th align="#">
#號可為 left:向靠左對齊
center:向中對齊 right:向靠右對齊
【2】垂直位置 -- align <th align="#"> #號可為
top:向上對齊 middle:向中對齊
bottom:向下對齊
【3】欄位寬度 -- width
<th width=點數或百分比>
【4】欄位垂直合并 -- rowspan
<th rowspan=欲合并欄位元>
【5】欄位橫向合并 -- colspan
<th colspan=欲合并欄位元>

三、FRAME

1、分割視窗指令 <frameset>..........</frameset>
【1】垂直(上下)分割 -- rows
<frameset rows=#> #號可為點數:如欲分割為100,200,300三個視窗,則
<frameset rows=100,200,300>;亦可以*號代表,如<frameset rows=*,500,*>
百分比:如<frameset rows=30%,70%>,各 項總和最好為100%
【2】水平(左右)分割 -- cols <frameset cols=點數或百分比>
2、指定視窗內容 -- <frame>
<frameset cols=30%,70%> <frame> <frame> </frameset>
【1】指定視窗的檔案名稱 -- src <frame src=HTML檔名>
【2】定義視窗的名稱 -- name
<frame name=視窗名稱>
【3】設定檔案與上下邊框的距離 -- marginheight
<frame marginheight=點數>
【4】設定檔案與左右邊框的距離 -- marginwidth
<frame marginwidth=點數>
【5】設定分割視窗捲軸 -- scrolling
<frame scrolling=#> #號可為 yes:固定出現捲軸
no:不出現捲軸 auto:自動判斷檔案大小需不需要捲軸(預設值)
【6】鎖住分割視窗的大小 -- noresize <frame noresize>



相關文章

Beyond APAC's No.1 Cloud

19.6% IaaS Market Share in Asia Pacific - Gartner IT Service report, 2018

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。