目录
1 本节概要
2 head下的常见标签
2.1 网页编码设置
2.2 网页的标题
2.3 样式标签
3 head标签的内容不会显示到网页上
4 查看网页源代码
1 本节概要
上一节,我们说了HTML网页最基本的框架标签,说到标签分为head头部和body身体部分。这一小节呢,我们说一下head这个大标签下,一般都会包含哪些内容。
由于现在是入门可成,所以不会说太多复杂的,到后面慢慢的,我们都会说到。
2 head下的常见标签
2.1 网页编码设置
网页编码如果不正确,展示出来的就会是乱码,现在最常用最流行的,也就是utf-8编码。可以这样写:
<!DOCTYPE html>
<html><head><meta charset="utf-8"></head><body></body>
</html>
你看,这个meta标签,里面有 charset 属性,对应着属性值是 utf-8。就表示咱们这个网页要设置为 utf-8 编码的。
2.2 网页的标题
你看,一般网页都是有标题的,表示这个网页的主旨内容。现在我们还没有设置,所以他用浏览器打开后,长这样:
所以,我们可以添加代码设置,代码如下:
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>我的第一个网页</title></head><body></body>
</html>
再刷新一下网页,我们就可以看到最新设置的标题了。如下图:
2.3 样式标签
后面我们会学到给网页添加样式,也就是CSS的内容。这里我们先学一种标签 也就是 style 标签
这个style标签下面,会放CSS样式内容,可以控制网页中的一些元素,让他们更好看一些。
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>我的第一个网页</title><style type="text/css"></style></head><body></body>
</html>
要记住,我们给 style 标签添加了 type 的属性,属性值是 text/css。这是固定写法,记下来就可以了。
其实还可以引入外部的CSS样式表,用来影响当前网页的元素内容,这个我们后面说,先记住这个标签就可以了。
3 head标签的内容不会显示到网页上
我们虽然写了这么多标签,但都是在head标签里面的,这些head下面的内容,是不会显示在网页区域的。
比如我们在刚才的style标签下面,写几个文字,包括刚才加的 title 标签,都不会显示出来。
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>我的第一个网页</title><style type="text/css">是否有内容呢?</style></head><body></body>
</html>
然后看一下自己的网页,刷新一下网页看一下效果:
对吧,并没有内容。
4 查看网页源代码
那么我么写了那么多代码,从浏览器可以看到吗?是可以看到的,但是浏览器里只能看,不能改,如果要改动代码,还是得回到我们的编辑器里。
在浏览器右键,然后有“查看网页源代码”的按钮,点击这个按钮,就会弹出一个新的网页标签,就可以看到了。