在做dedecms5.6的時(shí)候,,經(jīng)常會(huì)遇到很多問題,對(duì)于我們建站菜鳥來說,,修改個(gè)把簡單的html頁面,,勉強(qiáng)還能應(yīng)付,但一旦涉及 到CSS,JS,PHP的就立馬兩眼摸黑,昏頭轉(zhuǎn)向了,,下面是在建站過程中,,看到了一些比較好的CSS介紹,挺實(shí)用的,,就轉(zhuǎn)載過來與大家分享了,。
在dedecms.css找到.header .nav這里是航欄的長適度或背
.header .nav{
width:100%; 導(dǎo)航欄的寬度,默認(rèn)是自適應(yīng),,全屏大小,。改為960px即可實(shí)現(xiàn)與body部分相同寬度。
height:32px;
background:url(../images/nav-bg.gif) repeat-x;這里是修改導(dǎo)航欄北景,,可以用背景圖片也可以直接用純色,。
clear:both;
overflow:hidden;
}
修改下面的搜索和熱門標(biāo)簽與導(dǎo)航欄的寬度修改類似,只不過是在dedecms.css修改.header .search
導(dǎo)航欄目間距的修改方法
header .nav ul li a{ height:32px; padding:0px 16px 0px 17px; display:block; color:#FFF; float:left;
其中 padding:0px(top) 16px (right) 0px (bottom) 17px (left),,
很簡單 縮小right和left的數(shù)值即可減小各個(gè)欄目之間的距離
修改首頁字體顏色,,欄目樣式
dedecms.css里面
a {color:#666666;text-decoration:none;}控制本月熱點(diǎn).推薦內(nèi)容.圖文資訊還有網(wǎng)站最底部帶超鏈接的字的顏色。
header a {color:#666666;}控制熱門標(biāo)簽的顏色,。
footer .copyright {color:#666666;}網(wǎng)站底部非超鏈接字的顏色,。
在:layout.css里面
f5 li a {color:#******;float:left;}控制友情鏈接字的顏色。
page.css里面
index .bignews a {color:#000000;}控制首頁頭條和頭條下面的字顏色,。<不包括頭條簡介>
index .bignews .onenews p {line-height:19px;color:#000000;}頭條簡介字的顏色,。
index .latestnews ul a {color:#000000;}最近更新字的顏色。
index .listbox ul a {color:#000000;}這個(gè)是自己添加的欄目文章標(biāo)題字的顏色,。
index .usercenter .tbox dd#loading{
display:block;
text-align:center;
line-height:200px;
letter-spacing:2px;
color:#******;}首頁評(píng)論字的顏色
修改幻燈片的大小可以通過修改首頁模板和page.CSS來實(shí)現(xiàn),,修改幻燈片要影響到其它部分顯示
<script language=\’javascript\’>
linkarr = new Array();
picarr = new Array();
textarr = new Array();
var swf_width=320; 幻燈片的寬
var swf_height=450; 幻燈片的的高
在page.CSS中找到以下部分
.index .flashnews{
width:幻燈片的寬寫上模板中的相應(yīng)數(shù)值即可
height:幻燈片的的高寫上模板中的相應(yīng)數(shù)值即可
overflow:hidden;
float:left;
}
圖文資訊圖片大小的修改方法
找到layout.css文件,搜索 e1 li a img{ 把下面的數(shù)值改成你想要的即可.
.header .nav ul li a{
height:32px;
padding:0px 13px 0px 14px;
display:block;
color:#FFF; font-size:13px;
font-weight:bold;
float:left;
}
給網(wǎng)站加上背景,這里說的是用純色,,用背景圖片當(dāng)然也可以,。
打開dedecms.css把原來的代碼:
html{
background:#FFF;
}
body{
font:12px Verdana,Arial,Tahoma;
}
更改為:
html{
text-align: center;
background: #669900;
}
body{
font:12px Verdana,Arial,Tahoma;
width: 970px;
text-align: left;
margin: 0 auto;
background: #fff;
}
此法設(shè)置背景,當(dāng)網(wǎng)頁窗口大小變化時(shí)會(huì)出生錯(cuò)位,,用CSS中position:relative;可以搞定如
.header .search{
width:960px;
position:relative;
}