HTML常用标签

看客老爷们大家好！为了让小白（零基础）能快速的了解H5，为了让小白能有一个从零开始的，可以看懂的，看了后能学到一些知识点的文档，今天开始我将持续性的写一些小知识点的文章；下面我们就从页面结构开始：

网页的构成

网页是由结构（页面的结构部分html）、表现（网页的样式css）、行为（网页要实现的交互功能js）组成的；简单的说html是我们造的一个机器人；css就是给他穿上衣服；js就是赋予它走路，下棋等的行为；

好的，今天我们就说说HTML的部分：

深入HTML

HTML 指的是超文本标记语言 (英文全称：Hyper Text Markup Language) www万维网的描述性语言。

HTML中可以写入标签（标记）下面我们说说常见标签的语法：

HTML标记的语法：
1、常规标记(双标记)：
<标记名称 属性1名="属性1值" 属性2名="属性2值" ………… ></标记名>
2、空标记（单标记）：<标记名 属性1名="属性1值" />
注：标记有两种形式，我们分别称单标记和双标记,或者叫空标记和普通标记；

HTML常用标签

1、文本标题
语法：<h#></h#>
说明：
其中#可以选择1-6；
文本标题（h1-h6）
<h1>一级标题</h1>（唯一性，在单一页面中只能出现一次）
<h2>二级标题</h2>
...
<h6>六级标题</h6>

2、字体及字符实体
语法：<i></i> | <em></em>
说明：倾斜标记

语法：<b></b> | <strong></strong>
说明：加粗标记

语法：<u></u>
说明：下划线标记

语法：<br />
说明：空标记，用来设置字体换行

语法：<hr />
说明：空标记，用做水平线

语法：<p></p>
说明：段落标记，标识一个段落(段落与段落之间有段间距)

什么是字符实体：

在往HTML文档中写入特殊字符，
如“〈”、“〉”、“&”、“ ”等要使用特殊的代码，
浏览器会用HTML命令对这些特殊代码进行翻译。
往网页中输入特殊字符，需在HTML代码中加入以&开头的字母组合或以&#开头的数字。

常见的有：
  不换行空格

> 右尖括号

< 左尖括号

© 备案中图标

3、常用元素

语法：<div></div>
说明：<div> 标签可以把文档分割为独立的、不同的部分。它可以用作严格的组织工具，并且不使用任何格式与其关联。
如果用 id 或 class 来标记 <div>，那么该标签的作用会变得更加有效。

语法： <p></p>
说明：<p></p>文本结点是一个段落标签；

语法： <span></span>
说明：<span></span>文本结点可以是某一小段文本，或是某一个字
4、列表的应用

HTML中有三种列表，分别是：
无序列表（ul）
语法：

<ul>
    <li>列表项内容</li>
    <li>列表项内容</li>
    <li>列表项内容</li>
    …………
</ul>

有序列表（ol）

<ol>
    <li>列表项内容</li>
    <li>列表项内容</li>
    <li>列表项内容</li>
    …………
</ol>

自定义列表（dl）

<dl>
    <dt>名词</dt>
    <dd>解释</dd>
    ………
</dl>

5、超链接和图像

超链接
语法：
<a href="目标文件路径及全称/连接地址" alt="替换文本" title="提示文本">链接文本/图片</a>

插入图像

<img src="目标文件路径及全称" alt="图片替换文本" title="图片标题" />

6、表格元素

（1）表格的语法
语法：

<table>
    <tr>
        <td></td>
        <td></td>
    </tr>
</table>

说明：
一对tr表示一行；一对td表示一列(一个单元格)

（2）表格的相关属性

width="表格的宽度"
height="表格的高度"
border="表格的边框"
bordercolor="边框色"
cellspacing="单元格与单元格之间的间距"
cellpadding="单元格与内容之间的空隙"
align="表格对齐方式" 取值：left\right\center
valign="垂直对齐" 取值：top\bottom\middle
colspan=“所要合并的单元格的列数"
rowspan=“所要合并单元格的行数”

7、表单元素

（1）表单域
语法：

<form name="表单名称" method="post/get"  action=""></form>

说明：
Get是用来从服务器上获得数据，而Post是用来向服务器上传递数据。出于安全性考虑，建议最好使用 Post 提交数据

（2）表单控件

文本框：<input type="text" value="默认值" />
密码框：<input type="password" />
提交按钮：<input type="submit" value="按钮内容" />
重置按钮：<input type="reset" value="按钮内容" />
单选框：<input type="radio" name="" />
复选框：<input type="checkbox" name="" />
disabled="disabled" :禁用
checked="checked" :默认选中
按钮：<input type="button" value="按钮内容" />

（3）下拉菜单
语法：

<select>
     <option>下拉选项1</option>
     <option>下拉选项2</option>
      …………
</select>

（4）多行文本框

语法：<textarea cols="" rows="" ></textarea>

说明：rows属性和cols属性用来设置文本输入窗口的高度和宽度，单位是字符。

今天的常用标签就介绍到这里；