HTML页面优化
下面是页面背景图的设置
1 <html> 2 3 <frameset cols="25%,50%,25%"> 4 5 <frame src="/example/html/frame_a.html"> 6 <frame src="/example/html/frame_b.html"> 7 <frame src="/example/html/frame_c.html"> 8 9 </frameset> 10 11 </html>
下面是效果图
水平框架
1 <html> 2 3 <frameset rows="25%,50%,25%"> 4 5 <frame src="/example/html/frame_a.html"> 6 <frame src="/example/html/frame_b.html"> 7 <frame src="/example/html/frame_c.html"> 8 9 </frameset> 10 11 </html>
框架
通过使用框架，你可以在同一个浏览器窗口中显示不止一个页面。每份HTML文档称为一个框架，并且每个框架都独立于其他的框架。
使用框架的坏处：
- 开发人员必须同时跟踪更多的HTML文档
- 很难打印整张页面
- 框架结构标签（<frameset>）
-
- 框架结构标签（<frameset>）定义如何将窗口分割为框架
- 每个 frameset 定义了一系列行或列
- rows/columns 的值规定了每行或每列占据屏幕的面积
Iframe - 设置高度和宽度
height 和 width 属性用于规定 iframe 的高度和宽度。
属性值的默认单位是像素，但也可以用百分比来设定（比如 "80%"）。
实例
<iframe src="demo_iframe.htm" width="200" height="200"></iframe>
Iframe - 删除边框
frameborder 属性规定是否显示 iframe 周围的边框。
设置属性值为 "0" 就可以移除边框：
实例
<iframe src="demo_iframe.htm" frameborder="0"></iframe>
使用 iframe 作为链接的目标
iframe 可用作链接的目标（target）。
链接的 target 属性必须引用 iframe 的 name 属性：
实例
<iframe src="demo_iframe.htm"
name="iframe_a"></iframe> <p><a href="http://www.w3school.com.cn" target="iframe_a">W3School.com.cn</a></p>背景（Backgrounds）
<body> 拥有两个配置背景的标签。背景可以是颜色或者图像。
背景颜色（Bgcolor）
背景颜色属性将背景设置为某种颜色。属性值可以是十六进制数、RGB 值或颜色名。
<body
bgcolor="#000000"> <bodybgcolor="rgb(0,0,0)"> <bodybgcolor="black">以上的代码均将背景颜色设置为黑色。
背景（Background）
背景属性将背景设置为图像。属性值为图像的URL。如果图像尺寸小于浏览器窗口，那么图像将在整个浏览器窗口进行复制。
<body
background="clouds.gif"> <bodybackground="http://www.w3school.com.cn/clouds.gif">URL可以是相对地址，如第一行代码。也可以使绝对地址，如第二行代码。
提示：如果你打算使用背景图片，你需要紧记一下几点：
- 背景图像是否增加了页面的加载时间。小贴士：图像文件不应超过 10k。
- 背景图像是否与页面中的其他图象搭配良好。
- 背景图像是否与页面中的文字颜色搭配良好。
- 图像在页面中平铺后，看上去还可以吗？
- 对文字的注意力被背景图像喧宾夺主了吗？
基本的注意事项 - 有用的提示：
<body> 标签中的背景颜色（bgcolor）、背景（background）和文本（text）属性在最新的 HTML 标准（HTML4 和 XHTML）中已被废弃。W3C 在他们的推荐标准中已删除这些属性。
应该使用层叠样式表（CSS）来定义 HTML 元素的布局和显示属性。