当前位置:首页 > css应用 >
添加到收藏夹
返回目录页
上一篇:没有了

css应用

 1.如何更换空间背景? 
打开高级设置,再自定义css,看到里面的第3行和第4行都是  
header div.lc{background:url(header div.lc{background:url 

([img]http://img.baidu.com/hi/temp13/hdl.gif[img]) no-repeat}  

第三行的是标题栏左边的图片,第4行是标题栏的右边,建议大家换第4行就行了。  
找一个图片,复制下图片的url地址替换掉第四行的[img]http://img.baidu.com/hi/temp13/hdl.gif[img]就行了。  


2.如何美化你的百度空间的鼠标   
把第一行换成 
body{background:#000;cursor: url(http://webme.bokee.com/inc/mouse028.cur)}   

a:hover{cursor: url(http://webme.bokee.com/inc/mouse031.ani)}   就ok了! 

3.如何隐藏播放器而不影响音乐播放。   
在css 文件的空白处添加以下代码:  

#mod_bgmusic{display:none}  

不显示播放器,但不影响音乐的播放。   
  
4.让baidu空间背景音乐支持多首歌曲了   
将音乐的网址写到一个记事本文件里,保存扩展名为mp3(1.mp3),然后将这个文件找个空间传上去。 

回到空间中将背景音乐的地址设置为你刚刚做的文件就可以。格式如下(最好是wma文件,因为比较快) 

5.在空间中使用html javascight代码(原创) 
先把html javascight代码上传到免费的html主页空间, 
打开网页,把内容复制 
然后,写新文章,把代码粘贴在文章内容里,就ok了! 

6.百度空间文字发光的方法 
第一步 :  
按快捷键,ctrl+f 要搜索的关键字”#m_blog div.cnt” 
第二步:  
把”{color:#000000;line-height:20px;font-size:14px} 
#m_blog div.more{margin:14px 0 16px 0}”换成”{filter:glow 

(color=#ff0000,strength=3);color:#cccccc;font-size:12px;font-size:12px} 

7.教你加显示ip地址代码 
[1] 进入『设置』--->『高级设置』    
[2] 点击右边“自定义css可以让您: • 直接编辑css文件,实现个性化效果”下面的『开始自定义』   
[3] 在最下面加入下面全码   
#comm_info div.line{margin-top:5px;line-height:8px;border-top:1px solid #bbc1c6;  

background:url(http://www.ip.cn/s.php) no-repeat bottom; padding-bottom: 40px; margin- 

bottom: 10px} 

8.这样做到css阴影效果 
   字体阴影就是这个指令  

filter:dropshadow(color=color,offx=offx,offy=offy,  
            positive=positive)   
也支持图片阴影 效果不好

       屏蔽你认为多余的百度空间栏目的方法

方法如下:  

在css代码底部添加一下相应语句即可

div#header div.tit{display:none;}    (屏蔽空间名称语句)

div#tab{display:none;}      (屏蔽空间栏目导航)

按此规则可以屏蔽你百度空间你觉的不需要的任何一个版块.  

其方法是div#+具体版块(css里面有)+{display:none;}   

         给空间首页添加翻页按钮

把以下代码加到你的css中,替换你的css中的body内容
注意:这里要把我的用户名space163修改你自己用户名~! 
 之前的按钮因为少了判断,可能出错 
这里添加了if进行判断 

ps, 
为了不改掉自己的body部分的效果 
你可以在其他的没有需要背景的css标签中加入background就好了 

body { 
  background: url(" 
    javascript:document.body.onload = function(){ 
if(document.getelementbyid("mod_bloglist") ){ 
var objbloglist=document.getelementbyid("mod_bloglist"); 
     objbloglist.innerhtml=objbloglist.innerhtml+"<div align=right><a class=modact href=http://hi.baidu.com/space163/blog/index/1>more...</a></div>";} 
    } 
  "); 
}  

最新消息:出于安全性的考虑,百度空间过滤了css文本中的"javascript"和"expression"字符串,所以以上这个代码就没有效果了。希望百度公司能尽快出台更好的办法。

        百度空间导航栏效果的css代码

在自定义css中,先找到#tab,然后参考下面的css代码做修改

#tab a:link{color:#000000;text-decoration:none;font-size:14px;}
#tab a:visited{color:#000000;text-decoration:none}
#tab a:hover{background:#b7b7b7 bottom;}

#tab 指得是导航栏
a:link, a:visited, a:hover 指的是链接
{..}中的内容是属性

效果见:http://hi.baidu.com/space163

        百度空间的css代码研究之css运用

既然百度空间开放了css,不来玩玩就可惜了
那么这里简要介绍一下css的运用3方式

第一种是包含在<head>...</head>标记里,例如:

<head>
<style type="text/css">
<!--
h1 {font-family:宋体;font-size:12pt;color=blue}
-->
</style>
</head>

<body>
<h1> 在这里是行间h1标记</h1>
</body>

第二种是行间定义,例如:

<body>
<h1 style="font-family:宋体;font-size:12pt;color=blue">这是行间定义的h1标记</h1>
</body>

第三中是调用式,例如:

<head>
<link rel="stylesheet" href="sample.css">
</head>

还有另外一种调用式:

<head>
<style type="text/css">
<!--
@import url(http://www.yourname.com/style.css);
-->
</style>
</head>

      百度空间字体修改之光晕字体

找到

#m_blog div.cnt{color:#cccccc;line-height:20px;font-size:14px}

改成

#m_blog div.cnt{filter: glow(color=#ff0000,strength=3);color:#cccccc;font-size:12px;font-size:12px}

要实现不同的颜色,请对照修改以上代码

解说:

#m_blog div.cnt{filter: glow(color=#ff0000,strength=3);color:#cccccc;font-size:12px;font-size:12px}

                                        `````````````这是光晕颜色;  ```````````````````此处为字体颜色

        如何修改百度空间的鼠标样式

打开你的空间 
设置——高级设置——自定义css——开始自定义 

在空白处插入 
body {(…………………………)} 

在css鼠标样式代码大全里找一个你喜欢的鼠标 
复制代码 
用代码替换 
body {(…………………………)} 
里的…………………… 

保存修改

       如何更换空间的主体背景及文章的背景

主体背景应用于整个空间

一、背景为颜色

body{background:#ffffff}  /*表示背景为白色,亦可以用单词white代替*/

即body{background:black} 

二、背景为图片

body{background:url(http//:图片位置)  参数} /*可识别的图片格式为jpg、gif、bmp等*/

主要参数: 
repeat      :背景图像在纵向和横向上平铺  
no-repeat:背景图像不平铺  
repeat-x  :背景图像在横向上平铺  
repeat-y  :背景图像在纵向平铺 

示例:

body{background:url()  no-repeat  top  right}

/* top   right  表示图片与浏览器的顶边和右边对齐*/

/* bottom   left  表示图片与浏览器的底边和左边对齐*/

 文章背景

主体背景并不应用于文章的背景,所以看到主页的文章背景与博客文章的背景并不一致,另外设置。 

找到以#m_blog div.cnt开头的代码,如: 

#m_blog div.cnt{color:#666666;line-height:10px;font-size:14px} 

添加你喜欢的背景颜色或图片(方法同设置主体背景) 

示例: 
#m_blog div.cnt{padding:10px;background:#ff9966;color:#666666;line-height:10px;font-size:14px} 

/* padding 检索或设置对象四边的补丁边距,简单地说指内容与背景的间距。试一下用与不用的效果就很清楚了。*/ 

      怎样让背景自动更新,包括头背景logo和banner
      看人家都写文章,手痒痒了,虽然技术含量不是很高,但咱也不简单啊.呵呵. 

         大家都见过一些图片贴子回复(刷新)一次就变一个图,很多人都觉的做这图的人一定很了不起,一定很nb,其实也没有什么,就是几句编程语言做的,别怕,虽然涉及编程,但你不需要去学,我们直接拿来用就好了,不懂也没关系.今天我门就利用这种技术教大家怎么让你的空间自动更新背景banner,以及logo,总之一切图形界面都可以自动更新,简单的说就是:你每一次进入空间都是不同的背景和banner,logo.想想看   一个人正浏览你的 博客里的文章时,一退回主页,看到与先前截然不同的背景banner,logo ,  一定会以为baidu空间出bug了,居然专到别的空间了,要么就会赞美斑竹精力真旺盛,居然乐此不疲在着不停的换背景.....

         说那么多,大家肯定都迫不及待了,那就让我门一步一步实现把.

 一,     先教大家做回复一次就变一次的图片.

        ************************* 随机图片显示 **************************** 
使用实例:img.asp?list=图片存放目录 (例如: http://www.dalang.com.cn/testpic/pics.asp?list=imgs&fname这个地址把代码中的img.asp该成了pics.asp)

:图片目录放于本文件同目录下!需要fso支持! 
说明:只要将变化图片放于一个目录下,修改下面程序的(需要修改的地方)成你的目录名称! 
  上传本程序和图片文件夹到同一目录下,在发帖时候使用ubb代码形如:即可! 
---------------------------------------------------------------------------------------- 
function allpath() 
  dim domain,gfilepath 
  domain = request.servervariables("server_name") 
  gfilepath = request.servervariables("ath_info") 
  gfilepath = lcase(left(gfilepath,instrrev(gfilepath,"/"))) 
  allpath = "http://"&domain&gfilepath 
end function 
  
function showfilelist(folderspec) 
  dim path,objfso,objfolder,count,objfile,nume,s 
  ath = server.mappath(folderspec) 
  set objfso = server.createobject("scripting.filesystemobject") 
  if objfso.folderexists(path) then 
  set objfolder = objfso.getfolder(path) 
  count = 0 
  for each objfile in objfolder.files 
  count = count+1 
  next 
  randomize 
  nume = int((count*rnd)+1) 
  s = 0 
  showfilelist = "" 
  for each objfile in objfolder.files 
  s = s + 1 
  if s = nume then 
  showfilelist = objfile.name 
  exit for 
  end if 
  next 
  set objfolder = nothing 
  else 
  showfilelist = "no" 
  end if 
  set objfso = nothing 
end function 
  
dim list,2004528115924.htm,address,str 
  
list = trim(request.querystring("list")) 
if list = "" then 
  response.write "本页需要正确参数引入,您缺少相关的参数!正确格式如下:"&allpath&"img.asp?list=(需要修改的地方)" 
  response.end() 
end if 
  
2004528115924.htm = showfilelist("./"&list&"/") 
if 2004528115924.htm = "no" then 
  response.write "您指定的目录<b>"&list&"</b>不存在,请重新指定!" 
  response.end() 
end if 
  
if 2004528115924.htm = "" then 
  response.write "您指定的目录<b>"&list&"</b>没有相关的图片文件存在,请重新指定!" 
  response.end() 
end if 
  
str = right(2004528115924.htm,3) 
if str<>"jpg" and str<>"gif" then 
2004528115924.htm = "erro.gif" 
end if 
  
address = allpath&list&"/" 
address = address&2004528115924.htm 
%> 
<%response.redirect(address)%> 

 二,php代码的做法

制作方法:

1。选择好相关的图片(最好是一个主题的图片,不要太杂的说)

2。裁剪成尺寸相同的图片,否则会变形的(看到pw也有人用类似的头像,但因为尺寸不一,搞的严重变形,实在是不堪入目啊)

3。新建一个php文件,在里面写:

调用方法:500)this.style.width=500;" onmousewheel="return bbimg(this)">php" border=0 >

以上两种做法你认为那种简单就学那种,不过这两中做法都有一点限制,大家根据你上传的空间的情况选择,上传完以后就得到了会变图片的绝对地址.例如http://www.dalang.com.cn/testpic/pics.asp?list=imgs&fname

有了这个图片地址,我们就可以到处贴我们做的回复一次变一次的图了,当然这不是我们的最终目的,那好,继续往下看.

三    把图片插入百度空间css代码里

1.自动更新的背景

找到第一句代码直接替换成body{background:url(图片地址) no-repeat;background-position:

说明:大家都知道图片地址一般是以jpg,bmp.gif结尾的,但我们的地址却不是,如果百度认不出来怎么办,这样想的人一般是比较细心的,我们把上面的地址在浏览器里连接后会随机得到一个图片,然而地址栏里的地址也变成了这样的

ttp://www.dalang.com.cn/testpic/pics.asp?list=imgs&fname=3.jpg怎么样是jpg结尾的了,不用担心它回只单个图片,把这个地址放浏览器里连接一样会随机放出其他的图片当然地址也变成了以4.jpg或者其他的了.(当然背景图片比较大,banner图片和logo图片比较小,想要全部效果,就勤快点,一个一个做完吧)

2.自动更新banner(就是博客上部的图片)

找到代码

#header div.lc{}
#header div.rc{}

在大括号里加代码    background:url(banner图片地址) no-repeat top left

随便放到那一个括号里都可以.一个就够了.

3.logo动更新

有的人可能看到别人空间里的     其他        这个版快里会有一个图片或者是天气预报或ip显示

有图片的我们就称为logo在css代码找到#comm_info div.line 改为

#comm_info div.line{margin-top:4px;line-height:8px;border-top:2px solid #ff3333;    

background:url(图片地址) no-repeat bottom; padding-bottom: 32px; margin-bottom: 10px}

转自:http://www.hibaidu.com.cn 

         百度空间专栏分割线的css代码修改方法

效果预览: http://hi.baidu.com/1077    注意文章与文章之间的图片

方法:找到相应行 如:

#m_blog div.line行

替换成

#m_blog div.line{margin-top:17px;line-height:17px;background:url(图片地址) repeat-x}


以下是其他分割线代码!

/*文章栏目分割线*/
#m_blog div.line{margin-top:17px;line-height:17px;background:url(图片地址) repeat-x}
/*评论栏目分割线*/
#m_comment div.line{background:url(图片地址);line-height:12px} 
/*文章分类分割线*/
#m_artclg div.line{background:url(图片地址);line-height:12px} 
/*有请连接分割线*/
#m_links div.line{background:url(图片地址);line-height:12px}

      如何为友情链接增加一个滚动条代码

友情链接太长了怎么办,给他加个滚动条呗,赫赫。

方法如下:

在css找到#m_links div.item代码,在它上面增加这一行
#m_links{overflow-y:auto;height:200px}

显示效果:hi.baidu.com/acoolsun 
    

说明:1、overflow-y 设置当对象的内容超过其指定高度时如何管理内容;
         如果是overflow-x 设置当对象的内容超过其指定宽度时如何管理内容。

      2、height:200px 设置<友情链接>的高度。
   
参数 
visible:扩大面积以显示所有内容
auto:  当内容超出限定值时添加滚动条
hidden:隐藏滚动条
scroll:总是显示滚动条

   如果想美化滚动条,则还要增加以下代码:

         #m_links{
overflow-y:auto;height:200px;
scrollbar-face-color:#daa520;
scrollbar-highlight-color:#fff;
scrollbar-shadow-color:#000;
scrollbar-arrow-color:#4b0082;
scrollbar-base-color:#daa520; 
scrollbar-dark-shadow-color:#69f; 
}

    说明:
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 设置或检索滚动条基准颜色。其它界面颜色将据此自动调整
   
主要更改是base和face的颜色

文章列表滚动条方法相同
要把#m_links{overflow-y:auto;height:200px}
改成#m_blog{overflow-y:auto;height:200px}
然后修改其中的高度参数即可。

最新评论:
要把#m_links{overflow-y:auto;height:200px}
改成#m_comment{overflow-y:auto;height:200px}
然后修改其中的高度参数即可。

       让你的百度空间半透明!半透明代码

在 
#m_blog div.tit{font-size:14px;font-weight:bold} 
上面的空白处插入下面这句代码就好了 

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

效果见:http://hi.baidu.com/1077

       在百度空间中插入图片位置的代码 (1)

应网友之请,将几个常用的插入图片的代码给大家,大家只需将相应代码添加到css中即可得到下面的效果。大家需要将代码中的网址,换为自己想插入图片的网址。由于图片大小不定,所以可能需要调整下面两个参数,以求和页面搭配和谐: 

padding-bottom: 22px; margin-bottom: 6px; 改后面数字即可,padding-bottom为距上高度,margin-bottom为距下高度。

下一篇:没有了
© 2006-2008 All Rights Reserved