• 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. IDEA新建spring boot项目没有Spring Initializr选项

    在settings -> Plugins 里面搜索spring boot,勾选上,然后再重启下idea,就可以了.如果Plugins里面没有spring boot的话,先安装下,再勾选. 参考( ...

  2. Django-- 多数据库联用

    django项目中使用多个数据库的方法, 多个数据库的联用 以及多数据库时数据导入导出的方法. 直接给出一种简单的方法吧,想了解更多的到官方教程,点击此处 给每个app都可以单独的设置一个数据库 se ...

  3. springboot整合mybaits注解开发

    springboot整合mybaits注解开发时,返回json或者map对象时,如果一个字段的value为空,需要更改springboot的配置文件 mybatis: configuration: c ...

  4. 关于jmeter工具使用的总结

    今天总结下jmeter工具如何使用 先从最简单的说起 如何打开jemter 配置环境变量 接下来我们只要在dos窗口中输入 jmeter就能打开,这也告诉了我们配置环境变量的方便性 接下来介绍一下线程 ...

  5. 成功破解邻居的Wifi密码

    // 这是一篇导入进来的旧博客,可能有时效性问题. 默认配置的路由器,8位以下密码,黑客几分钟就可以破解.以前用自己的路由器做过实验,这次真正实践成功.环境:Kali Linux工具集:aircrac ...

  6. 【经验总结】Java在ACM算法竞赛编程中易错点

    一.Java之ACM易错点 1. 类名称必须采用public class Main方式命名 2. 在有些OJ系统上,即便是输出的末尾多了一个“ ”,程序可能会输出错误,所以在我看来好多OJ系统做的是非 ...

  7. [bzoj1273] [BeiJingWc2008]序列

    一开始想拆位..但显然没法应对进位啊什么的. 所以维护每一个长度的后缀. 查询有多少个a&2^i>0,也就是长度为(i+1)的后缀里,值为2^i...2^(i+1)-1的数有多少个. 前 ...

  8. [bzoj1806] [ioi2007]Miners 矿工配餐

    相当于noip前两题难度的ioi题........ 还是挺好想的...算是状压一下?...两个二进制位可以表示三种食物或者没有,所以用四个二进制位表示某个煤矿最近两餐的情况... 先把各种情况加上各种 ...

  9. UVA 572 dfs求连通块

    The GeoSurvComp geologic survey company is responsible for detecting underground oil deposits. GeoSu ...

  10. Generator函数异步应用

    转载请注明出处: Generator函数异步应用 上一篇文章详细的介绍了Generator函数的语法,这篇文章来说一下如何使用Generator函数来实现异步编程. 或许用Generator函数来实现 ...