html —— 超文本标记语言 标准的格式 如果出现小的编码错误 系统会自动帮你纠正
htm —— 一些较老的服务器,只有支持后缀为三位
xhtml—— 严格的html 格式
Meta 标签:
<meta name="Keywords" content="学生成绩"> 向搜索引擎说明网页的关键字 如果搜索学生成绩 那么就对抓取到这个网页 如果输入其他的则无法搜索到
<meta name="Description" content="这是统计学校成绩的网页"> 网页的描述 如果搜索引擎以一段文字抓取的话那么就会搜索到这网页
<meta http-equiv="content-type" content="text/html;charset=utf-8"> 设置网页的编码格式为:UTF-8
<meta http-equiv="refresh" content="3"> 这个网页会在三秒后刷新
<meta http-equiv="refresh" content="3;url=http://www.baidu.com"> 三秒后转跳到百度网页
<!----> 在html中表示注解
定义正文标题:<h1></h1> ----------> <h6></h6>
  <h1>标题1</h1>
  <h2>标题2</h2>
  <h3>标题3</h3>
  <h4>标题4</h4>
  <h5>标题5</h5>
  <h6>标题6</h6>
注解:正文就是正文 而标题也就是标题 正文无法变成标题 而标题也不会变成正文
定义段落标签:<p></P> 段落结尾之处必须换行 可以存在很多的P标签
代码演示:
         <p>这是一个P标签</p>
         <P>而这是第二个P标签 会在这里换行</P>
blockquote标签 用于引用文本
代码演示:
<blockquote>这里是引用的文本</blockquote>
定义列表:
有两种组合:
<ul><li>无序列表</li></ul>
<ol><li>有序列表</li></ol>(<li></li>标签 是有序和无序标签的包含标签)
代码演示:
     <p>以下是定义列表</p>
    <p>首先是无序组合列表</p>
    <ul>
      <li>无序列表1</li>
      <li>无序列表2</li>
      <li>无序列表3</li>
    </ul>
    <P>然后是有序组合列表</P>
    <ol>
     <li>有序列表1</li>
     <li>有序列表2</li>
     <li>有序列表3</li>
    </ol>
dl标签 :
<dl><!---DL为描述标签-->
<dt><img src="图片名"></dt><!---一般来说放入图片--->
<dd>对DT的描述 通常是对上面图片的解释</dd>
</dl>
代码演示:
    <p>描述标签</p>
  <dl>
      <dt><img src="img/1.jpg"></dt>
      <dd>这照片好帅</dd>
  </dl>
注:../表示回到上一级 <img sre="图片" alt+"文字"> 此标签当图片因为特殊原因无法显示的时候 显示的提示语句
pre 标签: 我们自定义的格式 我们想怎么定义都可以
代码演示:
       <P>自定义格式PRE标签</P>
  <pre>
      45
     +15
    -------
      =60
  </pre>
常用的实体符号:
  空格 < 左括号(<) > 右括号(>) © 版权符号 ® 已注册符号 & &符号  长破折号
button标签 为html中的按钮标签
代码演示:
    <p>按钮标签button</p>
    <button>我是按钮</button>
A标签为超链接标签:
a标签可以连接到其他的地方
代码演示:
     <P>A标签演示:</P>
  <a href="http://www.baidu.com">我是A标签 点我转跳到百度</a>       如果点击文字就会转跳到百度网页
  <a href="http://www.baidu.com" accesskey="a">按住Alt+a 转跳到百度</a>     按住Alt+a 转跳到百度  
  <a tabindex="1">按下Tad 第一个跳到这里</a>     按下Tad 第一个跳到这里 
  <a tabindex="2">按下Tad 第二个跳到这里</a>
  <a tabindex="3">按下Tad 第三个跳到这里</a>
表格: table 标签 加入 border="1" cellspacing="0" 表示给这个表格加上边框
<table>
<tr> <!---TR为行--->
<td>TD为列</td>
</tr>
</table>
代码演示:
<p>以下是表格演示</p>
  <table border="1" cellspacing="0">
      <tr>
          <td>第一行第一列</td>
          <td>第一行第二列</td>
          <td>第一行第三列</td>
      </tr>
      <tr>
          <td>第二行第一列</td>
          <td>第二行第二列</td>
          <td>第二行第三列</td>
      </tr>
</table>
合并单元格:
<p>合并单元格演示:</p>
  <table border="1" cellspacing="0">
      <tr>
          <td rowspan="2">合并两行</td>
          <td>第一行第一列</td>
          <td>第一行第二列</td>
          <td>第一行第三列</td>
      </tr>
      <tr>
          <td>第二行第一列</td>
          <td>第二行第二列</td>
          <td>第二行第三列</td>
      </tr>
</table>
  <table border="1" cellspacing="0">
      <tr>
          <td colspan="3">合并三列</td>
      </tr>
      <tr>
          <td>第二行第一列</td>
          <td>第二行第二列</td>
          <td>第二行第三列</td>
      </tr>
</table>
iframe 标签 在网页嵌套另外一个网页 width设置宽 height设置高
 <P>一个网页嵌套别的网页iframe标签</P>
<iframe src="http://www.baidu.com" width="1000" height="600"></iframe>
锚链接:
代码演示:
<a href="#p1">锚链接点这里</a>
<P id="p1">锚链接会跳到这里</P>
注: 每一个标签都有ID 属性 而且是唯一的不能重复
------------------------------------------------------------------------------------------这是分界线一下是完整代码-----------------------------------------------------------------------------------
<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta http-equiv="content-type" content="text/html;charset=utf-8">
    <meta name="Description" content="这是统计学校成绩的网页">
    <meta http-equiv="refresh" content="300">
</head>
<body>
<a href="#p1">锚链接点这里</a>
  <h1>标题1</h1>
  <h2>标题2</h2>
  <h3>标题3</h3>
  <h4>标题4</h4>
  <h5>标题5</h5>
  <h6>标题6</h6>
  <p>这是一个P标签</p>
  <P>而这是第二个P标签 会在这里换行</P>
<blockquote>这里是引用的文本</blockquote>
  <p>以下是定义列表</p>
  <p>首先是无序组合列表</p>
  <ul>
      <li>无序列表1</li>
      <li>无序列表2</li>
      <li>无序列表3</li>
  </ul>
  <P>然后是有序组合列表</P>
  <ol>
     <li>有序列表1</li>
     <li>有序列表2</li>
     <li>有序列表3</li>
 </ol>
  <p>描述标签</p>
  <dl>
      <dt><img src="img/1.jpg"></dt>
      <dd>这照片好帅</dd>
  </dl>
  <P>自定义格式PRE标签</P>
  <pre>
      45
     +15
    -------
      =60
  </pre>
<p>按钮标签button</p>
<button>我是按钮</button>
  <P>A标签演示:</P>
  <a href="http://www.baidu.com">我是A标签 点我转跳到百度</a>
  <a href="http://www.baidu.com" accesskey="a">按住Alt+a 转跳到百度</a>
  <a tabindex="1">按下Tad 第一个跳到这里</a>
  <a tabindex="2">按下Tad 第二个跳到这里</a>
  <a tabindex="3">按下Tad 第三个跳到这里</a>
  <p>以下是表格演示</p>
  <table border="1" cellspacing="0">
      <tr>
          <td>第一行第一列</td>
          <td>第一行第二列</td>
          <td>第一行第三列</td>
      </tr>
      <tr>
          <td>第二行第一列</td>
          <td>第二行第二列</td>
          <td>第二行第三列</td>
      </tr>
</table>
<p>合并单元格演示:</p>
  <table border="1" cellspacing="0">
      <tr>
          <td rowspan="2">合并两行</td>
          <td>第一行第一列</td>
          <td>第一行第二列</td>
          <td>第一行第三列</td>
      </tr>
      <tr>
          <td>第二行第一列</td>
          <td>第二行第二列</td>
          <td>第二行第三列</td>
      </tr>
</table>
  <table border="1" cellspacing="0">
      <tr>
          <td colspan="3">合并三列</td>
      </tr>
      <tr>
          <td>第二行第一列</td>
          <td>第二行第二列</td>
          <td>第二行第三列</td>
      </tr>
</table>
<P>一个网页嵌套别的网页iframe标签</P>
<iframe src="http://www.baidu.com" width="1000" height="600"></iframe>
<P id="p1">锚链接会跳到这里</P>
</body>
</html>
原文:http://www.cnblogs.com/chenyangpeng/p/5543994.html