HTML初学者系列

最新推荐文章于 2022-10-28 16:02:21 发布

吹笛少年

最新推荐文章于 2022-10-28 16:02:21 发布

阅读量199

点赞数

本文链接：https://blog.csdn.net/weixin_43970038/article/details/107121958

版权

HTML初学者日记

Hello，在看的各位小伙伴，欢迎阅读本原创文章，此文章适合新手入门HTML，也会总结我所遇到的一些坑，如果存在一些问题，欢迎各位帖子提出，我会尽快更新与解决。
首先，讲一讲，HTML是一门什么样的编程语言。**HTML是用于创建网页的语言。**我们通过使用HTML标记标签创建html文档来创建网页。HTML代表超文本标记语言。**HTML是一种标记语言，它具有标记标签的集合。**HTML标签是由尖括号括起来的词，标签通常成对出现，例如，一开始用DW开创一个网页文件，会有,如图
在这里插入图片描述
从上图中我们可以看见常见自带的HTML标签，<html>显示文件类型为网页，然后在<head>头部标签里含有<meta>与<title>标签，<meta>标签的属性定义了与文档相关联的名称/值对，在这里的属性charset设置了字符的编码方式，常见的编码方式有"utf-8"与"gb2312"，utf-8为可变长度字符编码,又称国际编码，通用性强。而"gb2312"为简体中文编码。网页存在中文时，一般设置为utf-8。<head>头部除了初始文件自带的标签之外，还可以在里面添加内部样式
<style type="text/css"></style>
<body></body>内为网页的内容，值得注意的是网页必须先有内容，后面再添加内部样式，就好比如你有油漆，但没有一堵墙，是没有效的。好了，新建页面元素讲述完，一下来段有趣的代码，来理解一下油漆与墙的效果。

创建一个有内容的页面：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>第一个网页文件</title>
<style type="text/css">
div{
	width: 70px;
	height:70px;
	line-height: 70px;
	margin: 0 auto;
	text-align: center;
	color:darkred;
	background-color: aquamarine;
	
}
</style>
</head>

<body>
	<div>奥利给</div>
</body>
</html>

运行后的效果：
在这里插入图片描述
小伙伴们可以试试把<body></body>内的<div>标签去掉，会发现页面什么都没有，就会认识到内容优先了。
好的，HTML初学者系列就先介绍到这。看完有帮助的小伙伴可以点波关注，之后会持续更新！