• 1，基本标签

<html>：html文档的根元素，可以指定一个xmlns属性，值只能是http://www/w3.org/1999/xhtml。

<body>：页面主体部分

<head>：页面开始部分

<style>：CSS定义

<h1>到<h6>：定义标题一到标题六。数字越大，显示的标题越小

<p>：段落

<br />：换行

<hr />：水平线

<!--  -->：注释

<div>：文档中的节

<span>：也是文档中的节





ok，html的常用标签就是上面这些，有3个标签<p><span><div>经常用到，他们都可以作为其他内容的容器。这里要注意他们之间的区别：

1，<span>不会换行，<div>和<p>都会换行，而且<p>段落与段落之间的默认间距更大。

2，<p>可以包含<span>，但是<span>不能包含<p>，但是<div>可以包含所有的东西，实际中<div>也使用最多。



以下是一份包含上面标签的html：

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<title>Html基本标签</title>

</head>

<body>

	<!-- 标题一到标题6输出文本 -->

	<h1>林肯公园</h1>

	<h2>林肯公园</h2>

	<h3>林肯公园</h3>

	<h4>林肯公园</h4>

	<h5>林肯公园</h5>

	<h6>林肯公园</h6>

	<!-- 输出换行 -->

	<br />

	<!-- 输出一条水平线 -->

	<hr />

	<!-- 使用span定义3个节 -->

	<span>不换行</span><span>不换行</span><span>不换行</span>

	<!-- 使用div定义3个节 -->

	<div>换行</div><div>换行</div><div>换行</div>

	<!-- 使用p定义3个段落 -->

	<p>换行</p><p>换行</p><p>换行</p>

</body>

</html>

  • 2，文本格式化标签

<b>：粗体文本

<i>：斜体文本

<em>：强调文本

<big>：大号字体文本

<strong>：粗体文本

<small>：小号字体文本

<sup>：上标文本

<sub>：下标文本

<bdo>：定义文本的显示方向。这个标签可以指定dir属性，该属性值只能是ltr和rtl。

以下是一份包含上面标签的html：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<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 />

	<span><big>大号字体文本</big></span><br />

	<span><small>小号字体文本</small></span><br />

	<span><strong>加粗的文本</strong></span><br />

	<span>普通的文本<sup>上标文本</sup></span><br />

	<span>普通的文本<sub>下标文本</sub></span><br />

	<bdo dir="ltr">指定文本内容从左到右，left to right么</bdo><br />

	<bdo dir="rtl">指定文本内容从右到左，right to left</bdo>

</body>

</html>

  • 3，超链接

<a>：超级链接。页面使用超链接，与网络中的另外一个资源保持关联，当用户点击页面上的超级链接时，浏览器会定义到该浏览器链接所指的资源。关于这个标签有2个属性很重要：

href：指定超链接所关联的另一个资源。这里的属性值可以是相对路径，也可以是绝对路径。指定了这个属性，超级链接位置上鼠标移过去就变成了手势图标了，而且字体也变色了。

target：指定使用框架集中的哪一个框架来加载资源。一般有_self（自身），_blank（新窗口），_top（顶级框架），_parent（父框架）

注意：当href的属性值指定的是绝对路径时，属性值就是一个URL。关于url不多说了，他的语法规范是：

scheme://host.domain:port/path/filename





<a>标签还可以生成一个命名锚点。命名锚点用于在html中生成一个定位点，这样子允许超级链接链接到指定页面的该定位点。通俗点就是说要是没有锚点的话每次页面链接过去呢，都是在最上面开始显示，假如一个页面很长的话，那么我们就要自己去拖拉和滚动。定位了一个锚点呢，就是页面一下子就跳到了指定的这个地方了，不用再拖拉页面了。

比如<a name="linkin">  这里的name属性就是说该命名锚点的名称

<a href="Linkin.html#linkin"> 这里就是说在url资源后指定了锚点名，锚点名和url资源之间用#隔开。



以下是一份包含上面标签的html：



 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<title>超链接</title>

</head>

<body>

	<a href="http://www.baidu.com">使用绝对路径打开百度(自己的窗口)</a><br />

	<a href="http://www.baidu.com" target="_blank">使用绝对路径打开百度(新的窗口)</a><br />

	<a href="Park.html">使用相对路径打开自己的文件</a><br />

	<a href="Park.html#linkin">直接定位到linkin锚点</a>

</body>

</html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<title>Park.html</title>

</head>

<body>

	<h1>这里是另外的一个页面</h1>

	<hr />

	<h1>这里是另外的一个页面</h1>

	<hr />

	<a name="linkin">这里定义了一个锚点</a>

</body>

</html>

三、Html常用标签的更多相关文章

  1. jsp学习--JSP运行原理,九大隐式对象和JSP常用标签

    一.JSP运行原理 每个JSP 页面在第一次被访问时,WEB容器都会把请求交给JSP引擎(即一个Java程序)去处理.JSP引擎先将JSP翻译成一个_jspServlet(实质上也是一个servlet ...

  2. Python 44 前端概述 、三剑客 、常用标签与分类

    1.前端三剑客是哪三位?文件的后缀内容?在前端开发中的功能是什么? HTML:   .htm .html   内容 CSS:   .css   效果 JS:   .js   行为 2.简述三剑客的主要 ...

  3. html(常用标签,标签分类)，页面模板， CSS(css的三种引入方式)，三种引入方式优先级

    HTML 标记语言为非编程语言负责完成页面的结构 组成: 标签:被<>包裹的由字母开头,可以结合合法字符( -|数字 ),能被浏览器解析的特殊符号,标签有头有尾 指令:被<>包 ...

  4. 一、HTML概述 二、web相关的概念 三、HTML的常用标签

    一.HTML概述###<1>概念 HTML:Hypertext Markup Language,超文本 标记语言,用来描述网页的一种语言. 非编程语言,由浏览器直接解释运行. ###< ...

  5. CSS常用标签

    CSS常用标签 一 CSS文字属性 color : #999999; /*文字颜色*/ font-family : 宋体,sans-serif; /*文字字体*/ font-size : 9pt; / ...

  6. 9月5日网页基础知识 通用标签、属性（body属性、路径、格式控制） 通用标签（有序列表、无序列表、常用标签）（补）

    网页基础知识 一.HTML语言 HTML语言翻译汉语为超文本标记语言. 二.网页的分类 1.静态页面:在静态页面中修改网页内容实际上就是修改网页原代码,不能从后台操作,数据来只能来源于原于代码.静态网 ...

  7. Struts2常用标签

    Struts2常用标签总结 一 介绍 1．Struts2的作用 Struts2标签库提供了主题.模板支持,极大地简化了视图页面的编写,而且,struts2的主题.模板都提供了很好的扩展性.实现了更好的 ...

  8. dedecms 常用标签调用

    /*------------------单个ip调用-------------------*/ {dede:type typeid="12"} <a title=" ...

  9. HTML之一天学会html(常用标签+网页架构)

    1.  网页文件的创建 新建一个文本文件,将其命名为xxx.html或者xxx.htm(注意后缀名) 2.  简单的html页面的编写 在网页中都是通过标签来指定相应的显示内容,所有的页面内容都必须在 ...

随机推荐

  1. wx.createSelectorQuery()的方法讨论

    在之前的<小程序节点查询方法:wx.createSelectorQuery()的使用场景与注意事项>中,讨论了节点查询方法. 最近在wx.createSelectorQuery()实际使用 ...

  2. 【转】LDA数学八卦

    转自LDA数学八卦 在 Machine Learning 中,LDA 是两个常用模型的简称: Linear Discriminant Analysis 和 Latent Dirichlet Alloc ...

  3. [转载]Tortoise SVN使用方法，简易图解

    刚到公司实习,为了版本控制,我公司使用SVN控制版本,在此记下SVN使用方法,仅供参考!           废话少说,上图!   ---------------------------------- ...

  4. 0.python class

    http://pythonprogramminglanguage.com/ 什么是python? python是一款让你工作比起用其他语言更快的编程语言.老练的程序员用其他的语言会比用python更顺 ...

  5. LevelDB的源码阅读（二） Open操作

    在Linux上leveldb的安装和使用中我们写了一个测试代码,内容如下: #include "leveldb/db.h" #include <cassert> #in ...

  6. 微信小程序之swiper轮播图中的图片自适应高度

    小程序中的轮播图很简单,官方都有例子的,但是唯一的缺陷就是swiper是固定死的150px高度,这样如果传入的图片大于这个高度就会被隐藏.辣么,怎样让图片自适应不同分辨率捏. 我的思路是:获取屏幕宽度 ...

  7. Zabbix实战-简易教程（8）--添加item

    一.术语 1.1 Item概念 Item是从主机里面获取的所有数据.通常情况下 item称为监控项,例如我们host加入了 zabbix 监控,我们需要监控它的内存.CPU信息,那么获取的CPU或内存 ...

  8. Linux（常用命令） 中常用的压缩丶解压缩格式命令和参数详解

    Linux中常用的压缩格式后缀名有:①.zip  ②.gz  ③.bz2  ④.tar.gz  ⑤.tar.bz2 ①.zip后缀名格式 1.压缩 语法: ①zip 压缩文件名 源文件 (压缩文件) ...

  9. Mac从零配置Vim

    // 这是一篇导入进来的旧博客,可能有时效性问题. 1. 安装Homebrew (包管理器,用来安装Vim)& /usr/bin/ruby -e "$(curl -fsSL http ...

  10. 互联网App应用程序测试流程及测试总结

    互联网App应用程序测试流程及测试总结 1. APP测试基本流程 1.1流程图 仍然为测试环境 Pass 1.2测试周期 测试周期可按项目的开发周期来确定测试时间,一般测试时间为两三周(即15个工作日 ...