请教coffee模版问题
coffe做的这个模版很漂亮,但有个小小的遗憾:
版面利用率有点底,导致用可视版不能显示全文,或者稍大点的图就不能全部显示。

css一直没有搞通,不会修改,不知用咱ftp上那个教材能不能精通css ?

请教coffee,如果想抄袭喜欢的css,该从何下手?

我选择的模版css如下,改哪个地方才能把右边的绿色改窄或消除呢?

怎样才能把logo充满屏幕的两边呢?

*{
margin: 0px;
padding: 0px;
}

body,html {
background: #39694a url(http://www.zhuoda.org/pic/showimage?col=origin&id=30320) left top repeat-x;
text-align: left;
WORD-WRAP: break-word;
color:#000000;
SCROLLBAR-FACE-COLOR: #fffbf7;
SCROLLBAR-HIGHLIGHT-COLOR: #9c9c9c;
SCROLLBAR-SHADOW-COLOR: #fffbf7;
SCROLLBAR-3DLIGHT-COLOR: #fffbf7;
SCROLLBAR-ARROW-COLOR: #5a4d42;
SCROLLBAR-TRACK-COLOR: #fffbf7;
SCROLLBAR-DARKSHADOW-COLOR: #9c9c9c

}

a { text-decoration: none; font-style:normal; }

a:link { color: #fff; font-style:bold ; text-decoration:None; }

a:visited { color: #fff; }

a:active { color: #218a21; }

a:hover { color: #000000; border-bottom:1px dotted #218a21; }

h1, h2, h3 { margin: 0px; padding: 0px; font-weight: normal; }

#container {
line-height: 140%;
margin-left: 0;
text-align: left;
padding: 0px;
width: 750px;
background-color:#cec7a5 ;
overflow: hidden; }

#logo { width:647px; }
#logo img { border: 1px solid #FFFFFF; }
#logo layer2 { position:absolute; left:550px;
top:35px; width:200px; height:22px; z-index:2; color:none;
}
#logo verson { font-color:#FFFFFF;font-size:5;font-family:Verdana }


#banner {
font-family: Georgia, 'Times New Roman', serif;
color: #fff;
background: #fff url(http://www.zhuoda.org/pic/showimage?col=origin&id=30323) top left no-repeat ;
text-align: left;
padding-top: 140px;
padding-left:80px;
margin-right:10px solid #fff;
height:205px;
}

a#banner-img {display: none; }

#banner a {color: #FFFFFF; text-decoration: none; }
#cmt a {text-decoration: none; font-style:normal}
#banner h1 {
font-size: 95%;
display: inline;
padding-right: 10px;
font-weight: bold;
}

#banner h2 {
font-size: x-small;
display: inline;
padding-left: 10px;
border-left: 5px solid #fff;
}

#banner version {position:absolute; left:550px;
top:35px; width:200px; height:22px; z-index:2;
font-color:#FFFFFF;font-size:5; }

#center { float: right;
overflow: hidden;
background: #cec7a5;
width: 540px;
border-right: 10px #fff solid;
}

.content {
padding: 30px 20px 40px 20px;
background: none;
font-family: Verdana, Arial, sans-serif;
font-size: x-small;
}

.content p {
color: #42aef7;
font-family: Verdana, Arial, sans-serif;
font-size: x-small;
font-weight: normal;
line-height: 150%;
text-align: left;
margin-bottom: 10px;
}

.content blockquote { line-height: 150%; }

.content li { line-height: 150%; }

.content h2 {
color: #ffffff;
font-family: Verdana, Arial, sans-serif;
font-size: small;
text-align: left;
font-weight: bold;
margin-bottom: 10px;
}

.content h3 {
color: #005d84;
font-family: Georgia, 'Times New Roman', serif;
font-size: medium;
text-align: left;
font-weight: bold;
margin-bottom: 10px;
}

.content p.posted {
color: #999999;
font-family: Verdana, Arial, sans-serif;
font-size: x-small;
text-align: right;
margin-bottom: 25px;
line-height: normal;
}
#right {
float: left;
width: 190px;
border-right:10px solid #fff;
border-bottom:10px solid #fff;
background-color: #84929c;
}
.sidebar {
background: none;
padding:30px 0px 40px 0px;
}

#calendar {
line-height: 140%;
color: #000000;
font-family: Arial, sans-serif;
font-size: x-small;
padding: 2px;
text-align: center;
margin-bottom: 30px;
}

#calendar table {
padding: 2px;
border-collapse: collapse;
border: 0px;
width: 100%;
}

#calendar caption {
color: #000000;
font-family: Arial, sans-serif;
font-size: small;
text-align: left;
font-weight: bold;
letter-spacing: .3em;
}

#calendar th {
text-align: center;
font-weight: normal;
}

#calendar td {
text-align: center;
}

.sidebar h2 {
height:30px;
padding-left:18px;
padding-top:3px;
margin-bottom: 0px;
color: #ffffff;
font-family: Arial, sans-serif;
font-size: 14px;
text-align: left;
font-weight: bold;
font-style:normal;
letter-spacing: .3em;
}

.sidebar ul {
padding-top: 5px;
margin-top: -9px !important ;
margin-bottom: 10px;
background: none;
}

.sidebar li {
color: #000000;
font-family: Arial, sans-serif;
font-size: 11px;
line-height: 180%;
padding-left:15px;
list-style-type: none;
}

.sidebar img { border: 0px ; }

.photo {text-align: left; margin-bottom: 20px;}

.link-note {
font-family: Arial, sans-serif;
font-size: x-small;
line-height: 150%;
text-align: left;
padding: 2px;
margin-bottom: 15px;
}

#powered {
clear:both;
padding-top:50px;
padding-right:20px;
border-top:10px solid #fff;
font-family: Arial, sans-serif;
font-size: x-small;
text-align: right;
color: #000;
line-height: 150%;
background-color:#39694a;
height: 120px;
}

#comment-data {
float: left;
width: 180px;
padding-right: 15px;
margin-right: 15px;
text-align: left;
border-right: 1px dotted #BBB;
}

textarea[id="comment-text"] { width: 80%; }

/* from cnblogs.com */

DIV.postTitle A:visited {
COLOR: #218a21; TEXT-DECORATION: none
}
DIV.postTitle A:active {
COLOR: #218a21; TEXT-DECORATION: none
}
DIV.postTitle A:link {
COLOR: #218a21; TEXT-DECORATION: none
}
DIV.post {
BORDER-RIGHT: #6e8bde 1px solid; BORDER-TOP: #6e8bde 1px solid;
BORDER-LEFT: #6e8bde 1px solid; BORDER-BOTTOM: #6e8bde 1px solid;
BACKGROUND: none
}
DIV.postTitle {
PADDING-LEFT: 33px; FONT-WEIGHT: bolder; FONT-SIZE: 13px;
PADDING-BOTTOM: 3px; PADDING-TOP: 8px;
height: 38px;
WORD-BREAK:break-all;
background: none;
color:#218a21;
}
DIV.postText {
PADDING-RIGHT: 5px;
MARGIN-TOP: 0px;
color:#000000;
PADDING-LEFT: 10px;
FONT-SIZE: 13px;
MARGIN-BOTTOM: 10px; PADDING-BOTTOM: 5px; PADDING-TOP: 1px;
WORD-BREAK:break-all;
text-indent: 2em;
background:none ;
}

DIV.postText img { border:10px solid #fff;}
DIV.postFoot {
PADDING-RIGHT: 3px; BORDER-TOP: #6e8bde 1px dashed; PADDING-LEFT: 3px;
FONT-SIZE: 7pt; PADDING-BOTTOM: 1px; PADDING-TOP: 1px;
BACKGROUND-COLOR: #ece9d8; TEXT-ALIGN: right
}
/* by hofman on 2004-11-28 */
#cmt a {text-decoration: none; font-style:normal}
#logo { width:778px; }
#logo img { border: 1px solid #FFFFFF; }
#logo layer2 { position:absolute; left:550px;
top:35px; width:200px; height:22px; z-index:2;
}
#logo verson { font-color:#FFFFFF;font-size:5;font-family:Verdana }
luotuo8895   2005-11-20 22:46:52 评论:4   阅读:880   引用:0
@2005-11-21 00:54:07  coffee
这个我没有尝试过,大概是把#logo { width:647px; }改成#logo { width:100%; },然后换一张足够宽的图片作banner,瞎猜的。
怎样才能把logo充满屏幕的两边呢 @2005-11-20 22:57:16  骆驼
俺问的问题太多了,估计这些问题得让coffee写一个关于css的小册子,哈哈。

您现在能不能再指教一招——
怎样才能把logo充满屏幕的两边呢?
解决了! @2005-11-20 22:53:13  骆驼
解决了!
谢谢coffee!俺发个大图试试!
@2005-11-20 22:49:44  coffee
大概呢,把#center元素里面的overflow属性hidden改成auto应该就行了。

发表评论>>

署名发表(评论可管理,不必输入下面的姓名)

姓名:

主题:

内容: 最少15个,最长1000个字符

验证码: (如不清楚,请刷新)

Copyright@2006 powered by YuLog