文章列表
 
您正在查看 "网络一些" 分类下的文章

2009年06月14日 星期日 16:46
昨天晚上有朋友问这个问题,所以一大早就来写教程了,答应别人的事一定要做

如何查看别人(自己)的百度空间CSS代码其实所有的CSS都是开放的

可以根据源文件来查看,打开你要查看的百度空间,选择查看----源文件...,有朋友竟然不知道源文件怎么打开,呵呵!要多学习一下了。你可以参考下图:

这次你知道源文件怎么找了吧,呵呵!

在打开的记事本中找类似这样的一句

1、按快捷键“ctrl+f”出现搜索框

2、在搜索框里粘贴上<link rel="stylesheet" type="text/css,你会看到有像这样的代码:

<link rel="stylesheet" type="text/css" href="/xiaomigoing/css/item/6c7067f06f5561afa40f52df.css">

如果是你自己用的模版,那么红色部分就应该是你的用户名了,找到后你就轻松多了,呵呵!

3、然后把你找到的代码,也就是href后的部分:/xiaomigoing/css/item/6c7067f06f5561afa40f52df.css前添加hi.baidu.com。

4、把找到的css文件用迅雷下载下来,完整的下载地址:http://hi.baidu.com/xiaomigoing/css/item/6c7067f06f5561afa40f52df.css这里是我的css,你别忘了要找到你的css文件才下啊,呵呵!

5、下载完后你就可以用dreamweaver打开你需要的代码了。呵呵!快去试试吧!

百度css代码的路上,困难多多。

以后就靠自己研究了

当然那些代码对新手应该有些难度吧

不过都是这样过来的

第一次看代码的时候我也是糊里糊涂的

习惯就好了

 
2009年06月14日 星期日 16:39
行高       line-height: 16px
宽度       (具体位置)-width: 16px
文字缩行   text-indent: 2px  
文字字体   font-family: "华文彩云"
文字颜色   font-color: #ffffff
文字大小   font-size: 21px

http://hi.baidu.com/tchzx

文字排列   font-aligh:  
left 左对齐
center 居中
right 右对齐
top   顶对齐
bottom 底对齐

边界 margin-top:(允许值:长度,百分比)(边界分为上,下,左,右)
补白 padding-top: (允许值:长度百分比)

顶空格填充, padding-top: 20px;,
底空格填充     padding-bottom: 5px;
左空格填充     padding-left: 100px;  
右空格填充     padding-right: 55px  

顶边框宽度     border-top-width: 3px
底边框宽度     border-bottom-width: 5px
左边框宽度     border-left-width: 1px
右边框宽度     border-right-width: 1px  
边框上 border-top:(允许值,样式颜色,宽度,样式)
     下 ………-bottom
     左…
     右…

http://hi.baidu.com/tchzx

边框样式       border-style: none
none(没有) | dotted(有点的) | dashed(虚线) | solid(固体) | double(两倍) | groove( 凹槽) | ridge(凸出) | inset(插入物) |tset(开头) ]

文字修饰    { text-decoration: none }
blink文字闪烁
none使得上述效果都不会发生

定位(左边和顶部)   {position: absolute; left: 100px; top: 43px }(将标记的内容定位于左100px顶43px)(另外可以添加 width:130px 限制宽度为130)(或添加heigh: 130px)(允许值:长度,百分比)

标记的内容隐藏   p { visibility: hidden } (visible为看见hidden为隐藏inherit为可视性设置)

http://hi.baidu.com/tchzx

链接不显示下划线  
A:link { text-decoration: none }  

颜色   color: #

背景于文字之后 background-image: url( dfdf)
背景       background: url(dd.jpg)    
背景不滚动   background-attachment: fixed

背景定位     background-position:
top将背景图象同前景要素的顶部对齐。  
bottom将其同前景要素的底部对齐。  
left将其同左边对齐。  
right将其同右边对齐。  
center将其水平居中(如果使用在另一关键字前面)或垂直居中(如果用在另一关键字后面)。
  
背景重复   background-repeat:    (不重复)(缺省为重复)
背景长度   background-position: 70px (水平70) 10px (垂直10)    ;   background-repeat: repeat-y(垂直平铺)或 repeat-x (水平平铺)

http://hi.baidu.com/tchzx
背景不滚动
body{background:url('http://hiphotos.baidu.com/monyer/pic/item/d375e4cd9bf5b8510eb34568.jpg') no-repeat fixed center;  
cursor:url('http://hiphotos.baidu.com/monyer/pic/item/7345d3c81000ec177e3e6f72.jpg');  
SCROLLBAR-FACE-COLOR: #fe90b0;  
SCROLLBAR-HIGHLIGHT-COLOR: #fec5d7;  
SCROLLBAR-SHADOW-COLOR: #cc3366;  
SCROLLBAR-3DLIGHT-COLOR: #ffffff;  
SCROLLBAR-ARROW-COLOR: #cc3366;  
SCROLLBAR-TRACK-COLOR: #ffb2cc;  
SCROLLBAR-DARKSHADOW-COLOR: #cc3366;  
SCROLLBAR-BASE-COLOR: #ffb1cb;  
}
 
2009年06月14日 星期日 16:18
基础一

#header              标题栏的ID,就是挂着空间名字的栏目

#tab                导航兰的ID,就是写着主页 | 博客 | 相册....的栏目

#comm_info        其他模版的ID,就是有访问量显示和RSS的栏目

#m_blog          文章列表模版的ID

#m_pro             个人档案模版的ID

#m_album           照片自动播放模块的ID,一般这个不需要设置,因为设置了背景看不到,前面有照片显示

#m_links          友情链接模版的ID

#m_artclg          文章分类模版的ID

#m_comment    最新评论模版的ID

#m_filed              文章存档的ID


———————————定式性的代码————————————


display:none 全能隐藏代码

背景{}中添加background: url(图片地址)repeat
注:
repeat         背景图像在纵向和横向上平铺
no-repeat   背景图像不平铺
repeat-x      背景图像在横向上平铺
repeat-y      背景图像在纵向平铺

background-color:#颜色代码

超链接自定义设置超链接的属性就是在相关栏目名称后面+上a{}的属性

color:#颜色代码或颜色英文名称 定义超链接字体的颜色
font-family:字体名称       定义超链接字体
font-size:大小px          定义超链接字体大小
text-decoration : 参数        定义超链接的文本装饰,参数:none || underline || blink || overline || line-through
      none :  无装饰
      blink :  闪烁
      underline :  下划线
      line-through :  贯穿线
      overline :  上划线

其实超链接属性设置
a:hover{}        当鼠标移动到超链接上时显示的属性
a:link{}        超链接未被访问前显示的属性
a:visited{}    已经被访问过的超链接的属性
a:active{}    超链接被点击的时候显示的属性(在鼠标点击与释放之间发生的事件)

.modbl{}
.modbc{}
.modbr{}
这三个就是分别设置模版左下角,底边中央,右下角的代码:
.modbl{}中的border-left:是设置左下角左边框的属性的,border-bottom是设置左下角底边的边框属性的
.modbc{}中的border-bottom:是设置边框当中一段底边属性的
.modbr{}中的border-right:是设置右下角右边框的属性的,border-bottom是设置右下角底边的边框属性的

解决回车换两行的问题
Shift+回车

个性标题
#header div.tit{top:5px;left:20px;line-height:60px;font-size:60px;font-family:隶书}
#header div.tit a.titlink{color:#813533;text-decoration:none}
#header div.tit a.titlink:visited{color:#813533;text-decoration:none}
#header div.tit a.titlink:hover{color:#FFFFFF;text-decoration:none}
#header div.desc{top:27px;left:320px;color:#813533;font-size:16px}
说明:
#header div.tit{}             这是标题的设置
#header div.tit a.titlink{}       这是标题超链接的设置
#header div.tit a.titlink:visited{} 这是标题超链接已经被访问过的设置
#header div.tit a.titlink:hover{}    这是当鼠标移动到标题超链接上时显示的属性
#header div.desc{}             这是空间标题后面的简介的内容设置
属性和详细参数
top:5px          距离模版顶部的间隔距离为5px
left:20px          距离模版左边的间隔距离为20px
line-height:60px    设置总高度为60px
font-size:60px        设置字体大小为60px,这个不能设置的比的line-height大,不然标题字体的一部分会被遮掉的
font-family:隶书    设置字体的型号
color:#813533        设置字体的颜色代码为#813533,这里也可以写颜色的英文名,比如black,white,red,green等
text-decoration:none 字体的划线修饰属性,none为无下划线,关于text-decoration的具体参数可以查看我前面写的关于定义超链接的文章

更多文章 放到右面
#m_blog div.more{margin:14px 0 16px 0;text-align:right}

1.在友情链接添加“发送消息”的链接:
在友情链接里的链接地址内填上:http://msg.baidu.com/ms?ct=21&cm=1&tn=bmSendMessage&un=你的百度用户名
这样人家一点该链接就可以马上给你发送消息了,而这个链接另一个功能就是可以给自己发送消息,嘿嘿,由于自己浏览自己空间的时候,是没有发送消息的链接的,所以应该没有多少人试过给自己发送消息吧?但是我用这个链接来试过。。。而且收到了,很有意思。。。
2.在友情链接添加“加为好友”的链接:javascript:document.addfriend.submit()

—————————CSS系列—————————————

/*发表评论中的背景*/
#spBlogCmtor{background:url(图片地址)} /* 这是 姓名 中的*/
#spBlogCmtURL{background:url(图片地址) /* 这是 网址或邮箱 中的*/
background-attachment: fixed;
background-position: center center;
background-repeat: no-repeat;
}
#spBlogCmtText{background:url(图片地址) /* 这是 内容中 的*/
background-attachment: fixed;
background-position: center center;
background-repeat: no-repeat;
}

/*改变你的按钮和输入栏的颜色及字体*/
input,select,textarea{color:green;font-size:14px;font-family:Tahoma,黑体;border:1px solid green;background-color:black}
textarea{overflow:hidden}

解释一下:color:green        表示字体颜色。
font-size:14px       表示字体大小。
font-family:Georgia,黑体    表示英文字体和中文字体
border:1px          表示边框的粗细。
solid green          表示边框的颜色。
background-color:black    表示背景色。

/*最顶部加字方法!*/
#tabline{margin-top:-490px;right:0px;line-height:8px; background:url(图片地址) no-repeat bottom; padding-bottom: 40px; margin-bottom: 10px}
图片上面打上你要的字~

/*文章虚线边框*/
#m_blog div.cnt{color:#333333;line-height:20px;font-size:14px;border:1px dashed #090688;background:#Ffffff;PADDING: 10px;}
/
#m_blog div.cnt{color:#808080;line-height:20px;font-size:16px;border-top:2px dashed #1DC01D;border-bottom:2px dashed #1DC01D;border-left:2px dashed #1DC01D;border-right:2px dashed #1DC01D;PADDING-RIGHT: 10px; PADDING-LEFT: 10px;PADDING-TOP: 10px;PADDING-bottom: 10px;}

dotted: 点线
dashed :  虚线
double :  双线边框
groove :  3D凹槽
ridge :  菱形边框
inset :  3D凹边
outset :  3D凸边

/*留言板图片*/
#spBlogCmtText {border: 1px solid #A6B5C4;background:url(http://***.jpg) no-repeat top center;background-attachment: fixed;}

/*播放器*/
#phx{FILTER: Alpha(Opacity=100, FinishOpacity=60, Style=2, StartX=20, StartY=40, FinishX=0, FinishY=0)Invert(); WIDTH: 224px;HEIGHT:200px}
Invert(); 滤镜效果 可以换成别的


/*不显示播放器,但不影响音乐的播放*/
添加#mod_bgmusic{display:none}

/*日志背景*/
#m_blog.modbox{background:url(这里填上你选的背景图片连接地址)}
或#m_blog div.cnt{background:url(填入你选择的图片地址连接) repeat; /*背景图片*/color:#666666;line-height:20px;font-size:14px}

/*滚动条*/
{overflow-y:auto;height:200px}

{scrollbar-face-color: #E100E1;
scrollbar-shadow-color: maroon;
scrollbar-highlight-color: white;
scrollbar-3dlight-color: #E100E1;
scrollbar-darkshadow-color:#E100E1;
scrollbar-arrow-color:#E100E1;
scrollbar-base-color: #E100E1;
scrollbar-track-color: #E100E1;
overflow-y:auto;height:458px;
filter: chroma(color=#E100E1);}

scrollbar-3d-light-color 设置或检索滚动条亮边框颜色
scrollbar-highlight-color 设置或检索滚动条3D界面的亮边(ThreedHighlight)颜色
scrollbar-face-color 设置或检索滚动条3D表面(ThreedFace)的颜色
scrollbar-arrow-color 设置或检索滚动条方向箭头的颜色
scrollbar-shadow-color 设置或检索滚动条3D界面的暗边(ThreedShadow)颜色
scrollbar-dark-shadow-color 设置或检索滚动条暗边框(ThreedDarkShadow)颜色
scrollbar-base-color 设置或检索滚动条基准颜色

/*鼠标触碰 按钮下陷*/
a:hover{}中加入 position:relative; left:2px; top:1px; clip:rect( );

/*禁止选择 鼠标右键特效*/
#main{
background:url('javascript:
document.oncontextmenu=new Function("event.returnValue=false;");
document.onselectstart=new Function("event.returnValue=false;");
')}
即可
document.oncontextmenu=new Function("event.returnValue=false;");禁止鼠标右键
document.onselectstart=new Function("event.returnValue=false;");
禁止选择

/*探出窗口*/
#comm_info 和#comm_info a 替换#comm_info a{color:#D77B18 border: 1px solid #000000; padding: 10px; background-image: url('javascript:alert("你要说的话");')}

#comm_info{}或#m_links div.item{}
添加
background:url(javascript:alert(你要说的内容))

/*鼠标样式*/
平常状态 body{}中加入CURSOR: url('http://***.ani');
链接状态 a:hover{}中加入CURSOR: url('http://***.ani');

/*文章在新窗口中打开*/
a:active { text: (target="_blank");}

/*屏蔽Rss链接,baidu图片*/
#comm_info a {display:none;}

/*大背景*/
body{}中加入background:url(http://***.gif) repeat-x #FFFFFF

/*标题背景*/
#header div.lc{} -左
#header div.rc{} -右
插入 background:url(http://***)

/*百度空间 进入后弹出对话框*/
去掉#comm_info div.line 把#comm_info a换成
#comm_info a{color:#D77B18 border: 1px solid #000000; padding: 10px; background-image: url('javascript:alert("你要说的话");')}

/*文章日期旁加小图案*/
#m_blog div.date
{text-indent:1.5cm;background:url(这里要填上你自己选的小图片的连接地址) 30% 0% no-repeat; /*背景图片*/margin:5px 0 8px 0;color:#999999;
line-height:50px; /*调整行高*/}

/*常用插入时间图片位置的代码*/
图片显示位置——个人档案照片下面:
#m_pro div.act{margin-top:5px; background:url(http://escati.linkopp.net/cgi-bin/date.cgi?trgb=red&srgb=red&prgb=red&timezone=GMT-0500) no-repeat bottom; padding-bottom: 22px; margin-bottom: 6px; }

图片显示位置——文章列表 标题下面:
#m_blog div.tit{font-size:14px;font-weight:bold; background:url(http://escati.linkopp.net/cgi-bin/date.cgi?trgb=red&srgb=red&prgb=red&timezone=GMT-0500) no-repeat bottom; padding-bottom: 22px; margin-bottom: 6px; }

图片显示位置——文章列表 标题左面:
#m_blog div.tit{font-size:14px;font-weight:bold; line-height:24px; text-indent:120px; background:url(http://escati.linkopp.net/cgi-bin/date.cgi?trgb=red&srgb=red&prgb=red&timezone=GMT-0500) no-repeat; }

图片显示位置——文章列表 标题栏:
#tabline{top:89px; background:url(http://escati.linkopp.net/cgi-bin/date.cgi?trgb=red&srgb=red&prgb=red&timezone=GMT-0500) no-repeat bottom; padding-bottom: 32px; margin-bottom: 6px; }

图片显示位置——相册下面:
#m_album div.image{text-align:center; background:url(http://escati.linkopp.net/cgi-bin/date.cgi?trgb=red&srgb=red&prgb=red&timezone=GMT-0500) no-repeat bottom; padding-bottom: 45px; margin-bottom: 1px; }

图片显示位置——每个友情链接下面:
#m_links div.line{margin-top:5px;line-height:8px;border-top:1px solid #F4C1B5; background:url(http://escati.linkopp.net/cgi-bin/date.cgi?trgb=red&srgb=red&prgb=red&timezone=GMT-0500) no-repeat bottom; padding-bottom: 16px; margin-bottom: 10px; }

图片显示位置——每个最新评论下面:
#m_comment div.item{color:#000000;font-size:12px; background:url(http://escati.linkopp.net/cgi-bin/date.cgi?trgb=red&srgb=red&prgb=red&timezone=GMT-0500) no-repeat bottom; padding-bottom: 22px; margin-bottom: 6px; }

图片显示位置——每个文章分类下面:
#m_artclg div.line{margin-top:5px;line-height:8px;border-top:1px solid #F4C1B5; background:url(http://escati.linkopp.net/cgi-bin/date.cgi?trgb=red&srgb=red&prgb=red&timezone=GMT-0500) no-repeat bottom; padding-bottom: 16px; margin-bottom: 10px; }

图片显示位置——其他区域:
#comm_info div.line{margin-top:5px;line-height:8px;border-top:1px solid #BBC1C6; background:url(http://escati.linkopp.net/cgi-bin/date.cgi?trgb=red&srgb=red&prgb=red&timezone=GMT-0500) no-repeat bottom; padding-bottom: 22px; margin-bottom: 6px; }

/*分割线*/
{margin-top:17px;line-height:12px;background:url(http://***.gif) repeat-x}  

/*<其它>模块中只显示访问人数*/
#comm_info a {display:none}

/*发光效果*/
{}中加入filter:glow (color= #299BE8,strength=2);

/*阴影效果字体阴影*/
{}中加入filter:DropShadow(Color=#000000, OffX=3, OffY=3, Positive=true);
参数的作用:
Color=这里是阴影的颜色代码,我这里用的是黑色
OffX=这里设置阴影与对象(文字或图片)的横向距离偏移
OffY=这里设置阴影与对象的竖向距离偏移
Positive=这里是设置建立阴影的对象,true就是为非透明像素建立阴影,false就是为透明的像素建立阴影,一般不建议使用false,至于原因,你们可以自己设置false,然后预览看看效果,就知道为什么了,当然,如果你喜欢这样的效果,那也是个性使然,个人审美观不同,呵呵

另外,如果大家要添加阴影的地方已经有了filter的参数,例如设置透明度的filter:alpha(),那么只要把DropShadow(Color=#000000, OffX=3, OffY=3, Positive=true)添加到alpha()的后面就可以了,这里不需要间隔,当中留空格可以,但是千万不要自作聪明的去用";"来间隔,一旦间隔了就无效了
例如在原来的filter:alpha(opacity=50);后面加上阴影效果代码:
filter:alpha(opacity=50)DropShadow(Color=#000000, OffX=3, OffY=3, Positive=true);

建议阴影不要用的太多,而且小字体的阴影很难搭配颜色,所以要慎重使用,不然反而适得其反

/*投影的代码*/
filter:Shadow(Color=gray/*颜色*/,Direction=135/*方向*/)

/*文章标题背景*/
#m_blog div.tit{text-indent:1.5cm/*缩近*/;line-height:75px;/*增大行高,使背景图片完全显示*/font-size:16px;font-weight:bold;background:url(http://***.gif) no-repeat;/*标题背景图片,不重复*/}
line-height:多少px;    设置标题的高度,其实这里的设置为图片的高度就可以了
text-indent:多少px;    设置标题的文本前面空多少宽度,这里可以填图片的宽度,为了美观起见,可以再多+5、6px,因为图片和标题贴着不好看,这个主要还是看个人感觉和喜好设置了

/*空间透明*/
.modbox,.modbl,.modbc,.modbr{filter:alpha(opacity=80);-moz-opacity:0.8;width:auto !important;width:100%}

/*添加自己的LOGO图片*/
#comm_info div.line{margin-top:4px;line-height:8px;border-top:2px solid #ff3333; background:url(http://***.gif) no-repeat bottom; padding-bottom: 32px; margin-bottom: 32px}

/*添加LOGO*/
#m_pro div.image{}加入background:url(http://***.jpg) no-repeat bottom;padding-bottom:100px
   bottom让       图片沉底
   padding-bottom    增加头像模块底下的宽度,这样,我们的LOGO就可以再往下移了,直到不被我们的头像挡住就可以了,
关键就是 padding-bottom    后面的数值大小了,一般设置为LOGO的高度值正好,LOGO的上边正好贴紧了头像的下边,如果觉得贴紧了不好看,就稍微再加大一点padding-bottom的值,留点缝缝

/*给评论框加背景图片*/
#spBlogCmtText {border: 8px solid #1AE61A ;
background:url(图片地址) no-repeat top center;
background-attachment: fixed;}

/*如何设定+固定百度空间的背景*/
在body{}中加入
background-image:url(图片地址) ;      定义背景图片
background-repeat: no-repeat;       定义背景图片不重复
background-position: center;       定义背景居中
background-attachment: fixed;       定义背景固定,不滚动,这个就是关键参数fixed

好啦,背景定义好了,预览看一下,却发现基本看不到背景,为什么?因为百度空间的样式中还有别的背景,比如标题栏上的背景图片等

所以我们要把标题栏他们的背景给去掉
在header{}中加入
background:transparent          这个参数的作用是使完全背景透明(关于半透明的设置请看后面的教程)
并把其中原来的属性background:url(……)的设置删除掉

接着到#header div.rc{}以及.stage{}中做与header{}同样的设置,即可达到效果了,再看看,是不是能够看到设定的背景了

如果觉得其他模块的背景也很碍眼的话,只要照着上面的方法设置了即可了,不过有的是设置背景色的,那么只要把background-color:……;删掉然后再+上background:transparent就可以了

这里加一句,有很多朋友的菜单栏是带背景色的,也就是主页|博客|相册这一栏有背景色,有的人想变透明不知道在哪里,我这里提示一下,就是#tab{}中,只要把里面的background-color的相关属性删除掉就可以了

—————————————技巧系列———————————————
转贴出处点击南开一、空间模块巧移动:

改变空间主页各模块的排布位置可以在空间中依次点击:设置-高级设置-自定义模板-开始自定义

然后鼠标拖动各个栏目的标题处,移动到你想要的位置,松手即可。

但是如果你曾经把一个模块拖动到“文章列表”下面,而后来发表了许多文章,想把下面的那个模块拖回来是就会发现,无法移动到上面。

其实有个简单的方法:
先到下面鼠标左键按住想要拖动的模块的标题栏,接着按键盘上的“Pg Up”(上页)键,就会发现页面向上翻了,而模块还在鼠标指针上。
按几次达到想要的位置后,松开鼠标左键,该模块就会移到你想要的地方去了^_^

二、文章快速插链接:

我们在文章中经常会遇到插入超链接的情况,直接贴网址虽然也可以自动转换为超链接,但是我觉得就影响了文章的美观。
所以我比较喜欢用文字链接,但是每次都用鼠标点上面的设置链接按钮也未免太慢了……

用过微软FRONT PAGE的朋友应该知道,该软件插入超链接是有快捷键的,我在空间里测试里一下,的确可以用!

所以写日志时想给文字加超链接,先将链接指向的网址复制一下,然后选中想要加的文字,最后按快捷键“CTRL+K”——在弹出的提示框中粘贴刚复制的地址,确定即可。

———————————HTML系列————————————

HTML提交:
javascript:if(navigator.userAgent.indexOf('MSIE')>0){void(document.form1.spBlogText.value=frames['rte1'].document.body.innerText);void(document.form1.rte1.value='');document.form1.submit()};
提交地址 添加到收藏夹做按钮即可

/*公告牌*/
<table cellspacing="0" cellpadding="0" align="center" border="0">
<tbody>
<tr>
    <td colspan="3"><img src=" </tr>
<tr>
    <td><img src="     <td valign="top"width="288" bgcolor="white"><div align="center"><span style="font-size:20px; font-weight:bold; letter-spacing:10px">公告</span></div>
    <div style="text-indent:24px; letter-spacing:2px; line-height:16px; padding-top:10px">内容</div>
</td>
    <td><img src=" </tr>
<tr>
    <td colspan="3"><img src=" </tr>
</tbody>
</table>

—————————————CSS注释————————————————

打开CSS表:
在空间页面上依次点击:设置——高级设置——自定义css

代码解释:
1、关于文字或背景的颜色的16进制代码形式如:#530C0E
可以到如下网页直观查看颜色代码:
http://shirley329.blogchina.com/3501281.html
也可以用颜色的相应英文单词替换,如:Black Fuchsia Gray Gree Lime Maroon Navy Olive Purple

Red Silver Teal White Yellow Blue Aqua

2、相关元素“位置”为“center,left,right”,可直接相互替换;

3、文字等元素的大小格式为“13px”数字越大字号或元素就越大,反之则越小;

4、图片地址可直接用可以引用的地址替换,建议将图片传到空间相册后再引用。

5、代码详细注释:

body{background-color:#530C0E}
——背景颜色

#header{height:89px;background:url() no-repeat}
#header div.rc{background:url() repeat-x}
——页面上方“主页博客|相册……”栏背景图片
#tab a.on,#tab a.on:link,#tab a.on:visited{margin-top:3px;line-height:19px;background-

color:#BC0304;color:#FFFFFF;font-size:14px}
——页面上方“主页”栏大小颜色+背景
#tab span{color:#FFFFFF;font-size:14px}
#tab a:link{color:#FFFFFF;text-decoration:none;font-size:14px}
——页面上方“博客|相册……”栏链接颜色,未被点击
#tab a:visited{color:#FFFFFF;text-decoration:none;font-size:14px}
——页面上方“博客|相册……”栏链接颜色,已被点击
#tab2{background:#DAE9F5}
#tab2 span{color:#000000;font-size:12px;font-weight:bold}
#tab2 a{font-size:12px}
#tab2 a:link{color:#0000CC}
#tab2 a:visited{color:#0000CC}

.stage{background:url() no-repeat top left;line-

height:1px}
——每个栏目右上角远郊边沿图片
.modbl{background-color:#FFF6E7;border-left:1px solid #FFF6E7;border-bottom:1px solid

#FFF6E7;line-height:1px}
——每个栏目左下角点的设置
.modbc{background-color:#FFF6E7;border-bottom:1px solid #FFF6E7;line-height:1px}
——每个栏目最下端一条的设置
.modbr{background-color:#FFF6E7;border-right:1px solid #FFF6E7;border-bottom:1px solid

#FFF6E7;line-height:1px}
——每个栏目右下角点的设置

#m_blog div.tit{font-size:14px;font-weight:bold}
#m_blog div.tit a{color:#000000;font-size:14px;font-weight:bold}
——日志标题大小颜色,未被点击
#m_blog div.tit a:visited{color:#000000}
——日志标题大小颜色,已被点击
#m_blog div.date{margin:5px 0 8px 0;color:#666666}
——日志日期文字大小颜色
#m_blog div.cnt{color:#000000;line-height:20px;font-size:14px}
——日志内容大小颜色
#m_blog div.more{margin:14px 0 16px 0}
#m_blog div.more a{color:#D77B18;font-size:14px}
——日志“阅读全文>>”的大小颜色,未被点击
#m_blog div.more a:visited{color:#D77B18}
——日志“阅读全文>>”的大小颜色,已被点击
#m_blog div.opt{color:#666666;font-size:12px}
——“类别:技术专区 | 编辑……”中的“|”的颜色大小
#m_blog div.opt a{color:#D77B18;font-size:12px}
——“类别:技术专区”的大小颜色
#m_blog div.opt a:visited{color:#D77B18}
——“编辑 删除 评论(4) 浏览(21)”的大小颜色
#m_blog div.line{margin-top:17px;line-height:17px;border-top:1px solid #F4C1B5}
——日之间的分割线的相关设置
#m_blog div.none{padding:100px 0 100px 0;color:#000000;font-size:14px}
——隐形设置,不需要改变

#m_pro a{color:#D77B18}
——个人档案中“查看详细信息”的颜色,未被点击
#m_pro a:visited{color:#D77B18}
——个人档案中“查看详细信息”的颜色,已被点击
#m_pro div.image{text-align:center}
——个人档案中照片的显示位置,分为“中,左,右——center,left,right”
#m_pro div.act{margin-top:10px}
——个人介绍和照片的间距
#m_pro div.user{margin-top:10px;color:#000000;font-size:12px;font-weight:bold}
——个人用户名的大小颜色
#m_pro div.desc{color:#000000;font-size:12px}
——个人介绍的大小颜色
#m_pro div.line{margin-top:17px;line-height:17px;border-top:1px solid #F4C1B5}
#m_pro td{color:#000000;line-height:24px;font-size:14px}

#m_album div.image{text-align:center}
——相册中照片的显示位置,分为“中,左,右——center,left,right”
#m_album div.page{color:#666666;font-size:12px;text-align:center}
#m_album div.page a{color:#0000CC;font-size:12px}
#m_album div.page a:visited{color:#0000CC}

#m_links div.item{color:#000000;font-size:12px}
——友情链接的连接描述的大小颜色
#m_links div.item a{color:#D77B18;font-size:12px;text-decoration:none}
——友情链接名的大小颜色,未被点击
#m_links div.item a:visited{color:#D77B18}
——友情链接名的大小颜色,已被点击
#m_links div.line{margin-top:5px;line-height:8px;border-top:1px solid #F4C1B5}
——友情链接见的分隔符的相关设置

#m_artclg div.item{color:#666666;font-size:12px}
——文章分类中各分类后面主题数及括号的大小颜色
#m_artclg div.item a{color:#D77B18;font-size:12px}
——文章分类中各分类的大小颜色,未被点击
#m_artclg div.item a:visited{color:#D77B18}
——文章分类中各分类的大小颜色,已被点击
#m_artclg div.line{margin-top:5px;line-height:8px;border-top:1px solid #F4C1B5}
——文章分类中各分类之间的分割线的相关设置

#m_comment div.item{color:#000000;font-size:12px}
#m_comment div.item a{color:#D77B18;font-size:12px}
——最新评论中用户名的大小颜色,未被点击
#m_comment div.item a:visited{color:#D77B18}
——最新评论中用户名的大小颜色,已被点击
#m_comment div.item a.cnt{color:#000000;font-size:12px;text-decoration:none}
——最新评论中评论文字的大小颜色,未被点击
#m_comment div.item a.cnt:visited{color:#000000;text-decoration:none}
——最新评论中评论文字的大小颜色,已被点击
#m_comment div.item a.cnt:hover{color:#000000;text-decoration:underline}
————最新评论中评论文字当鼠标移上去时的颜色
#m_comment div.line{margin-top:5px;line-height:8px;border-top:1px solid #F4C1B5}
——最新评论中各评论之间的分割线的相关设置

 
2009年06月14日 星期日 16:12

1.让你看懂css各个参数http://hi.baidu.com/tchzx/blog/item/1e0453e7c351052eb838200d.html

2.百度空间CSS使用说明http://hi.baidu.com/tchzx/blog/item/b360d33fddd2b0c27c1e714a.html

3.怎样编写CSS的! http://hi.baidu.com/tchzx/blog/item/d75fd7a2f36821adcaefd0e1.html

4.CSS代码解密http://hi.baidu.com/tchzx/blog/item/f106f71f339b06f5e1fe0bfe.html

5.一个CSS的漏洞http://hi.baidu.com/tchzx/blog/item/c1e74cfb9c6c8164024f560d.html

6.增加自定义模块功能http://hi.baidu.com/tchzx/blog/item/c207c91b9f69d7faae513303.html

7.更换主体及文章的背景http://hi.baidu.com/tchzx/blog/item/f7b0d609ad57ba82d0581b15.html

8.透明flash代码http://hi.baidu.com/tchzx/blog/item/5012e1cd15168a510eb345e3.html

9.百度空间十大宝藏http://hi.baidu.com/tchzx/blog/item/7e3daa6eb9da40da80cb4a62.html

10.制作个性化的标题栏http://hi.baidu.com/tchzx/blog/item/ae077109a6518aaf2fddd434.html

11.看到更多的百度空间http://hi.baidu.com/tchzx/blog/item/dbe16c634f5e47600d33fa07.html

12.百度空间的8个优缺点http://hi.baidu.com/tchzx/blog/item/75d054432e8b9e119213c606.html

13.专栏分割线的代码修改http://hi.baidu.com/tchzx/blog/item/32c416df0880ac1362279831.html

14.添加自己的LOGO图片http://hi.baidu.com/tchzx/blog/item/0bee1a9599002e087af48000.html

15.宣传百度空间的方法http://hi.baidu.com/tchzx/blog/item/a8f9758b7e459512c9fc7a59.html

16.添加多首背景音乐http://hi.baidu.com/tchzx/blog/item/5339282e42b2bd504ec22617.html

17.设置透明背景图http://hi.baidu.com/tchzx/blog/item/f4cb90dd7fad81345882ddb6.html

18.更改空间的鼠标样式http://hi.baidu.com/tchzx/blog/item/50c2c15cc3d17f43faf2c0b6.html

19.在空间里加入滚动条http://hi.baidu.com/tchzx/blog/item/702631d319d09a003bf3cfb6.html

20.透明的背景音乐的播放器http://hi.baidu.com/tchzx/blog/item/97f7b909d38ada246a60fbb6.html

21.透明个性化滚动条http://hi.baidu.com/tchzx/blog/item/3013b5fbeaff41224e4aeab6.html

22.给链接添加背景色效果代码http://hi.baidu.com/tchzx/blog/item/effb6427fc39db03908f9db6.html

23.显示"点击给你发消息"怎么在空间做! http://hi.baidu.com/tchzx/blog/item/62e02f3893d9c524b9998fb6.html

24.去掉文章题目下划线http://hi.baidu.com/tchzx/blog/item/ce8c044f1019db36aec3abb6.html

25.常用插入图片位置的代码http://hi.baidu.com/tchzx/blog/item/83257c89c9b823b30e2444b5.html

26.如何隐藏播放器而不影响音乐播放http://hi.baidu.com/tchzx/blog/item/e4233edbfb147e66d1164eb5.html

27.如何有字体阴影http://hi.baidu.com/tchzx/blog/item/b1d78094e72b511ed31b70b5.html

28.自制闪字空间名称http://hi.baidu.com/tchzx/blog/item/df49ca114a626b10b8127bb5.html

29.解决回车换两行的问题http://hi.baidu.com/tchzx/blog/item/b420a086e4fe533e66096eb5.html

30.调整一下行距http://hi.baidu.com/tchzx/blog/item/b8bc514e84b1fd09b2de05b5.html

31.让空间拥有精美flash背景http://hi.baidu.com/tchzx/blog/item/5fc12af5ea17b525bd3109b5.html

32.让空间自动弹出对话框!http://hi.baidu.com/tchzx/blog/item/5339282e4cd0b7504ec226b5.html

33.修改blog显示的文字颜色大小http://hi.baidu.com/tchzx/blog/item/691c36ad2e075a094a36d6b5.html

34.如何让你的浏览器滚动条变色http://hi.baidu.com/tchzx/blog/item/af686238d73fbd2396ddd8b5.html

35.为评论和链接加上图片http://hi.baidu.com/tchzx/blog/item/b2c26759e6c5f82a2934f0b5.html

36.如何在"其它"下面加上图片http://hi.baidu.com/tchzx/blog/item/6c1f975228ca5e0e0df3e3b5.html

37.百度空间的名称如何用艺术字?http://hi.baidu.com/tchzx/blog/item/0738f00331678cec09fa93b5.html

38.百度空间文字发光的方法http://hi.baidu.com/tchzx/blog/item/d5b9ff19f8f01a7adbb4bdb5.html

39.文字快速插链接http://hi.baidu.com/tchzx/blog/item/ca2b7e3166bd9f19eac4afb5.html

40.空间模块巧移动http://hi.baidu.com/tchzx/blog/item/b4abaa4b8efb5ff083025cb4.html

41.个性化你的IP显示,自定义颜色http://hi.baidu.com/tchzx/blog/item/378ed71659cc8718962b43b4.html

42.全透明http://hi.baidu.com/tchzx/blog/item/c12a7a1e97f322f41ad576b4.html

43.空间背景半透明http://hi.baidu.com/tchzx/blog/item/b4e8bda1faf95e8b461064b4.html

44.如何在百度空间的文章标题周围加花边图案?http://hi.baidu.com/tchzx/blog/item/55a6221fbf22fdc8a68669b4.html

45.关于百度空间照片大小限制的问题!!! http://hi.baidu.com/tchzx/blog/item/f7b0d609ab36b082d0581bb4.html

46.如何在百度空间发表文章时插入FLESH动画?http://hi.baidu.com/tchzx/blog/item/f106f71f32c101f5e1fe0bb4.html

47.怎样换百度空间的背景http://hi.baidu.com/tchzx/blog/item/c94729dd492b50d98c1029b4.html

48.做分割线的方法http://hi.baidu.com/tchzx/blog/item/f6fbb77e136749380dd7dab4.html

49.在百度空间里面添加自己的特效http://hi.baidu.com/tchzx/blog/item/69db8044561f364c500ffeb4.html

50.在文章中快速插入图片http://hi.baidu.com/tchzx/blog/item/437f5eee9b8a79fbb3fb95b4.html

51.添加计数器的两种方法http://hi.baidu.com/tchzx/blog/item/0731f5d3cecb3ddfa8ec9ab4.html

52.如何在空间顶部加入图片http://hi.baidu.com/tchzx/blog/item/4b9b8cd437fbab01a08bb7b4.html

53.发表评论框的图片http://hi.baidu.com/tchzx/blog/item/b4abaa4b8ef45ff083025cab.html

54.改变空间主页名称和简介的字体大小http://hi.baidu.com/tchzx/blog/item/7e3daa6e94237dda80cb4aab.html

55.给超链接添加按钮效果http://hi.baidu.com/tchzx/blog/item/95f73d292412ccfe98250aab.html

56.如何给评论框添加背景http://hi.baidu.com/tchzx/blog/item/c26ece17518b4b09c83d6df9.html

57.Iframe 用法的详细讲解http://hi.baidu.com/tchzx/blog/item/e23e207f172e2b0828388a8e.html

58.背景图片素材01 http://hi.baidu.com/tchzx/blog/item/bc11d02aa2db092dd52af10f.html

59.图片素材20060929 http://hi.baidu.com/tchzx/blog/item/6d12563d821675ee3c6d970e.html

60.我的自定义设计 http://hi.baidu.com/tchzx/blog/item/3c6ab5b731ac21f431add193.html

61.CSS鼠标样式大全 http://www.hi128.cn/?250/action_viewspace_itemid_37.html

62.跟我一起玩百度空间的音乐和视频+ http://hi.baidu.com/tchzx/blog/item/398833a85082a0b1ca130c21.html

63.为<好友列表>增加一个滚动条 http://hi.baidu.com/tchzx/blog/item/b54a0bf4d32be5ef7709d70b.html

64.空间模块巧移动 + 文字快速插链接 http://hi.baidu.com/tchzx/blog/item/d6369b82c9d0e2bf6d811914.html

65.怎么去掉百度空间里模块的框框!http://hi.baidu.com/tchzx/blog/item/5012e1cd2f64b0510eb345b1.html

66.基本颜色代码+ http://hi.baidu.com/tchzx/blog/item/e3f0317aa7d065ed2f73b329.html

67.在你的空间中加入幽默元素.. http://hi.baidu.com/tchzx/blog/item/5612858b86b287d3fc1f10f0.html

68.百度空间吧[精品]贴+ http://hi.baidu.com/tchzx/blog/item/06cf65d06bb7be8fa1ec9cf9.html

69.如何在博客上---中--下加入图片(时钟)http://hi.baidu.com/tchzx/blog/item/8e2cb0452fc7b226cefca333.html

72.教你10个你未必知道的CSS技巧! http://hi.baidu.com/tchzx/blog/item/ee3cb41c0680918b86d6b60e.html

73.用CSS进行百度空间样式设计! http://hi.baidu.com/tchzx/blog/item/f7b0d609a75eac82d0581b0c.html

74.百度空间自动友情链接 http://hi.baidu.com/tchzx/blog/item/f235a64477276882b2b7dc98.html

75.一起玩百度空间帮助 http://hi.baidu.com/tchzx/blog/item/e4233edbfee96366d0164e98.html

76.一起玩百度空间榜单 http://hi.baidu.com/tchzx/blog/item/5173043b98a1f8ea15cecb99.html

77.点对点宣传百度空间 http://hi.baidu.com/tchzx/blog/item/e859cc13444c3823dc540164.html

78.百度空间常见27+问题 http://hi.baidu.com/tchzx/blog/item/9636b38f8c02a5eef11f365a.html

79.怎样让百度、Google搜到你的博客 http://hi.baidu.com/tchzx/blog/item/3c6ab5b70df03df430add15f.html

80.如何加上一个个性时间网页上?http://hi.baidu.com/tchzx/blog/item/f467a7ec9522603d279791a5.html

81.教你怎样让背景自动更新,包括头背景 http://hi.baidu.com/tchzx/blog/item/92eb968f3bd93afa503d927a.html

82.在 CSS 中关于字体处理效果的思考 http://hi.baidu.com/tchzx/blog/item/4ac6be3876097ac2d4622526.html

83.如何置顶文章及美化自定意模块! http://hi.baidu.com/tchzx/blog/item/6c1f97523edf440e0df3e382.html

84.如何美化页眉部分 http://hi.baidu.com/tchzx/blog/item/d6f1ecc4d2bb75a98326ac83.html

85.更换背景及滚动轴颜色和空间半透代码 http://hi.baidu.com/tchzx/blog/item/4dd018306adb8e99a8018e8c.html

86.如何设置标题.简介及文章字体为光晕字 http://hi.baidu.com/tchzx/blog/item/55a6221f8acae6c8a786698c.html

87.用CSS来控制网页背景 http://hi.baidu.com/tchzx/blog/item/cce94b08ec6526950b7b8228.html

88.CSS产生的特殊效果 http://hi.baidu.com/tchzx/blog/item/e763a11ebdb7c61f40341728.html

89.用Css控制IE5.5浏览器中滚动条 http://hi.baidu.com/tchzx/blog/item/4dd0183097408399a8018e29.html

90.css语法(百度空间) http://hi.baidu.com/tchzx/blog/item/e5e21ed8ac5b8a3532fa1c29.html

第二部分

0.空间制作目录
http://hi.baidu.com/huge/blog/item/9f35cffc6b46f382b901a001.html


1.百度官方空间CSS说明
http://hi.baidu.com/huge/blog/item/83420fb3541b3ba7d9335a36.html

2.最浅显易懂的百度CSS教程
http://hi.baidu.com/huge/blog/item/cc50ad4bb0560af082025c3c.html

3.你的博客值多少钱?
http://hi.baidu.com/huge/blog/item/9ac5277f0d2e760828388a71.html

4.如何提高百度空间访问量?
http://hi.baidu.com/huge/blog/item/f6d7b745c7dee526cffca3ef.html

5.给百度空间的几点改进建议
http://hi.baidu.com/huge/blog/item/8f56d6889045ff94a4c272e9.html

6.百度空间的网址功能连接项
http://hi.baidu.com/huge/blog/item/075f510f6c82512a6059f3eb.html

7.个人空间常用特殊符号介绍
http://hi.baidu.com/huge/blog/item/33cea3cc9ca30b1001e928ea.html

8.CSS代码图解(转)
http://hi.baidu.com/huge/blog/item/4a3f11df34acf31363279830.html

9.百度空间实用技巧集
http://hi.baidu.com/huge/blog/item/a1225c603a4f25df8db10d9e.html

10.百度空间个性代码
http://hi.baidu.com/huge/blog/item/d3089d16e09cf051f3de321d.html

11.利用重新定义标签,达到写文章时迅速排版的目的
http://hi.baidu.com/huge/blog/item/a42b9b50a3bb5362853524e9.html

12.边框风格属性(border-style)
http://hi.baidu.com/huge/blog/item/7d4a252d6d53ae34349bf7e9.html

13.百度空间布局剖析
http://hi.baidu.com/huge/blog/item/73151d95820284087bf480e9.html

14.浏览器窗口滚动条特效及添加滚动条的方法
http://hi.baidu.com/huge/blog/item/8f4bd109bea71a82d1581be8.html

15.教你怎样让背景自动更新,包括头背景
http://hi.baidu.com/huge/blog/item/383ed42a924cb29b033bf6e8.html

16.给超链接添加按钮效果
http://hi.baidu.com/huge/blog/item/1e5c78f09eddd4c37931aa9b.html

17.超链接效果修改--由浅入深
http://hi.baidu.com/huge/blog/item/ae0f8701daf301d6277fb5e8.html

18.插入图片位置的代码及效果演示图
http://hi.baidu.com/huge/blog/item/cc4bccbf7070fb0a18d81f60.html

19.使博客文章中链接在新窗口中打开
http://hi.baidu.com/huge/blog/item/c7a74aedac9df0d4b21cb166.html

20.文字发光方法!!!
http://hi.baidu.com/huge/blog/item/833c0708a3d56430e8248865.html

21.自制闪字空间名称
http://hi.baidu.com/huge/blog/item/26d49f3dcc37aa00baa1679a.html

22.各模块添加滚动条实例 + 参数详解
http://hi.baidu.com/huge/blog/item/1e285bb500016ece36d3ca9b.html

23.在百度空间里面添加自己的LOGO等等特效技巧
http://hi.baidu.com/huge/blog/item/1e285bb5000c6ece36d3ca9e.html

24.无缝调用不同模板CSS的办法
http://hi.baidu.com/huge/blog/item/1e285bb5000e6ece36d3ca9c.html

25.在文章中插入FLASH的制作过程
http://hi.baidu.com/huge/blog/item/8d419822c3b377f3d7cae2b5.html

26.如何在百度空间里添加多首背景音乐(图解)
http://hi.baidu.com/huge/blog/item/3b8459ee9a532ffbb2fb9536.html

27.教你如何制作个性化的标题栏
http://hi.baidu.com/huge/blog/item/2988033b928cb3ea15cecb29.html

28.文章列表板块文章区边框的设置
http://hi.baidu.com/huge/blog/item/b4643912ceb3c951f819b8d8.html

29.百度空间搜索模块css样式
http://hi.baidu.com/huge/blog/item/9a87a4c23b82ab1b0ef477cb.html

 
2009年06月14日 星期日 16:04

http://hi.baidu.com/%B0%D9%B6%C8%BF%D5%BC%E4/blog/item/a6d9bc3eb987c2f9828b13d3.html

亲爱的Hier们:

空间变得更“聪明”了!“相关文章”功能上线啦!

您是否希望在空间中结识更多志同道合的朋友?!空间最新增加了“相关文章”功能,您可以在自己或其他朋友空间感兴趣的文章后查看与之相关话题的文章,也可以看到哪些朋友正在与您关注同一话题。同时您的文章也会被对相同话题感兴趣的朋友所关注。

1、如何添加\取消相关文章功能

登录后在设置页——基本选项中选择是否显示相关文章——点击“保存选项”即可添加\取消相关文章功能。

2、如果您添加了相关文章功能,但没有与此话题或内容相关的文章,将不出现相关文章。


3、相关文章的CSS,供大家调整此部分样式时参考.

#in_related_doc{margin-bottom:6px;color:#333333;font-size:12px}
/* "相关文章:" 标题的样式*/
#in_related_doc div.tit{margin-bottom:12px;color:#333333;font-size:14px;font-weight:bold}
/* 链接的字号和颜色 */
#in_related_doc a{color:#3399CC;font-size:12px}
/* 访问之后的链接的颜色 */
#in_related_doc a:visited{color:#3399CC}


hier们赶紧试试,是不是真的可以找到“臭味相投”的ta?!

 
   
 
 
文章存档
 
     
 
最新文章评论
  

Tourists enjoy all the beach everywhere.not only Phi Phi Island, Thailand.
 

好复杂哦~
   
帮助中心 | 空间客服 | 投诉中心 | 空间协议
©2012 Baidu