首頁 > 文章 > web前端 > html中常用標籤的總結總結

html中常用標籤的總結總結

巴扎黑原創: 2017-06-16 17:09:171441瀏覽

html中常用標籤的總結總結

#html標籤
字型效果
區段標記
連結格式
貼圖/音樂
表格語法
分割視窗
表單
表示顏色的有三種方式;
.....屬性可分為三種：

##align 屬性

列表

select元素

html中常用標籤的總結總結

option屬性

##多行文字方塊

回到頂部

html標籤

# ...

普通捲動

.. .

滑動

...

預設捲動

# ...

來回捲動...向下捲動

...

向上捲動

向右捲動

向左捲動

...

捲動次數

. ..

設定寬度

...

設定高度

...

設定背景顏色

...

#設定滾動速度

...設定捲動時間 html中常用標籤的總結總結

#...滑鼠經過上面時停止滾動 ...

滑鼠離開時開始捲動

回到頂部

字體效果

###### ######

...

###標題字### ###(######最大######) ######### ####

...

標題字#(最小##)

...

粗體字

##...> ;

粗體字

(強調) （同上效果略同）

...

斜體字

...

斜體字

(強調) #

... dfn>

斜體字

(表示定義#)

.. .

底線

#...

底線

#(表示插入文字)

#~~...~~

橫線

~~...~~

刪除線

~~...~~

刪除線

(表示刪除#)

鍵盤文字

#...

打字體

...固定寬度字體

(#在檔案中空白、換行、定位功能有效)

...</plaintext>固定寬度字體#(不執行標記符號) # <listing>...</listing> 固定寬度小字體 ...字體顏色 ...最小字體# font-size:100 px ">>...#無限增大 ## 回到頂部 <a href="#_labelTop"></a><img class="anchorclass" alt="html中常用標籤的總結總結" >區斷標記 <h2># </h2> <hr> 水平線 <hr size="9"> >水平線##(設定大小) <hr width="80%">>水平線(設定寬度) <hr color="ff0000"> >水平線(##顏色) (換行) ## ...水域#(不換行) ... 水域(段落#) # <center>...</center>置中 <a href="#_labelTop"></a>##回到頂部<img class="anchorclass" alt="html中常用標籤的總結總結" > <h2>連結格式</h2> # ##<base href="<span" style="font-family: 宋体;">地址>(預設好連結路徑) ##<a href="<p">地址></a>#外部連結# ##<a href="</p">地址target='_blank'#></a>#外部連結(#另開新視窗) <a href="</p">位址##target='## _top'></a>外部連結(全視窗連結) <a href="</p">地址target='頁框名'#>外部連結(在指定頁框連接#) <a href="#_labelTop"></a><img class="anchorclass" alt="html中常用標籤的總結總結" > <h2></h2> 回到頂部貼圖/音樂 <img src="</span" alt="html中常用標籤的總結總結" >圖片地址> 貼圖 ## <img src="<span" style="max-width:90%"Times New Roman';" alt="html中常用標籤的總結總結" >圖片地址width="#180">設定圖片寬度### ######<img src="###%E5%9C%96%E7%89%87%E5%9C%B0%E5%9D%80######height=%22######30%22######&gt" alt="html中常用標籤的總結總結" ><img src="<span" style="max-width:90%" alt="html中常用標籤的總結總結" >圖片地址alt="提示文字">#設定圖片提示文字</a> <img src="<span" style="max-width:90%" alt="html中常用標籤的總結總結" >圖片地址 border="1"# >設定圖片邊框 <bgsound src="MID<span" style="font-family: 宋体;">音樂檔案地址##>背景音樂設定</bgsound> 回到頂部<a href="#_labelTop"></a><img class="anchorclass" alt="html中常用標籤的總結總結" > <h2>表格語法</h2> <table aling="left">...</table> 表格位置,置左 <table aling="center">...</table> 表格位置,置中 <table background="<p">圖片路徑>...</table> 背景圖片的URL=就是路徑網址# <table border="<p">邊框大小>...</table> 設定表格邊框大小(#使用數字#) <table bgcolor="<p">顏色碼>...</table> 設定表格的背景顏色 <table borderclor="<p">顏色碼>...</table> #設定表格邊框的顏色 <table borderclordark="<p">顏色碼>...</table> 設定表格暗邊框的顏色 <table borderclorlight="<p">顏色碼>...</table> 設定表格亮邊框的顏色 <table cellpadding="<p">參數>... table>指定內容與格線之間的間距(#使用數字#) <table cellspacing="<p">參數>...</table> #指定格線與格線之間的距離(使用數字) #<table cols="<p">參數>. ..</table> 指定表格的欄位數 <table frame="<p">參數> ...</table> 設定表格外框線的顯示方式 <table width="<span" style="font-family: 宋体;">寬度>... </table> 指定表格的寬度大小(使用數字) <table height="<span" style="font-family: 宋体;">高度>... </table>&gt ;指定表格的高度大小(使用數字#) &lt ;td colspan=參數>...指定儲存格合併欄的欄數(使用數字) <td rowspan="<span" style="font-family: 宋体;">參數>... </td> 指定儲存格合併列的欄位數(使用數字) <a href="#_labelTop">回到頂部</a><img class="anchorclass" alt="html中常用標籤的總結總結" > <h2>分割視窗</h2> # <frameset cols="20%,*"> 左右分割,將左邊框架分割大小為20% 右邊框架的大小瀏覽器會自動調整 <frameset rows="20%,*"> 上下分割##,將上方框架分割大小為20%下方框架的大小瀏覽器會自動調整# <frameset cols="20%,*"> 分割左右兩個框架 <frameset cols="20%,*,20%"> 分割左中右三個框架 分割上下兩個框架 <frameset rows="20%, *,20%"> 分割上中下三個框架 屬性： cols 垂直切割視窗（如左右分割兩個視窗）接受整數值，百分數，*#（*代表佔用餘下空間）數值的個數代表分成的部分數目，要以逗號分隔。例：cols="30,*,50%"可以切成三個視窗，第一部分是30#像素（pixels）為絕對分割，第二部分是當分配完第一和第三視圖後剩下的空間，第三部分則佔整個視窗的 50%寬度，為相對分割。 rows 就是橫向切割，將視窗上下分開，數值設定同上。 以上兩個屬性盡量不要在同一個 <frameset> #標籤中，因為王井（netscape#）不支持，盡量採用多重分割。 frameborder 設定框架的邊框，其值有0#不要邊框，1#要邊框。 border 設定框架邊框厚度 framespacing 表示框架與框架間保留空白的距離 frame 元素（單一標籤） ##語法格式： <frame name="" src="url" scrolling="yes/no" noresize> 屬性：# name 框架名稱，指定框架來做連線的目標視窗。 src 框架中要顯示的網頁文字當url位址，每個框架要對應一個html。 scrolling 是否顯示捲軸，yes/no,auto是自動。 noresize 設定不讓使用者改變這個框架的大小， noframe元素 指定當使用了框架的頁面在不支援框架的瀏覽器中開啟時顯示的資訊 語法格式： <noframe> ......o <a href="#_labelTop"></a><img class="anchorclass" alt="html中常用標籤的總結總結" > <h2></h2> </noframe> 回到頂部 表單 <form> 語法格式： <form action="url" method="get/post "></form> .... #<input type="submit"><input type="reset"> # </form> #method有兩種提交方式get,post action 是指明處理該表單的程式位置，這樣表單所填的資料才能傳給cgi做處裡，可設定此參數為action="mailto:lwr8494@163.com" 這樣此表單所填的資料將會傳送到這個郵件地址。 method 是指傳送訊息給cgi 等網路程式的方式。可選 post 方法， get方法，post##方法容許傳送大量訊息。 get方法只接受低於1k的資訊。 申請表單用的是post#搜尋引擎用的是##get ######### ###註解############# ######<a href target> ###指定超連結的分割視窗######### ######</a><a href="####%E9%8C%A8%E7%9A%84%E5%90%8D%E7%A8%B1##"> ######指定錨定名稱的超連結######### ######</a><a href> ###指定超連結####### ### ###<a name="<span" style="font-family: 宋体;">锚的名称> 被连结点的名称 </a> <address>....</address> 用来显示电子邮箱地址 粗体字 <base target> 指定超连结的分割视窗 <basefont size> 更改预设字形大小 <bgsound src> 加入背景音乐 </bgsound> <big> 显示大字体 </big> <blink> 闪烁的文字 </blink> 设定文字颜色 显示本文 换行 <caption align> 设定表格标题位置 <caption>...</caption> 为表格加上标题 <center> 向中对齐 <cite>...<cite> 用於引经据典的文字 </cite></cite> <code>...</code> 用於列出一段程式码 <comment>...</comment> 加上注解 <dd> 设定定义列表的项目解说 <dfn>...</dfn> 显示"定义"文字 <dir>...</dir> 列表文字标签 <dl>...</dl> 设定定义列表的标签 </dd> <dt> 设定定义列表的项目 强调之用 任意指定所用的字形 设定字体大小 <form action> 设定户动式表单的处理方式 </form> <form method> 设定户动式表单之资料传送方式 <frame marginheight> 设定视窗的上下边界 <frame marginwidth> 设定视窗的左右边界 <frame name> 为分割视窗命名 <frame noresize> 锁住分割视窗的大小 <frame scrolling> 设定分割视窗的卷轴 <frame src> 将HTML档加入视窗 <frameset cols> 将视窗分割成左右的子视窗 <frameset rows> 将视窗分割成上下的子视窗 <frameset>...</frameset> 划分分割视窗 <h1>~<h6> 设定文字大小 </h6> </h1> 标示文件资讯 <hr> 加上分格线 檔案的開始與結束 斜體字 # <img align alt="html中常用標籤的總結總結" > 調整圖片影像的位置 <img alt> 為你的圖片影像加註 <img dynsrc loop alt="html中常用標籤的總結總結" > 加入影片 <img height width alt="html中常用標籤的總結總結" > 插入圖片並預設圖形大小 <img hspace alt="html中常用標籤的總結總結" > 插入圖片並預設圖形的左右邊界## <img lowsrc alt="html中常用標籤的總結總結" > 預載圖片功能 <img src border alt="html中常用標籤的總結總結" > 設定圖片邊界 <img src alt="html中常用標籤的總結總結" > 插入圖片 <img vspace alt="html中常用標籤的總結總結" > 插入圖片並預設圖形的上下邊界 <input type name value> 在表單中加入輸入欄位 #<isindex> 定義查詢用表單 <kbd>...</kbd> 表示使用者輸入文字 #<li type>...</li> 清單的項目( 可指定符號##) <marquee> </marquee>跑馬燈效果## <menu>...</menu> 條列文字標籤 <meta name="REFRESH" content url> 自動更新檔案內容 # <multiple> 可同時選擇多項的清單欄 # <noframe> 定義不出現分割視窗的文字 <ol>...</ol> 有序號的清單 ## 定義表單中清單列的項目 # 設定對齊方向 分段 #<person>...</person> 顯示人名 <pre class="brush:php;toolbar:false"> 使用原始排列 <samp>...</samp> 用於引用字 <select>...</select> 在表單中定義清單欄# 顯示小字體# <strike> </strike>文字加橫線 用於加強語氣# 下標字 上標# </pre> <table border="n"> 調整表格的寬線高度 <table cellpadding> 調整資料欄位之邊界 # <table cellspacing> 調整表格線的寬度 <table height> 調整表格的高度 # <table width> 調整表格的寬度 <table>...</table> 產生表格的標籤 # <td align> 調整表格欄位之左右對齊 </td> <td bgcolor> 設定表格欄位之背景顏色 ## </td> <td colspan rowspan> 表格栏位的合并 </td> <td nowrap> 设定表格栏位不换行 </td> <td valign> 调整表格栏位之上下对齐 </td> <td width> 调整表格栏位宽度 </td> <td>...</td> 定义表格的资料栏位 <textarea name rows cols> 表单中加入多少列的文字输入栏 </textarea> <textarea wrap> 决定文字输入栏是自动否换行 </textarea> <th>...</th> 定义表格的标头栏位 <title> 文件标题 <tr>...</tr> 定义表格美一行 <tt> 打字机字体 </tt> 文字加底线 <ul type>...</ul> 无序号的列表 ( 可指定符号 ) <var>...</var> 用於显示变数 BlockQuotc文本缩进 <a href="#_labelTop">回到顶部</a><img class="anchorclass" alt="html中常用標籤的總結總結" > <h2>表示颜色的有三种方式； </h2> 1，16进制颜色代码 语法：#RRGGBB 例：红色 2，10进制RGB码 语法：RGB（RRR，GGG，BBB） 例：红色 3,直接用颜色的英文名称 例：红色 <a href="#_labelTop">回到顶部</a><img class="anchorclass" alt="html中常用標籤的總結總結" > <h2>.....属性可分为三种： </h2> 1，背景属性 包括：bgcolor,background 2,文字属性： 包括：text,link,alink,vlink, 3,留白属性： 其中分为：leftmargin,topmargin .bgcolor背景色 語法格式： # .background背景圖案。 語法格式： .text文字顏色（非連接文字顏色） .link連接文字顏色（可連接文字顏色） .alink活動連接文字顏色（正被點擊的可連接文字的顏色） # .vlink已存取連接文字顏色）（已經點擊訪問過的可連接文字的顏色） 語法格式： .leftmargin 頁面左邊的留白距離 . topmargin 頁面頂部的留白距離 語法格式： 註：value長度值為數字## <img class="anchorclass" alt="html中常用標籤的總結總結" > ##align <h3>屬性 </h3> 語法： <h2 align="html中常用標籤的總結總結"></h2> 文字 #其屬性有三種：left靠左, center居中,right靠右邊# 〈pp 〉 為段落標記，可利用上述屬性對整個段落設定 〈 br> 為換行標記 #為不換行標記放在文字兩邊即可 例： </title> # <h3></h3> 江南逢李龜年 # 歧王宅裡尋常見## 催九堂前幾度聞 正是江南好風景 <a href="#_labelTop"></a>與君落花時節<img class="anchorclass" alt="html中常用標籤的總結總結" > <h2> </h2> <img class="anchorclass" alt="html中常用標籤的總結總結" >預先格式化： <h3> <pre class="brush:php;toolbar:false">......</pre> </h3>瀏覽是效果和編寫是效果格式一樣 回到頂部## 1無序列表又稱符號清單 ### ### ###語法格式：###### ######<ul type="">type###的屬性可選直#####disc######實心圓點######,clrcle######空心圓點######,square######實心方框######### ### <li> 文字 </li> <li> 文字 </li> </ul> <img class="anchorclass" alt="html中常用標籤的總結總結" > <h3></h3> 2有序列表 語法格式： <ol type="html中常用標籤的總結總結" start html> <li>文字 </li> # <li>文字 </li> # </ol> type的值是編號字元可選的有1...,a...,A...,i... ,I... # start為起始值範例：如果<img class="anchorclass" alt="html中常用標籤的總結總結" >start <h3>#為#3##是那麼將從 </h3>3開始，而且必須是數字。 3# 清單 <dl> 定義列表標記 #<dt> 標示定義條目 ## </dt> <dd> 標示定義內容 #語法格式： # <dl> <dt>文字 </dt> <dd>文字內容 </dd> # </dl> 連結與圖片 語法格式： <a href="url" name="html%E4%B8%AD%E5%B8%B8%E7%94%A8%E6%A8%99%E7%B1%A4%E7%9A%84%E7%B8%BD%E7%B5%90%E7%B8%BD%E7%B5%90" target="html中常用標籤的總結總結" title="html中常用標籤的總結總結">.. ..</a> #屬性：href 連接目標值可以是url地址也可以是連接錨點 <a href="url">...</a><a href="#_labelTop">或</a><img class="anchorclass" alt="html中常用標籤的總結總結" > <h2> <a href="<span%20style=" font-family:>錨點</a>">... </h2> <a href="#_labelTop"></a><img class="anchorclass" alt="html中常用標籤的總結總結" > <h2>' #回到頂部</h2> name 連結名稱 ##語法格式： <a name="%E9%8C%A8%E9%BB%9E%E5%90%8D%E7%A8%B1<span%20style=" font-family:>">...</a> 例： <a name="abcdcf">...</a> 連接到該錨點的連接則應為： <a name="#abcdef">....</a> ##回到頂部 target目標視窗語法格式###：###### ######<a>....</a>###### ######-blank###開啟新視窗######## # ######_self###目前視窗開啟######### #######一下兩個只在框架葉面中應用###### #########################。 #_parent###目前視窗的父級視窗（上一層）開啟######### ######_top###在最高一層的視窗開啟####### ## ######windowname###已命名的視窗或框架中開啟連線########## ###title連結提示 <a href="http://www.crazytribe.net" title="打開狂人部落的首頁">狂人部落</a> ##回到頂部<a href="#_labelTop"></a><img class="anchorclass" alt="html中常用標籤的總結總結" > <h2>圖片<img alt="html中常用標籤的總結總結" > #語法格式： </h2> <img src="url" alt="html中常用標籤的總結總結" style="max-width:90%" height="html中常用標籤的總結總結" border="html中常用標籤的總結總結" align="html中常用標籤的總結總結"> border屬性定義圖片邊框的寬度，預設值為0 align屬性設定圖片旁邊文字的位置 語法格式：<img src="" align alt="html中常用標籤的總結總結" > 可選值有： top圖片和文字頂部對齊 middle圖片和文字置中對齊 bottom圖片和文字底邊對齊（預設） left圖片在左對齊，文字沿著圖片繞排 right圖片居右對齊，文字沿著圖片繞排 absmiddle圖片對齊到目前文字行絕對中央 absbottom圖片對齊到目前文字行絕對底部 文字的排版 不換行空白標記 #回到頂部<a href="#_labelTop"></a><img class="anchorclass" alt="html中常用標籤的總結總結" >##font<h2>元素 </h2> 語法格式： 字體名稱 " size="字體大小" color="#字體顏色"> 字體大小可選值為1#—#7，預設為3 範例：〈font face="黑體" size="4" color="#ff00ff"> .... 水平線 <hr> 語法格式： <hr width="寬度" align="對齊方式預設居中center" size="水平線厚度預設為2" color="顏色" noshade> ## noshade無陰影，既實線 層〈p> #兩種元素 是區塊級元素，和段落元素相似，不同的是兩個元素之間不會產生兩個#元素之間的空白行， ## 是行內元素，可以定義段落中部分文字的屬性# 語法格式： #... align設定層中元素的水平對齊方式 stule設定元素應用程式css規格的屬性## <a href="#_labelTop"></a># <img class="anchorclass" alt="html中常用標籤的總結總結" >相容性比 <h2>#好一點，最好使用</h2> # 回到頂部 表格語法格式： <table width="" bgcolor="" background="" border="" cellspacing="" cellpadding=""> <tr>...<td>. ...</td>....</tr> # </table> border邊框寬度預設值為0，既沒有邊框 # <img class="anchorclass" alt="html中常用標籤的總結總結" >cellspacing<h3>表格中儲存格的邊距大小，預設值為兩個像素 </h3>cellpadding表格中儲存格之間的間距大小，預設值為兩個像素 tr元素# 語法格式： <tr align="" bgcolor="">....</tr> align屬性對齊方式可選值如下：left,center,tight,<img class="anchorclass" alt="html中常用標籤的總結總結" >預設為 <h3>left </h3>bgcolor 指定該行的背景顏色 #td元素## <a href="#_labelTop"></a><img class="anchorclass" alt="html中常用標籤的總結總結" >#################################################################################### # ####語法格式：###### ######<td width="###寬度######" height="######高#### ##" align="######水平對齊方式######" valign="#######垂直對齊方式######" bgcolor="" background="" rowspan="######單元格的行跨度######" colapan="######單元格的列跨度######">..... ######### ######align###屬性的可選值有：######left,center,right ######## # #####valign###屬性的選用值有：######top,middle,bottom ######### ######rowspan###和### ###colapan######跨行和跨列的數量，預設為#####1 ######### #########回到頂部### ######<h2>input元素語法格式：</h2> <input type=""> #type屬性的選用值有： text 單行文字方塊## 屬性：name 文字方塊名稱 #value 文字方塊的初始值 size 文字方塊的長度 #maxlength 可輸入字串最大的長度 radio 單選方塊 屬性：name #單選方塊名稱 value 內部值 #checked 預設選取 ## checkbox 複選框 屬性：name 複選框名稱 #。 value 內部值 checked 預設選取 reset 重置按鈕 submit 確定按鈕 # 屬性：name 按鈕名稱 value 已顯示在按鈕上的文字## password 密碼方塊 屬性與文字方塊的屬性完全相同 file 檔案域 屬性：name檔案域名稱 size 檔案網域的長度 maxlength 檔案域可接受的字元數量的上限 # hidden 隱藏域 # 屬性：name 隱藏域名稱# value 內定值 # image 圖片領域 屬性：name 要代表的按鈕，可以是 submit,reset, 或其他 . # src 按鈕圖片的<a href="#_labelTop"></a>url <img class="anchorclass" alt="html中常用標籤的總結總結" >地址<h2> 列錶框</h2> <select> 語法格式： <select> </select> ..... <option> ....</option> <a href="http://www.php.cn/code/4996.html" target="_blank">.....</a> </select> 回到頂部 <img class="anchorclass" alt="html中常用標籤的總結總結" >select<h3>元素 </h3> 語法格式： <select name="" size="" multiple></select> ######### #####name ###指定列錶框的名字### ###### ######size ###指定列錶框顯示列表項目的條數，如果指定了該參數，######select######元素是個列表，否則是一個###下拉列錶框### ######### ######multiple ###指定了這個參數，則表示該列錶框可選擇多項，否則只可選擇一項目######### ###################option###屬性############ ###語法格式：<option value="" selected></option> value 該清單項目的值 selected 如果設定了這個參數，預設為選定這一項## 回到上方<a href="#_labelTop"></a><img class="anchorclass" alt="html中常用標籤的總結總結" > <h2>多行文字方塊<textarea> </textarea> </h2> <textarea name="" cols="" rows="" wrap="off/physical/virtual"></textarea> 屬性： #name文字方塊的名稱 cols文字方塊的寬度 rows文字方塊的高度 wrap文字方塊的折行方式可選值有： ## off不保存換行資訊 physical強迫瀏覽器在傳送訊息到web伺服器端時必須將多行文字方塊的文字一行一行的送出， #virtual送出連續成串的字除非使用者按回車。 回到頂部<a href="#_labelTop"></a><img class="anchorclass" alt="html中常用標籤的總結總結" >#css <h2>層疊樣式表 </h2> 引入層疊樣式表的方法包括： <img class="anchorclass" alt="html中常用標籤的總結總結" >外接式樣式表<h3> </h3> 範例： # <link rel="stylesheet" href="/css%20/default.css"> # #.... # 屬性：rel 用來說明<link>元素在這裡要完成的任務是連接一個獨立的css檔案。而href屬性給出了所要連接css檔案的##url位址 內嵌式樣式表： 範例： <style type="text/css"> #<!- - td{font:9pt;color:red}# .font105{font:10.5pt;color:blue} --> </style> ....# <img class="anchorclass" alt="html中常用標籤的總結總結" >元素內定 <h3> </h3>格式： <img class="anchorclass" alt="html中常用標籤的總結總結" >匯入式樣式表 <h3> </h3>〈 html> <style type="text/css">  # 士大夫井岡山地方官 九連續離開計畫 # #還有一個方法就是限定可以套用它的頁面元素 #「範例：〈head> <title>.....</title> #<style type="text/css"></style>  士大夫井岡山地方官 <h1 class="red">九連續離開計畫</h1> # 3 id選擇符 與class選擇附類似，只是把'.'#換成'#' 範例： ### <style type="text/css"> ####### ######</style>###### # ########### ############ ######<table width="250" border="1 " height="50">###### ######<tr>###### ### <td align="center" id="select">idSelector </td> </tr> </table> We see that when calling ID, the selection is attached with CLASS Select Attach Similar, but replace class="" with id="" to facilitate the call of page script language <img class="anchorclass" alt="html中常用標籤的總結總結" > <h3>##Associative selector </h3> <style type="text/css"> &lt ;!-- td p{font-size:18px;color:#0000ff} --> </style> <table width="250" border="1" height="50"> <tr> <td align="center"> Association selector </td> </tr> </table> Associated selection Symbol We set the elements in the element </td> <td> For styles that contain text, the style will take effect only if both conditions are met. Pseudo-class selector is a selector that can only be used in the css selector, but cannot be used in the html code Example: 〈html> <style type="text/css">  &lt ;/style> </style> &lt ;p><a href="#">Associative selector</a> &lt ;p><a href="#">Associative selector</a> &lt ;p><a href="#">Associative selector</a> &lt ;p><a href="#">Associative selector</a> 〈 /body> The correct order isa:link\a :visited\a:hover Otherwise, the connection colors on the page will be confused <img class="anchorclass" alt="html中常用標籤的總結總結" > <h3>Pseudo-element selector</h3> is similar to the definition of pseudo-class selector. Currently, there are two supported by most browsers: first-line pseudo-element (first-line ) and the first-letter pseudo-element (first-letter) are used to achieve the effect of capitalizing the first line and sinking the first line Example: First line <style></style>  &gt ; dfgsadfgsdfgsdfgsdfgsdfgsdfgsdfgsdfgsdfgsdf... html> The length changes with the size of the browser window First word <style></style>  <table width="300" border="1" height="150 "> <tr> <td align="center"> css Rules </td> </tr> </table> html> is the highest level </td> <td> the next two levelscssUsed on an attribute element, the same override, different inheritance, 2.CombinationExample:td{font-size:12pt}p1{font-size:12pt}After combinationtd,.p1{font-size: 12pt} 3.CascadeAfter it is defined in the style, define another one in the table attribute <style type="text/css"></style> <table width="300" border="1" height="150"> <tr> <td align="center" style=" color:#0000ff" class="red">Juesa local official</td> </tr> </table> cssunit Four major categories: 1 Unit of lengthThe value can be an integer, a decimal, a positive number, a negative number, 0, followed by the unit (do not use negative values lightly) Conversion relationship: 1in(inch)=6pc(pie1in(inch)=72pt(pound) 1in(inch)=2.54(cm) 1cm(cm)=10mm(MM) 1cm(CM)=0.3937( inch) 1pt(pound)=1/72in(inch)=0.2478mm(MM) 1pc( Pie)=1/6in( inch)=The size of my country’s new No. 4 lead type 2 Percentage unit 3 Color unit 4 urlUnit <a href="#_labelTop" style="text-align: right;">Back to top</a><img class="anchorclass" alt="html中常用標籤的總結總結" > <h2>pAttribute </h2> color : #999999 Text color font-family : 宋体font font -size: 10pt Text size##font-style:itelic Text italic sportsfont-variant:small-caps small font letter-spacing<a href="http://www.php.cn/wiki/865.html" target="_blank"> : 1pt </a>Text spacingline-height : 200% Set line height font-weight:bold Bold text vertical-align<a href="http://www.php.cn/wiki/869.html" target="_blank">:sub </a>subscriptvertical-align:super Superscript text-decoration<a href="http://www.php.cn/wiki/859.html" target="_blank">:line-through </a>Addhtml中常用標籤的總結總結h Except linetext-decoration:overline Add top line text-decoration:underline Add underline text-decoration:none html中常用標籤的總結總結hExcept for connecting the bottom line text-transform<a href="http://www.php.cn/wiki/863.html" target="_blank"> : capitalize </a>Capitalize the first wordtext-transform : uppercase English uppercasetext-transform : lowercase English writingtext-align:right Text*Align righttext-align:left Text-align*Align lefttext-align:center Text-center alignmentThese are some simple text effects that can be applied to css pages . Back to top<a href="#_labelTop"></a><img class="anchorclass" alt="html中常用標籤的總結總結" > <h2>Background </h2>TEXTAREA STYLE="border:1px dashed pink" >solid line <textarea style="border:1px solid pink"> </textarea> </td> </dd> </dl> </table> </table> </table> </table> </table></noframe></multiple> </frameset> </frameset> </form> </dt> </center> </caption></a> </frameset> </frameset> </frameset> </frameset> </frameset> </frameset> </table></marquee>以上是html中常用標籤的總結總結的詳細內容。更多資訊請關注PHP中文網其他相關文章！</div><div class="nphpQianMsg"><div class="clear"></div></div><div class="nphpQianSheng">陳述：<div>本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn</div></div></div><div class="nphpSytBox">上一篇：<a class="dBlack" title="常見全域屬性的總結分享" href="http://m.php.cn/zh-tw/faq/367595.html">常見全域屬性的總結分享</a>下一篇：<a class="dBlack" title="常見全域屬性的總結分享" href="http://m.php.cn/zh-tw/faq/367598.html">常見全域屬性的總結分享</a></div><div class="nphpSytBox2"><div class="nphpZbktTitle"><h2>相關文章</h2><a href="http://m.php.cn/zh-tw/article.html" class="bBlack">看更多</a><div class="clear"></div></div><ul class="nphpXgwzList"><li><a href="http://m.php.cn/zh-tw/faq/348757.html" title="Html小知識總結" class="aBlack">Html小知識總結</a><div class="clear"></div></li><li><a href="http://m.php.cn/zh-tw/faq/348804.html" title="如何快速學習HTML" class="aBlack">如何快速學習HTML</a><div class="clear"></div></li><li><a href="http://m.php.cn/zh-tw/faq/348873.html" title="html xhtml xml的區別" class="aBlack">html xhtml xml的區別</a><div class="clear"></div></li><li><a href="http://m.php.cn/zh-tw/faq/348884.html" title="src與href屬性的差別" class="aBlack">src與href屬性的差別</a><div class="clear"></div></li><li><a href="http://m.php.cn/zh-tw/faq/348902.html" title="關於HTML5和CSS替換使用" class="aBlack">關於HTML5和CSS替換使用</a><div class="clear"></div></li></ul></div></div><footer><div class="footer"><div class="footertop"><img src="/static/imghwm/logo.png" alt="">公益線上PHP培訓，幫助PHP學習者快速成長！</div><div class="footermid"><a href="http://m.php.cn/zh-tw/about/us.html">關於我們</a><a href="http://m.php.cn/zh-tw/about/disclaimer.html">免責聲明</a><a href="http://m.php.cn/zh-tw/update/article_0_1.html">Sitemap</a></div><div class="footerbottom"> © php.cn All rights reserved </div></div></footer><script>isLogin = 0;</script><script type="text/javascript" src="/static/layui/layui.js"></script><script type="text/javascript" src="/static/js/global.js?4.9.47"></script></div><script src="https://vdse.bdstatic.com//search-video.v1.min.js"></script><link rel='stylesheet' id='_main-css' href='/static/css/viewer.min.css' type='text/css' media='all'/><script type='text/javascript' src='/static/js/viewer.min.js?1'></script><script type='text/javascript' src='/static/js/jquery-viewer.min.js'></script><script>jQuery.fn.wait = function (func, times, interval) { var _times = times || -1, //100次 _interval = interval || 20, //20毫秒每次 _self = this, _selector = this.selector, //选择器 _iIntervalID; //定时器id if( this.length ){ //如果已经获取到了，就直接执行函数 func && func.call(this); } else { _iIntervalID = setInterval(function() { if(!_times) { //是0就退出 clearInterval(_iIntervalID); } _times <= 0 || _times--; //如果是正数就 -- _self = $(_selector); //再次选择 if( _self.length ) { //判断是否取到 func && func.call(_self); clearInterval(_iIntervalID); } }, _interval); } return this; } $("table.syntaxhighlighter").wait(function() { $('table.syntaxhighlighter').append(""); }); $(document).on("click", ".cnblogs_code_footer",function(){ $(this).parents('table.syntaxhighlighter').css('display','inline-table');$(this).hide(); }); $('.nphpQianCont').viewer({navbar:true,title:false,toolbar:false,movable:false,viewed:function(){$('img').click(function(){$('.viewer-close').trigger('click');});}}); </script></body></html>