網(wǎng)頁編程語言。Html之所以能展現(xiàn)出各種各樣的效果，是瀏覽器的功能。
HTML(HyperText Markup Language)就是描述網(wǎng)頁長什么樣子、有什么內(nèi)容的一個文本。查看網(wǎng)頁的描述內(nèi)容（HTML）的方式：使用IE瀏覽器的話，在網(wǎng)頁上點擊右鍵，選擇“查看源文件”
B/S(Browser/ Server)：瀏覽器-服務器，客戶端只需要一個瀏覽器
C/S(Client/Server)：客戶端必須安裝對應的軟件。比如：QQ、MSN、FoxMail

二、最基本的HTML結(jié)構(gòu)

<span style="color: #008080;"> 1</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> <!DOCTYPE> 是HTML5聲明，<!DOCTYPE> 必須是 HTML 文檔的第一行，位于 <html> 標簽之前。<!DOCTYPE>是指示 web 瀏覽器關(guān)于頁面使用哪個 HTML 版本進行編寫的指令。</span><span style="color: #008000;">--></span>
<span style="color: #008080;"> 2</span> <span style="color: #0000ff;"><!</span><span style="color: #ff00ff;">DOCTYPE html</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 3</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">html</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 4</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> head標簽是所有頭部元素的容器。head標簽內(nèi)的元素可包含腳本、樣式表和提供頁面的元信息等等。以下標簽都可以添加到 head 部分：title、base、link、meta、script 以及style。頭部的內(nèi)容不會顯示在瀏覽器的。 </span><span style="color: #008000;">--></span>
<span style="color: #008080;"> 5</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">head</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 6</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> 設置字符集，如果字符集不對，可能導致亂碼。一般建議utf-8國際編碼 </span><span style="color: #008000;">--></span>
<span style="color: #008080;"> 7</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">meta </span><span style="color: #ff0000;">http-equiv</span><span style="color: #0000ff;">="Content-Type"</span><span style="color: #ff0000;"> content</span><span style="color: #0000ff;">="text/html; charset=gb2312或utf-8或gbk"</span> <span style="color: #0000ff;">/></span>
<span style="color: #008080;"> 8</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> 定時自動跳轉(zhuǎn) </span><span style="color: #008000;">--></span>
<span style="color: #008080;"> 9</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">meta </span><span style="color: #ff0000;">http-equiv</span><span style="color: #0000ff;">="refresh"</span><span style="color: #ff0000;"> content</span><span style="color: #0000ff;">="10;URL=http://www.leixuesong.cn"</span> <span style="color: #0000ff;">/></span>
<span style="color: #008080;">10</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> SEO相關(guān)標簽，title定義文檔的標題,百度建議一般不要超過32位,meta定義頁面關(guān)鍵詞和頁面的描述</span><span style="color: #008000;">--></span>
<span style="color: #008080;">11</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">title</span><span style="color: #0000ff;">></span>網(wǎng)頁標題<span style="color: #0000ff;"></</span><span style="color: #800000;">title</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">12</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">meta </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="keywords"</span><span style="color: #ff0000;"> content</span><span style="color: #0000ff;">="PHP程序員,技術(shù)博客,個人博客"</span> <span style="color: #0000ff;">/></span>
<span style="color: #008080;">13</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">meta </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="description"</span><span style="color: #ff0000;"> content</span><span style="color: #0000ff;">="我的博客記錄了Linux學習，PHP開發(fā)與編程，Web前端開發(fā)，MySQL學習和教程，NoSQL數(shù)據(jù)庫教程以及個人的人生經(jīng)歷和觀點。"</span> <span style="color: #0000ff;">/></span>
<span style="color: #008080;">14</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">link </span><span style="color: #ff0000;">rel</span><span style="color: #0000ff;">="stylesheet"</span><span style="color: #ff0000;"> type</span><span style="color: #0000ff;">="text/css"</span><span style="color: #ff0000;"> href</span><span style="color: #0000ff;">="main.css"</span> <span style="color: #0000ff;">/></span>
<span style="color: #008080;">15</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">script </span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="text/javascript"</span><span style="color: #ff0000;"> src</span><span style="color: #0000ff;">="http://pagead2.googlesyndication.com/pagead/show_ads.js"</span><span style="color: #0000ff;">></</span><span style="color: #800000;">script</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">16</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">head</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">17</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> 正文部分，所有在瀏覽器上可見的內(nèi)容必須寫在body標簽內(nèi)部 </span><span style="color: #008000;">--></span>
<span style="color: #008080;">18</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">body</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">19</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">body</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">20</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">html</span><span style="color: #0000ff;">></span>

三、最常用的HTML標簽

a、布局標簽

div標簽定義文檔中的分區(qū)或節(jié)（division/section），可以把文檔分割為獨立的、不同的部分，主要用于布局。
aside標簽的內(nèi)容可用作文章的側(cè)欄，html5新增標簽。
header標簽定義頁面的頭部（介紹信息），html5新增標簽。
section標簽定義文檔中的節(jié)（section、區(qū)段）。比如章節(jié)、頁眉、頁腳或文檔中的其他部分，html5新增標簽。
footer 標簽定義文檔或節(jié)的頁腳，通常包含文檔的作者、版權(quán)信息、使用條款鏈接、聯(lián)系信息等等，html5新增標簽。
article標簽規(guī)定文章獨立的其他內(nèi)容，比如：標題、內(nèi)容、評論，html5新增標簽。

b、文本標簽

h1-h6標簽可定義標題（h1最大，h6最?。?/li>
p標簽定義段落
b/strong標簽加粗
em標簽來表示強調(diào)的文本，斜體
strong標簽表示重要文本
u標簽下劃線
s標簽刪除線
br標簽表示回車換行
hr標簽表示水平線
span標簽被用來組合文檔中的行內(nèi)元素。
blockquote標簽表示塊引用
pre標簽可定義預格式化的文本，保持原有格式的一種標簽。
sub標簽下標，
sup>標簽上標
表示一個空格
©表示版權(quán)符
<表示<
>表示>

c、a標簽定義超鏈接

指定頁面間的跳轉(zhuǎn)，鏈接可以指向外部鏈接或者頁面內(nèi)部id錨點，可以在當前頁面打開，新開窗口。

<span style="color: #0000ff;"><</span><span style="color: #800000;">a </span><span style="color: #ff0000;">href</span><span style="color: #0000ff;">="指向的鏈接地址或者網(wǎng)址#ID名"</span><span style="color: #ff0000;"> target</span><span style="color: #0000ff;">="_blank|_self|_top|_parent"</span><span style="color: #0000ff;">></span>百度<span style="color: #0000ff;"></</span><span style="color: #800000;">a</span><span style="color: #0000ff;">></span>

超級鏈接

<span style="color: #0000ff;"><</span><span style="color: #800000;">a </span><span style="color: #ff0000;">href</span><span style="color: #0000ff;">="http://www.yahoo.com"</span><span style="color: #ff0000;"> target</span><span style="color: #0000ff;">="_self"</span><span style="color: #ff0000;"> title</span><span style="color: #0000ff;">="去美國雅虎"</span><span style="color: #0000ff;">></span>雅虎<span style="color: #0000ff;"></</span><span style="color: #800000;">a</span><span style="color: #0000ff;">></span>

圖片超鏈接

<span style="color: #0000ff;"><</span><span style="color: #800000;">a </span><span style="color: #ff0000;">href</span><span style="color: #0000ff;">="http://www.microsoft.com"</span><span style="color: #0000ff;">><</span><span style="color: #800000;">imgborder</span><span style="color: #0000ff;">="0"</span><span style="color: #ff0000;"> src</span><span style="color: #0000ff;">="1.jpg"</span><span style="color: #0000ff;">/></</span><span style="color: #800000;">a</span><span style="color: #0000ff;">></span>

相對URL
相對URL表示相對于當前文檔的資源;
“/”表示網(wǎng)站根目錄，“../”表示父目錄;
“../../”表示父目錄的父目錄，“./”或者不寫任何斜線表示相對于當前路徑的目錄
站內(nèi)引用最好用相對URL，這樣域名改變了、目錄改變了都不受影響。

<span style="color: #0000ff;"><</span><span style="color: #800000;">img </span><span style="color: #ff0000;">src</span><span style="color: #0000ff;">="../images/csharp1.jpg"</span> <span style="color: #0000ff;">/></span>
<span style="color: #0000ff;"><</span><span style="color: #800000;">img </span><span style="color: #ff0000;">src</span><span style="color: #0000ff;">="/images/csharp1.jpg"</span> <span style="color: #0000ff;">/></span>

將的target屬性設定為"_blank"就可以在新窗口中打開超鏈接。
國情：國內(nèi)的網(wǎng)站很多都是默認在新窗口中打開。target的取值范圍：
_blank :在新窗口中打開
_self :在自己的窗口中打開
_parent :父窗口中打開
_top :表示在頂級窗口打開
框架名稱：在指定框架中打開。

錨記：用name屬性為起名字：這里是最后。這樣可以通過轉(zhuǎn)到平臺來跳轉(zhuǎn)到超鏈接的部分。

d、多媒體標簽

img標簽主要在網(wǎng)頁中插入圖像，可以定義圖片替換文本、顯示寬度和高度、是否帶邊框，建議等比例設置，否則圖像會變形。

　　　注意圖片是鏈接的，不是插入的，所以如果src指向的文件不存在了，就看不了了。alt屬性為圖片無法顯示時的顯示文本，鼠標方式去也會有懸浮提示“點擊查看大圖”；title用來顯示當鼠標放到圖片上時顯示的文字；border屬性指定邊框，border="0"不顯示邊框；width、height屬性指定圖片的顯示大小，如果不指定則是圖片的原始大小。

<span style="color: #0000ff;"><</span><span style="color: #800000;">img </span><span style="color: #ff0000;">src</span><span style="color: #0000ff;">="圖片地址"</span><span style="color: #ff0000;"> alt</span><span style="color: #0000ff;">="替換文本，圖片打不開的時候顯示"</span><span style="color: #ff0000;"> width</span><span style="color: #0000ff;">="圖片寬度"</span><span style="color: #ff0000;"> height</span><span style="color: #0000ff;">="高度"</span><span style="color: #ff0000;"> border</span><span style="color: #0000ff;">="0"</span> <span style="color: #0000ff;">/></span>

audio標簽定義聲音，比如音樂或其他音頻流。html5新增標簽。

<span style="color: #0000ff;"><</span><span style="color: #800000;">audio </span><span style="color: #ff0000;">src</span><span style="color: #0000ff;">="someaudio.wav"</span><span style="color: #0000ff;">></span>您的瀏覽器不支持 audio 標簽。<span style="color: #0000ff;"></</span><span style="color: #800000;">audio</span><span style="color: #0000ff;">></span>

video標簽定義視頻，比如電影片段或其他視頻流。html5新增標簽。

<span style="color: #0000ff;"><</span><span style="color: #800000;">video </span><span style="color: #ff0000;">src</span><span style="color: #0000ff;">="movie.ogg"</span><span style="color: #ff0000;"> controls</span><span style="color: #0000ff;">="controls"</span><span style="color: #0000ff;">></span>您的瀏覽器不支持 video 標簽。<span style="color: #0000ff;"></</span><span style="color: #800000;">video</span><span style="color: #0000ff;">></span>

e、序列化標簽

ul和li無序列表標簽。

<span style="color: #0000ff;"><</span><span style="color: #800000;">ul</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"><</span><span style="color: #800000;">li</span><span style="color: #0000ff;">></span>HTML<span style="color: #0000ff;"></</span><span style="color: #800000;">li</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"><</span><span style="color: #800000;">li</span><span style="color: #0000ff;">></span>JS<span style="color: #0000ff;"></</span><span style="color: #800000;">li</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"><</span><span style="color: #800000;">li</span><span style="color: #0000ff;">></span>PHP<span style="color: #0000ff;"></</span><span style="color: #800000;">li</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"></</span><span style="color: #800000;">ul</span><span style="color: #0000ff;">></span>

ol和li有序列表標簽，可以使用type屬性規(guī)定有序列表符號的類型。1 按數(shù)字有序排列，為默認值，（1、2、3、4）；a 按小寫字母有序排列，（a、b、c、d）；A 按字母大寫有序排列，（A、B、C、D）。i 按小寫羅馬字母有序，（i, ii, iii, iv）；I 按小寫羅馬字母有序，（I, II, III, IV）。

<span style="color: #0000ff;"><</span><span style="color: #800000;">ol</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"><</span><span style="color: #800000;">li</span><span style="color: #0000ff;">></span>HTML<span style="color: #0000ff;"></</span><span style="color: #800000;">li</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"><</span><span style="color: #800000;">li</span><span style="color: #0000ff;">></span>JS<span style="color: #0000ff;"></</span><span style="color: #800000;">li</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"><</span><span style="color: #800000;">li</span><span style="color: #0000ff;">></span>PHP<span style="color: #0000ff;"></</span><span style="color: #800000;">li</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"></</span><span style="color: #800000;">ol</span><span style="color: #0000ff;">></span>

dl標簽定義了定義列表（definition list），dl標簽用于結(jié)合 dt（定義列表中的項目）和 dd（描述列表中的項目）。

<span style="color: #0000ff;"><</span><span style="color: #800000;">dl</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"><</span><span style="color: #800000;">dt</span><span style="color: #0000ff;">></span>計算機<span style="color: #0000ff;"></</span><span style="color: #800000;">dt</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"><</span><span style="color: #800000;">dd</span><span style="color: #0000ff;">></span>用來計算的儀器 ... ...<span style="color: #0000ff;"></</span><span style="color: #800000;">dd</span><span style="color: #0000ff;">></span>
<span style="color: #0000ff;"></</span><span style="color: #800000;">dl</span><span style="color: #0000ff;">></span>

f、表格標簽

為表格，在內(nèi)部通過創(chuàng)建行，內(nèi)部通過創(chuàng)建單元格?？梢詫able的border屬性設為0來隱藏表格線。
cellpadding內(nèi)容和表格邊線之間的距離
cellspacing單元格之間的間距。

rowspan(跨行)、colspan（跨列）進行單元格的合并,是td的屬性。

<span style="color: #008080;"> 1</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">table </span><span style="color: #ff0000;">width</span><span style="color: #0000ff;">="100%"</span><span style="color: #ff0000;"> height</span><span style="color: #0000ff;">="193"</span><span style="color: #ff0000;"> border</span><span style="color: #0000ff;">="1"</span><span style="color: #ff0000;"> cellpadding</span><span style="color: #0000ff;">="0"</span><span style="color: #ff0000;"> cellspacing</span><span style="color: #0000ff;">="0"</span><span style="color: #ff0000;"> bordercolor</span><span style="color: #0000ff;">="#FF0000"</span><span style="color: #ff0000;"> bgcolor</span><span style="color: #0000ff;">="#000000"</span><span style="color: #ff0000;"> background</span><span style="color: #0000ff;">=""</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 2</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 3</span>     <span style="color: #0000ff;"><</span><span style="color: #800000;">th</span><span style="color: #0000ff;">></span>標題<span style="color: #0000ff;"></</span><span style="color: #800000;">th</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 4</span>     <span style="color: #0000ff;"><</span><span style="color: #800000;">th</span><span style="color: #0000ff;">></span>標題<span style="color: #0000ff;"></</span><span style="color: #800000;">th</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 5</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 6</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 7</span>     <span style="color: #008000;"><!--</span><span style="color: #008000;"> 合并橫向單元格 </span><span style="color: #008000;">--></span>
<span style="color: #008080;"> 8</span>     <span style="color: #0000ff;"><</span><span style="color: #800000;">td </span><span style="color: #ff0000;">colspan</span><span style="color: #0000ff;">="2"</span><span style="color: #ff0000;"> nowrap</span><span style="color: #0000ff;">="nowrap"</span><span style="color: #0000ff;">></span><span style="color: #ff0000;">&amp;</span>nbsp;<span style="color: #0000ff;"></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 9</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">10</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">11</span>     <span style="color: #0000ff;"><</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">12</span>     <span style="color: #008000;"><!--</span><span style="color: #008000;"> 合并縱向單元格 </span><span style="color: #008000;">--></span>
<span style="color: #008080;">13</span>     <span style="color: #0000ff;"><</span><span style="color: #800000;">td </span><span style="color: #ff0000;">rowspan</span><span style="color: #0000ff;">="2"</span><span style="color: #0000ff;">></span> <span style="color: #0000ff;"></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">14</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">15</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">16</span>     <span style="color: #0000ff;"><</span><span style="color: #800000;">td </span><span style="color: #ff0000;">height</span><span style="color: #0000ff;">="16"</span><span style="color: #0000ff;">></span> <span style="color: #0000ff;"></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">17</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">18</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">table</span><span style="color: #0000ff;">></span>

g、表單標簽

form標簽定義提交方式、提交地址、表單字符集以及如何對其進行編碼，需要提交的表單一定要放在form標簽內(nèi)。

<span style="color: #0000ff;"><</span><span style="color: #800000;">form </span><span style="color: #ff0000;">id</span><span style="color: #0000ff;">="form1"</span><span style="color: #ff0000;"> name</span><span style="color: #0000ff;">="form1"</span><span style="color: #ff0000;"> method</span><span style="color: #0000ff;">="post|get"</span><span style="color: #ff0000;"> enctype</span><span style="color: #0000ff;">="multipart/form-data"</span><span style="color: #ff0000;"> action</span><span style="color: #0000ff;">="提交到的地址"</span><span style="color: #0000ff;">></</span><span style="color: #800000;">form</span><span style="color: #0000ff;">></span>

input標簽用于搜集用戶信息

<span style="color: #008080;"> 1</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="userName"</span><span style="color: #ff0000;"> type</span><span style="color: #0000ff;">="text"</span><span style="color: #ff0000;"> maxlength</span><span style="color: #0000ff;">="5"</span><span style="color: #ff0000;"> size</span><span style="color: #0000ff;">="100"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">="asdfasdfasfd"</span> <span style="color: #0000ff;">/></span>
<span style="color: #008080;"> 2</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> 密碼，輸入的字符會被掩碼（顯示為星號或原點） </span><span style="color: #008000;">--></span>
<span style="color: #008080;"> 3</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="pwd"</span><span style="color: #ff0000;"> type</span><span style="color: #0000ff;">="password"</span><span style="color: #ff0000;"> maxlength</span><span style="color: #0000ff;">="5"</span><span style="color: #ff0000;"> size</span><span style="color: #0000ff;">="100"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">=""</span> <span style="color: #0000ff;">/></span>
<span style="color: #008080;"> 4</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> 文件類型的表單，上傳文件時，form表單一定要設置為enctype="multipart/form-data" </span><span style="color: #008000;">--></span>
<span style="color: #008080;"> 5</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="file"</span><span style="color: #ff0000;"> name</span><span style="color: #0000ff;">="file"</span> <span style="color: #0000ff;">/></span>
<span style="color: #008080;"> 6</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> 隱藏表單 </span><span style="color: #008000;">--></span>
<span style="color: #008080;"> 7</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="hidden"</span><span style="color: #ff0000;"> name</span><span style="color: #0000ff;">="country"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">="China"</span> <span style="color: #0000ff;">/></span>
<span style="color: #008080;"> 8</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> 提交 </span><span style="color: #008000;">--></span>
<span style="color: #008080;"> 9</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="submit"</span><span style="color: #ff0000;"> name</span><span style="color: #0000ff;">="Submit"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">="提交"</span><span style="color: #ff0000;"> disabled</span><span style="color: #0000ff;">="disabled"</span> <span style="color: #0000ff;">/></span>
<span style="color: #008080;">10</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> 重置 </span><span style="color: #008000;">--></span>
<span style="color: #008080;">11</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="reset"</span><span style="color: #ff0000;"> name</span><span style="color: #0000ff;">="Submit2"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">="重置"</span> <span style="color: #0000ff;">/></span>
<span style="color: #008080;">12</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> radio單選 </span><span style="color: #008000;">--></span>
<span style="color: #008080;">13</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="sex"</span><span style="color: #ff0000;"> type</span><span style="color: #0000ff;">="radio"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">="1"</span> <span style="color: #0000ff;">/></span><span style="color: #000000;">男
</span><span style="color: #008080;">14</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="sex"</span><span style="color: #ff0000;"> type</span><span style="color: #0000ff;">="radio"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">="2"</span><span style="color: #ff0000;"> checked</span><span style="color: #0000ff;">="checked"</span> <span style="color: #0000ff;">/></span><span style="color: #000000;">女
</span><span style="color: #008080;">15</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> checkbox多選 </span><span style="color: #008000;">--></span>
<span style="color: #008080;">16</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="skill"</span><span style="color: #ff0000;"> type</span><span style="color: #0000ff;">="checkbox"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">="1"</span><span style="color: #ff0000;"> checked</span><span style="color: #0000ff;">="checked"</span> <span style="color: #0000ff;">/></span><span style="color: #000000;">PHP
</span><span style="color: #008080;">17</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="skill"</span><span style="color: #ff0000;"> type</span><span style="color: #0000ff;">="checkbox"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">="2"</span> <span style="color: #0000ff;">/></span><span style="color: #000000;">前端
</span><span style="color: #008080;">18</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">input </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="skill"</span><span style="color: #ff0000;"> type</span><span style="color: #0000ff;">="checkbox"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">="2"</span> <span style="color: #0000ff;">/></span>數(shù)據(jù)庫

注：checked=”checked”可以簡寫成checked

label標簽為input元素定義標注，如果您點擊label元素文本，就會觸發(fā)此input控件。
textarea標簽，設置文本區(qū)內(nèi)的可見行數(shù)和寬度

　　禁止拉伸屬性：style="resize:none"?

<span style="color: #0000ff;"><</span><span style="color: #800000;">textarea </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="content"</span><span style="color: #ff0000;"> cols</span><span style="color: #0000ff;">="30"</span><span style="color: #ff0000;"> rows</span><span style="color: #0000ff;">="10"</span><span style="color: #0000ff;">></span>大段文本輸入框<span style="color: #0000ff;"></</span><span style="color: #800000;">textarea</span><span style="color: #0000ff;">></span>

button標簽定義一個按鈕

<span style="color: #008080;">1</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> 提交按鈕 </span><span style="color: #008000;">--></span>
<span style="color: #008080;">2</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">button </span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="submit"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">="提交"</span><span style="color: #0000ff;">></span>提交<span style="color: #0000ff;"></</span><span style="color: #800000;">button</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">3</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> 重置按鈕 </span><span style="color: #008000;">--></span>
<span style="color: #008080;">4</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">button </span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="reset"</span><span style="color: #ff0000;"> value</span><span style="color: #0000ff;">="重置"</span><span style="color: #0000ff;">></span>重置<span style="color: #0000ff;"></</span><span style="color: #800000;">button</span><span style="color: #0000ff;">></span>

select標簽和option標簽下拉列表

<span style="color: #008080;"> 1</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> 單選菜單列表框 </span><span style="color: #008000;">--></span>
<span style="color: #008080;"> 2</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">select </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="user"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 3</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">option </span><span style="color: #ff0000;">value</span><span style="color: #0000ff;">="1"</span><span style="color: #0000ff;">></span>ray<span style="color: #0000ff;"></</span><span style="color: #800000;">option</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 4</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">option </span><span style="color: #ff0000;">value</span><span style="color: #0000ff;">="2"</span><span style="color: #ff0000;"> selected</span><span style="color: #0000ff;">="selected"</span><span style="color: #0000ff;">></span>raykaeso<span style="color: #0000ff;"></</span><span style="color: #800000;">option</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 5</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">select</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 6</span> <span style="color: #008000;"><!--</span><span style="color: #008000;"> 多選列表下拉框，shift加鼠標單擊，可以連續(xù)選擇多個選擇，CTRL+鼠標點擊，可以點擊多個。</span><span style="color: #008000;">--></span>
<span style="color: #008080;"> 7</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">select </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="user"</span><span style="color: #ff0000;"> size</span><span style="color: #0000ff;">="10"</span><span style="color: #ff0000;"> multiple</span><span style="color: #0000ff;">="multiple"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 8</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">option </span><span style="color: #ff0000;">value</span><span style="color: #0000ff;">="1"</span><span style="color: #0000ff;">></span>雷雪松<span style="color: #0000ff;"></</span><span style="color: #800000;">option</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 9</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">option </span><span style="color: #ff0000;">value</span><span style="color: #0000ff;">="2"</span><span style="color: #ff0000;"> selected</span><span style="color: #0000ff;">="selected"</span><span style="color: #0000ff;">></span>ray<span style="color: #0000ff;"></</span><span style="color: #800000;">option</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">10</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">option </span><span style="color: #ff0000;">value</span><span style="color: #0000ff;">="3"</span><span style="color: #0000ff;">></span>raykaeso<span style="color: #0000ff;"></</span><span style="color: #800000;">option</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">11</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">select</span><span style="color: #0000ff;">></span>

Hinweis: selected=“selected“ kann als ?selected“ abgekürzt werden, was ?selected“ bedeutet

4. Andere HTML-Angelegenheiten

Bei HTML-Tags und -Attributen wird die Gro?-/Kleinschreibung nicht beachtet. Es wird empfohlen, HTML-Tags und -Attribute in Kleinbuchstaben zu schreiben und Attributwerte in doppelte Anführungszeichen zu setzen.
HTML-Tags beginnen alle mit einem Start-Tag und enden mit einem End-Tag. Die meisten HTML-Tags erscheinen paarweise, sogenannte Doppel-Tags, wie z. B. p-Tags und div-Tags. Einige HTML-Tags, die mit dem Start-Tag enden, werden Einzel-Tags genannt, wie z. B. hr-Tags und br-Tags. Die meisten HTML-Elemente k?nnen Attribute haben und Textinhalte werden zwischen den ?ffnenden und schlie?enden Tags geschrieben.
Versuchen Sie, HTML-Tags einzurücken und umzubrechen, und machen Sie nicht jede Codezeile zu lang, um das Lesen und die Wartung zu erleichtern.
Die Verwendung von HTML-Tags muss den Tag-Verschachtelungsregeln entsprechen. Es ist verboten, dass ein Tag ein Tag und ein p-Tag ein div-Tag verschachtelt.
Es wird empfohlen, keine veralteten oder veralteten HTML-Tags zu verwenden und weniger Tabellenlayout, Iframe-Frame-Verschachtelung und Flash Player zu verwenden.

五、表格、表單實例

<span style="color: #008080;"> 1</span> <span style="color: #0000ff;"><!</span><span style="color: #ff00ff;">DOCTYPE html</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 2</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">html</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 3</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">Kopf</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 4</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">meta </span><span style="color: #ff0000;">charset</span><span style="color: #0000ff;">="utf-8"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 5</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">meta </span><span style="color: #ff0000;">http-equiv</span><span style="color: #0000ff;">="X-UA-Compatible"</span><span style="color: #ff0000;">Inhalt</span><span style="color: #0000ff;">="IE=edge,chrome=1"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 6</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">Titel</span><span style="color: #0000ff;">></span>Beispiele<span style="color: #0000ff;"></</span><span style="color: #800000;">Titel</span><span style="color: #0000ff;"> ></span>
<span style="color: #008080;"> 7</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">meta </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="description"</span><span style="color: #ff0000;"> content</span><span style="color: #0000ff;">= ""</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 8</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">meta </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="keywords"</span><span style="color: #ff0000;"> content</span><span style="color: #0000ff;">= ""</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 9</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">link </span><span style="color: #ff0000;">href</span><span style="color: #0000ff;">=""</span><span style="color: #ff0000;"> rel</span><span style="color: #0000ff;">=" stylesheet"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">10</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">Kopf</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">11</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">K?rper</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">12</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">Formular </span><span style="color: #ff0000;">Methode</span><span style="color: #0000ff;">="POST"</span><span style="color: #ff0000;"> Aktion</span><span style="color: #0000ff;">= "1.php"</span><span style="color: #ff0000;"> enctype</span><span style="color: #0000ff;">="multipart/form-data"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">13</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">Tabelle </span><span style="color: #ff0000;">Rahmen</span><span style="color: #0000ff;">="1"</span><span style="color: #ff0000;">Rahmenfarbe</span><span style="color: #0000ff;">= ?#F4F4F4“</span><span style="color: #ff0000;">Breite</span><span style="color: #0000ff;">="560"</span><span style="color: #ff0000;">ausrichten</span><span style="color: #0000ff;">="Mitte"</span><span style="color: #ff0000;">Zellenauffüllung</span><span style="color: #0000ff;">="5"</span><span style="color: #ff0000;">Regeln</span><span style="color: #0000ff;">="alle"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">14</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">Bildunterschrift</span><span style="color: #0000ff;">></span>個人中心<span style="color: #0000ff;"></</span><span style="color: #800000;">Bildunterschrift</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">15</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr </span><span style="color: #ff0000;">bgcolor</span><span style="color: #0000ff;">="#F9F9F9"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">16</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td </span><span style="color: #ff0000;">colspan</span><span style="color: #0000ff;">="3"</span><span style="color: #0000ff;">><</span><span style="color: #800000;">b</span><span style="color: #0000ff;">></span>1. Anmeldename und Passwort des Mitglieds<span style="color: #0000ff;"></</span><span style="color: #800000;">b</span><span style="color: #0000ff;"> ></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">17</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">18</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">19</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td </span><span style="color: #ff0000;">align</span><span style="color: #0000ff;">="right"</span><span style="color: #0000ff;">></span>Benutzername: <span style="color: #0000ff;"></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">20</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td</span><span style="color: #0000ff;">><</span><span style="color: #800000;">Eingabe </span><span style="color: #ff0000;">Typ</span><span style="color: #0000ff;">= ?Text“</span><span style="color: #ff0000;">Name</span><span style="color: #0000ff;">="Benutzername"</span><span style="color: #ff0000;">maxlength</span><span style="color: #0000ff;">="15"</span><span style="color: #ff0000;">deaktiviert</span><span style="color: #0000ff;"> ="deaktiviert"</span><span style="color: #ff0000;">Wert</span><span style="color: #0000ff;">="Admin"</span><span style="color: #0000ff;">></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">21</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td</span><span style="color: #0000ff;">><</span><span style="color: #800000;">Eingabe </span><span style="color: #ff0000;">Typ</span><span style="color: #0000ff;">= ?submit“</span><span style="color: #ff0000;">Wert</span><span style="color: #0000ff;">="Benutzernamen erkennen"</span><span style="color: #0000ff;">><</span><span style="color: #800000;">Schriftart </span><span style="color: #ff0000;">Farbe</span><span style="color: #0000ff;">="#0E9EFF"</span><span style="color: #ff0000;">Gr??e</span><span style="color: #0000ff;">="1"</span><span style="color: #0000ff;">></span> 5-15 Personen<span style="color: #0000ff;"></</span><span style="color: #800000;"> Schriftart</span><span style="color: #0000ff;">></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">22</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">23</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">24</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td </span><span style="color: #ff0000;">align</span><span style="color: #0000ff;">="right"</span><span style="color: #0000ff;">></span>Passwort: <span style="color: #0000ff;"></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">25</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td</span><span style="color: #0000ff;">><</span><span style="color: #800000;">Eingabe </span><span style="color: #ff0000;">Typ</span><span style="color: #0000ff;">= ?Passwort“</span><span style="color: #ff0000;">Name</span><span style="color: #0000ff;">="Passwort"</span><span style="color: #ff0000;">maxlength</span><span style="color: #0000ff;">="15"</span><span style="color: #0000ff;">></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">26</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td</span><span style="color: #0000ff;">><</span><span style="color: #800000;">Schriftart </span><span style="color: #ff0000;">Farbe</span><span style="color: #0000ff;">= ?#0E9EFF“</span><span style="color: #ff0000;">Gr??e</span><span style="color: #0000ff;">="1"</span><span style="color: #0000ff;">></span>Passwort 5-15 Zeichen<span style="color: #0000ff;"></</span><span style="color: #800000;">Schriftart </span><span style="color: #0000ff;">></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">27</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">28</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">29</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td </span><span style="color: #ff0000;">align</span><span style="color: #0000ff;">="right"</span><span style="color: #0000ff;">></span>Passwort best?tigen: <span style="color: #0000ff;"></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">30</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td</span><span style="color: #0000ff;">><</span><span style="color: #800000;">Eingabe </span><span style="color: #ff0000;">Typ</span><span style="color: #0000ff;">= ?password“</span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="repassword"</span><span style="color: #ff0000;"> maxlength</span><span style="color: #0000ff;">="15"</span><span style="color: #0000ff;">></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">31</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td</span><span style="color: #0000ff;">><</span><span style="color: #800000;">Schriftart </span><span style="color: #ff0000;">Farbe</span><span style="color: #0000ff;">= ?#0E9EFF“</span><span style="color: #ff0000;">Gr??e</span><span style="color: #0000ff;">="1"</span><span style="color: #0000ff;">></span> muss mit dem Passwort übereinstimmen<span style="color: #0000ff;"></</span><span style="color: #800000;"> Schriftart</span><span style="color: #0000ff;">></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">32</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">33</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr </span><span style="color: #ff0000;">bgcolor</span><span style="color: #0000ff;">="#F9F9F9"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">34</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td </span><span style="color: #ff0000;">colspan</span><span style="color: #0000ff;">="3"</span><span style="color: #0000ff;">><</span><span style="color: #800000;">b</span><span style="color: #0000ff;">></span>2. Grundlegende Informationen<span style="color: #0000ff;"></</span><span style="color: #800000;">b</span><span style="color: #0000ff;">></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">35</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">36</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">37</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td </span><span style="color: #ff0000;">align</span><span style="color: #0000ff;">="right"</span><span style="color: #0000ff;">></span>Geschlecht:<span style="color: #0000ff;"></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">38</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td</span><span style="color: #0000ff;">><</span><span style="color: #800000;">Eingabe </span><span style="color: #ff0000;">Typ</span><span style="color: #0000ff;">= ?Radio“</span><span style="color: #ff0000;">Name</span><span style="color: #0000ff;">="Geschlecht"</span><span style="color: #ff0000;">Wert</span><span style="color: #0000ff;">="Mann"</span><span style="color: #ff0000;">geprüft</span><span style="color: #0000ff;"> ="geprüft"</span><span style="color: #0000ff;">></span>M?nnlich<span style="color: #0000ff;"><</span><span style="color: #800000;">Eingabe </span><span style="color: #ff0000;">Typ</span><span style="color: #0000ff;">="Radio"</span><span style="color: #ff0000;"> Name</span><span style="color: #0000ff;">="Geschlecht"</span><span style="color: #ff0000;">Wert</span><span style="color: #0000ff;">="Frau"</span><span style="color: #0000ff;">></span>Weiblich<span style="color: #0000ff;"></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">39</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">40</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">41</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td </span><span style="color: #ff0000;">align</span><span style="color: #0000ff;">="right"</span><span style="color: #0000ff;">></span>Hobbys:<span style="color: #0000ff;"></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">42</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">43</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">Eingabe </span><span style="color: #ff0000;">Typ</span><span style="color: #0000ff;">="Kontrollk?stchen"</span><span style="color: #ff0000;"> Name</span><span style="color: #0000ff;">= ?like[]“</span><span style="color: #ff0000;">value</span><span style="color: #0000ff;">="game"</span><span style="color: #ff0000;">checked</span><span style="color: #0000ff;">="checked"</span> <span style="color: #0000ff;">/></span><span style="color: #000000;">Spiele
</span><span style="color: #008080;">44</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">Eingabe </span><span style="color: #ff0000;">Typ</span><span style="color: #0000ff;">="Kontrollk?stchen"</span><span style="color: #ff0000;"> Name</span><span style="color: #0000ff;">="like[]"</span><span style="color: #ff0000;">value</span><span style="color: #0000ff;">="T?ten"</span> <span style="color: #0000ff;">/></span><span style="color: #000000;">T?ten
</span><span style="color: #008080;">45</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">Eingabe </span><span style="color: #ff0000;">Typ</span><span style="color: #0000ff;">="Kontrollk?stchen"</span><span style="color: #ff0000;"> Name</span><span style="color: #0000ff;">="like[]"</span><span style="color: #ff0000;">value</span><span style="color: #0000ff;">="In Brand setzen"</span> <span style="color: #0000ff;">/></span><span style="color: #000000;">In Brand setzen
</span><span style="color: #008080;">46</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">Eingabe </span><span style="color: #ff0000;">Typ</span><span style="color: #0000ff;">="Kontrollk?stchen"</span><span style="color: #ff0000;"> Name</span><span style="color: #0000ff;">="Gef?llt mir[]"</span><span style="color: #ff0000;">Wert</span><span style="color: #0000ff;">="Ein Buch lesen"</span> <span style="color: #0000ff;">/></span>Ein Buch lesen<span style="color: #0000ff;"><</span> <span style="color: #800000;">br </span><span style="color: #0000ff;">></span>
<span style="color: #008080;">52</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">53</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">54</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">55</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">56</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td </span><span style="color: #ff0000;">align</span><span style="color: #0000ff;">="right"</span><span style="color: #0000ff;">></span>Bildung:<span style="color: #0000ff;"></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">57</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">58</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">w?hlen Sie </span><span style="color: #ff0000;">Name</span><span style="color: #0000ff;">="edu"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">59</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">Option </span><span style="color: #ff0000;">Wert</span><span style="color: #0000ff;">="Grundschule"</span><span style="color: #0000ff;">></span>Grundschule <span style="color: #0000ff;"></</span><span style="color: #800000;">Option</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">60</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">Option </span><span style="color: #ff0000;">Wert</span><span style="color: #0000ff;">="Junior High School"</span><span style="color: #0000ff;">></span>Junior Oberschule<span style="color: #0000ff;"></</span><span style="color: #800000;">Option</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">61</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">Option </span><span style="color: #ff0000;">Wert</span><span style="color: #0000ff;">="High School"</span><span style="color: #0000ff;">></span>High School <span style="color: #0000ff;"></</span><span style="color: #800000;">Option</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">62</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">Option </span><span style="color: #ff0000;">Wert</span><span style="color: #0000ff;">="Universit?t"</span><span style="color: #ff0000;"> ausgew?hlt</span><span style="color: #0000ff;">= ?ausgew?hlt“</span><span style="color: #0000ff;">></span>Universit?t<span style="color: #0000ff;"></</span><span style="color: #800000;">Option</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">63</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">Option </span><span style="color: #ff0000;">Wert</span><span style="color: #0000ff;">="Absolvent"</span><span style="color: #0000ff;">></span>Absolvent <span style="color: #0000ff;"></</span><span style="color: #800000;">Option</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">64</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">ausw?hlen</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">65</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">66</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">67</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">68</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr </span><span style="color: #ff0000;">bgcolor</span><span style="color: #0000ff;">="#F9F9F9"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">69</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td </span><span style="color: #ff0000;">colspan</span><span style="color: #0000ff;">="3"</span><span style="color: #0000ff;">><</span><span style="color: #800000;">b</span><span style="color: #0000ff;">></span>3.Stellen Sie sich vor<span style="color: #0000ff;"></</span><span style="color: #800000;">b</span><span style="color: #0000ff;">></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">70</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">71</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">72</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td </span><span style="color: #ff0000;">algi</span><span style="color: #0000ff;">="right"</span><span style="color: #0000ff;">></span>Pers?nliche Unterschrift: <span style="color: #0000ff;"></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">73</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td</span><span style="color: #0000ff;">><</span><span style="color: #800000;">textarea </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">="qianming"</span><span style="color: #ff0000;"> cols</span><span style="color: #0000ff;">="40"</span><span style="color: #ff0000;">Zeilen</span><span style="color: #0000ff;">="10"</span><span style="color: #ff0000;">Stil</span><span style="color: #0000ff;">="resize:none"</span> <span style="color: #0000ff;">>&lt ;/</span><span style="color: #800000;">textarea</span><span style="color: #0000ff;">></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">74</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">75</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">76</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">77</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td </span><span style="color: #ff0000;">align</span><span style="color: #0000ff;">="right"</span><span style="color: #0000ff;">></span>上傳頭像： <span style="color: #0000ff;"></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">78</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">79</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">Eingabe </span><span style="color: #ff0000;">Typ</span><span style="color: #0000ff;">="Datei"</span><span style="color: #ff0000;"> Name</span><span style="color: #0000ff;">= ?touxiang“</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">80</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">Eingabe </span><span style="color: #ff0000;">Typ</span><span style="color: #0000ff;">="versteckt"</span><span style="color: #ff0000;"> Name</span><span style="color: #0000ff;">= ?uid“</span><span style="color: #ff0000;">Wert</span><span style="color: #0000ff;">="90"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">81</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">82</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></</span><span style="color: #800000;">td</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">83</span> <span style="color: #0000ff;"></</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">84</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">tr</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">85</span> <span style="color: #0000ff;"><</span><span style="color: #800000;">td </span><span style="color: #ff0000;">colspan</span><span style="color: #0000ff;">="3"</span><span style="color: #ff0000;"> align</span><span style="Farbe: #0000f"></span>

Erkl?rung dieser Website

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Hei?e KI -Werkzeuge

Undress AI Tool

Ausziehbilder kostenlos

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Clothoff.io

KI-Kleiderentferner

Video Face Swap

Tauschen Sie Gesichter in jedem Video mühelos mit unserem v?llig kostenlosen KI-Gesichtstausch-Tool aus!

Hei?er Artikel

Gras Wonder Build Guide | Uma Musume hübsches Derby

1 Monate vor By Jack chen

<??>: 99 N?chte im Wald - alle Abzeichen und wie man sie freischalt

1 Monate vor By DDD

Rimworld Odyssey -Temperaturführer für Schiffe und Gravtech

3 Wochen vor By Jack chen

Mejiro Ryan Build Guide | Uma Musume hübsches Derby

4 Wochen vor By Jack chen

Rimworld odyssey wie man fischt

3 Wochen vor By Jack chen

Hei?e Werkzeuge

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Hei?e Themen

Laravel-Tutorial

1601

PHP-Tutorial

1502

276

Related knowledge

Konfigurieren von Dokumentmetadaten im HTML -Kopfelement Jul 09, 2025 am 02:30 AM

Metadaten in HTMLhead sind entscheidend für das Verhalten von SEO-, Social Sharing und Browser. 1. Setzen Sie den Seitentitel und die Beschreibung, verwenden Sie es und halten Sie es pr?zise und einzigartig. 2. Fügen Sie OpenGraph- und Twitter -Karteninformationen hinzu, um die Auswirkungen auf die soziale Freigabe zu optimieren, auf die Bildgr??e zu achten und Debugging -Tools zum Testen zu verwenden. 3. Definieren Sie die Einstellungen für den Zeichensatz und die Ansichtsfenster, um sicherzustellen, dass die Unterstützung mehrsprachiger Unterstützung an das mobile Terminal angepasst wird. 4. Optionale Tags wie das Urheberrecht des Autors, die Kontrolle der Roboter und die kanonische Verhindern doppelter Inhalte sollten auch vernünftig konfiguriert werden.

Bestes HTML -Tutorial für Anf?nger im Jahr 2025 Jul 08, 2025 am 12:25 AM

Tolearnhtmlin2025, ChooseatutororyThatbalancesHands-On-Practionwithmoderit und IntegrateCsSandjavaScriptbasics.1.PrioritizeHands-OnLearningWithStep-by-Stepprojects-?hnlich

HTML für E -Mail -Vorlagen -Tutorial Jul 10, 2025 pm 02:01 PM

Wie mache ich HTML -Mail -Vorlagen mit guter Kompatibilit?t? Zun?chst müssen Sie eine Struktur mit Tabellen erstellen, um die Verwendung von Div -Flex- oder Netzlayout zu vermeiden. Zweitens müssen alle Stile eingefügt werden und k?nnen sich nicht auf externe CSS verlassen. Dann sollte das Bild mit ALT -Beschreibung hinzugefügt werden und eine ?ffentliche URL verwenden, und die Schaltfl?chen sollten mit einer Tabelle oder TD mit Hintergrundfarbe simuliert werden. Schlie?lich müssen Sie die Details zu mehreren Clients testen und anpassen.

Wie kann ich mit Formularen in HTML ohne Server umgehen? Jul 09, 2025 am 01:14 AM

Wenn es keinen Backend-Server gibt, kann die Einreichung von HTML-Formular weiterhin über Front-End-Technologie oder Drittanbieterdienste verarbeitet werden. Zu den spezifischen Methoden geh?ren: 1. JavaScript verwenden, um die Einreichungen von Formulareingaben abzufangen, um die Eingabeüberprüfung und das Benutzerfeedback zu erhalten. Die Daten werden jedoch nicht bestehen. 2. Verwenden Sie serverlose Formulardienste von Drittanbietern wie F?rse, um Daten zu sammeln und E-Mail-Benachrichtigungs- und Umleitungsfunktionen bereitzustellen. 3.. Verwenden Sie LocalStorage, um tempor?re Clientdaten zu speichern, die zum Speichern von Benutzerpr?ferenzen oder zum Verwalten von Anwendungsstatus einseitig geeignet sind, jedoch nicht für die langfristige Speicherung vertraulicher Informationen geeignet sind.

Was sind die am h?ufigsten verwendeten globalen Attribute in HTML? Jul 10, 2025 am 10:58 AM

Klasse, ID, Stil, Daten und Titel sind die am h?ufigsten verwendeten globalen Attribute in HTML. Die Klasse wird verwendet, um einen oder mehrere Klassennamen anzugeben, um die Stileinstellung und JavaScript -Vorg?nge zu erleichtern. ID bietet eindeutige Kennungen für Elemente, die für Anker -Sprünge und JavaScript -Kontrolle geeignet sind. Durch den Stil k?nnen Inline-Stile hinzugefügt werden, geeignet für ein vorübergehendes Debuggen, aber nicht für die Verwendung von gro?em Ma?stab empfohlen. Data-Properties werden verwendet, um benutzerdefinierte Daten zu speichern, was für die Interaktion mit Front-End- und Back-End-Interaktion geeignet ist. Der Titel wird verwendet, um Mausover -Eingaben hinzuzufügen, aber sein Stil und sein Verhalten werden durch den Browser begrenzt. Eine angemessene Auswahl dieser Attribute kann die Entwicklungseffizienz und die Benutzererfahrung verbessern.

Implementierung des nativen faulen Ladens für Bilder in HTML Jul 12, 2025 am 12:48 AM

Native Lazy Loading ist eine integrierte Browserfunktion, die das faule Laden von Bildern durch Hinzufügen von Loading = "Lazy" zum Tag hinzufügen kann. 1. Es erfordert keine Bibliotheken von JavaScript oder Drittanbietern und wird direkt in HTML verwendet. 2. Es ist für Bilder geeignet, die nicht auf dem ersten Bildschirm unterhalb der Seite, die Scrolling-Add-Ons und gro?e Bildressourcen angezeigt werden. 3. Es ist nicht für Bilder mit dem ersten Bildschirm oder Display geeignet: keine; 4. Bei der Verwendung sollte ein geeigneter Platzhalter festgelegt werden, um Layout -Jitter zu vermeiden. 5. Es sollte das Laden von Responsive Bild in Kombination mit SRCSet- und Gr??enattributen optimieren. 6. Kompatibilit?tsprobleme müssen berücksichtigt werden. Einige alte Browser unterstützen es nicht. Sie k?nnen durch Merkmalserkennung verwendet und mit JavaScript -L?sungen kombiniert werden.

Wie füge ich ein Video als Hintergrund in HTML hinzu? Jul 08, 2025 am 12:03 AM

Um einer Webseite einen Videohintergrund hinzuzufügen, besteht der Schlüssel darin, HTML -Tags korrekt zu verwenden und relevante Attribute zu optimieren. 1. Verwenden Sie Tags als Hintergrund und verwenden Sie die CSS -Positionierung, um die Seite oder den lokalen Bereich zu füllen. 2. Das Videoformat wird bevorzugt. 3. Fügen Sie ged?mpfte und PlaySInline -Attribute hinzu, um eine automatische Wiedergabe auf der mobilen Seite zu gew?hrleisten. 4. Steuern Sie die Videogr??e, um die Ladegeschwindigkeit zu optimieren, und es wird empfohlen, sie bei zehn MB zu halten. 5. Schleifen hinzufügen, um eine nahtlose Schleifenwiedergabe zu erreichen. 6. Es kann flexibel auf Vollbild- oder Lokalbl?cke angewendet werden, und unterschiedliche Effekte werden durch Anpassen der Beh?ltergr??e und Positionierungsmethode erzielt. Die obigen Schritte k?nnen einen stabilen und sch?nen Videohintergrund erreichen.

Wie mache ich ein reaktionsschnelles Iframe? Jul 09, 2025 am 01:39 AM

Um Iframes reagieren zu lassen, besteht der Kern darin, CSS zu verwenden, um das Seitenverh?ltnis zu steuern und ihn mit dem Verpackungsbeh?lter zu kombinieren, um eine Anpassung zu erreichen. 1. Verwenden Sie Polstertechniken, um Containerboxen mit festen Proportionen zu erstellen. H?ufige Verh?ltnisse wie 16: 9 entsprechen Padding-Top56,25%, 4: 3 entsprechen 75%und 1: 1 entsprechen 100%; 2. Stellen Sie die Iframe-Breite auf 100% ein und verwenden Sie die absolute Positionierung, um den Container zu füllen, oder verwenden Sie das Aspektverh?ltnisattribut, um den Anteil beizubehalten. 3. Steuern Sie bei der Verarbeitung von Drittanbietern eingebetteter Inhalte, steuern Sie das Verh?ltnis über Containerverpackung und stellen Sie sicher, dass das zul?ssige Attribut für das zul?ssige Bildschirm hinzugefügt wird, um die Vollbildwiedergabe in mobilen Terminals zu unterstützen. Beherrschen Sie die Einstellungen für Container und Verh?ltnisse, um die Reaktionsf?higkeit des Iframe zu erkennen

See all articles

国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

HTML-Zusammenfassung

一、HTML

二、最基本的HTML結(jié)構(gòu)

三、最常用的HTML標簽

a、布局標簽

b、文本標簽

c、a標簽定義超鏈接

d、多媒體標簽

e、序列化標簽

f、表格標簽

g、表單標簽

4. Andere HTML-Angelegenheiten

五、表格、表單實例

Hei?e KI -Werkzeuge

Undress AI Tool

Undresser.AI Undress

AI Clothes Remover

Clothoff.io

Video Face Swap

Hei?er Artikel

Hei?e Werkzeuge

Notepad++7.3.1

SublimeText3 chinesische Version

Senden Sie Studio 13.0.1

Dreamweaver CS6

SublimeText3 Mac-Version

Hei?e Themen

一、HTML

二、最基本的HTML結(jié)構(gòu)

a、布局標簽

c、a標簽定義超鏈接

e、序列化標簽

f、表格標簽

五、表格、表單實例