<!DOCTYPE>
定义文档类型<html>
定义html文档<title>
定义文档的标题<body>
定义文档的主体<head>
定义关于文档的信息<!--...-->
定义注释<meta>
定义关于html文档的元信息 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="description" content="html_tag" />
<meta name="keywords" content="html, tag" />
<style>
定义文档的样式 <style type="text/css">
h1 {color: red}
p {color: blue}
</style>
<ul>
定义无序列表<ol>
定义有序列表<li>
定义列表的项目 <h3>无序列表</h3>
<ul>
<li>car</li>
<li>phone</li>
</ul>
<h3>有序列表</h3>
<ol>
<li>first</li>
<li>
<ul>
<li>car</li>
<li>phone</li>
</ul>
</li>
<li>second</li>
</ol>
<div>
定义文档中的分区<span>
定义文档中的节<section>
定义section<header>
定义section或page的页眉<footer>
定义section或page的页脚<aside>
定义页面内容之外的内容 <div style="background-color:red;text-align:center" >
<h3>div</h3>
<p>这是一个div。这是<span style="background-color:blue;">span</span>。</p>
</div>
<section style="background-color:blue;">
<h3>section</h3>
<p>这是一个section</p>
</section>
<header style="background-color:green;">
<h3>header</h3>
<p>这是一个header</p>
</header>
<footer style="background-color:pink;">
<h3>footer</h3>
<p>这是一个footer</p>
</footer>
<aside style="background-color:red;">
<h3>aside</h3>
<p>这是一个aside</p>
</aside>
<a>
定义超链接 <a href="http://www.baidu.com">百度</a>
<link>
定义文档与外部资源的关系 <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" type="text/css" href="/c5.css" />
<h1> to <h6>
定义html标题<p>
定义段落<br>
定义换行<hr>
定义水平线<pre>
定义预格式文本 比如代码<code>
定义计算机代码文本<abbr>
定义缩写<blockquote>
定义长的引用<q>
定义短的引用<strong>
定义语气更为强烈的强调文本<em>
定义强调文本<i>
定义斜体文本<address>
定义文档作者或拥有者的联系信息 <h1>标题</h1>
<div>
<p>
<span>中国移动研究院表示关注。</span><br>
长春工业大学发来贺电。<br>
西祠胡同发来贺电。<br>
山西某学院(<em>名字不记得了</em>)发来贺电。<br>
常州工业职业技术学院发来贺电。<br>
大连软件学院发来贺电。<br>
<i>电子政务与云计算国家工程实验室发来贺电。</i><br>
河南新乡学院不肯发来贺电,被我逼着发贺电。<br>
艺龙技术部工程师发来贺电。<br>
<strong>百度前端工程师发来贺电</strong>。<br>
<hr>
<b>江苏海悦集团发来隆重贺电。</b><br>
<code>var x= 1;</code>
<pre>
for i = 1 to 10
print i
next i
</pre>
<blockquote>这是长引用</blockquote>
<q>引用</q>
<address>
written by <a href="mailto:webmaster@exaple.com">guyue</a>.<br>
visit us at:<br>
example.com<br>
china
</address>
<acronym title="World Wide Wed">WWW</acronym>
the <abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
</p>
</div>
<form>
定义供用户输入的html表单<input>
定义输入控件<output>
定义输出的类型<label>
定义input元素的标注<select>
定义选择列表<datalist>
定义下拉列表 其选项不会被显示出来,它仅仅是合法的输入值列<textarea>
定义多行的文本输入控件<button>
定义按钮<optgroup>
定义选择列表中相关选项的组合<option>
定义选择列表中的选项<fieldset>
定义围绕表单元素的边框<legend>
定义fieldset元素的标题 <form action="/html_form.asp" method="get">
姓名:<input type="text" name="">
密码:<input type="password" name="">
<br>
足球:<input type="checkbox" name="">
<br>
篮球:<input type="checkbox" name="">
<br>
<label for="male">Male</label>
<input type="radio" checked="checked" id="male" name="sex">
<br>
<label for="female">Female</label>
<input type="radio" id="female" name="sex">
<br>
<select name="">
<option value="">first</option>
<option value="">second</option>
</select>
<select name="">
<option value="">first</option>
<option value="" selected="selected">second</option>
</select>
<textarea rows="5" cols="10">
there is nothing!
</textarea>
<input type="button" value="click"></input>
<fieldset>
<legend>健康信息</legend>
身高:<input type="text" name=""></input>
体重:<input type="text" name=""></input>
</fieldset>
<p>first name: <input type="text" name=""></input></p>
<p>last name: <input type="text" name=""></input></p>
<input type="submit" value="submit"></input>
<input type="reset" value="reset"></input>
<!-- html5新的input类型 -->
E-mail: <input type="email" name="user_email" />
Homepage: <input type="url" name="user_url" />
Points: <input type="number" name="points" min="1" max="10" />
Range:<input type="range" name="points" min="1" max="10" />
Date: <input type="date" name="user_date" />
Week: <input type="week" name="user_date" />
</form>
<!-- 文本域 -->
<textarea rows="5" cols="10">
文本域
</textarea>
<!-- 按钮 -->
<button type="button">click me!</button>
<select>
<optgroup label="数字">
<option value="1">1</option>
<option value="2">2</option>
</optgroup>
<optgroup label="字母">
<option value="a">a</option>
<option value="b">b</option>
</optgroup>
</select>
<input list="cars"></input>
<datalist id="cars">
<option value="BMW"></option>
<option value="Ford"></option>
</datalist>
<script>
定义客户端脚本 <script type="text/javascript" src="http://www.xiuyetang.com/js/jquery-1.11.3.js"></script>
<img>
定义图像 <img src="eg_goleft.gif" alt="向左转" />
<img src="eg_goleft1.gif" alt="向左转" />
<video>
定义视频 <video src="movie.ogg" controls="controls" width="300" loop="loop" autoplay="autoplay">
</video>
<audio>
定义音频
<audio src="/i/horse.ogg" controls="controls">
</audio>
<canvas>
定义图形 <canvas id="myCanvas" width="200" height="100" style="border:1px solid #c3c3c3;">
</canvas>
<script type="text/javascript">
var c=document.getElementById("myCanvas");
var cxt=c.getContext("2d");
cxt.moveTo(10,10);
cxt.lineTo(150,50);
cxt.lineTo(10,50);
cxt.lineTo(10,10);
cxt.stroke();
</script>
<svg>
矢量图标签 <svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="190">
<polygon points="100,10 40,180 190,60 10,60 160,180"
style="fill:lime;stroke:purple;stroke-width:5;fill-rule:evenodd;" />
</svg>
<tabel>
定义表格<tr>
定义表格中的行<td>
定义表格中的单元格<th>
定义表格中的表头 <table border="1">
<tr>
<th>篮球</th>
<th>足球</th>
<th>排球</th>
</tr>
<tr>
<td>10</td>
<td>10</td>
<td>10</td>
</tr>
<tr>
<td>10</td>
<td>10</td>
<td>10</td>
</tr>
</table>
<frame>
定义窗口或框架 不能有body<frameset>
定义框架集 不能有body<noframes>
定义针对不支持框架的用户的代替内容<iframe>
定义内联框架 <frameset rows="50, 50">
<frame src=""></frame>
<frameset cols="25, 75">
<frame></frame>
<frame></frame>
</frameset>
</frameset>
相关文章推荐: