【网页设计】25：HTML基础

hello world 999

已于 2023-04-18 22:18:59 修改

阅读量1k

点赞数 1

分类专栏：网页设计文章标签：前端

于 2021-03-04 00:08:08 首次发布

本文链接：https://blog.csdn.net/weixin_49167174/article/details/114341537

版权

网页设计专栏收录该内容

39 篇文章 8 订阅

订阅专栏

第25节：HTML基础

在这里插入图片描述

1.什么是HTML

（1）HTML概念

HTML（hyper text markup language）是一种超文本标记语言，由标记标签组成；
超文本：就是指页面内可以包含图片、链接甚至音乐、程序等非文字元素

在这里插入图片描述

（2）HTML基本骨架

在这里插入图片描述

1.<!DOCTYPE html>:文档类型声明统一为html声明类型，告诉浏览器这是html语言
2.<html></html>:根标签，表示整个网页
3.<meta>:单标签
    
4.UTF-8:编码格式的一种
5.<title></title>:网页的标题
6.<head></head>:网页头部，包含的都是网页的一些配置（除title标签，其他内容在浏览器上都是不可见的）
7.<body></body>:网页的主体内容，用户能够看到的内容区域

meta标签补充：

head标签内部的meta标签定义了当前的文件所使用的字库

中文字符集：

UTF-8：国际通用字库，涵盖了所有人类的语言文字（一个汉字3个字节）
GB2312/gbk：中国国标字库，涵盖了汉字和一些常用的外文、符号（一个汉字2个字节）

使用情况：

如果是制作外文网站，使用UTF-8；如果网站中含有大量中文且要求加载速度，使用gbk

2.HTML语法

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<body>
        !   叹号:提示性说明
        < > 尖括号:包含标签名
		/   反斜杠:标签的结束
            空格:分隔属性
        =   等号:给属性赋值
        “”  引号:包含值
        
	</body>
</html>

3.HTML基本标签

（1）HTML标签

标签	说明
`<h1></h1> ... <h6></h6>`	h1-h6标题标签
`<img src="" alt="">`	图片标签
`<p></p>`	段落标签
`<br/>`	强制换行标签
`<hr/>`	水平分割线标签
`<a href=""></a>`	超链接标签

（2）代码演示：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<body style="background-color:#fffae8;">
		<h2>25节代码演示</h2>
		<h3>课程内容：HTML基础</h3>
		<p>课程目录：<br/>01什么是HTML <br/>02HTML语法 <br/>03HTML基本标签</p>
        
		<img src="//bjetxgzv.cdn.bspapp.com/VKCEYUGU-dc-site/e9b208ff-1f80-4a4f-96a9-bb3e9b428f3a.png" height="250px">
		<a href="https://flatuicolors.com/palette/defo">a link</a>
		
		<!-- 知识扩展：背景颜色改变 -->
		<!-- <body style="background-color:#fffae8;"> -->
	</body>
</html>