分类: 博客万事通 |
一:页面宽度
<STYLE type=text/css>
.bodyTop{width:900px;}
.bodyBg{width:900px;}
.bodyBottom{width:900px;}
.feeds .text{width:640px;}
.label{width:240px;}
.photo{width:240px;}
.callboard{width:240px;}
.links{width:240px;}
.calendar{width:240px;}
.sysBr180{width:240px;}
</STYLE>
这个就是修改新浪博客页面宽度的代码了,先来看看它们的意思。
.bodyTop 指的是页面顶部的宽度,控制了 banner(就是题图)的宽度
.bodyBg 指的是整个页面的宽度,其值最好与上者相同(也可以自行变化)
.bodyBottom 指的是页面底部的宽度,其值最好是与上面相同
.feeds .text 指的是正文部分的宽度(也就是文章部分的宽度)
.label 指的是面板的宽度(其值加正文宽度的值应略小于整页的宽度)
.photo 指的是形象照片面板的宽度(同上)
.callboard 指的是公告栏的宽度(同上)
.links 面板(也即最新留言、最新评论等面板)宽度(同上)
.calendar 日历的宽度(同上)
.sysBr180 这个值比较特殊,其值同以上各面板宽度近似,但不一定相同大家应当根据自己设置的宽度进行调节。
width 后面的数字就是你要修改的宽度值,可根据自己的需要设置。
二:标题的美化
新浪博客的标题实在是难看,这是人所共知的事情.以下是美化标题代码,请看:1、
<STYLE type=text/css>
.banner .title td{font-size:32px;}
.banner .title td{FILTER: glow(color=#000000,direction=2);}
.banner .title td{color:#ffff66;}
.banner table{background:#transparent;
filter:alpha(opacity=80);
border:0px solid #000;}
</STYLE>
这里讲解一下,首先是代码的第三行:
.banner .title td{FILTER: glow(color=#000000,direction=2);}
处,filter后面的代码(glow)是发光字效果,大家可以自行查找一下其他的文字滤镜参数。
后面的color可以换上其他的颜色,这是文字的发光效果的颜色,direction是发光效果的强弱,自行设置到合适即可。
文字本身的大小和颜色请参考代码
.banner .title td{font-size:32px;}(数字控制大小)
.banner .title td{color:#ffff66;} (文字颜色)
还有最后一行代码
.banner table{background:#transparent; filter:alpha(opacity=80); border:0px solid #000;}
其含义是文字及其外框的设置,可修改background后面的值为颜色代码,即可实现标题外框的颜色改变,opacity=80是表示文字的透明度,值越小越透明。border:0px表示外框线的粗细,设为0即表示不要外框。
不过,这还只是对标题的简单修饰,我们还可以调节标题文字的位置,代码如下:
<STYLE type=text/css>
.banner .title{
margin-left:300px;
margin-top:60px;
font-weight:bold;
}
.banner .link {
MARGIN-TOP: 0px;
MARGIN-LEFT: 290px
}
</STYLE>
.banner .title 修改的是标题的位置,left和top分别指的是标题距页面左边和顶部的距离,可自行调节
.banner .link 指的是下面的“复制<收藏”处的位置,调节方法同上
<DIV><A href="http://blog.sina.com.cn/u/1463790452" target=_blank><FONT color=#ffffff>jiang.rl</FONT></A></DIV>
<DIV>
<STYLE type=text/css>
.banner .title td{font-size:30px;}
.banner .title td{FILTER: shadow
.banner .title td{color:#e4dc9b;}
.banner table{background:0;transparent;
</STYLE>
</DIV>
.banner .title td{FILTER: shadow(color=black);}
处,FILTER:后面的代码是各种字体效果.
.banner .title td{font-size:50px;}为字体的大小.
.banner .title td{color:#e4dc9b;}为字体的颜色.
.banner table{background:#transparent; filter:alpha(opacity=80); border:0px solid #000;}这个是文字及其外框的设置.可修改background:后面的值为标题外框的颜色效果.opacity=70是表示文字的透明度.数值可调.border:0px表示外框线条的粗细.数值越大边框线条越粗.数值设为0表示边框隐藏.
{background:url("横幅图片地址")
{height:235px}