html最基本的格式
在sublime的emmmet中輸入了html:4s跛锌,在按tab或者ctrl+e就可以生成如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>Document</title>
</head>
<body>
</body>
</html>
html標(biāo)簽
1.標(biāo)題
<h1></h1>
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
<h6></h6>
2.段落
<p></p>
3.鏈接
<a href=""></a>
4.圖片
<img src="" alt="" title="">
元素和屬性
<a href=""></a>
href代表a標(biāo)簽的一個(gè)屬性,都是鍵值對(duì)的形式届惋。
水平線和注釋
1.水平線
<hr />
2.注釋
<!-- This is a comment -->
<p>
和<br />
<p></p>
是塊級(jí)元素髓帽,俗稱硬換行,其實(shí)就是生成一個(gè)段落盼樟,每個(gè)<p>
之間是會(huì)有一個(gè)空行的氢卡。而<br />
是內(nèi)聯(lián)元素,俗稱軟換行晨缴,每個(gè)<br />
之間是沒有換行的译秦。
html樣式
html的樣式現(xiàn)在都是用css表示,常用的一個(gè)html標(biāo)簽來修改行內(nèi)文字的格式<span></span>
鏈接
1.新窗口打開鏈接
<a href="#" target="_blank"></a>
2.錨標(biāo)簽
<a href = "#xx"></a>
<h1 name=xx></h1>
3.發(fā)送電子郵件
<a href="mailto:oliverhuangpy@163.com"></a>
ps:mailto:地址?cc&bcc&subject&content
表格
<table border="1" summary=""><!-- 表格邊框與描述 -->
<tr>
<th>Heading</th><!-- 表頭 -->
<th>Another Heading</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>
表格標(biāo)題: <caption></caption>
列表
1.無序列表
<ul>
<li>list</li>
<li>list</li>
</ul>
2.有序列表
<ol>
<li>list1</li>
<li>list2</li>
</ol>
3.定義列表
<dl>
<dt>Coffee</dt>
<dd>Black hot drink</dd>
<dt>Milk</dt>
<dd>White cold drink</dd>
</dl>
表單
表單標(biāo)簽
<form></form>
1.文本域
<input type="text" name="lastname" />
2.單選按鈕
<input type="radio" name="sex" value="female" />
<input type="radio" name="sex" value="male" />
3.復(fù)選框
<input type="checkbox" name="car" />
4.表單提交
<form name="input" action="html_form_action.html" method="get">
<!-- action代表服務(wù)器的文件击碗,method代表傳送的方式 -->
Username:
<input type="text" name="user" /><!-- name是給服務(wù)器后端程序的值 -->
<input type="submit" value="Submit" />
</form>
5.下拉列表
<form>
<select name="cars"><!-- 加上mutilple代表的是多選 -->
<option value="volvo" selected="selected">Volvo</option><!-- selected是默認(rèn)選中 -->
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option><!-- value是給服務(wù)器的值 -->
</select>
</form>
6.文本域
<textarea rows="10" cols="30">
7.自定義按鈕
<input type="button" value="Hello world!">
8.field around data(很少用)
<fieldset>
<legend>健康信息:</legend>
<form>
<label>身高:<input type="text" /></label>
<label>體重:<input type="text" /></label>
</form>
</fieldset>
ps:增補(bǔ)一些內(nèi)容
sublime安裝了emmet后再輸入html:5按Tab
出現(xiàn)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
</body>
</html>
短文本的引用:
<q></q>
長(zhǎng)文本引用:
<blockquote></blockquote>
地址:
<address></address>
代碼(單行):
<code></code>
代碼(多行):
<pre></pre>
form的for:
<label for="xx"></label>
<input id="xx" />