HTML结构详解
所有的浏览器默认情况下都会忽略空格和空行
每个标签都有私有属性。也都有公有属性。
html中表示长度的单位都是像素。HTML只有一种单位就是像素。
1、文档声明头
任何一个标准的HTML页面,第一行一定是一个以<!DOCTYPE ……开头的语句。
这一行,就是文档声明头,DocType Declaration,简称DTD。此标签可告知浏览器文档使用哪种 HTML 或 XHTML 规范。
2、头标签
头标签都放在头部分之间。包括:<title>、<base>、<meta>、<link>
<title>:指定整个网页的标题,在浏览器最上方显示。
<base>:为页面上的所有链接规标题栏显示的内容定默认地址或默认目标。
<meta>:提供有关页面的基本信息
<body>:用于定义HTML文档所要显示的内容,也称为主体标签。我们所写的代码必须放在此标签內。
<link>:定义文档与外部资源的关系。
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>Document</title>
</head>
<body>
</body>
</html>
<meta http-equiv="refresh" content="3;http://www.baidu.com"> 上面这个标签的意思是说,3秒之后,自动跳转到百度页面。
1)字符集 charset
charset就是charactor set(即“字符集”),浏览器就是通过meta来看网页是什么字符集的。比如你保存的时候,meta写的和声明的不匹配,那么浏览器就是乱码。
2)定义“关键词”
举例如下:
<meta name="Keywords" content="网易,邮箱,游戏,新闻,体育,娱乐,女性,亚运,论坛,短信" />
3)定义“页面描述”
meta除了可以设置字符集,还可以设置关键字和页面描述。
我们把含有meta标签的这一行代码抽象一下: <meta name="Author/Description" content=""> name即“名字”,content即“内容”。
只要设置Description页面描述,那么百度搜索结果,就能够显示这些语句,这个技术叫做SEO(search engine optimization,搜索引擎优化)
<meta name="Description" content="网易是中国领先的互联网技术公司,为用户提供免费邮箱、游戏、搜索引擎服务,开设新闻、娱乐、体育等30多个内容频道,及博客、视频、论坛等互动交流,网聚人的力量。" />
4)title标签
title也是有助于SEO搜索引擎优化的。
面试题:
问:网页的head标签里面,表示的是页面的配置,有什么配置?
答:字符集、标题、页面描述、关键词
(今后我们还能看见一些其他的配置:
IE适配<meta http-equiv="X-UA-Compatible" content="IE=edge">
视口<meta name="viewport" content="width=device-width, initial-scale=0.1">、
iPhone小图标等等)
3、<body>标签
bgcolor:设置整个网页的背景颜色。
background:设置整个网页的背景图片。
text:设置网页中的文本颜色。
leftmargin:网页的左边距。IE浏览器默认是8个像素。
topmargin:网页的上边距。rightmargin:网页的右边距。bottommargin:网页的下边距。
<body>标签link属性表示默认显示的颜色、alink属性表示鼠标点击但是还没有松开时的颜色、vlink属性表示点击完成之后显示的颜色。