欧美一线二线三显区别,亚洲一级黄色中文字幕

HTML的結(jié)構(gòu)一般包括<html><head><body>，一般包括html文檔、head頭部、body身體，很多個(gè)html文檔頁(yè)面就是網(wǎng)站。

<!DOCTYPE html> ? ? <!--文檔類型 html-->
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>我是頁(yè)面標(biāo)題</title>
    </head>
    <body>
        正文
    </body>
</html>

文本

#段落
正文標(biāo)題?<h1></h1> 到 <h6></h6>
段落?<p>直接寫</p>
換行 <br>




#特殊符號(hào)
時(shí)間 ? <time>9:00</time>
時(shí)間 ? <time datetime="2016-02-14">情人節(jié)</time>
下劃線 ?<u> </u>


刪除線 <del> </del>


上標(biāo) ??<sup> </sup>
下標(biāo) ??<sub> </sub>
聯(lián)系地址?<address> </address>


水平線?<hr>
注釋 ?<!-- 這是注釋 -->


版權(quán)號(hào) ©
注冊(cè)商標(biāo) ®
& ? "；
< ? ⁢
> ? >
寬度、隨著值變化   Width 
像素絕對(duì)值、越大線越粗  Size ?


被CSS了的
空格 ? 
左對(duì)齊 ?<p align=“Left”>…</p>
居中 ? ?<p align=“Center”>…</p>
右對(duì)齊? <p align=“Right”>…</p>
加粗 ?   <b> </b>
加語(yǔ)氣   <strong> </strong>
傾斜 ?   <i> </i>
縮小 ?   <small> </small>
單句引用 <q>  </q>
多句引用 <blockquote> </blockquote>


#列表
<ul>
<li>無序列表</li>
<li>無序列表</li>
</ul>


<ol>
<li>有序列表</li>
<li>有序列表</li>
</ol>






#代碼標(biāo)簽
防止瀏覽器誤認(rèn)為是要執(zhí)行代碼
單行<code></code>
多行<pre></pre>




#跳轉(zhuǎn)標(biāo)簽
<a id="tips">提示部分</a>
<a href="#tips">跳到提示部分</a>

表格

#table標(biāo)簽、tbody標(biāo)簽  
table標(biāo)簽表示表格，tbody標(biāo)簽用它來將表格分段，可以一部分一部分的顯示 
tr表示一行
th表示行內(nèi)表頭
td表示行內(nèi)表數(shù)據(jù)


border="1" 表格邊框大小
<table>
    <tbody>
    ? <tr> <th>表格標(biāo)題</th> <th>表格標(biāo)題</th> </tr>
    ? <tr> <td>表格數(shù)據(jù)</td> <td>表格數(shù)據(jù)</td> </tr>
    </tbody>
</table>


#摘要
摘要的內(nèi)容是不會(huì)在瀏覽器中顯示出來的。它的作用是增加表格的可讀性(語(yǔ)義化)，使搜索引擎更好的讀懂表格內(nèi)容，還可以使屏幕閱讀器更好的幫助特殊用戶讀取表格內(nèi)容。
<table summary="表格簡(jiǎn)介文本">




#標(biāo)題
用以描述表格內(nèi)容，標(biāo)題的顯示位置：表格上方。
<table>
    <caption>標(biāo)題文本</caption>
    <tr>
        <td>…</td>
        <td>…</td>
        …
    </tr>


</table>




#表格邊框
<style type="text/css">
    table tr td,th{
           border:1px solid #000;
    }           


</style>

超鏈接

#<a></a>標(biāo)簽
使用a標(biāo)簽可實(shí)現(xiàn)超鏈接
<a  rel="external nofollow" target="_blank" >外部鏈接</a>
<a href="/html">本地鏈接</a>
<a href="/html"? target="_blank">新窗口打開</a>




導(dǎo)航鏈接
<nav>? 
? <a href="/html/">HTML</a>|<a href="/css/">CSS</a>|? ? ?
</nav>




圖片鏈接
相當(dāng)于將圖片標(biāo)記語(yǔ)言放在了超鏈接下面
<a href="http://www.o2fo.com"> <img src="images\xxgk.jpg" alt="loge" width="258" height="39" /></a>




<mailto>標(biāo)簽
使用mailto能讓訪問者便捷向網(wǎng)站管理者發(fā)送電子郵件
用mailto做許多其它事情。下面一一進(jìn)行講解，請(qǐng)看詳細(xì)圖示：
注意：如果mailto后面同時(shí)有多個(gè)參數(shù)的話，第一個(gè)參數(shù)必須以“?”開頭，后面的參數(shù)每一個(gè)都以“&”分隔。
<a herf="mailto:yy@imooc.com?subject=我是郵件主題。&body=我是郵件內(nèi)容。">對(duì)此影評(píng)有何感想，發(fā)送郵件給我</a>
<a href="mailto:425389019@qq.com">郵件鏈接</a>

圖片

#<img>標(biāo)簽
用來插入圖片
1、src：標(biāo)識(shí)圖像的位置；
2、alt：指定圖像的描述性文本，當(dāng)圖像不可見時(shí)（下載不成功時(shí)），可看到該屬性指定的文本；
3、title：提供在圖像可見時(shí)對(duì)圖像的描述(鼠標(biāo)滑過圖片時(shí)顯示的文本)；
4、圖像可以是GIF，PNG，JPEG格式的圖像文件。




靜態(tài)圖片 ? ?
<img src="圖片地址" alt="下載失敗時(shí)的替換文本" title = "提示文本">
<img src="images\xxgk.jpg" alt="loge" width="258" height="39" />




背景圖片    
<body background=images\bg.jpg>

音樂視頻

音樂
定義了mp3與ogg兩個(gè)格式
<audio controls loop>
? <source src="music/大王叫我來巡山.MP3" type="audio/mpeg">
? <source src="horse.ogg" type="audio/ogg">
</audio>




視頻
<video width="320" height="240" controls>
? <source src="video/鷸.mp4"? type="video/mp4">
</video>
<embed src='http://player.youku.com/player.php/sid/XMjg2NjYzNzc1Mg==/v.swf' allowFullScreen='true' quality='high' width='480' height='400' align='middle' allowScriptAccess='always' type='application/x-shockwave-flash'></embed>

表單

<form></form>標(biāo)簽
使用表單標(biāo)簽，與用戶交互，網(wǎng)站怎樣與用戶進(jìn)行交互？答案是使用HTML表單(form)表單是可以把瀏覽者輸入的數(shù)據(jù)傳送到服務(wù)器端，這樣服務(wù)器端程序就可以處理表單傳過來的數(shù)據(jù)。


method：數(shù)據(jù)傳送的方式（get/post),post/get的區(qū)別這一部分內(nèi)容屬于后端程序員考慮的問題。感興趣的小伙伴可以查看本小節(jié)的wiki，里面有詳細(xì)介紹。
action：服務(wù)器文件，瀏覽者輸入的數(shù)據(jù)被傳送到的地方,比如一個(gè)PHP頁(yè)面(save.php)。


type: 表單樣式，文本框text   密碼框password  單選框radio  復(fù)選框checkbox   多行文本框comment  
name：為文本框命名，以備后臺(tái)程序ASP 、PHP使用。
value：為文本輸入框設(shè)置默認(rèn)值。(一般起到提示作用)
placeholder：框內(nèi)的提示符


文本框：
<input type="text/password" name="名稱" value="文本" />


    <form  action="save.php" method="post"  >
        賬戶: 
        <input type="text" name="myName"  value="zhangzexiang"  placeholder='請(qǐng)輸入賬號(hào)'>
        密碼: 
        <input type="password" name="pass">

        
         <input type="submit" value="提交"  name="submit" />
         <input type="reset" value="重置" name="reset" />

        
    </form> 








多行文本框：
<textarea  rows="行數(shù)" cols="列數(shù)">文本</textarea>


    <form  action="save.php" method="post" >
        <label>聯(lián)系我們</label>
        <textarea cols="50" rows="10" >在這里輸入內(nèi)容...</textarea>
    </form>




單選框：
<input type="radio" name="sex" value="male">Male<br>
<input type="radio" name="sex" value="female">Female<br>




復(fù)選框：
1、type:當(dāng)?type="radio"?時(shí)，控件為單選框,當(dāng)?type="checkbox"?時(shí)控件為復(fù)選框
2、value：提交數(shù)據(jù)到服務(wù)器的值（后臺(tái)程序PHP使用）
3、name：為控件命名，以備后臺(tái)程序 ASP、PHP 使用
4、checked：當(dāng)設(shè)置 checked="checked" 時(shí)，該選項(xiàng)被默認(rèn)選中
<input   type="radio/checkbox"   value="值"    name="名稱"   checked="checked"/>


        <form action="save.php" method="post" >
             <label>性別:</label>
             <label>男</label>
             <input type="radio" value="1"  name="gender" />
             <label>女</label>
            <input type="radio" value="2"  name="gender" />
        </form>






下拉框
selected="selected"：
設(shè)置selected="selected"屬性，則該選項(xiàng)就被默認(rèn)選中。
    <form action="save.php" method="post" >
        <label>愛好:</label>
        <select>
          <option value="看書">看書</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>
    </form>


multiple="multiple"讓下拉框多選
    <form action="save.php" method="post" >
        <label>愛好:</label>
        <select multiple="multiple">
          <option value="看書">看書</option>
          <option value="旅游">旅游</option>
          <option value="運(yùn)動(dòng)">運(yùn)動(dòng)</option>
          <option value="購(gòu)物">購(gòu)物</option>
        </select>
    </form>




<form>
<select>
<option>房子</option>
<option>車子</option>
<option selected>永久生命</option>????? <!-- selected>Fiat 是預(yù)選按鈕? -->
<option value="錢">金錢</option>
<input type="reset" value="重置">
</select>
</form>






form表單中的label標(biāo)簽
小伙伴們，你們?cè)谇懊鎸W(xué)習(xí)表單各種控件的時(shí)候，有沒有發(fā)現(xiàn)一個(gè)標(biāo)簽--label，這一小節(jié)就來揭曉它的作用。
label標(biāo)簽不會(huì)向用戶呈現(xiàn)任何特殊效果，它的作用是為鼠標(biāo)用戶改進(jìn)了可用性。如果你在 label 標(biāo)簽內(nèi)點(diǎn)擊文本，就會(huì)觸發(fā)此控件。就是說，當(dāng)用戶單擊選中該label標(biāo)簽時(shí)，瀏覽器就會(huì)自動(dòng)將焦點(diǎn)轉(zhuǎn)到和標(biāo)簽相關(guān)的表單控件上（就自動(dòng)選中和該label標(biāo)簽相關(guān)連的表單控件上）。
語(yǔ)法：
<label for="控件id名稱">
注意：標(biāo)簽的?for 屬性中的值應(yīng)當(dāng)與相關(guān)控件的?id 屬性值一定要相同。

 
<form action="save.php" method="post">
  <label>你對(duì)什么運(yùn)動(dòng)感興趣:</label><br />
  <label for="mal">慢跑</label>
  <input type="checkbox" name="慢跑" id="mal"/><br />
  <label for="mal">登山</label>
  <input type="checkbox" name="登山" id="mal"/><br />
  <label for="mal">籃球</label>
  <input type="checkbox" name="籃球" id="mal"/><br />
</form>

HTML結(jié)構(gòu)