標籤：microsoft 字型大小 xxxx 退出 索引 amp 顏色 大文本 sub
HTML+CSS
HTML參考手冊【http://www.w3school.com.cn/tags/index.asp】
0、HTML主體標記
代碼分為三部分編寫
<html> 是網頁檔案的最外層標記<head> 之間的文本是頭資訊 不會顯示在瀏覽器中，包括基本的描述，整個網頁的公用屬性</head><body> 是網頁檔案的主體部分本文 ：文字、圖片、連結、表單等</body></html>
1、HTML文檔頭部標記
<head>頭部標記</head>
<title>標籤 </title> 只能有一個
###定義網頁標題，顯示在瀏覽器的標題列中，如：公司名稱+公司產品。有利於搜尋引擎
<base 為頁面上的所有連結規定預設地址或預設目標 /> 只能有一個
###基底網址標記，用於設定瀏覽器中檔案的絕對路徑，網頁中的檔案只需要寫下檔案的相對路徑即可，這個路徑就是base中指定下的路徑。【一般很少使用】
<link 連結樣式表 /> 可以有多個
###用於確定本頁面和其它文檔之間的關係
<meta> 可以有多個
###有兩種用法。可提供有關頁面的元資訊，比如針對搜尋引擎和更新頻度的描述和關鍵詞。位於文檔的頭部，不包含任何內容。<meta> 標籤的屬性定義了與文檔相關聯的成對的名稱和數值。
1.<meta name=“” content=“”>
###Name用於在網頁中加入一些關於網頁的描述資訊，網頁的關鍵字，網頁描述資訊。"keywords"是一個經常被用到的名稱。它為文檔定義了一組關鍵字。某些搜尋引擎在遇到這些關鍵字時，會用這些關鍵字對文檔進行分類。（Keywords : 網頁的關鍵字；Description：網頁的描述）
Robots：是否允許被搜尋引擎搜尋
例如：
<span style="font-size:18px;"><meta name="keywords" content="HTML,ASP,PHP,SQL"></span>
2.<meta http-equiv=“” content=“”>
http-equiv:屬性用於在HTML文檔中類比HTTP協議的響應訊息頭，例如，告訴瀏覽器是滯快取頁面面，使用什麼樣的字元集顯示網頁內容。【refresh：重新整理，轉向其他頁面，expires：快取頁面面】
例如：
<span style="font-size:18px;"><meta http-equiv="charset" content="iso-8859-1"><meta http-equiv="expires" content="31 Dec 2008"></span>
<meta http-equiv="Windows-Target" content="_top"> ##禁止本網頁被載入成其他網頁小表單
進入/退出頁面特效【23種】
<meta http-equiv="Page-Enter" content="revealTrans(Transition=2,Duration=1.000)"> #進入<meta http-equiv="Page-Exit" content="revealTrans(Transition=22,Duration=1.000)"> #退出
3、主體標記<body>
###包含文檔的所有內容（比如文本、超連結、映像、表格和列表等等。在它中放置網頁中所有內容。
註：只要是可以用樣式控制的就不用HTML本身屬性
屬性 值 描述 alink
- rgb(x,x,x)
- #xxxxxx
- colorname
不贊成使用。請使用樣式取代它。
規定文檔中活動連結（active link）的的顏色。
background URL 不贊成使用。請使用樣式取代它。
規定文檔的背景映像。
bgcolor
- rgb(x,x,x)
- #xxxxxx
- colorname
不贊成使用。請使用樣式取代它。
規定文檔的背景顏色。
link
- rgb(x,x,x)
- #xxxxxx
- colorname
不贊成使用。請使用樣式取代它。
規定文檔中未訪問連結的預設顏色。
text
- rgb(x,x,x)
- #xxxxxx
- colorname
不贊成使用。請使用樣式取代它。
規定文檔中所有文本的顏色。
vlink
- rgb(x,x,x)
- #xxxxxx
- colorname
不贊成使用。請使用樣式取代它。
規定文檔中已被訪問連結的顏色。
"Id" "name" "class" "style" 等通用屬性，所有的元素都可以使用
4、<!DOCTYPE>
聲明必須是 HTML 文檔的第一行，位於 <html> 標籤之前。
聲明不是 HTML 標籤；它是指示 網頁瀏覽器關於頁面使用哪個 HTML 版本進行編寫的指令。##########################################################################
注釋：<!DOCTYPE> 聲明沒有結束標籤。
提示：<!DOCTYPE> 聲明對大小寫不敏感。
提示：請使用 W3C 的驗證器來檢查您是否編寫了有效 HTML / XHTML 文檔！##########################################################################
例如：
HTML 5
<span style="font-size:18px;"><!DOCTYPE html></span>
HTML 4.01 Transitional
<span style="font-size:18px;"><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"></span>
5、常用標籤
#格式標籤
格式標籤用於定義網頁中文本的布局、縮排、位置、換行、列表等。
<br> 換行
<p> 段落
<center> 對其所包括的文本進行水平置中
<pre> 保留文字在原始碼中的格式【http://www.w3school.com.cn/tags/tag_pre.asp】
<ul><li> 無序列表例如：
<span style="font-size:18px;"><ul> <li>Coffee</li> <li>Tea</li> <li>Milk</li></ul></span>
<ol><li> 有序的列表
例如：
<span style="font-size:18px;"><ol> <li>Coffee</li> <li>Tea</li> <li>Milk</li></ol></span>
<hr> 水平分隔線
標籤：
<span style="font-size:18px;"><h1>This is header 1</h1><hr /><p>This is some text</p></span>
6、文字標籤
在網頁中，為了著意強調某一部分文字，或者為了讓文字有所變化 0、<hn> #以標題樣式顯示文本，n為數字
<span style="font-size:18px;"><h1>這是標題 1</h1><h2>這是標題 2</h2><h3>這是標題 3</h3><h4>這是標題 4</h4><h5>這是標題 5</h5><h6>這是標題 6</h6></span>
1、<b> </b> #粗體文本
2、<i> </i> #顯示斜體文字效果。標籤和基於內容的樣式標籤 <em> 類似。它告訴瀏覽器將包含其中的文本以斜體字（italic）或者傾斜（oblique）字型顯示。如果這種斜體字對該瀏覽器停用話，可以使用高亮、反白或加底線等樣式。
註：<i> 標籤一定要和結束標籤 </i> 結合起來使用。
3、<u> </u> #為文本添加底線註：請盡量避免為文本加底線 - 使用者會把它混淆為一個超連結！
4、<sub> </sub> #定義下標文本。包含在 <sub> 標籤和其結束標籤 </sub> 中的內容將會以當前文字資料流中字元高度的一半來顯示，但是與當前文字資料流中文字的字型和字型大小都是一樣的。註：無論是 <sub> 標籤還是和它對應的 <sup> 標籤，在數學等式、科學符號和化學公式中都非常有用
5、<sup> </sup> #定義上標文本，與<sub>類似註：這個標籤在向文檔添加腳註以及表示方程式中的指數值時非常有用。如果和 <a> 標籤結合起來使用，就可以建立出很好的超連結腳註。
6、<font> </font> #定文本的字型、字型尺寸、字型顏色
例如：
<span style="font-size:18px;"><font size="3" color="red">This is some text!</font><font size="2" color="blue">This is some text!</font><font face="verdana" color="green">This is some text!</font></span>
7、<tt> </tt> #呈現類似打字機或者等寬的文字效果。
對於以下元素，建議使用樣式表，可以到達更豐富的效果##<em> 把文本定義為強調的內容。
##<strong> 把文本定義為語氣更強的強調的內容。
##<dfn> 定義一個定義項目。
##<code> 定義電腦代碼文本。
##<samp> 定義樣本文本。
##<kbd> 定義鍵盤文本。它表示文本是從鍵盤上鍵入的。它經常用在與電腦相關的文檔或手冊中。
##<var> 定義變數。您可以將此標籤與 <pre> 及 <code> 標籤配合使用。
##<cite> 定義引用。可使用該標籤對參考文獻的引用進行定義，比如書籍或雜誌的標題。8、<big></big> #顯現大號字型效果。如果文字已經是最大號字型，這個 <big> 標籤將不起任何作用。可以嵌套 <big> 標籤來放大文本。
6、超連結標籤
錨點的應用
<a href=“URL”>某某頁面</a> : 超串連
<a name=“name”>內容</a> :錨點
使用時<a href=“#name”>定位位置</a>
7、映像標籤
<img /> #向網頁中嵌入一幅映像。兩個必需的屬性：src 屬性 和 alt 屬性
alt text規定映像的替代文本。
src URL規定顯示映像的 URL。
常用屬性：
border：邊框的寬度
width：映像寬度
height：映像高度
8、映像地圖
因為一個映像只能加一個a標籤，做一個連結
如果把一幅映像分成多個地區，每個地區指向不同的URL地址（為一個圖片加多個連結）【例如中國地圖】
在映像<img>中使用usemap屬性去使用地圖
<map>定義作用區
<area>指定每個作用區
Shape指定形狀 rect, poly, circle
Coords確定形狀
href指定連結的位置
例如：
<span style="font-size:18px;"><img src="planets.jpg" border="0" usemap="#planetmap" alt="Planets" /><map name="planetmap" id="planetmap"> <area shape="circle" coords="180,139,14" href ="venus.html" alt="Venus" /> <area shape="circle" coords="129,161,10" href ="mercur.html" alt="Mercury" /> <area shape="rect" coords="0,0,110,260" href ="sun.html" alt="Sun" /></map></span>
9、表格標籤
表格標籤<table>
列標籤<tr>
欄標籤<td><th>
表頭儲存格 - 包含表頭資訊（由 th 元素建立） #文字是以粗體置中顯示，欄位標籤
標準列儲存格 - 包含資料（由 td 元素建立） #td元素內的文本通常是靠左對齊的普通文本
例：一個簡單的 HTML 表格，包含兩行兩列
<span style="font-size:18px;"><table border="1"> <tr> <th>Month</th> <th>Savings</th> </tr> <tr> <td>January</td> <td>$100</td> </tr></table></span>註：如果需要將內容橫跨多個行或列，請使用 colspan 和 rowspan 屬性。【指定幾行幾列】
可選的屬性
屬性 值 描述 abbr text 規定儲存格中內容的縮寫版本。 align
- left
- right
- center
- justify
- char
規定儲存格內容的水平對齊。 axis category_name 對儲存格進行分類。 bgcolor
- rgb(x,x,x)
- #xxxxxx
- colorname
不推薦使用。請使用樣式替代它。
規定表格儲存格的背景顏色。
char character 規定根據哪個字元來進行內容的對齊。 charoff number 規定對齊字元的位移量。 colspan number 設定儲存格可橫跨的列數。 headers idrefs 由空格分隔的表頭儲存格 ID 列表，為資料儲存格提供表頭資訊。 height
- pixels
- %
不推薦使用。請使用樣式替代它。
規定表格儲存格的高度。
nowrap nowrap 不推薦使用。請使用樣式取而代之。
規定儲存格中的內容是否折行。
rowspan number 規定儲存格可橫跨的行數。 scope
- col
- colgroup
- row
- rowgroup
定義將表頭資料與單中繼資料相關聯的方法。 valign
- top
- middle
- bottom
- baseline
規定儲存格內容的垂直相片順序。 width
- pixels
- %
不推薦使用。請使用樣式取而代之。
規定表格儲存格的寬度。
a、Html視窗分幀【分幀不利用搜尋引擎】
把一個瀏覽器文件視窗分隔成多個視窗,每個視窗都可以顯示一個獨立的網頁檔案。每個幀(即頁面)都有自己的url。【通常用於後台首頁】
1、幀標籤
<frameset>標籤
frameset 元素可定義一個框架組。它被用來組織多個視窗（架構）。每個架構存有獨立的文檔。在其最簡單的應用中，frameset 元素僅僅會規定在框架組中存在多少列或多少行。
屬性：rows、cols、 可以使用固定值，百分比和 * 三種
border：邊框的寬度
frameborder：是否顯示邊框
<span style="font-size:18px;"><html><frameset cols="25%,50%,25%"> <frame src="frame_a.htm" /> <frame src="frame_b.htm" /> <frame src="frame_c.htm" /></frameset></html></span>
<frame>標籤
<frame> 標籤定義 frameset 中的一個特定的視窗（架構）。
屬性：src、name
scrolling：是否出現捲軸（yes/no）
noresize：不可以調邊框尺寸，預設可調
<a href=“”>的target屬性【指定顯示位置】
四個內建的取值：_blank、_parent、_self、_top
<span style="font-size:18px;"><html><frameset cols="25%,50%,25%"> <frame src="frame_a.htm" /> <frame src="frame_b.htm" /> <frame src="frame_c.htm" /></frameset></html></span>
<noframes>標籤
noframes 元素可為那些不支援架構的瀏覽器顯示文本（“請使用可以分幀的瀏覽器”）。noframes 元素位於 frameset 元素內部。
使用Microsoft Visual Studio.NET建立框架組
<iframe>標籤【常用於前台特效顯示】
iframe 元素會建立包含另外一個文檔的內聯架構（即行內架構）【畫中畫效果】
註：您可以把需要的文本放置在 <iframe> 和 </iframe> 之間，這樣就可以應對無法理解 iframe 的瀏覽器。
註： 分楨不能和body標籤及內容體共存
b、表單的作用
<form>標籤及其屬性
<from></form>標籤對用來建立一個表單，即定義表單的開始和結束位置，<form>標籤具有下面等屬性。
1、action屬性用來設定接收和處理瀏覽器遞交的表單內容的伺服器程式的URL。相對和絕對
2、Method屬性用來定義瀏覽器將表單中的資訊提交給伺服器端的處理常式的方式，取值可以為：GET或POST.
3、Target屬性用來指定伺服器返回結果顯示的目標視窗或目標幀。
4、Title屬性用來設定當網站訪問者的素、滑鼠在表單上的任一位置停留過幾秒時，瀏覽器用黃色小浮標顯示的文本（如表單的名稱或描述）。
5、Enctype屬性指示瀏覽器使用哪種編碼方法將表單資料傳送給www伺服器。該屬性可以有兩種取值：
application/x-www-form-urlencoded（預設的設定）
multipart/form-data
PHP.8-HTML+CSS（二）-HTML詳解
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
