分类: 小怪要学习的 |
<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{font-size:32px;}
.banner .title td{FILTER: glow(color=#000000,direction=2);}
.banner .title td{color:#ffff66;}
.banner table{background:#transparent;
</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>
<STYLE type=text/css>
.banner .title{
}
.banner .link {
MARGIN-TOP: 0px;
MARGIN-LEFT: 290px
}
</STYLE>
.banner .title 修改的是标题的位置,left和top分别指的是标题距页面左边和顶部的距离,可自行调节
.banner .link 指的是下面的“复制<收藏”处的位置,调节方法同上
<center><MARQUEE scrollAmount=1 scrollDelay=1 direction=up width=600 height=350>
<DIV align=center><IMG src="图片网址" width=300 border=0></DIV>
<DIV align=center><IMG src="图片网址" width=300 border=0></DIV>
<DIV align=center><IMG src="图片网址" width=300 border=0></DIV>
<DIV align=center><IMG src="图片网址" width=300 border=0></DIV>
<DIV align=center><IMG src="图片网址" width=300 border=0></DIV>
<DIV align=center><IMG src="图片网址" width=300 border=0></DIV></MARQUEE></center>
提示:
1,<center></center>前后代码代表居中的意思,可以居中滚动
2,scrollAmount=1 scrollDelay=1可以设置数值,也就是滚动速度,数值越大滚动越快。
3,direction是方向,up=上,down=下,left=左,right=右,都可以自定义,愿意怎么滚动就怎么滚动。
4,width 宽度,height 高度 可以更改
1*固定位置挂件的源代码:
<DIV id=youxia style="RIGHT: 10px; POSITION: absolute; TOP: 100px"><IMG src="图片地址" border=0></A></DIV>
说明:以上为右挂件代码,更换RIGHT(右)为LEFT(左),则为左挂件代码
2*(挂件)随滚动条上下移动的源代码:
<DIV style="BORDER-RIGHT: medium none; BORDER-TOP: medium none; ; RIGHT: expression_r(eval_r(document.body.scrollLeft)+eval_r(document.body.clientWidth)-1020); FILTER: progid:DXImageTransform.Microsoftpadding:8px; BORDER-LEFT: medium none; BORDER-BOTTOM: medium none; POSITION: absolute; ; TOP: expression_r(eval_r(document.body.scrollTop)+eval_r(document.body.clientHeight)-600); TEXT-ALIGN: center"><IMG src="图片地址" border=0></DIV>
代码说明:
(document.body.clientWidth)-1020);表示图片的左右位置,负数值越大距离左侧越远
(document.body.clientHeight)-600);表示图片的上下位置,负数值越大距离下方越远
<DIV id=youxia style="RIGHT: 10px; POSITION: absolute; TOP: 100px"><IMG src="图片地址" border=0></A></DIV>
说明:以上为右挂件代码,更换RIGHT(右)为LEFT(左),则为左挂件代码
2*(挂件)随滚动条上下移动的源代码:
<DIV style="BORDER-RIGHT: medium none; BORDER-TOP: medium none; ; RIGHT: expression_r(eval_r(document.body.scrollLeft)+eval_r(document.body.clientWidth)-1020); FILTER: progid:DXImageTransform.Microsoftpadding:8px; BORDER-LEFT: medium none; BORDER-BOTTOM: medium none; POSITION: absolute; ; TOP: expression_r(eval_r(document.body.scrollTop)+eval_r(document.body.clientHeight)-600); TEXT-ALIGN: center"><IMG src="图片地址" border=0></DIV>
代码说明:
(document.body.clientWidth)-1020);表示图片的左右位置,负数值越大距离左侧越远
(document.body.clientHeight)-600);表示图片的上下位置,负数值越大距离下方越远
<iframe src="http://ip.91.com/ip/showip.asp?text=&bg=&line=2&scro=1&leng=140" frameborder="0" scrolling="no" width="260" height="66" marginheight="4" marginwidth="0"></iframe>
<IFRAME name=jiro23 src="日历的地址" width=270 height=300></IFRAME>
自己可以找一些更好看更有个性的日历地址贴上去
其效果可以在首页看到,
具体操作步骤如下所示:
进入 控制面板----个人首页维护----自定义空白面板----新增----填写 面板标题----
勾 显示源代码----粘贴当前代码----去掉钩----保存
如果是新增的面板可以再接着点----定制我的首页----添加模块----勾选新添面板----选取----保存
自己可以找一些更好看更有个性的日历地址贴上去
其效果可以在首页看到,
具体操作步骤如下所示:
进入 控制面板----个人首页维护----自定义空白面板----新增----填写 面板标题----
勾 显示源代码----粘贴当前代码----去掉钩----保存
如果是新增的面板可以再接着点----定制我的首页----添加模块----勾选新添面板----选取----保存
1竖式
<iframe id="baiduframe" border="0" vspace="0" hspace="0" marginwidth="0" marginheight="0"
framespacing="0" frameborder="0" scrolling="no" width="140" height="75"
src="http://unstat.baidu.com/bdun.bsc?tn=7720&csid=105&rkcs=2&bgcr=FFFFFF&ftcr=000000&rk=0&bd=1&bdas=0">
</iframe>
</iframe>
2横式<iframe id="baiduframe" border="0" vspace="0" hspace="0" marginwidth="0" marginheight="0"
</iframe>
<DIV align=left><IMG src="显示在面板里的图片" align=left></DIV>
<STYLE type=text/css>
body
{background:url(背景图片) repeat scroll!important;}
.logo
{background:url(题图上) no repeat no scroll!mportant;}
.banner
{background:url(题图下) no repeat no scroll!mportant;}
</STYLE>
2*整体模板源代码:
<STYLE type=text/css>
body
{background:url(页面背景图片) repeat
scroll!important;}
.logo
{background:url(题图logo图片) no
repeat no scroll!mportant;}
.banner
{background:url(题图大图) no
repeat no scroll!mportant;}
.menu{
repeat center;}
.feeds .up{
repeat center;}
.feeds .down{
repeat center;}
.feeds .function{background:url("正文摘要结尾处菜单的图片") no-
repeat right;}
.links .up{
.links .down{
.links .mid{
.photo .mid{
.label .mid{
.calendar .mid{
.callboard .up{
.callboard .down{
.callboard .mid{
.bodyBg{
.bodyBottom{
.gbook .up{
.gbook .down{
.feeds .page{
</STYLE>
(以上代码只适用于sina blog)图片地址必须是网络上已经存在的(这样才能读取图片),最好的方法是利用新浪的博客储存图片(这样你的图片就有地址了),方法很简单,先发表文章,把你的图片通过“图片剪切板”上传到博客,再点击“存为草稿”,这样文章不会发表出去,你再进入“草稿箱”,找出你的那篇文章进入编辑模式,点击左下角的“显示源代码”,你上传的图片地址就显示出来了。
小提示:如果只想改变模板的某一部分内容,就截取其中的某一段代码即可。