html标签总结

格式化标签

加粗标签：<srong></strong>或 <b></b>

倾斜标签：<em></em>或<i></i>
删除线：<del></del>或<s></s>
下划线：<ins></ins>或<u></u>

空格：&nbsp;    别忘了分号
<:    &lt;
>:    &gt;

布局盒子

<div></div>：独占一行
<span></span>：一行中可有多个

图像标签

<img src="tuxiang.jpeg">

alt = "文字"    当图片显示不出来的时候，用文字代替图片
title = "文字"    鼠标移动到图片上时，显示文字
height="高度"
width="宽度"    设置宽度和高度，只需要设置其中一个就会按照等比例缩放
border="size"    设置边界宽度
<img src="huaduo.jpeg" title="我的私人庄园思密达" width="500" height="400" border="15"/>
上面5个属性必须写在src后面，除此之外不分先后顺序，已空格隔开

<img src="图片地址">    还可以加上图片地址

段落标签和换行标签

<br />    单标签，换行
<p></p>        段落标签，该段落上下各空一行

超链接标签

<a href="http://www.qq.com" target="_blank">腾讯官网</a>
   <a href="http://www.itcast.cn" target="_self">传智播客</a>

<a>文字、图片、表格、音频</a>
href="外部连接地址"        需要加上http://

target="打开方式"
_self: 当前页面打开，相当于不写
_blank: 新页面打开 

内部连接：自己写的html之间的跳转

空链接：<a href="#">空连接</a>

下载链接：href=“下载链接”        是一个压缩包或者exe文件

锚点链接：从本页面某一位置跳到另一位置
<a href="#name">
<h3 id="name">

列子：
你的交流世界：<a href="http://www.qq.com" target="_blank">腾讯官网</a><br />
   公司简介：<a href="http://www.itcast.cn" target="_self">传智播客</a><br />
   庄园世界：<a href="图像标签.html" target="_blank">魅力之花</a><br />
   空连接：<a href="#">空连接</a><br />
   下载链接：<a href="images/huaduo.rar">图片下载链接</a><br />
   其他链接方式：<a href="http://www.baidu.com" target="_blank"><img src="images/huaduo.jpeg" alt="无效图片" title="百度官网" width="100"></a>

表格

表格：显示数据

<table>            表格标签
    <tr>        一行
        <td>    单元格
        <td>
    </tr>
</table>

<th></th>    表头单元格

align        调整表格所在页面位置center，left，right
border        添加表格
cellpadding     文字与表格单元距离
cellspaceing    表格之间的距离
width
height        设置表格的宽度和高度

<thead></thead>        整个头部区域
<tbody></tbody>        整个身体区域

合并单元格：
colspan="表格数量"        从最左面的列数开始删除
rowspan="表格数量"    从最上面的行开始删除

表单

表单：搜集用户信息

表单域：
<form></form>

表单控件input：
提示：<input type="属性" />

属性：
text：输入文本
password：密码
radio：单项框
CheckBox：复选框

checked：主要针对单选框和复选框，作用是默认选上，checked=“checked”
maxlength=“长度”    用于限制文本框和密码等长度

submit：提交按钮，于value搭配给按钮起名字
reset: 全部重置按钮，于value搭配给按钮起名字
button：普通按钮，于value搭配，获取验证码等

file：获取文件

<label></label>    使用户获得更好的体验
<label for="nv">女</label>
        <input type="radio" name="sex" value="woman" id="nv"><br>

表单控件：select（下拉表单）
<select>
    <option> 选项1</option>
    <option> 选项2</option>
    <option> 选项3</option>
</select>
同时可以搭配selected=“selected”表示默认选项

表单控件：textarea（文本域）
<textarea row="行数" col=“列数”>
</textarea>

列表

列表：布局

无序列表：
<ul>
    <li> 1 </li>
    <li> 2 </li>
    <li> 3 </li>
</ul>
注意：ul中只能放li，而li中能放任何元素，如：文字，<p>

有序列表；
<ol>
    <li> 1 </li>
    <li> 2 </li>
    <li> 3 </li>
</ol>
注意事项与无序列表一样

自定义列表：大哥带小弟
<dl>
    <dt>小标题</dt>
    <dd>说明<dd>
    <dd>说明<dd>
    <dd>说明<dd>    
</dl>
dl中只能是dt和dd，dt和dd是并列关系