- <!-- -->
- 定义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>
来源: http://www.bubuko.com/infodetail-1980279.html