1. 程式人生 > >HTML速查列表

HTML速查列表

reset 刪除 comment images ref 信息 計算機 描述 input

HTML 速查列表


HTML 基本文檔


<!DOCTYPE html>

<html>

<head>

<title>文檔標題</title>

</head>

<body> 可見文本... </body>

</html>


基本標簽(Basic Tags)


<h1>最大的標題</h1>

<h2> . . . </h2>

<h3> . . . </h3>

<h4> . . . </h4>

<h5> . . . </h5>

<h6>最小的標題</h6>

<p>這是一個段落。</p>

<br> (換行)

<hr> (水平線)

<!-- 這是註釋 -->


文本格式化(Formatting)


<b>粗體文本</b>

<code>計算機代碼</code>

<em>強調文本</em>

<i>斜體文本</i>

<kbd>鍵盤輸入</kbd>

<pre>預格式化文本</pre>

<small>更小的文本</small>

<strong>重要的文本</strong>

<abbr> (縮寫)

<address> (聯系信息)

<bdo> (文字方向)

<blockquote> (從另一個源引用的部分)

<cite> (工作的名稱)

<del> (刪除的文本)

<ins> (插入的文本)

<sub> (下標文本)

<sup> (上標文本)


鏈接(Links)


普通的鏈接:<a href="鏈接地址">鏈接文本</a>

圖像鏈接: <a href="http://www.example.com/"><img src="URL" alt="替換文本"></a>

郵件鏈接: <a href="mailto:[email protected]">發送e-mail</a>

書簽: <a id="tips">

提示部分</a> <a href="#tips">跳到提示部分</a>

圖片(Images)


<img src="URL" alt="替換文本" height="42" width="42">


樣式/區塊(Styles/Sections)


<style type="text/css">

h1 {color:red;}

p {color:blue;}

</style>

<div>文檔中的塊級元素</div>

<span>文檔中的內聯元素</span>


無序列表


<ul>

<li>項目</li>

<li>項目</li>

</ul>


有序列表


<ol>

<li>第一項</li>

<li>第二項</li>

</ol>


定義列表


<dl>

<dt>項目 1</dt>

<dd>描述項目 1</dd>

<dt>項目 2</dt>

<dd>描述項目 2</dd>

</dl>


表格(Tables)


<table border="1">

<tr>

<th>表格標題</th>

<th>表格標題</th>

</tr>

<tr>

<td>表格數據</td>

<td>表格數據</td>

</tr>

</table>


框架(Iframe)


<iframe src="demo_iframe.htm"></iframe>


表單(Forms)


<form action="demo_form.php" method="post/get">


<input type="text" name="email" size="40" maxlength="50">

<input type="password">

<input type="checkbox" checked="checked">

<input type="radio" checked="checked">

<input type="submit" value="Send">

<input type="reset">

<input type="hidden">


<select>

<option>蘋果</option>

<option selected="selected">香蕉</option>

<option>櫻桃</option>

</select>


<textarea name="comment" rows="60" cols="20">

</textarea>

</form>


實體(Entities)


&lt; 等同於 <

&gt; 等同於 >

&copy; 等同於 ?


HTML速查列表