html5是由标签组成的标记语言，本篇就介绍HTML5的部分标签
html5保留的常用标签
<!-- --> 定义HTML注释 <html> HTML5文档的根元素 <head> 定义HTML文档的头部页面元素 <title> 定义HTML5的页面标题 <body> 定义HTML5文档的页面主体部分 <style> 该元素用于引入样式定义 <h1>到<h6> 定义标题一到标题六 <p> 段落标签 <br> 换行标签 <hr> 定义水平线 <div> 定义文档中的块 <span> 与div标签基本相似，默认不会换行
代码示例：
<!DOCTYPE html> <html> <meta charset="utf-8"><!--定义编码方式--> <head> <title>标签代码示例</title> <head> <body> <h1>标题一</h1><!--标题标签--> <h2>标题二</h2> <h3>标题三</h3> <h4>标题四</h4> <h5>标题五</h5> <h6>标题六</h6> <hr><!--输出一条水平线--> <span>php</span><span>mysql</span><span>html</span><!--定义三个span标签--> <br><!--换行标签--> <div>php</div><div>mysql</div><div>html</div> <p>tomcat</p> </body> </html>
文本格式化标签
这些元素让文本在浏览器中呈现出特定的效果
<b> 定义粗体文本 <i> 定义斜体文本 <em> 定义强调文本 <strong> 定义粗体文本，与<b>标签的作用和用法基本相同 <sup> 定义上标文本 <sub> 定义下标文本 <bdo> 定义文本的显示方向，该标签可以指定dir属性，该属性值只能是ltr或者是rtl
代码示例：
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>文本格式化标签</title> </head> <body> <span><b>加粗文本</b></span><br/> <span><i>斜体文本</i></span><br/> <span><b><i>粗斜体文本</i></b></span></br> <span><em>被强调的文本<em><span><br/> <big><span>大号字体文本</span></big><br/> <p><strong>加粗文本</strong></p><br/> <small><span>小号字体文本</span></small><br/> <div>普通文本<sup>上标文本</sup></div> <bdo dir="ltr">从左向右排列</bdo><br/> <bdo dir="rtl">从右向左排列</bdo><br/> </body> </html>
语义相关元素
html5保留了如下相关元素 <abbr> 用于表示一个缩写 <address> 用于表示一个地址 <blockquote> 用于定义一段长的引用文本 <q>用于定义一段短的引用文本 <cite> 用于表示作品的标题 <code> 用于表示一段计算机代码 <dfn> 用于定义一个专业术语 <del> 定义文档中被删除的文本 <ins> 定义文档插入的文本 <pre> 预格式化标签 <samp> 定义示范文本内容 <kbd> 定义键盘文本 <var> 用于表示一个变量
超链接和锚点
超链接<a.../>，该元素可以指定 id class style等核心属性，也可以指定onclick等各种事件属性，还可以指定如下三个重要属性
href：指定超链接所关联的另一个资源
target：指定使用框架集中的哪一个框架来装载另一个资源，该属性的属性值可以是_self _blank _top _parent
<a href=" target="_blank" ">百度</a> <a href="#test">定位到test锚点</a> <a name="test"></a>
列表相关标签
<ul> 定义无序列表 <ol> 定义有序列表 该元素可以指定如下三个属性，start :指定列表项的起始数字 type :哪种类型 的编号 reversed 该属性用于指定是否将排序反转 （目前没有浏览器支持该属性） <li> 定义列表项目 <dl> 用于定义列表 <dt> 用于定义标题列表项 <dd> 用于定义普通列表项
代码示例：
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>列表相关标签</title> </head> <body> <ul> <li>列表一</li> <li>列表二</li> <li>列表三</li> </ul> <ol start="2" type="I"> <li>列表一</li> <li>列表二</li> <li>列表三</li> </ol> <dl> <dt><dt> <dd><dd> <dd><dd> <dt><dt> <dd><dd> <dd><dd> <dl> </body> </html>
图像相关标签：
<img.../> src:该属性指定图片的所在的位置 alt:作为改图片的提示信息 height：该图片的的高度 width:该图片的宽度 usemap="#mapname" <map.../> <map name=""> <area="" coords="" href=""> <area="" coords="" href=""> </map>
表格相关标签：
<table> 用于定义表格 属性：cellpadding :指定单元格内容和单元格边框之间的间距 cellspacing :指定单元格之间的间距，该属性可以是像素值也可以是百分比 width:表格的宽度 <caption> 定义表格标题 <tr> 定义表格行 <td> 定义单元格 <th> 定义表格页眉的单元格 <tbody> 定义表格的主体 <thead> 定义表格的头 <tfoot> 定义表格的脚 rowspan colspan 两个属性用于定义跨行跨列
框架相关元素：
<iframe src="" width ="" height="">
html5新增的通用属性：
contentEditable属性 该属性设置为true，那么浏览器将允许开发者直接编辑该HTML元素里的内容，可以继承，如果一 个HTML元素的父元素是可编辑的那么子元素默认也是可以编辑的 designMode 属性 相当于一个全局的contentEditable属性，如果把真个页面的designMode属性设置为on时，该页面 上所有可支持contentEditabe都变成可编辑状态 hidden属性 hiddle设为true，就意味着浏览器不显示该组件，浏览器也不会保留该组件所占用的空间，相当于 在CSS中设置display:none; spellcheck属性 设置spellcheck="true"浏览器将会对输入的文本内容执行输入检查
html5新增的常用元素：应用较少，略
html5头部和元信息
<script>该元素用于包含JavaScript脚本 链接外部js<script type="text/javascript" src=""> <style>用于定义内部CSS样式 <link>链接外部资源 链接外部CSS<link type="text/css" rel="stylesheet" href=""> <meta>定义HTML页面的元数据 <mata charset="utf-8"> <mata http-equiv="refreash" content="2;URL="http://www.baidu.com">
时间： 2024-08-02 19:18:29