Ich habe die Forum-Homepage in Kopfbereich, Informationsbereich, Inhaltsbereich und Fußbereich unterteilt. Verwenden Sie zunächst ein großes Div, um diese einzuschließen, vor allem, weil es praktisch ist, die gesamte Seite anzupassen. Wenn Sie sie beispielsweise auf einen breiten Bildschirm oder einen schmalen Bildschirm anpassen möchten, müssen Sie nur dieses große Div festlegen.
/* CSS-Dokument */
body{
background-color:#F5F5F5;
margin:0;
font-family : „Lucida Grande“, Verdana, Lucida, Arial, Helvetica , ,sans -serif;
font-size:12px
.pagehoder{
width:100%;
background-color:#2662DF;
border-right:2px solid #7197D7;
border-top:2px solid #7197D7;
background -color: #B1C3D9;
}
.logo{
background:url(../images/logo.png ) no-repeat;
width:200px
height :60px;
float:left;
.img{
background:url(../images/images1. jpg) repeat-x ;
height:60px
}
.navigate {
padding-left:20px;
background-color:#F3F8FE;
height:10px;}
.navigate li{
float:left ;
}
.navigate li a{
margin-left:2px;
padding-bottom:3px; 🎜>display:block;
text-decoration:none;
height:10px;
background- color:#ececec;}
.navigate li a :hover{
color:#ffffff;
background-color:#bbbbbb;}
.notice{
background-color:#ffffff; }
.content{
background-color:#0000FF;
height:400px
}
.contentHead {
text-align:center; :5px;
padding-bottom:0px;
background-color:#71A3CC;
width:60%; float:left;
background-color:#71A3CC; 🎜>}
.f3{
width:12%;
background-color:#71A3CC;
.f4{
width:15 %;
Hintergrundfarbe:#71A3CC;}
.typeHolder{
width:100%;
Hintergrundfarbe:#D9DBE4; .type{
width:60%;
float:left;}
.boardHolder{
text-align :center;
background- color:#FFFFFF;
.boardName{
width:60%;
float:left;
.subject{
width:12%; >float:left;
background-color:#F7F7F8;
}
.last{
width:15%;
background-color:#F7F7F8;
}
.msg{
background-color:#FAFAFA; >height:60px;
.footer{
background-color:#99CC33;
text-align:center; >.
html:
Code kopieren
Code wie folgt:
<머리>
sclBBS首页 <본문>
最高在线人数 2,712 人 [ 记录时间 :: 2007-08-13 16:12:34 ]
