html笔记

最新推荐文章于 2024-10-14 16:05:05 发布

lvyuhu000

最新推荐文章于 2024-10-14 16:05:05 发布

阅读量414

点赞数

文章标签： html

本文链接：https://blog.csdn.net/lvyuhu000/article/details/104680052

版权

本文详细介绍了HTML的基本概念、文档结构、常用标签、超链接、表格、表单、内嵌框架以及HTML5的发展、特点和新增内容。重点讲述了HTML5中的语义化标签、表单元素、多媒体标签的使用，帮助读者全面理解HTML及HTML5的精髓。

摘要由CSDN通过智能技术生成

一、 HTML简介

1.HTML是什么？

HTML: HYper Text language超文本标记（标签）语言有多种标签组成，用来制作网页，告浏览器该如何显示页面

2.HTML语言作用？

制作网页，控制网页、内容的显示
插入图片、音乐、视频、动画等多媒体
通过链接检索信息
使用表单获取用户信息，实现交互

3.版本

W3C：world wide wed consortium万维网联盟，制定WEB技术相关表尊和规范的组织，HTML就是由W3C制定的标准

常用的两个版本：HTML4.0和HTML5.0

官网：https://www.w3school.com.cn/

4.HTML后缀名----拓展名

HTML文件的拓展名是以.html或.htm来结尾

二、HTML文档结构

1.基本结构

1.1简介

HTML标签是由尖括号括起来的关键词，如html,通常都是成对出现的，如<html></html>
以<html>为根标签，包含：<head>头部和<body>主体部分
头部提供关于网页的相关信息，如标题、字符编码、文档类型、关键词等摘要信息
主体部分提供网页的具体内容，真正显示在页面中
合理的进行缩进
标签名不区分大小写，但一般习惯用小写

1.2开发工具

记事本notepad、sublime、notepad++、Dreamweaver、VScode、Webstorm等

使用步骤：

1.新建文件（ctrl+N),然后保存（ctrl+S)，指定扩展名为.hmtl （代码无颜色提示）

2.编写HTML文件

3.在浏览器中打开文件

使用技巧：

先保存在编写代码，否则没有颜色提示
建议创建一个文件夹，用与保存所有的网页内容，将文件夹拖拽到sublime中打开，便于管理
显示/隐藏侧边栏

方式1：查看–>侧边栏–>显示/隐藏侧边栏

方式2：ctrl+K再按B
显示多栏

方式1：查看–>布局–>列数，2列

方式2：alt+shift+2

1.3：浏览器

常见浏览器：IE浏览器、Chrome谷歌（IT）工作者常用、firefox火狐、safari（苹果电脑浏览器）

浏览器的作用就是来读取html文件，并以网页的形式进行显示

浏览器不会直接显示html标签，而是使用标签来解释网页的内容

2.标签

2.1标签的组成

一个完整的html标签的组成：

<标签名属性名=“属性值”>内容</标签名>

属性值要用引导引起来，一般用双引号

2.2标签的分类

根据标签是否关闭，分为：关闭型、非关闭型

关闭性标签：又开始标签也有结束标签，即标签成对出现

<title></title>
<body></body>
<h1><h1>

<html>
 	<head>
 		<title>标签的组成</title>
 		<meta charset = "utf-8"> 
 	</head>
	<body bgcolor="red" text="blue">
		标签的组成
		<h1>主讲</h1>
	</body>	
</html>

非关闭型标签：只有开始标签，没有结束标签
```
<meat>
<br>
<hr>
```
根据标签中的内容是否独占一行，分为：行级标签、块标签
块级标签：块级标签包起来的内容，独占一行

<h1></h1>

<hr>

行级标签：在行内显示，可以与其他内容在一行显示

<span></span>
在这里插入图片描述

2.3注释

注释才浏览器中式不会显示的，是用来标注解释html语句:

!<--注释内容-->

2.4实体字符

也称为特殊字符，用于显示一些特殊符号，如:<>&空格等

语法：

实体字符的名称；

常见的实体字符：

1   &lt；        <   小于号   less than
2   &gt；        <   大于号   greate than
3   &nbsp;           空格          space    在html中对于连续的空白字符（包括空格、换行、TAB等），在浏览器中显示为1个空格
4   &amp；       &   与
5   &quot；       "   双引号
6   &copy；      ©   版权符号  copyright
7   &reg；       ®   注册符号  register
8   &times；     X   关闭按钮

2.4实体字符

在这里插入图片描述

2.5文档类型

在html文档的第一行，使用声明HTML文档的类型用来告诉浏览器页面的文档类型，简单来讲，用来指定html版本的规范目前基本上最常用的html5，

三、常用标签

1.基本标签

标签	含义	说明
br	换行标签	非关闭类型
p	段落标签	关闭型，块级标签，前后有明显间隔
h1 h2、h6	标题标签	按照h1到h6逐渐的变小，仍然属于块级标签加粗显示
pre	预格式化标签	保留编码时的格式
div	分区标签	常作为容器来使用，一般用来去做页面布局，块级标签
span	范围标签	默认情况下没有效果，一般用来设置行内的特殊格式，这是一个行级标签
ol、li	有序列表	有顺序的项目列表
ul、li	无序列表	无顺序的项目列表
dl、dt、dd	定义列表	对属于、图片等进行描述定义的列表
hr	水平线标签	非关闭性标签，块级标签
img	图像标签	非关闭型标签，行级标签