[HTML]网页的整体设置_html如何设置网址-优快云博客

本文介绍了HTML网页的整体设置，包括定义网页标题、设置基底网址、使用元信息标签以及与CSS和JavaScript的结合。重点讲解了元信息标签如keywords、description、author、generator、robots等的用途，以及http-equiv属性中的content-type、refresh、expires、cache-control和set-cookie。此外，还提到了如何通过link和script标签引入CSS和JavaScript，并展示了头部信息的一些常见设置。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、定义网页的标题

<html>
<head>
 <title>我的第一个标题—网页标题信息设置</title>
</head>
<body>
</body>
</html>

2、设置网页的基底网址

基底网址的实质就是同意设置超级链接的属性，基底网址标签是，它有两个属性：href和target。href用于设置基底网址的路径，target用于设置超级链接的打开方式。

通过基底网址的添加，页面中所有的相对网站根目录地址可转换成绝对地址，当浏览器浏览页面时，通过标记将相对网站根目录地址附加在基底网址路径的后面，从而转化成绝对地址。

<html>
<head>
 <title>基底网址的设置</title>
 <base href="http://www.google.com" _target="_blank"/>
</head>
<body>
</body>
</html>

3、掌握强大的元信息标签

元信息标签是头部信息的基本标签，专业的网页代码中都对元信息标签作了详细设置。元信息标签为，也是单标签。 meta元素提高的信息对于浏览用户是不可见的，一般用于定义页面信息的名称，关键字，作者等。在HTML标签中，一个meta标签就是一个meta内容，而在一个HTML头页面中，可以有多个meta元素。

meta标签属性分为两种：页面描述信息（name）和http标题信息（http-equiv）。 name属性主要用于描述网页内容，正确的设置name属性，可以便于搜索引擎（google、baidu）的搜神记机器人查找、分类，搜索引擎一般都会查找meta值来给网页分类。

name的取值如下：

（1）keywords，中文：“关键字”，用于说明网页包含的关键字等信息，从而提高被搜索引擎搜索的概率。编写格式为

<meta name="Keywords" content="关键字" />
//content属性值为用户设置的具体关键字。

（2）description。中文意思：“描述”，用于描述网页的主要内容、主题等，合理的设置也可以提高被搜索引擎搜索到的概率。编写格式为：

<meta name="description" content="对页面的描述"/>
//content属性的值可以最多容纳1024个字符，但搜索引擎一般只显示大约前175个字符，故应短小精悍为好。

（3）author，中文意思：“作者”，用于设置网站作者的名称，在比较专业的网站页面上经常用到，编写格式为：

<meta name="author" content="作者名称" />

（4）generator，中文意思为“生成器”，用于设置网站编辑工具的名称，在比较专业的网站页面上经常用到，编写格式为：

<meta name="generator" content="网站编辑工具名称" />

（5）robots，中文意思为“机器人”，用于限制页面的搜索方式，搜索引擎的“搜索机器人”沿着网页上的链接（如http和src链接），不断的检索资料建立自己的数据库，通过这种meta标签可以限制部分内容不被搜索引擎检索到，从而降低部分信息的公开性，编写格式为：

<meta name="robots" content="指令组合" />
//包含四个命令，分别是index,noindex,follow,nofollow.

index,follow 页面允许被检索，页面中的链接也允许被检索。//可以写成all
index,nofollow 页面允许被检索，页面中的链接不允许被检索。
noindex,follow 页面不允许被检索，页面中的链接也允许被检索。
noindex,nofollow 页面不允许被检索，页面中的链接也不允许被检索。//可以写成none

name属性主要用于对搜索引擎的优化！读者必须掌握

只有部分搜索引擎支持robots meta 标签，如著名的Google，而google还增加了一个指令"archive"，可以限制google是否保留网页快照，例如<META NAME="googlebot" CONTENT="index,follow,noarchive>，archive代表保留网页快照，noarchive代表不保留网页快照

再来看看http标签信息属性，即http-equiv属性，其取值如下：（1）content-type,中文信息为“内容类别”，用于设置页面的类别和语言字符集，编写格式为：

 <meta http-equiv="content-type" content="test/html; charset=gb2312" />
//字符集也常用utf-8

（2）refresh,中文意思即为“刷新”，用于设置多长时间网页自己刷新一遍，或者过多长时间自动跳转到其他页面，编写格式为：

<meta http-equiv="refresh" content="30" />//代表页面自动刷新间隔为30秒
<meta http-equiv="refresh" content="30;url=www.google.com" />//代表页面页面30秒后跳转到www.google.com

（3）expires,中文意思为“到期”，用于设置页面到期时间，一旦网页过期，必须到服务器上重新调用网页，编写格式为：

<meta http-equiv="expires" content="Wed, 10 Mar 2007 12:00:00 GMT" />//必须使用GMT时间格式

另一编写格式为：

 <meta http-equiv="expires" content="0">//content值表示还有多少时间过期。

（4）cache-control，中文意思为“缓存控制”，用于禁止在缓存中调用网页，

 <meta http-equiv="cache-control" content="no-cache"/>//表示不缓存

（5）set-cookie,中文意思为“设置cookie”，用于设置本页面cookie多久过期，编写格式为：

<meta http-equiv="set-cookie" content="Wed, 10 Mar 2007 12:00:00 GMT"/>//代表到这个时间，cookie将会被删除。

cookie广泛用于登陆注册系统，同时，浏览者的cookie也常被网站运营者收集，以便分析浏览者的浏览习惯

4、怎样和CSS及JavaScript产生联系

CSS负责HTML网页的样式，JavaScript负责HTML网页的动态行为，这些技术与HTML网页是融合在一起使用的。

（1）CSS只需在头部信息中加入标签对。

<html>
<head>
 <title>CSS的设置</title>
 <style type="text/css">
    CSS具体内容
 </style>
</head>
<body>
</body>
</html>

（2）加入JavaScript只需在头部信息加入标签对。

<html>
<head>
 <title>CSS的设置</title>
 <style type="text/css">
    CSS具体内容
 </style>
 <script type="text/javascript">
    JavaScript具体内容
 </script>  
</head>
<body>
</body>
</html>

5、头部信息的常用设置

（1）页面切换特性，其中一种特效的编写格式如下:

<meta http-equiv="page-enter" content="blendtrans(duration=0.5)"/>

http-equiv属性值为page-enter时代表进去该页面时启动特效，http-equiv属性值为page-exit代表退出时该页面启用特效
content属性的值就代表特效的种类，也叫动态滤镜，滤镜种类有很多，blendtrans效果为淡入淡出，duration代表效果持续的时间（秒）。

（2）强制当前页面在当前窗口以独立页面显示，以防止网页被其他网站框架。编写格式如下：

<meta http-equiv="window-target" content="_top"/>

（3）页面图标设置，编写格式如下：

<link rel="Shortcut Icon" href="/favicon.ico">
//href属性值为ico图标文件的路径，采用相对根目录路径。