网页是如何诞生的
一、创建一个网页
创建一个网页在html中是一个再简单不过的事情了
html是超文本标记语言，其中html最基本的标签为：
注：<!-- -->是html语言的注释，类似/**/
我们使用<html>标签就可以产生一个网页
<!doctype html><!--这个头表示本页面使用的是H5标准-->
<html><!--html标签是页面标签，表示一个页面-->
<head><!--网页头标签，一些网页的设置或者是css的内联样式就写在这里-->
</head>
<body><!--网页主体，网页的内容都写在这里-->
</body>
</html>
<!--如果不能理解，接下来举个例子，一个网页就相当于一个人，<html>标签就相当于人，<head>标签相当于人的大脑，关于人的基本信息都在脑子里，<body>标签则相当于人的肚子，东西都在肚子里-->
二、对创建的网页进行一些基本的设置
网页诞生后我们可不能不管它，毕竟它是我们亲手创造的，这时候网页是什么属性，有哪些设置，都需要由我们来设定
<!doctype html>
<html lang="zh-CN"><!--这个设置的意思就是本网页的语言为简体中文，即提供给会中文的人看的网页-->
<head>
<meta charset="UTF-8"><!--设置该页面的编码字符集为UTF-8-->
<meta name="description" content="这是描述本网页的一句话"><!--对网页进行描述的一句话-->
<meta nmae="keywords" content="关键词 搜索 demo"><!--搜索引擎会根据这里的关键词来检索网页-->
<!--还有很重要的网页标题标签-->
<title>我是网页的标题</title>
<head>
对网页的设置除了以上的基本设定还有一个很重要的标签，就是<style>标签，<style>标签是一个双标签<style></style>在，在中间我们写css的代码，这就是网页的另一个重要部分，html是创建网页并且进行设置的，css是用来美化网页，改变各种各样样式的。
三、给页面添加上我们想要添加的内容
在给网页设置了那么多东西后，它就不再是一张白纸了，但是它有什么内容，
传递什么信息，也需要我们来添加。
在添加之前，我们得先来了解一些网页中常用的标签
1.div标签
div标签就是一个盒子，同时是一个块级元素（独占一行，另起一行），它里面可以装很多的其他的标签
div标签的默认样式是{display: block}表示这是块级元素标签
2.p标签
p标签是段落标签，通常用来表示一大段文字，p标签也是块级元素标签。
p标签的默认样式也是{display: block}
3.a标签
a标签是超链接标签，这是一个很常用的标签，在生活中我们点开网页总是会点到一些奇奇怪怪的链接，这些链接都是a标签干的好事
a标签是行级元素标签，默认样式为
在学习了这三个标签后，我们可以来写一些例子尝试了
如下图，我们新建一个html后缀的文件，然后用记事本打开，在里面写上如下代码：
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="description" content="这是描述本网页的一句话">
<meta nmae="keywords" content="关键词 搜索 demo">
<title>我是网页的标题</title>
</head>
<body>
<div>
<p>我是这个网页的第一个文本</p>
</div>
</body>
</html>
我们会发现在图中，这行文字并不是完全在浏览器的左上角，而是有一些间隙，这是为什么呢，让我们打开浏览器的检查工具查看这行文本的样式
第一行是p的默认样式我们已经讲过了，但是这后面四个样式值是哪儿来的呢？？？
原来这是p的默认margin，p标签含有默认的margin-top和margin-bottom,大小都为1em,即当前标签的字体大小（默认为16px)。p标签有这些默认的样式，其他标签也会有，这样往往会让我们得不到自己想要的效果，所以我们在<style></style>标签中写下这样的代码
<style>
* {
marigin: 0;
padding: 0;
}
</style>
这行代码的作用就是清除当前页面所有标签的默认margin（外边距）和padding（内边距），*被称为通配符选择器，它可以匹配页面中所有的标签。
2021/4/14总结
版权声明：本文为weixin_46497661原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接和本声明。