PHP学习4_HTML的主体结构

最新推荐文章于 2022-09-13 15:20:18 发布

原创最新推荐文章于 2022-09-13 15:20:18 发布 · 556 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#html #php #搜索引擎 #transition #文档 #浏览器

PHP 同时被 2 个专栏收录

4 篇文章

订阅专栏

笔记

4 篇文章

订阅专栏

本文介绍了HTML文档的基本结构，包括文档的三大部分：html标签、head头部信息和body主体内容。详细解析了各部分的作用及如何使用，特别是head部分的title、base、link和meta标签的应用。

HTML的主体结构

一、HTML文档基本格式

1. 三部分：

Code:

<html>
<head>
... ...
</head>
<body>
... ...
</body>
</html>

（1）<html>和</html>：网页文件的最外层标签，HTML所有内容在其之内

（2）<head>和</head>之间：头信息（不会显示在浏览器窗口中），包括当前页面的一些基本描述的语句，用以说明文件的标题和整个文件的一些公共属性

（3）<body>和</body>之间：HTML文件的主体

2. 头部标记

在头部标记中可以使用的标记（4个）：

（1）标题标记<title></title>

显示在浏览器的标题栏，用以说明文件的用途（有利于搜索引擎——作为搜索关键字&在搜索引擎页面中作为标题显示）

只有1个

一般是：公司名称+产品（要好好设计）

（2）基地网址标记<base>

用于设定浏览器中文件的绝对路径，之后只要加相对路径，就能形成完整路径

只有1个

Code:

<base href="http://www.lampbrother.net">
<base href="URL" target="WINDOW_NAME">

（3）设置外部文件的链接标记<link>

显示本文档和其它文档之间的链接关系

最有用的是CSS 的应用

可有多个

Code:

<link rel=stylesheet" href="style.css" type="text/css">

rel——指定什么样的链接；href——路径；type——以什么类型载进来

（4）元信息标记<meta>（头标签中最复杂的一个）

定义文件信息的名称、内容等。

可有多个

有两种形式：

Code:

<meta name="" content="">
<meta http-equiv="" content="">

a. name标记（用于在网页中加入一些网页的描述信息，如关键字、网页描述信息）的content内容：

keyword（重点）——网页的关键字（搜索引擎会通过~搜到网页）

description（重点）——网页的描述（在搜索的结果显示中显示~中的内容（当前页面的中心思想）；如果没有~，则会显示第一段文字）<字数以搜索引擎的结果放得下为准>

robots——多种值：index：允许放在搜索引擎的缓存中（若想被搜索到应设置index）

noindex：不允许放在搜索引擎的缓存中

follow：允许搜索引擎通过网页上的引擎爬到别人的网页，搜到别人

nofollow：不允许搜索引擎通过网页上的引擎爬到别人的网页，搜到别人

all：index+follow（一般都是all）

none：noindex+nofollow

author——作者

copyright——版权、版本

b. http-equiv标记（用于在HTML文档中模拟HTTP协议的相应消息头）的content内容：

Content-Type——文档类型，指定整个网页类型和使用的字符集（内容可放多个，用“；”隔开）

Code:

<meta http-equiv="Content-Type" content="text/html; charset=gbk">

text/html:文档格式；charset字符集类型

refresh——刷新时间，没多少时间刷新一次（不要太频繁，不要小于5s，），后面加链接可以赚到那里去

Code:

<meta http-equiv="refresh" content="3000;url=http://www.baidu.com">

expires——缓存时间，内容中些时间（若为0，则禁止缓存）

Code:

<meta http-equiv="expires" content="0">

Windows-Target——内容为“-top”禁止被放入小窗体

Page-Enter和Page-Exit——进入、退出页面时的效果

Code:

<meta http-equiv="Page-Enter" content="revealTrans(Transition=2,Duration=1.000)">
<meta http-equiv="Page-Exit" content="revealTrans(Transition=22,Duration=1.000)">

revealTrans中的Transition是特效的种类（一共有23种）

3. 主体标记

（1）常用属性（不用记，可以用样式控制）（只有body体自己能用）

text——设定页面文字的颜色；

bgcolor——设定页面背景的颜色

background——设定页面背景图像

link——设定页面默认的链接颜色

alink——设定鼠标正在单击时的链接颜色

vlink——设定访问后链接文字的颜色

topmargin——设定页面的上边距

leftmargin——设定页面的左边距

（2）通用属性（所有元素都可以使用）

id、name、class、style

二、DTD（文档类型定义）

加在全局文件开头（对网页效果有点影响，但不大）

Html，Public，Version，URL四部分：

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

!DOCTYPE——开头

html——告诉这是最外层标签

PUBLIC——指明所依据的DTD文档可以对任何人公开访问，而不是某公司的内部文档

- ——ISO标准开头

W3C——那个组织发布的DTD

DTD XHTML 1.0——DTD版本

Transitional//EN——字符集类型

http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd——DTD的地址，加载该DTD，按其结构显示网页