夨忆吧 关注:23贴子:84
  • 3回复贴,共1

【百度CSS】设置个性CSS空间代码

只看楼主收藏回复

/*背景设置*/
body{}中加入background:url(http://hi.baidu.com/0454ldk) repeat-x #FFFFFF
注:
repeat                        背景图像在纵向和横向上平铺
no-repeat                   背景图像不平铺
repeat-x                     背景图像在横向上平铺
repeat-y                     背景图像在纵向平铺

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

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

/*全能隐藏代码*/
display:none

/*不停变换空间背景图片*/
http://magic.qtutu.com/


参数
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}
图片上面打上你要的字~欢迎光临http://hi.baidu.com/0454ldk

/*添加LOGO*/
#main {background:url(顶部LOGO) no-repeat 10px 0px;} /*10px 0px;距顶部 距左*/
#layout {width:980px;margin-left:0px;background:url(底部LOGO) no-repeat bottom 0px;padding-bottom:80px} /*margin-left:0px底部图片距离最左边长度;bottom 0px边框大小;padding-bottom:80px主体模块最下端距离底部图片最顶端距离*/

/*添加小背景图片*/
.stage{background:url(小背景图片) repeat-y 0px 0px} /*0px 0px距左        距顶(建议为0)*/

/*空间整体宽度*/
#main{width:740px!important;text-align:center}或#main{width:80%!important}

/*版块长度及间距*/
#layout td.c2t1{padding-left:55px;width:570px} /*最左版块*/
#layout td.c2t2{width:60px} /*左右两版块间距*/
#layout td.c2t3{width:260px;padding-right:30px} /*第2竖列版块信息*/

/*定义阅读文章时 文章块宽度 距左长度*/
.stagepad {width:570px;margin-left:44px;}
.stagepad a:link{text-decoration:none;font-weight:bold}
.stagepad a:visited{text-decoration:none;font-weight:bold}

/*文章虚线边框*/
#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凸边

/*前景图片透明设置*/
filter:alpha(opacity=90,finishopacity=100,style=0,)



1楼2007-08-06 19:45回复
    /*播放器*/
    #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}

    /*滚动条*/
    #m_blog{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:1330px; 
    filter: chroma(color=#E100E1)} 

    /*去掉横向滚动条*/
    在body{ }里加上overflow-x : hidden; 

    /*禁止选择 鼠标右键特效*/
    #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;")

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

    /*弹出窗口*/
    #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())欢迎光临零点壹貮http://hi.baidu.com/0454ldk


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

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

    /*标题背景*/
    #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("欢迎光临http://hi.baidu.com/0454ldk");')}

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

    /*标题栏主体加小图案*/
    模块ID span.modtit{background:url(http://hi.baidu.com/0454ldk) no-repeat top left;font-size:0px;width:100%;margin-left:-18px;padding-top:3px}

    /*常用插入时间图片位置的代码*/
    图片显示位置——个人档案照片下面: 
    #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; } 

    图片显示位置——TAB导航栏: 
    #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; } 

    其他样式显示http://www.csufresno.edu/cgi-bin/Count.cgi?display=date&dd=A

    /*调整图片位置*/
    padding-bottom: 20px; margin-bottom: 5px; padding-bottom为距上高度,margin-bottom为距下高度。


    2楼2007-08-06 19:45
    回复
      /*调整TAB距离*/
      在TAB{}内加入text-indent:30px

      /*分割线*/
      模块ID div.line{margin-top:17px;line-height:17px;background:url(http://hi.baidu.com/0454ldk) repeat-x} 

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

      /*阴影效果字体阴影*/
      {}中加入filter:DropShadow(Color=#000000:,OffX=2, OffY=3,Positive=1);或filter:shadow(Color=#000000:,OffX=2, OffY=3,Positive=1);
      参数作用:
      Color=阴影的颜色代码
      OffX=设置阴影与对象(文字或图片)的横向距离偏移
      OffY=设置阴影与对象的竖向距离偏移
      Positive=设置建立阴影的对象,true是为非透明像素建立阴影,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://hi.baidu.com/0454ldk) 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%}

      /*其他模块添加图片*/
      #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} 

      /*隐藏其他模块标题*/
      #comm_info .modhead span{display:none} 

      /*个人档案添加图片*/
      #m_pro div.image{}加入background:url(http://hi.baidu.com/0454ldk) no-repeat bottom;padding-bott

      om:100px
       bottom让图片沉底
       padding-bottom增加头像模块底下的宽度
       padding-bottom数值一般设置为LOGO的高度值,LOGO的上边与头像的下边距离0,加大padding-bottom的数值,LOGO的上边与头像的下边距离亦加大


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

      /*去除模块背景即完全背景透明*/
      删除模块background-color:……的属性;加background:transparent即可
      在header{}中加入
      background:transparent 这个参数的作用是使完全背景透明,并删除原来的属性background:url(……)
      #header div.rc{}以及.stage{}与header{}同样设置

      /*其他模块标题添加图片*/
      #comm_info span.modtit{color:#737373;text-indent:16px;background:url(http://hi.baidu.com/0454ldk)repeat-x;font-size:0px;width:100%;margin-left:-18px;padding-top:3px}


      3楼2007-08-06 19:46
      回复
        吊炸了!哈哈


        IP属地:山东5楼2015-01-19 21:23
        回复