五月天中文字幕人妻,9991区二区三区,国产精品流白浆在线

1.頭部標(biāo)簽

<head>
<meta charset="utf-8"> 
<title>菜鳥教程(runoob.com)</title> 
<meta name="description" content="免費(fèi)在線教程">
<meta name="keywords" content="HTML,CSS,XML,JavaScript">
<meta name="author" content="runoob">
<meta charset="UTF-8">
<base  target="_blank">
</head>

HTML <head> 元素
<head> 元素包含了所有的頭部標(biāo)簽元素。在 <head>元素中你可以插入腳本（scripts）, 樣式文件（CSS），及各種meta信息。
可以添加在頭部區(qū)域的元素標(biāo)簽為: <title>, <style>, <meta>, <link>, <script>, <noscript>, and <base>.

HTML <link> 元素
<link> 標(biāo)簽定義了文檔與外部資源之間的關(guān)系。
<link> 標(biāo)簽通常用于鏈接到樣式表:
必須寫rel的屬性，不寫它的話，是不可用的

<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>

HTML <style> 元素
<style> 標(biāo)簽定義了HTML文檔的樣式文件引用地址.
在<style> 元素中你也可以直接添加樣式來渲染 HTML 文檔:

<head>
<style type="text/css">
body {background-color:yellow}
p {color:blue}
</style>
</head>

每30秒鐘刷新當(dāng)前頁面:

<meta http-equiv="refresh" content="30">

2.HTML 圖像- Alt屬性
alt 屬性用來為圖像定義一串預(yù)備的可替換的文本。
替換文本屬性的值是用戶定義的。

<img src="boat.gif" alt="Big Boat">

在瀏覽器無法載入圖像時(shí)，替換文本屬性告訴讀者她們失去的信息。此時(shí)，瀏覽器將顯示這個(gè)替代性的文本而不是圖像。為頁面上的圖像都加上替換文本屬性是個(gè)好習(xí)慣，這樣有助于更好的顯示信息，并且對于那些使用純文本瀏覽器的人來說是非常有用的。

提示: 指定圖像的高度和寬度的一個(gè)很好的習(xí)慣。如果圖像指定了高度寬度，頁面加載時(shí)就會保留指定的尺寸。如果沒有指定圖片的大小，加載頁面時(shí)有可能會破壞HTML頁面的整體布局。

3.圖像區(qū)域：

<img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap">//名稱

<map name="planetmap">//關(guān)聯(lián)上map了
  <area shape="rect" coords="0,0,82,126" alt="Sun" href="sun.htm">
  <area shape="circle" coords="90,58,3" alt="Mercury" href="mercur.htm">
  <area shape="circle" coords="124,58,8" alt="Venus" href="venus.htm">
</map>

該段代碼中的shape指的是點(diǎn)擊區(qū)域的形狀，coords指的應(yīng)該是鏈接區(qū)域在圖片中的坐標(biāo)（像素為單位）

4.表格
每個(gè)表格從一個(gè) table 標(biāo)簽開始。每個(gè)表格行從 tr 標(biāo)簽開始。每個(gè)表格的數(shù)據(jù)從 td 標(biāo)簽開始。

<h4>一行三列:</h4>
<table border="1">
<tr>
  <td>100</td>
  <td>200</td>
  <td>300</td>
</tr>
</table>

<h4>兩行三列:</h4>
<table border="1">
<tr>
  <td>100</td>
  <td>200</td>
  <td>300</td>
</tr>
<tr>
  <td>400</td>
  <td>500</td>
  <td>600</td>
</tr>
</table>

<h4>兩行三列:</h4>
<table border="1">
<tr>
  <td>100</td>
  <td>200</td>
  <td>300</td>
</tr>
<tr>
  <td>400</td>
  <td>500</td>
  <td>600</td>
</tr>
</table>

<table border="1">
  <caption>Monthly savings</caption>    //這個(gè)是標(biāo)題
    <tr>
        <th>Header 1</th>//這個(gè)是表頭
        <th>Header 2</th>
    </tr>
    <tr>
        <td>row 1, cell 1</td>
        <td>row 1, cell 2</td>
    </tr>
    <tr>
        <td>row 2, cell 1</td>
        <td>row 2, cell 2</td>
    </tr>
</table>

<h4>垂直標(biāo)題:</h4>//垂直表頭
<table border="1">
<tr>
  <th>First Name:</th>
  <td>Bill Gates</td>
</tr>
<tr>
  <th>Telephone:</th>
  <td>555 77 854</td>
</tr>
<tr>
  <th>Telephone:</th>
  <td>555 77 855</td>
</tr>
</table>

<h4>單元格跨兩格:</h4>
<table border="1" cellpadding="10" cellspacing="10">//cellpadding單元格邊距,cellspacing單元格間距。邊距是指文字和邊界的距離，間距十只兩個(gè)表格的距離
<tr>
  <th>Name</th>
  <th colspan="2">Telephone</th>//設(shè)置了此，瀏覽器必然如此做
</tr>
<tr>
  <td>Bill Gates</td>
  <td>555 77 854</td>
  <td>555 77 855</td>
</tr>
</table>

<h4>單元格跨兩列:</h4>
<table border="1">
<tr>
  <th>First Name:</th>
  <td>Bill Gates</td>
</tr>
<tr>
  <th rowspan="3">Telephone:</th>
  <td>555 77 854</td>
</tr>
<tr>
  <td>555 77 855</td>
</tr>
<tr>
  <td>555 77 855</td>
</tr>
</table>

HTML中的table可以大致分為三個(gè)部分：
thead ---------表格的頁眉
tbody ---------表格的主體
tfoot ---------定義表格的頁腳
thead, tbody, tfoot 相當(dāng)于三間房子，每間房子都可以用來放東西。
<tr> </tr> 這個(gè)標(biāo)簽就是放在三間房子里面的東西，每一個(gè) <tr> </tr> 就是表格一行。
表格的每一行被分為一個(gè)個(gè)單元格。
每一個(gè)單元格就是用來存放數(shù)據(jù)的，這個(gè)數(shù)據(jù)分為兩種：一，數(shù)據(jù)的名稱；二，數(shù)據(jù)本身。
用 <th></th> 表示數(shù)據(jù)的名稱(標(biāo)題) ,
<td></td>表示真正的數(shù)據(jù)內(nèi)容。
一個(gè)實(shí)際的例子：

table-thead-tbody-tfoot.png

6.列表：

<h4>無序列表:</h4>
<ul>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>

有序表格：

<ol start="50">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ol>

<h4>一個(gè)自定義列表：</h4>
<dl>
<dt>Coffee</dt>
<dd>black hot drink</dd>//這個(gè)是描述項(xiàng)，可以沒有
<dt>Milk</dt>
<dd>white cold drink</dd>
</dl>

7.HTML <div> 元素
HTML <div> 元素是塊級元素，它可用于組合其他 HTML 元素的容器。
<div> 元素沒有特定的含義。除此之外，由于它屬于塊級元素，瀏覽器會在其前后顯示折行。
如果與 CSS 一同使用，<div> 元素可用于對大的內(nèi)容塊設(shè)置樣式屬性。
<div> 元素的另一個(gè)常見的用途是文檔布局。它取代了使用表格定義布局的老式方法。使用 <table> 元素進(jìn)行文檔布局不是表格的正確用法。<table> 元素的作用是顯示表格化的數(shù)據(jù)。

HTML <span> 元素
HTML <span> 元素是內(nèi)聯(lián)元素，可用作文本的容器
<span> 元素也沒有特定的含義。
當(dāng)與 CSS 一同使用時(shí)，<span> 元素可用于為部分文本設(shè)置樣式屬性。

8.HTML 表單
表單是一個(gè)包含表單元素的區(qū)域。
表單元素是允許用戶在表單中輸入內(nèi)容,比如：文本域(textarea)、下拉列表、單選框(radio-buttons)、復(fù)選框(checkboxes)等等。
多數(shù)情況下被用到的表單標(biāo)簽是輸入標(biāo)簽（<input>）
表單使用表單標(biāo)簽 <form> 來設(shè)置:

<form>
.
input 元素
.
</form>

提交按鈕(Submit Button)
<input type="submit"> 定義了提交按鈕.
當(dāng)用戶單擊確認(rèn)按鈕時(shí)，表單的內(nèi)容會被傳送到另一個(gè)文件。表單的動作屬性定義了目的文件的文件名。由動作屬性定義的這個(gè)文件通常會對接收到的輸入數(shù)據(jù)進(jìn)行相關(guān)的處理。:

<form name="input" action="html_form_action.php" method="get">
Username: <input type="text" name="user">
<input type="submit" value="Submit">
</form>

瀏覽器顯示效果如下:
Username:
假如您在上面的文本框內(nèi)鍵入幾個(gè)字母，然后點(diǎn)擊確認(rèn)按鈕，那么輸入數(shù)據(jù)會傳送到 "html_form_action.php" 的頁面。該頁面將顯示出輸入的結(jié)果。
使用圖片提交，也是使用input標(biāo)簽，只是type換成imge而已

9.簡單的下拉列表

<form action="">
<select name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>
</form>

10.帶邊框的表格
<fieldset>定義了一組相關(guān)的表單元素，并使用外框包含起來
可以為邊框內(nèi)的內(nèi)容寫標(biāo)題，如C#的groupbox一樣的

<form action="">
<fieldset>
<legend>Personal information:</legend>
Name: <input type="text" size="30"><br>
E-mail: <input type="text" size="30"><br>
Date of birth: <input type="text" size="10">
</fieldset>
</form>

11.發(fā)送電子郵件，也可以使用form的

<h3>發(fā)送郵件到 someone@example.com:</h3>

<form action="MAILTO:someone@example.com" method="post" enctype="text/plain">
Name:<br>
<input type="text" name="name" value="your name"><br>
E-mail:<br>
<input type="text" name="mail" value="your email"><br>
Comment:<br>
<input type="text" name="comment" value="your comment" size="50"><br><br>
<input type="submit" value="發(fā)送">
<input type="reset" value="重置">
</form>

12.一個(gè)輸入框，并可以提示
這個(gè)有點(diǎn)用的，一個(gè)文字輸入框，并可以提示用戶，不同于選擇框

<form action="demo-form.php" method="get">
<input list="browsers" name="browser">
<datalist id="browsers">
  <option value="Internet Explorer">
  <option value="Firefox">
  <option value="Chrome">
  <option value="Opera">
  <option value="Safari">
</datalist>
<input type="submit">

</form>

13.框架，就是在一個(gè)頁面，可以顯示另外的頁面而已，將多個(gè)頁面整合一下而已：
注意，邊框使用frameborder而不是border了

<iframe src="./test2.html" frameborder="0" name="iframe_a"></iframe>//開始顯示test2.html文件，不過只在這一小片區(qū)域
<p><a  .target="iframe_a">baidu.com</a></p>//點(diǎn)擊后，還會在上面框中顯示baidu頁面，因?yàn)閠arget的名稱與iframe一致

<p><b>注意：</b> 因?yàn)?a 標(biāo)簽的 target 屬性是名為 iframe_a 的 iframe 框架，所以在點(diǎn)擊鏈接時(shí)頁面會顯示在 iframe框架中。</p>

14.相對于使用rgb(255,255,0)，使用rgba(255,255,0,0.5)可以實(shí)現(xiàn)設(shè)置顏色透明度的功能，這里的0.5表示透明度，范圍0~1。

<p style="background-color:rgb(255,255,0)">
通過 rbg 值設(shè)置背景顏色
</p>
<p style="background-color:rgba(255,255,0,0.25)">
通過 rbg 值設(shè)置背景顏色
</p>
<p style="background-color:rgba(255,255,0,0.5)">
通過 rbg 值設(shè)置背景顏色
</p>
<p style="background-color:rgba(255,255,0,0.75)">
通過 rbg 值設(shè)置背景顏色
</p>

15.HTML<noscript> 標(biāo)簽
<noscript> 標(biāo)簽提供無法使用腳本時(shí)的替代內(nèi)容，比方在瀏覽器禁用腳本時(shí)，或?yàn)g覽器不支持客戶端腳本時(shí)。
<noscript>元素可包含普通 HTML 頁面的 body 元素中能夠找到的所有元素。
只有在瀏覽器不支持腳本或者禁用腳本時(shí)，才會顯示 <noscript> 元素中的內(nèi)容：

<script>
document.write("Hello World!")
</script>
<noscript>抱歉，你的瀏覽器不支持 JavaScript!</noscript>

色偷偷精品伊人,欧洲久久精品,欧美综合婷婷骚逼,国产AV主播,国产最新探花在线,九色在线视频一区,伊人大交九欧美,1769亚洲,黄色成人av

HTML 教程（2）

HTML 教程（2）

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容

色偷偷精品伊人,欧洲久久精品,欧美综合婷婷骚逼,国产AV主播,国产最新探花在线,九色在线视频一区,伊人大交九 欧美,1769亚洲,黄色成人av

HTML 教程（2）

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容

色偷偷精品伊人,欧洲久久精品,欧美综合婷婷骚逼,国产AV主播,国产最新探花在线,九色在线视频一区,伊人大交九欧美,1769亚洲,黄色成人av