HTML标签（上）

最新推荐文章于 2024-07-14 12:57:13 发布

GuTaiWEI

最新推荐文章于 2024-07-14 12:57:13 发布

阅读量140

点赞数 1

分类专栏：前端学习文章标签： html

本文链接：https://blog.csdn.net/qq_43826202/article/details/117873869

版权

前端学习专栏收录该内容

15 篇文章 0 订阅

订阅专栏

网页开发的相关概念：

什么是HTML?
什么是网页?

什么是HTML

1.HTML 指的是超文本标记语言 (Hyper Text Markup Language) ，它是用来描述网页的一种语言。

2.HTML 不是一种编程语言，而是一种标记语言 (markup language)。

标记语言是一套标记标签 (markup tag)。

什么是网页

1.网站是指在因特网上根据一定的规则，使用 HTML 等制作的用于展示特定内容相关的网页集合。

2.网页是网站中的一“页”，通常是 HTML 格式的文件，它要通过浏览器来阅读。

常用的浏览器

浏览器是网页显示、运行的平台。常用的浏览器有 IE、火狐（Firefox）、谷歌（Chrome）、Safari和Opera等。平时称为五大浏览器。

浏览器内核（渲染引擎）

目前国内一般浏览器都会采用 Webkit/Blink 内核，浏览器不同，它们显示页面或者排版就有些许差异。

基本结构标签

每个网页都会有一个基本的结构标签（也称为骨架标签），页面内容也是在这些基本标签上书写。

代码如下：

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
</html>

DOCTYPE

<!DOCTYPE html> 文档类型声明标签,告诉浏览器这个页面采取html5版本来显示页面.

lang 语言种类（lang="en"）

用来定义当前文档显示的语言。 en定义语言为英语 zh-CN定义语言为中文简单来说,定义为en 就是英文网页, 定义为 zh-CN 就是中文网页其实对于文档显示来说，定义成en的文档也可以显示中文，定义成zh-CN的文档也可以显示英文这个属性对浏览器和搜索引擎(百度.谷歌等)还是有作用的

字符集（charset="UTF-8"）

1.字符集 (Character set)是多个字符的集合。以便计算机能够识别和存储各种文字。

2.在<head>标签内，可以通过<meta> 标签的 charset 属性来规定 HTML 文档应该使用哪种字符编码。

3.<meta charset=" UTF-8" />

4.charset 常用的值有：GB2312 、BIG5 、GBK 和 UTF-8，其中 UTF-8 也被称为万国码，基本包含了全世界所有国家需要用到的字符.

5.注意：上面语法是必须要写的代码，否则可能引起乱码的情况。一般情况下，统一使用“UTF-8”编码，尽量统一写成标准的 "UTF-8"，不要写成 "utf8" 或 "UTF8"。

语义化标签

标题标签： <h1> - <h6>

特点：

1.加了标题的文字会变的加粗，字号也会依次变大。

2. 一个标题独占一行。

段落标签：<p> </p>

特点：

1. 文本在一个段落中会根据浏览器窗口的大小自动换行。

2. 段落和段落之间保有空隙。

换行标签：<br />

特点：

1. <br />是个单标签。

2. <br />标签只是简单地开始新的一行，跟段落不一样，段落之间会插入一些垂直的间距。

文本格式化标签

网页中，有时需要为文字设置粗体、斜体或下划线等效果，这时就需要用到 HTML 中的文本格式化标签，使文字以特殊的方式显示。

div和span标签：<div> </div> <span> </span>

特点：

1. <div> 标签用来布局，但是现在一行只能放一个<div>。

2. <span> 标签用来布局，一行上可以多个 <span>。

图片标签：<img src="图像URL" />

图像标签的属性

图像标签注意点：

1.图像标签可以拥有多个属性，必须写在标签名的后面。

2.属性之间不分先后顺序，标签名与属性、属性与属性之间均以空格分开。

3.属性采取键值对的格式，即 key=“value" 的格式，属性 =“属性值”。

链接标签

链接的语法格式：<a href="跳转目标" target="目标窗口弹出的方式"> 文本或者图片 </a>

属性：

1.href：用于指定链接目标的url地址

2.target:用于指定链接页面的打开方式_self，默认值 _blank新窗口打开

3.#：空链接

链接分类：

1.外部链接:

例如 < a href="http:// www.baidu.com "> 百度</a >

2.内部链接:网站内部页面之间的相互链接. 直接链接内部页面名称即可

例如 < a href="index.html"> 首页 </a >

3.空链接: 如果当时没有确定链接目标时，可以将url地址设置为"#"

例如 < a href="#"> 首页 </a >

4.下载链接: 如果 href 里面地址是一个文件或者压缩包，会下载这个文件

5.网页元素链接: 在网页中的各种网页元素，如文本、图像、表格、音频、视频等都可以添加超链接.

6.锚点链接: 点我们点击链接,可以快速定位到页面中的某个位置.

例如目标元素：<p id="test"> </p> 锚点超链接：<a href="#test"> </a>

特殊字符

在 HTML 页面中，一些特殊的符号很难或者不方便直接使用，此时我们就可以使用下面的字符来替代。

GuTaiWEI

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
HTML标签（上）

首先了解一下网页开发的相关概念：什么是HTML? 什么是网页? 什么是HTML1.HTML 指的是超文本标记语言 (Hyper Text Markup Language) ，它是用来描述网页的一种语言。2.HTML 不是一种编程语言，而是一种标记语言 (markup language)。标记语言是一套标记标签 (markup tag)。什么是网页1.网站是指在因特网上根据一定的规则，使用 HTML 等制作的用于展示特定内容相关的网页集合。2.网页是网站中的.
复制链接

扫一扫