网页页面布局
1.用表格组织排列网页
表格标签:<table></table>
行标签:<tr></tr>
表格标题标签:<th></th>
列标签:<td></td>
<table border="1">
<tr> <th>Month</th> <th>Savings</th> </tr> <tr> <td>January</td> <td>$100</td> </tr></table>
另外表格还可以嵌套。
frame属性:frame 属性规定外侧边框的哪个部分是可见的
void 不显示外侧边框。
above 显示上部的外侧边框。
below 显示下部的外侧边框。
hsides 显示上部和下部的外侧边框。
vsides 显示左边和右边的外侧边框。
lhs 显示左边的外侧边框。
rhs 显示右边的外侧边框。
box 在所有四个边上显示外侧边框。
border 在所有四个边上显示外侧边框。
参考:http://www.w3school.com.cn/tags/tag_table.asp
2.css(Cascading Style Sheets级联样式表)格式化页面
样式结构由css根据层次结构决定,从而实现级联效果;可将CSS级联机制看成一种继承的关系父亲的特征传递给子女,但子女有会更特殊的特征,即基样式规则覆盖整个样式表,但可被更具体的样式规则覆盖。
2.1应用样式的三种方法
外部样式表:将一组css样式规则保存为一个独立的.css文件,在每个页面的开头(<head>内)用<link/>指定该文件;如
<head>
<link rel="stylesheet" type="text/css" href="[css文件路径]" />
</head>
.css
body{
font-size:12pt;
……
}
内部样式表:通过<style>标签将一组css规则放在页面中,这些样式规则只对其所在的页面有效;如
<style type="text/css">
div{
margin-left=10px;
margin-right=10px;
}
内联样式表:通过style属性直接将一个或多个css属性放在标签内;如
<table style="width:100px; height:100px">
2.2样式类
定义的特殊格式文本称为样式类,如
h1.silly{font:36pt;}
<h1 class="silly"></h1>
2.3css修改链接外观
Link:尚未访问
Hover:鼠标指向
Active:被激活
Visited:访问
每种链接状态对应一种css伪类,伪类是应用于元素元素状态的一种特殊样式类。
a:Link{font-weight:Bold;…}
2.4堆叠顺序
z-index样式属性,值较大的元素叠在值元素较小的上面。
2.5id和class的区别
理论上是说id是针对具体的一个标签,一个页面中唯一,而class是一类,可以多个,不过我实际中试过用id定义多个如<a id="a"><a id="a">也是正常的。
3.框架frame
标签<frame></frame>
frameset 元素可定义一个框架集。它被用来组织多个窗口(框架)。每个框架存有独立的文档。在其最简单的应用中,frameset 元素仅仅会规定在框架集中存在多少列或多少行。您必须使用 cols 或 rows 属性。如:
<html>
<frameset cols="25%,50%,25%">
<frame src="frame_a.htm" />
<frame src="frame_b.htm" />
<frame src="frame_c.htm" />
</frameset>
</html>
重要事项:您不能与 <frameset></frameset> 标签一起使用 <body></body> 标签。不过,如果您需要为不支持框架的浏览器添加一个 <noframes> 标签,请务必将此标签放置在 <body></body> 标签中!