html常用标签，html基本常用标签（一些HTML常用标签）

关于【html常用标签】，html基本常用标签，今天犇犇小编给您分享一下，如果对您有所帮助别忘了关注本站哦。

内容导航：1、html常用标签：一些HTML常用标签「码住！」2、html常用标签，html基本常用标签

1、html常用标签：一些HTML常用标签「码住！」

HTML常用标签

1. web标准

1.1 web标准的构成

主要包括结构、表现和行为三个方面。

标准说明结构用于对网页元素进行整理和分类（HTML）表现用于设置网页元素的外观样式（CSS）行为网页模型的定义及交互的编写（JavaScript）

如果将web标准比喻为一只鸟，则

结构=身体表现=羽毛行为=动作（飞行、站立等）

1.2 标签关系

双标签关系分为：

包含关系（父子）并列关系（兄弟）

(1)包含关系

<head> <title></title></head>

(2)并列关系

<head></head><body></body>

2. HTML基本结构

标签名定义<html></html>html标签<head></head>文档的头部<title></title>文档的标题<body></body>文档的主体

<!DOCTYPE html>  <html lang="en">  <head>  <meta charset="UTF-8"> <title></title> </head> <body> </body> </html>

3. HTML常用标签

3.1 标题标签

一个标题独占一行。（块级元素）

3.2 段落标签

用于将HTML文档分割为若干段落。

特点：

文本在一个段落中会根据浏览器窗口的大小自动换行段落之间有空隙

<p> 这是一个段落</p>

3.3 换行标签

用于强制换行。

特点：

单标签换行没有像段落那样的空隙

<br>这是换行标签

3.4 文本格式化标签

语义标签加粗<strong></strong>倾斜<em></em>删除线<del></del>下划线<ins></ins>

3.5 盒子标签

用于界面布局。

特点：

div一行只能放一个（块级元素）span一行可以放多个（行级元素）

<div> 这是大盒子</div><span>这是小盒子</span>

3.6 图像标签和路径

(1)图像标签

用于定义页面中的图像。

<img src="图像的url" alt="" title="">

属性说明src图片路径（必须属性）alt图像不能显示时的替换文本title鼠标放到图像上显示的提示文本width设置图像的宽度height设置图像的高度border设置图像的边框粗细（在CSS中修改）

注：图像的宽和高一般只修改其中一个，另一个会随之调整。

(2)路径

相对路径：文件相对于HTML页面的位置

相对路径分类符号说明同一级src="文件名"下一级/src="同一级文件夹名称/文件名"上一级../src="../文件名"

绝对路径：完整的路径名称（一般很少用）。eg. C:\\xxx\\xxxx.jpg

注意：绝对路径用“\”分隔，相对路径用“/”分隔。

3.7 超链接标签和链接分类

(1)超链接标签

<a href="跳转目标" target="目标窗口的弹出方式">文本或图像</a>

属性作用href链接目标的url（必须属性）target链接页面的打方式。_self：在当前窗口打开（默认值），_blank：在新窗口打开

(2)链接分类

外部链接：例如http://www.bilibili.com内部链接：网站内部页面之间的相互链接，例如index.html空链接：#下载链接：地址里是一个文件或压缩包网页元素链接：在网页中的各种网页元素都可以添加超链接锚点链接：可以快速定位到页面中的某个位置链接：<a href="#名字"></a>找到目标位置标签，里面添加一个id属性，<h2 id="名字"></h2>返回顶部：<a href="#"></a>

3.8 注释和特殊字符

(1)注释

(2)特殊字符

特殊字符描述字符的代码空格符<小于号<>大于号>&和号&￥人民币¥©版权©®注册商标®°摄氏度°±正负号±✖乘号×➗除号÷²平方²³立方³

注：重点记住前三个。

2、html常用标签，html基本常用标签

HTML全称是：超文本标记语言（HyperText Markup Language），学习这种语言主要就是学习各种标签的使用，今天给大家介绍HTML的基本标签。

html标签

1、HTML 标题

1）标题前面是开始标签opening tag，标题后面是结束标签closing tag，结束标签前面有一个斜杠。

2）标题（heading）是通过 <h1> - <h6> 从大到小的标签进行定义的，<h1> 定义最大的标题。<h6> 定义最小的标题。

3）通常情况下网站的标题使用h1标签，页面标题使用h2标签，其他部分根据具体情况使用h3-h6。

如：

2、段落标签

一般情况下文章中除了标题，副标题，还有一些普通的段落，把文字描述放到<p>标签（段落标签paragraph tab）中，使用段落标签展示描述性内容，浏览器会自动地在段落的前后添加空行。

<p>我是一个段落。</p>

3、无序列表标签

列表标签可以显示一组列表，此列项目使用粗体圆点（小黑圆圈）进行标记。无序列表unordered list始于 <ul> 标签，每个列表item list项始于 <li>，<li>标签一定要写在<ul>标签内部。

<ul>是<li>标签的父元素（父标签parent），反过来<li>就是<ul>的子元素（子标签children），这种写法称之为嵌套标签或者嵌套元素。注意，子标签相对于父标签还有2个或者4个空格，亦或者按下键盘上的tab键，来达到缩进的目的，便于区分父子元素。

<h2>=======无序列表=======</h2> <h3>中国一线城市有：</h3> <ul> <li>北京</li> <li>上海</li> <li>深圳</li> <li>广州</li> </ul>

提示：虽然缩进在HTML中不是必须的，但是写代码一定要注意缩进，不要让你的html代码难以阅读

4、有序列表标签

有序列表可以添加序号来明确的显示先后顺序，列表项目使用数字进行标记。有序列表ordered list始于 <ol> 标签，每个列表项依然始于 <li> 标签，<li>标签作为子元素一定要写在<ol>标签里面。

5、body标签

所有在浏览器中能看到的内容都需要放入到<body>标签中，前面介绍的所有元素中的父元素。body本身不显示什么信息，是为了让html代码更符合规范，代码规范是由w3c万维网联盟规范的。

World Wide Web Consortium万维网联盟创建于1994年，是Web技术领域最具权威和影响力的国际中立性技术标准机构。

HTML标签

6、head标签

在页面内容被浏览器显示出来之前，如果想运行某些代码的话，可以放到<head>标签里面，这些代码不会显示在浏览器当中，比如css、javascript等都可以放到<head>标签里面。

7、html标签

最后把前面所有内容都放到<html>标签里，<html>标签是<head>、<body>标签的父标签。<html>、<head>、<body>都不会在浏览器当中显示额外的内容，它们只是把代码更好的组织在一起，让浏览器能够正确的识别代码的每一部分。

8、文档类型声明

整个html文档中还有一个必要的元素叫：文档类型声明DOCTYPE，它放在所有代码的最上面，它表示html的版本信息，浏览器会根据DOCTYPE中的版本信息，决定如何来显示这个网页，如果html文档没有指定html版本，就是目前的最新版html5。

代码演示：

<!DOCTYPE html><html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>html标签</title></head> <body> <h1>h1标题</h1> <h2>h2标题</h2> <h3>h3标题</h3> <h4>h4标题</h4> <h5>h5标题</h5> <h6>h6标题</h6> <p> 我是一个段落。我是一个段落。我是一个段落。我是一个段落。我是一个段落。我是一个段落。我是一个段落。我是一个段落。我是一个段落。我是一个段落。我是一个段落。我是一个段落。我是一个段落。 </p> <h2>=======无序列表=======</h2> <h3>中国一线城市有：</h3> <ul> <li>北京</li> <li>上海</li> <li>深圳</li> <li>广州</li> </ul> <h2>=======有序列表=======</h2> <ol> <li>上海</li> <li>北京</li> <li>深圳</li> <li>广州</li> </ol></body></html>

显示效果：