css常用布局样式
1.一行三列
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="gb2312">
<head><title>css布局:一行三列</title>
<link rel="stylesheet" href="css/03_3columnplustopbox.css" mce_href="css/03_3columnplustopbox.css" type="text/css" media="all" />
<meta http-equiv="content-type" content="text/html; charset=gb2312" />
<meta name="robots" content="all" />
<meta name="author" content="Owen Briggs:www.w3cn.org" />
</head><body>
<div id="top">
<p>top</p>
</div>
<div id="left">
<p>left</p>
</div>
<div id="middle">
<pre>
#top {
margin: 20px 20px 0px 20px;
padding: 10px;
border: 5px solid #666;
background: #FFF;
height: 100px; /* ie5win fudge begins */
voice-family: "\"}\"";
voice-family:inherit;
height: 70px;
}
html>body #top {
height: 70px; /* ie5win fudge ends */
}
#left {
position: absolute;
top: 120px;
left: 0px;
margin: 20px;
padding: 10px;
border: 5px solid #666;
background: #FFF;
width: 150px; /* ie5win fudge begins */
voice-family: "\"}\"";
voice-family:inherit;
width: 120px;
}
html>body #left {
width: 120px; /* ie5win fudge ends */
}
#middle {
margin: 20px 190px 20px 190px;
padding: 10px;
border: 5px solid #666;
background: #FFF;
}
#right {
position: absolute;
top: 120px;
right: 0px; /* Opera5.02 will show a space
at right when there is no scroll bar */
margin: 20px;
padding: 10px;
border: 5px solid #666;
background: #FFF;
width: 150px; /* ie5win fudge begins */
voice-family: "\"}\"";
voice-family:inherit;
width: 120px;
}
html>body #right {
width: 120px; /* ie5win fudge ends */
}
</pre>
<div align="right"><p><a href="css/03_3columnplustopbox.css" mce_h
相关文档:
盒子标签和属性对照
CSS语法(不区分大小写)
JavaScript语法(区分大小写)
border
border
border-bottom
borderBottom
border-bottom-color
borderBottomColor
border-bottom-style
borderBottomStyle
border-bottom-width
borderBottomWidth
border-color
borderColor
border-left
borderLeft
border ......
.
Transparent
{
width
: 16px
;
height
: 42px
;
background
: transparent
url(images/transparent.png)
no-repeat
;
}
*
html
.
Transparent
{
&nbs ......
+++ 每搞IT的人都知道B/S系统的DIV+CSS结构,知道它的好。但如果你问,DIV+CSS结构是什么?好在哪里?实际项目应该如何体现或实现?每个人都能和你白伙几句,有些人甚至会滔滔不绝,而往往这些滔滔不绝的人也只是听另一些滔滔不绝的人说的,仅仅是“接收”并“接受”了信息,That is all,就像一张磁盘� ......
1. document.formName.item("itemName") 问题
说明:IE下,可以使用document.formName.item("itemName")或document.formName.elements["elementName"];
Firefox下,只能使用document.formName.elements["elementName"].
解决方法:统一使用document.formName.elements["elementName"].
2.集合类对象问题
说明:IE下,可 ......
在Web标准中的页面布局是使用Div配合CSS来实现的。这其中最常用到的就是使整个页面水平居中的效果,这是在页面布局中基本,也是最应该首先掌握的知识。不过,还是经常会有人问到这个问题,在这里我简单总结一下使用Div和CSS实现页面水平居中的方法:
一、margin:auto 0 与 text-aligh:center
在现代浏览器(� ......