一、html思想

（一）經(jīng)過(guò)幾天的學(xué)習(xí)認(rèn)為HTML重要的還是學(xué)會(huì)分析框架模塊，可以用一些專用標(biāo)簽例如<nav>、<dl>、<section>等有意義的標(biāo)簽對(duì)整體結(jié)構(gòu)進(jìn)行劃分。不要一昧的使用<div>、<span>標(biāo)簽來(lái)寫(xiě)所有模塊。
（二） 在寫(xiě)一些模塊化的東西時(shí)要考慮好怎么樣分開(kāi)會(huì)易于書(shū)寫(xiě)css代碼。

二、html的一些簡(jiǎn)介與標(biāo)簽詳解

body:在網(wǎng)頁(yè)上要展示出來(lái)的頁(yè)面內(nèi)容一定要放在body標(biāo)簽中
p:如果想在網(wǎng)頁(yè)上顯示文章，這時(shí)就需要p標(biāo)簽了，把文章的段落放到p標(biāo)簽中。標(biāo)簽的默認(rèn)樣式，段前段后都會(huì)有空白，如果不喜歡這個(gè)空白，可以用css樣式來(lái)刪除或改變它。

hx:標(biāo)題標(biāo)簽一共有6個(gè)，h1、h2、h3、h4、h5、h6分別為一級(jí)標(biāo)題、二級(jí)標(biāo)題、三級(jí)標(biāo)題、四級(jí)標(biāo)題、五級(jí)標(biāo)題、六級(jí)標(biāo)題。并且依據(jù)重要性遞減。h1是最高的等級(jí)。

strong em:標(biāo)簽是為了強(qiáng)調(diào)一段話中的關(guān)鍵字時(shí)使用，它們的語(yǔ)義是強(qiáng)調(diào)。但兩者在強(qiáng)調(diào)的語(yǔ)氣上有區(qū)別:em 表示強(qiáng)調(diào)，strong 表示更強(qiáng)烈的強(qiáng)調(diào)。并且在瀏覽器中em 默認(rèn)用斜體表示，strong 用粗體表示。兩個(gè)標(biāo)簽相比，目前國(guó)內(nèi)前端程序員更喜歡使用strong表示強(qiáng)調(diào)。

span:標(biāo)簽是沒(méi)有語(yǔ)義的，它的作用就是為了設(shè)置單獨(dú)的樣式用的。

q:標(biāo)簽是對(duì)簡(jiǎn)短文本的引用，比如說(shuō)引用一句話就用到q標(biāo)簽。用q標(biāo)簽的真正關(guān)鍵點(diǎn)不是它的默認(rèn)樣式雙引號(hào)（如果這樣我們不如自己在鍵盤(pán)上輸入雙引號(hào)就行了），而是它的語(yǔ)義：引用別人的話。

blockquote:blockquote的作用也是引用別人的文本。但它是對(duì)長(zhǎng)文本的引用，如在文章中引入大段某知名作家的文字，這時(shí)需要這個(gè)標(biāo)簽。瀏覽器對(duì)
標(biāo)簽的解析是縮進(jìn)樣式。

br:在需要加回車換行的地方加入br /，br /標(biāo)簽作用相當(dāng)于word文檔中的回車。在 html 代碼中輸入回車、空格都是沒(méi)有作用的。在html文本中想輸入回車換行，就必須輸入br /。沒(méi)有HTML內(nèi)容的標(biāo)簽就是空標(biāo)簽，空標(biāo)簽只需要寫(xiě)一個(gè)開(kāi)始標(biāo)簽，這樣的標(biāo)簽有br /、hr /和img /。
:在html代碼中輸入空格、回車都是沒(méi)有作用的。要想輸入空格，必須寫(xiě)入nbsp;。

hr:在信息展示時(shí)，有時(shí)會(huì)需要加一些用于分隔的橫線，這樣會(huì)使文章看起來(lái)整齊些。

address:一般網(wǎng)頁(yè)中會(huì)有一些網(wǎng)站的聯(lián)系地址信息需要在網(wǎng)頁(yè)中展示出來(lái)，這些聯(lián)系地址信息如公司的地址就可以
標(biāo)簽。也可以定義一個(gè)地址（比如電子郵件地址）、簽名或者文檔的作者身份。

code:在介紹語(yǔ)言技術(shù)的網(wǎng)站中，避免不了在網(wǎng)頁(yè)中顯示一些計(jì)算機(jī)專業(yè)的編程代碼，當(dāng)代碼為一行代碼時(shí)，你就可以使用code標(biāo)簽了.如果是多行代碼，可以使用pre標(biāo)簽。

pre:預(yù)格式化的文本。被包圍在 pre 元素中的文本通常會(huì)保留空格和換行符。pre 標(biāo)簽不只是為顯示計(jì)算機(jī)的源代碼時(shí)用的，在你需要在網(wǎng)頁(yè)中預(yù)顯示格式時(shí)都可以使用它，只是pre標(biāo)簽的一個(gè)常見(jiàn)應(yīng)用就是用來(lái)展示計(jì)算機(jī)的源代碼。

ul:ul-li是沒(méi)有前后順序的信息列表。每項(xiàng)li前都自帶一個(gè)圓點(diǎn)

ol:在網(wǎng)頁(yè)中展示有前后順序的信息列表,這類信息展示就可以使用ol標(biāo)簽來(lái)制作有序列表來(lái)展示。每項(xiàng)li前都自帶一個(gè)序號(hào)，序號(hào)默認(rèn)從1開(kāi)始.

div:在網(wǎng)頁(yè)制作過(guò)程過(guò)中，可以把一些獨(dú)立的邏輯部分劃分出來(lái)，放在一個(gè)div標(biāo)簽中，這個(gè)div標(biāo)簽的作用就相當(dāng)于一個(gè)容器。什么是邏輯部分？它是頁(yè)面上相互關(guān)聯(lián)的一組元素。如網(wǎng)頁(yè)中的獨(dú)立的欄目版塊，就是一個(gè)典型的邏輯部分。用id屬性來(lái)為div提供唯一的名稱，必須唯一.

表格

table:table…/table：整個(gè)表格以table標(biāo)記開(kāi)始、/table標(biāo)記結(jié)束。
tbody:tbody…/tbody：當(dāng)表格內(nèi)容非常多時(shí)，表格會(huì)下載一點(diǎn)顯示一點(diǎn)，但如果加上tbody標(biāo)簽后，這個(gè)表格就要等表格內(nèi)容全部下載完才會(huì)顯示。
tr:tr…/tr：表格的一行，所以有幾對(duì)tr表格就有幾行。表格中列的個(gè)數(shù)，取決于一行中數(shù)據(jù)單元格的個(gè)數(shù)。
td:td…/td：表格的一個(gè)單元格，一行中包含幾對(duì)td…/td，說(shuō)明一行中就有幾列。
th:th…/th：表格的頭部的一個(gè)單元格，表格表頭。表頭，也就是th標(biāo)簽中的文本默認(rèn)為粗體并且居中顯示
caption:添加標(biāo)題和摘要,標(biāo)題用以描述表格內(nèi)容，標(biāo)題的顯示位置：表格上方。摘要的內(nèi)容是不會(huì)在瀏覽器中顯示出來(lái)的。它的作用是增加表格的可讀性(語(yǔ)義化)，使搜索引擎更好的讀懂表格內(nèi)容
a:實(shí)現(xiàn)超鏈接 a href=”目標(biāo)網(wǎng)址” title=”鼠標(biāo)滑過(guò)顯示的文本” 鏈接顯示的文本 /a .title屬性的作用，鼠標(biāo)滑過(guò)鏈接文字時(shí)會(huì)顯示這個(gè)屬性的文本內(nèi)容。主要方便搜索引擎了解鏈接地址的內(nèi)容（語(yǔ)義化更友好） a href=”目標(biāo)網(wǎng)址” target=”_blank” click here! /a在新的網(wǎng)頁(yè)中打開(kāi)
mailto:使用mailto能讓訪問(wèn)者便捷向網(wǎng)站管理者發(fā)送電子郵件,如果mailto后面同時(shí)有多個(gè)參數(shù)的話，第一個(gè)參數(shù)必須以“?”開(kāi)頭，后面的參數(shù)每一個(gè)都以“&”分隔。
img:插入圖片,img src=”圖片地址” alt=”下載失敗時(shí)的替換文本” title = “提示文本” src：標(biāo)識(shí)圖像的位置；alt：指定圖像的描述性文本，當(dāng)圖像不可見(jiàn)時(shí)（下載不成功時(shí)），可看到該屬性指定的文本；title：提供在圖像可見(jiàn)時(shí)對(duì)圖像的描述(鼠標(biāo)滑過(guò)圖片時(shí)顯示的文本)；圖像可以是GIF，PNG，JPEG格式的圖像文件。

表單

form:可以把瀏覽者輸入的數(shù)據(jù)傳送到服務(wù)器端，這樣服務(wù)器端程序就可以處理表單傳過(guò)來(lái)的數(shù)據(jù)。form method=”傳送方式” action=”服務(wù)器文件” . form標(biāo)簽是成對(duì)出現(xiàn)的，以form開(kāi)始，以/form結(jié)束。action ：瀏覽者輸入的數(shù)據(jù)被傳送到的地方,比如一個(gè)PHP頁(yè)面(save.php)。method ： 數(shù)據(jù)傳送的方式（get/post）。所有表單控件（文本框、文本域、按鈕、單選框、復(fù)選框等）都必須放在標(biāo)簽之間
<form method="傳送方式" action="服務(wù)器文件">
input:當(dāng)用戶要在表單中鍵入字母、數(shù)字等內(nèi)容時(shí)，就會(huì)用到文本輸入框。文本框也可以轉(zhuǎn)化為密碼輸入框。input type=”text/password” name=”名稱” value=”文本” / 當(dāng)type=”text”時(shí)，輸入框?yàn)槲谋据斎肟?當(dāng)type=”password”時(shí), 輸入框?yàn)槊艽a輸入框。name：為文本框命名，以備后臺(tái)程序ASP 、PHP使用。value：為文本輸入框設(shè)置默認(rèn)值。(一般起到提示作用)
<form>
<input type="text/password" name="名稱" value="文本" />
</form>
textarea:當(dāng)用戶需要在表單中輸入大段文字時(shí)，需要用到文本輸入域。textarea rows=”行數(shù)” cols=”列數(shù)” 文本 /textarea rows ：多行輸入域的行數(shù)。cols ：多行輸入域的列數(shù)。在textarea /textarea 標(biāo)簽之間可以輸入默認(rèn)值。
<textarea rows="行數(shù)" cols="列數(shù)">文本</textarea>
radio/checkbox:使用單選框、復(fù)選框，讓用戶選擇,input type=”radio/checkbox” value=”值” name=”名稱” checked=”checked”/> 當(dāng) type=”radio” 時(shí)，控件為單選框,當(dāng) type=”checkbox” 時(shí)，控件為復(fù)選框,value：提交數(shù)據(jù)到服務(wù)器的值（后臺(tái)程序PHP使用）,name：為控件命名，以備后臺(tái)程序 ASP、PHP 使用,checked：當(dāng)設(shè)置 checked=”checked” 時(shí)，該選項(xiàng)被默認(rèn)選中,同一組的單選按鈕，name 取值一定要一致，這樣同一組的單選按鈕才可以起到單選的作用。
<input type="radio/checkbox" value="值" name="名稱" checked="checked"/>
option:下拉列表框,設(shè)置selected=”selected”屬性，則該選項(xiàng)就被默認(rèn)選中。
<select>
<option value="看書(shū)">看書(shū)</option>
<option value="旅游" selected="selected">旅游</option>
<option value="運(yùn)動(dòng)">運(yùn)動(dòng)</option>
<option value="購(gòu)物">購(gòu)物</option>
</select>
multiple:下拉列表也可以進(jìn)行多選操作，在標(biāo)簽中設(shè)置multiple=”multiple”屬性，就可以實(shí)現(xiàn)多選功能,在 widows 操作系統(tǒng)下，進(jìn)行多選時(shí)按下Ctrl鍵同時(shí)進(jìn)行單擊
<select multiple="multiple">
submit:使用提交按鈕，提交數(shù)據(jù),input type=”submit” value=”提交”> type：只有當(dāng)type值設(shè)置為submit時(shí)，按鈕才有提交作用,value：按鈕上顯示的文字
<input type="submit" value="提交">
reset:重置按鈕，重置表單信息,input type=”reset” value=”重置”>type：只有當(dāng)type值設(shè)置為reset時(shí)，按鈕才有重置作用,value：按鈕上顯示的文字
<input type="reset" value="重置">
label:為鼠標(biāo)用戶改進(jìn)了可用性。當(dāng)用戶單擊選中該label標(biāo)簽時(shí)，瀏覽器就會(huì)自動(dòng)將焦點(diǎn)轉(zhuǎn)到和標(biāo)簽相關(guān)的表單控件上（就自動(dòng)選中和該label標(biāo)簽相關(guān)連的表單控件上）。label for=”控件id名稱”>標(biāo)簽的 for 屬性中的值應(yīng)當(dāng)與相關(guān)控件的 id 屬性值一定要相同。
<label for="控件id名稱">