谁能提供网页樱花飘落的背景特效?

html-css020

谁能提供网页樱花飘落的背景特效?,第1张

背景颜色自己选[推荐][共1步]

====1、以下是这个效果的全部代码。[最好从一个空页面开始]

<html>

<head>

<meta http-equiv="Content-Type" content="text/htmlcharset=gb_2312-80">

<title>新页面 </title>

</head>

<body>

<script language="JavaScript">

<!--

done = 0

step = 4

function anim(yp,yk)

{

if(document.layers) document.layers["napis"].top=yp

else document.all["napis"].style.top=yp

if(yp>yk) step = -4

if(yp<60) step = 4

setTimeout('anim('+(yp+step)+','+yk+')', 35)

}

function start()

{

if(done) return

done = 1

if(navigator.appName=="Netscape") {

document.napis.left=innerWidth/2 - 145

anim(60,innerHeight - 60)

}

else {

napis.style.left=11

anim(60,document.body.offsetHeight - 60)

}

}

//-->

</script>

<div id="napis"

style="position: absolutetop: -50

color: #000000font-family:宋体font-size:9pt">

</div><script language="JavaScript">

<!--

setTimeout('start()',10)

//-->

</script>

<script language="JavaScript">

<!-- Begin

function initArray() {

for (var i = 0i <initArray.arguments.lengthi++) {

this[i] = initArray.arguments[i]

}

this.length = initArray.arguments.length

}

var colors = new initArray(

"#000000","#0000FF","#80FFFF","#80FF80","#FFFF00","#FF8000","#FF00FF","#FF0000"

)

delay = 100

link = 0

vlink = 0

function linkDance() {

link = (link+1)%colors.length

vlink = (vlink+1)%colors.length

document.linkColor = colors[link]

document.vlinkColor = colors[vlink]

setTimeout("linkDance()",delay)

}

linkDance()

// End -->

</script>

<script>

function colors(c1){

this.c1 = c1

}

a00 = new colors("FFFBD0")

a01 = new colors("FF0000")

a02 = new colors("FF8080")

a03 = new colors("FF8000")

a04 = new colors("FFFF00")

a05 = new colors("000080")

a06 = new colors("0000FF")

a07 = new colors("008000")

a08 = new colors("00FF00")

a09 = new colors("804000")

a10 = new colors("808000")

a11 = new colors("000000")

a12 = new colors("FFFFFF")

a13 = new colors("C0C0C0")

a14 = new colors("408080")

a15 = new colors("808080")

a16 = new colors("D2BF51")

a17 = new colors("44BBE8")

a18 = new colors("C97AB9")

a19 = new colors("A2C97A")

a20 = new colors("804000")

a21 = new colors("6AE6C4")

a22 = new colors("33A3D1")

a23 = new colors("6C9AEE")

function changebg(type){

scheme = type

document.bgColor = scheme.c1

timerID=setTimeout('document.bgColor = scheme.c2', document.selector.value * 10)

}

</script>

<form NAME="selector">

<p><input TYPE="button" onClick="changebg(a00)" style="background-color: rgb(255,251,208)"><input

TYPE="button" onClick="changebg(a01)" style="background-color: rgb(255,0,0)"><input

TYPE="button" onClick="changebg(a02)" style="background-color: rgb(255,128,128)"><input

TYPE="button" onClick="changebg(a03)" style="background-color: rgb(255,128,0)"><input

TYPE="button" onClick="changebg(a04)" style="background-color: rgb(255,255,0)"><input

TYPE="button" onClick="changebg(a05)" style="background-color: rgb(0,0,128)"><input

TYPE="button" onClick="changebg(a06)" style="background-color: rgb(0,0,255)"><input

TYPE="button" onClick="changebg(a07)" style="background-color: rgb(0,128,0)"><input

TYPE="button" onClick="changebg(a08)" style="background-color: rgb(0,255,0)"><input

TYPE="button" onClick="changebg(a09)" style="background-color: rgb(128,0,0)"><input

TYPE="button" onClick="changebg(a10)" style="background-color: rgb(128,128,0)"><input

TYPE="button" onClick="changebg(a11)" style="background-color: rgb(0,0,0)"><input

TYPE="button" onClick="changebg(a12)" style="background-color: rgb(255,255,255)"><input

TYPE="button" onClick="changebg(a13)" style="background-color: rgb(192,192,192)"><input

TYPE="button" onClick="changebg(a14)" style="background-color: rgb(64,128,128)"><input

TYPE="button" onClick="changebg(a15)" style="background-color: rgb(128,128,128)"><input

TYPE="button" onClick="changebg(a16)" style="background-color: rgb(210,191,81)"><input

TYPE="button" onClick="changebg(a17)" style="background-color: rgb(68,187,232)"><input

TYPE="button" onClick="changebg(a18)" style="background-color: rgb(201,122,185)"><input

TYPE="button" onClick="changebg(a19)" style="background-color: rgb(162,201,122)"><input

TYPE="button" onClick="changebg(a20)" style="background-color: rgb(106,230,196)"><input

TYPE="button" onClick="changebg(a21)" style="background-color: rgb(194,219,185)"><input

TYPE="button" onClick="changebg(a22)" style="background-color: rgb(51,163,209)"><input

TYPE="button" onClick="changebg(a23)" style="background-color: rgb(108,154,238)"></p>

</form>

</body>

</html>

不停变换的背景颜色[共1步]

====1、将以下代码加入HTML的<body></body>之间:

<body bgColor="#ffffff" onload="chgCol()pingpong()">

<script language="JavaScript">

<!-- Hide from JavaScript-Impaired Browsers

var pos = 10

function initArray() {

this.length = initArray.arguments.length

for (var i = 0i <this.lengthi++) {

this[i] = initArray.arguments[i]

}

}

var col=new initArray("4b","5b","8b","8b")

col[0] = "yellow"

col[1] = "coral"

col[2] = "orange"

col[3] = "red"

col[4] = "greenyellow"

col[5] = "lime"

col[6] = "turquoise"

col[7] = "coral"

col[8] = "blueviolet"

col[9] = "violet"

function chgCol() {

pos++

if (pos<0||pos>9) {

pos = 0

}

document.bgColor = col[pos]

setTimeout("chgCol()",5000)

/* Change above set to every 10 seconds (1000 = 1 sec) If

you wish to speed it up, lower the number. To slow it

down, raise the number. */

}

var yourwords = "不断变化背景色彩"var buffer1=" "var buffer2=" "var message1=buffer1+yourwords+buffer2var dir = "left"var speed =150function pingpong(){if (dir == "left") { message2=message1.substring(2,message1.length)+" "window.status=message2setTimeout("pingpong()",speed)message1=message2if (message1.substring(0,1) == "*") dir="right"}else { message2=" "+message1.substring(0,message1.length-2)window.status=message2setTimeout("pingpong()",speed)message1=message2if (message1.substring(message1.length-1,message1.length) == "*") dir="left"}}// --></script>

检测浏览器类型并调用不同的背景音乐[修改MIDI文件名][共1步]

====1、将以下代码加入HTML的<body></body>之间:

<SCRIPT LANGUAGE="JavaScript">

<!-- Begin

var MSIE=navigator.userAgent.indexOf("MSIE")

var NETS=navigator.userAgent.indexOf("Netscape")

var OPER=navigator.userAgent.indexOf("Opera")

if((MSIE>-1) || (OPER>-1)) {

document.write("<BGSOUND SRC=sound.mid LOOP=INFINITE>")

} else {

document.write("<EMBED SRC=sound2.mid AUTOSTART=TRUE ")

document.write("HIDDEN=true VOLUME=100 LOOP=TRUE>")

}

// End -->

</SCRIPT>

滚动背景[特别推荐][共1步][IE专用]<先在页面中设置好背景图片然后再进行下一步>

====1、将以下代码加入HEML的<body></body>之间:

<script language="VBScript">

dim c,numgc

c=-100000

numgc=document.body.sourceIndex

sub SF

c=c+1

Document.all(numgc).style.BackgroundPosition= "0 " &c

id=SetTimeOut("SF",16,"VBScript")

end sub

SF

</script>

永远居中的背景图片[推荐][共1步][修改图片名称]

====1、将以下代码加入HEML的<body></body>之间:

<STYLE TYPE="text/css">

<!--

BODY {background-image: URL(图片名称.gif)

background-position: center

background-repeat: no-repeat

background-attachment: fixed}

-->

</STYLE>

随机显示的背景图片[想别人每次看你页面时背景都不一样吗?][共1步]

====1、将以下代码加入HTML的<head></head>之间:

<script LANGUAGE="JavaScript">

bg = new Array(2)//设定图片数量,如果图片数为3,这个参数就设为2,依次类推

bg[0] = 'bg1.gif' //显示的图片路径,可用http://

bg[1] = 'bg2.gif'

bg[2] = 'bg3.gif'

index = Math.floor(Math.random() * bg.length)

document.write("<BODY BACKGROUND="+bg[index]+">")

</script>

跟随屏幕移动的图像[推荐]修改图片名称和文字即可][共2步]

====1、将以下代码加入到HEML的<head></head>之间:

<style type="text/css">

#floater {

position: absolute

left: 500

top: 146

width: 125

visibility: visible

z-index: 10

}</style>

====2、将以下代码加入到HEML的<body></body>之间

<div ID="floater" style="left: 590pxtop: 158px">

<p align="center"><img SRC="想要显示的图片.gif" alt="图片显示的文字" WIDTH="125" HEIGHT="60"><br>

<font color="#FF8040">图片下面的文字</font></p>

</div><script LANGUAGE="JavaScript">

self.onError=null

currentX = currentY = 0

whichIt = null

lastScrollX = 0lastScrollY = 0

NS = (document.layers) ? 1 : 0

IE = (document.all) ? 1: 0

<!-- STALKER CODE -->

function heartBeat() {

if(IE) { diffY = document.body.scrollTopdiffX = document.body.scrollLeft}

if(NS) { diffY = self.pageYOffsetdiffX = self.pageXOffset}

if(diffY != lastScrollY) {

percent = .1 * (diffY - lastScrollY)

if(percent >0) percent = Math.ceil(percent)

else percent = Math.floor(percent)

if(IE) document.all.floater.style.pixelTop += percent

if(NS) document.floater.top += percent

lastScrollY = lastScrollY + percent

}

if(diffX != lastScrollX) {

percent = .1 * (diffX - lastScrollX)

if(percent >0) percent = Math.ceil(percent)

else percent = Math.floor(percent)

if(IE) document.all.floater.style.pixelLeft += percent

if(NS) document.floater.left += percent

lastScrollX = lastScrollX + percent

}

}

<!-- /STALKER CODE -->

<!-- DRAG DROP CODE -->

function checkFocus(x,y) {

stalkerx = document.floater.pageX

stalkery = document.floater.pageY

stalkerwidth = document.floater.clip.width

stalkerheight = document.floater.clip.height

if( (x >stalkerx &&x <(stalkerx+stalkerwidth)) &&(y >stalkery &&y <(stalkery+stalkerheight))) return true

else return false

}

function grabIt(e) {

if(IE) {

whichIt = event.srcElement

while (whichIt.id.indexOf("floater") == -1) {

whichIt = whichIt.parentElement

if (whichIt == null) { return true}

}

whichIt.style.pixelLeft = whichIt.offsetLeft

whichIt.style.pixelTop = whichIt.offsetTop

currentX = (event.clientX + document.body.scrollLeft)

currentY = (event.clientY + document.body.scrollTop)

} else {

window.captureEvents(Event.MOUSEMOVE)

if(checkFocus (e.pageX,e.pageY)) {

whichIt = document.floater

StalkerTouchedX = e.pageX-document.floater.pageX

StalkerTouchedY = e.pageY-document.floater.pageY

}

}

return true

}

function moveIt(e) {

if (whichIt == null) { return false}

if(IE) {

newX = (event.clientX + document.body.scrollLeft)

newY = (event.clientY + document.body.scrollTop)

distanceX = (newX - currentX)distanceY = (newY - currentY)

currentX = newXcurrentY = newY

whichIt.style.pixelLeft += distanceX

whichIt.style.pixelTop += distanceY

if(whichIt.style.pixelTop <document.body.scrollTop) whichIt.style.pixelTop = document.body.scrollTop

if(whichIt.style.pixelLeft <document.body.scrollLeft) whichIt.style.pixelLeft = document.body.scrollLeft

if(whichIt.style.pixelLeft >document.body.offsetWidth - document.body.scrollLeft - whichIt.style.pixelWidth - 20) whichIt.style.pixelLeft = document.body.offsetWidth - whichIt.style.pixelWidth - 20

if(whichIt.style.pixelTop >document.body.offsetHeight + document.body.scrollTop - whichIt.style.pixelHeight - 5) whichIt.style.pixelTop = document.body.offsetHeight + document.body.scrollTop - whichIt.style.pixelHeight - 5

event.returnValue = false

} else {

whichIt.moveTo(e.pageX-StalkerTouchedX,e.pageY-StalkerTouchedY)

if(whichIt.left <0+self.pageXOffset) whichIt.left = 0+self.pageXOffset

if(whichIt.top <0+self.pageYOffset) whichIt.top = 0+self.pageYOffset

if( (whichIt.left + whichIt.clip.width) >= (window.innerWidth+self.pageXOffset-17)) whichIt.left = ((window.innerWidth+self.pageXOffset)-whichIt.clip.width)-17

if( (whichIt.top + whichIt.clip.height) >= (window.innerHeight+self.pageYOffset-17)) whichIt.top = ((window.innerHeight+self.pageYOffset)-whichIt.clip.height)-17

return false

}

return false

}

function dropIt() {

whichIt = null

if(NS) window.releaseEvents (Event.MOUSEMOVE)

return true

}

<!-- DRAG DROP CODE -->

if(NS) {

window.captureEvents(Event.MOUSEUP|Event.MOUSEDOWN)

window.onmousedown = grabIt

window.onmousemove = moveIt

window.onmouseup = dropIt

}

if(IE) {

document.onmousedown = grabIt

document.onmousemove = moveIt

document.onmouseup = dropIt

}

if(NS || IE) action = window.setInterval("heartBeat()",1)

</script>

可以看一下http://www.ik8.com/

在上面点右键:背景另存为就可以了。是一个名为header.jpg的图片文件。

如果你不能右键,你可以这样:

1、查看源文件,可以看到其中有这样一句引用的CSS:

<link rel="stylesheet" id="css_extstyle" type="text/css" href="./template/default/style/xueye1.0-wanmeifengfeng-x2/style.css" />

2、根据这个地址,输入其绝对路径:

http://dcacg.com/template/default/style/xueye1.0-wanmeifengfeng-x2/style.css

可以获取到样式表文件。

3、查看这个样式表文件,可以看到其中的header.jpg与footer.jpg,现在把这两个文件名加到上面的路径下面如这样:

http://dcacg.com/template/default/style/xueye1.0-wanmeifengfeng-x2/header.jpg

http://dcacg.com/template/default/style/xueye1.0-wanmeifengfeng-x2/footer.jpg

这样就可以得到你需要的东西了。

不用谢谢。

这个空间是专门教人CSS的,我就是从一点也不懂到稍微懂点全是在这个空间里学的。 http://hi.baidu.com/space163body{ background-color:#47B12Cbackground-image: URL(http://hiphotos.baidu.com/sysu%5Fgreen/pic/item/90e019d5723bbcc451da4b0e.jpg

)/*大背景*/ background-position: centerbackground-repeat: no-repeatbackground-attachment: fixedCURSOR:http://webme.bokee.com/inc/mouse052.aniSCROLLBAR-FACE-COLOR: #47B12CSCROLLBAR-HIGHLIGHT-COLOR: whiteSCROLLBAR-SHADOW-COLOR: #FFFFCDSCROLLBAR-3DLIGHT-COLOR: whiteSCROLLBAR-ARROW-COLOR: #FFFFCDSCROLLBAR-TRACK-COLOR: whiteSCROLLBAR-DARKSHADOW-COLOR: #FFFFCDfilter: Xray} #header /*主体部分*/{ height:289pxbackground-color: #009900} #header div.lc /*左背景图*/{ background-image: url(http://hiphotos.baidu.com/sysu_green/pic/item/e2cd8f1082cc5b01213f2e5e.jpg

)background-repeat: no-repeatbackground-position: left centerbackground-attachment: fixed} /*#header div.rc /*右背景图 banner条*//*{background*/ /*url(http://hiphotos.baidu.com/sysu_green/pic/item/31d77b310faaec19eac4af70.jpg

) no-repeat top right}*/ #header div.tit /*空间名称*/{ top:3pxleft:20pxline-height:normalfont-size:largefont-family:"隶书"color: #00FF00text-decoration: blink} #header div.tit a.titlink /*空间名称链接*/{color:#00FF00text-decoration:blink} #header div.tit a.titlink:visited{color:#FFFFFFtext-decoration:none} #header div.desc /*空间简介*/{ top:200pxleft:autocolor:#000080font-size:mediumfont-family: "华文新魏"text-decoration: blinktext-align: centerwhite-space: pre} #tabline /*TAB菜单下方的横线*/{ top:autobackground-color:#FFFFFFcolor: #009900} #tab /*TAB菜单主体*/{ top:265pxbackground-image: nonebackground-repeat: no-repeat} #tab a.on,#tab a.on:link,#tab a.on:visited /*TAB选中状态*/{ line-height:19pxcolor:#00FF00font-size:14pxborder-top-width: 0pxborder-right-width: 0pxborder-bottom-width: 0pxborder-left-width: 0pxborder-top-style: grooveborder-right-style: ridgeborder-bottom-style: insetborder-left-style: ridgeborder-top-color: #009900border-right-color: #009900border-bottom-color: #009900border-left-color: #009900margin: 0px} #tab span /*TAB与TAB之间的分割符“|” */{ font-size:0pxtext-decoration: none} #tab a:link /*TAB未选中状态*/{color:#009900font-size:14px} #tab a:visited{color:#00FF66text-decoration:nonefont-size:14px} #tab2 /*设置TAB菜单主体*/{} #tab2 span /*TAB选中状态*/{ color:#FF0000font-size:12pxfont-weight:boldtext-decoration: blink} #tab2 a /*TAB未选中状态*/{ font-size:12pxcolor: #009900} #tab2 a:link{color:#33FF66} #tab2 a:visited{color:#FF0000} .stage /*(TAB菜单与版权信息之间的区域)*/{} /*其它区域(即访问量等信息)*/ #comm_info /*主体*/{ color:#009900font-family:"华文楷体"text-align:centerfont-size: largefont-style: normalline-height: normalfont-weight: boldfont-variant: small-capstext-transform: capitalizetext-decoration: blinkbackground-attachment: fixedbackground-image: url(http://www.ip.cn/s.php)background-position: center centerwhite-space: prebackground-repeat: no-repeat} #comm_info div.line /*分界线*/{ line-height:50pxbackground-image: url(http://www.ran.co.jp/Sozai/H161114D/049624.gif)text-decoration: nonemargin: autopadding: 0pxbackground-attachment: scrollbackground-repeat: repeat-xbackground-position: left topborder-top-width: 0pxborder-right-width: 0pxborder-bottom-width: 0pxborder-left-width: 0pxborder-top-style: noneborder-right-style: noneborder-bottom-style: noneborder-left-style: none} #comm_info a /*链接*/{color:#3399CC} /*页码区域*/ #page /*主体*/{height:30pxfont-size:14pxfont-family:Arialtext-align:center} #page span /*当前页码(不可点击)*/{padding:3pxcolor:#009900font-size:14pxfont-weight:bold} #page a.pc /*上一页和下一页*/{color:#3399CCfont-size:14pxfont-weight:bold} #page a.pc:visited{color:#3399CC} #page a.pi /*页码(可点击)*/{padding:3pxcolor:#3399CCfont-size:14px} #page a.pi:visited{color:#3399CC} /*模块*/ .mod {margin-bottom:10px} .modhandle{cursor:move} .modth /*模块标题栏主体*/{ height:50pxbackground-attachment: fixedbackground-image: url(http://www.ran.co.jp/Sozai/H1611143/011852.gif)background-repeat: no-repeatbackground-position: left top} .modhead{padding:4px 4px 0 4px} .modopt /*模块操作区(如写新文章)*/{padding:4px 4px 0 0} .modtit /*模块标题区(如文章列表)*/{ color:#0000FFfont-size:18pxfont-weight:boldfont-family: "华文行楷"}a.modtit{color:#FFFFFF}a.modtit:visited{color:#FFFFFF} .modtitlink{color:#FFFFFFfont-size:12pxfont-weight:bold}a.modtitlink{color:#FFFFFFtext-decoration:none}a.modtitlink:visited{color:#FFFFFFtext-decoration:none}a.modtitlink:hover{color:#FF5100text-decoration:underline} .modact /*操作文字链接(如文章列表)*/{color:#FFFFFFfont-size:12px}a.modact:link{color:#FFFFFF}a.modact:visited{color:#FFFFFF} .modbox /*模块内容区*/{ padding:0pxbackground-attachment: scrollbackground-image: url(background-repeat: repeat-ybackground-position: left top} .modtl /*模块左上角背景*/{background:url(temp1/ptitl.gif) no-repeat top leftline-height:1px} .modtc /*模块中上背景*/{background:url(temp1/ptitc.gif) repeat-x} .modtr /*模块右上角背景*/{background:url(temp1/ptitr.gif" target="_blank" >http://hiphotos.baidu.com/sysu%5Fgreen/pic/item/991c2a383c578824b8998f18.jpg)background-repeat: repeat-ybackground-position: left top} .modtl /*模块左上角背景*/{background:url(temp1/ptitl.gif) no-repeat top leftline-height:1px} .modtc /*模块中上背景*/{background:url(temp1/ptitc.gif) repeat-x} .modtr /*模块右上角背景*/{background:url(temp1/ptitr.gif

) no-repeat top rightline-height:1px} .modbl /*模块左下角背景*/{background-color:#FFFFFFline-height:1px} .modbc /*模块中下背景*/{background-color:#FFFFFFline-height:1px} .modbr /*模块右下角背景*/{background-color:#FFFFFFline-height:1px} /*.modbox,.modbl,.modbc,.modbr{filter:alpha(opacity=65)-moz-opacity:0.9width:auto !importantwidth:100%}*/ /*文章标题*/ #m_blog div.tit{ font-size:x-largefont-weight:boldfilter:Shadow(Color=gray,Direction=135)text-indent:4cm/*标题居中,采用了缩进*/ line-height:127px/*增大行高,使背景图片完全显示*/ line-height:127pxtext-indent:234pxbackground:url(http://hiphotos.baidu.com/sysu_green/pic/item/584812383ebba4f2b311c769.jpg

) no-repeatfont-family: "华文行楷"color: #009900}/*每篇文章前面的图*/ #m_blog div.tit /*文章标题链接*/ a{color: #009900font-size:x-largefont-weight:bold} #m_blog div.tit a:visited{color:#333333} #m_blog div.date /*文章发表日期*/{ margin:5px 0 8px 0color:#FF0000font-family: "华文新魏"font-size: mediumtext-decoration: blink} #m_blog div.cnt /*文章内容*/{color:#333333line-height:20pxfont-size:14px} #m_blog div.more{margin:14px 0 16px 0} #m_blog div.more a /*阅读全文链接*/{color:#3399CCfont-size:14px} #m_blog div.more a:visited{color:#3399CC} #m_blog div.opt /*文章操作区(如编辑、评论等)*/{color:#666666font-size:12px} #m_blog div.opt a /*文章操作链接*/{color:#3399CCfont-size:12px} #m_blog div.opt a:visited{color:#3399CC} #m_blog div.line /*分界线*/{ margin-top:autoline-height:20pxbackground-image: url(http://city.9sky.com/non-cgi/usr/27/27_4200_36.gif)border-top-width: 0pxborder-right-width: 0pxborder-bottom-width: 0pxborder-left-width: 0pxborder-top-style: noneborder-right-style: noneborder-bottom-style: noneborder-left-style: nonebackground-attachment: scrollbackground-repeat: repeat-xbackground-position: left top} #m_blog div.none /*无文章提示信息*/{padding:100px 0 100px 0color:#333333font-size:14px} #m_pro a /*链接*/{color:#3399CC} #m_pro a:visited{color:#3399CC} #m_pro div.image /*个人头像*/{text-align:center} #m_pro div.act /*操作区(如加为好友、发送消息)*/{margin-top:10px} #m_pro div.user /*用户名*/{margin-top:10pxcolor:#333333font-size:12pxfont-weight:bold} #m_pro div.desc /*用户简介*/{color:#333333font-size:12px} #m_pro div.line /*分界线*/{ line-height:50pxbackground-image: url(http://city.9sky.com/non-cgi/usr/27/27_4200_53.gif)/*草*/ margin: autoborder-top-width: 0pxborder-right-width: 0pxborder-bottom-width: 0pxborder-left-width: 0pxborder-top-style: noneborder-right-style: noneborder-bottom-style: noneborder-left-style: none} #m_pro td{color:#333333line-height:24pxfont-size:14px} #m_album div.image /*照片*/{text-align:center} #m_album div.page {color:#666666font-size:12pxtext-align:center} #m_album div.page a{color:#0000CCfont-size:12px} #m_album div.page a:visited{color:#0000CC} #m_links div.item /*子项*/{color:#333333font-size:12px} #m_links div.item a /*名称(链接)*/{color:#3399CCfont-size:12pxtext-decoration:none} #m_links div.item a:visited{color:#3399CC} #m_links div.line /*分界线*/{ line-height:40pxbackground-image: url(http://city.9sky.com/non-cgi/usr/27/27_4200_53.gif)margin: autoborder-top-width: 0pxborder-right-width: 0pxborder-bottom-width: 0pxborder-left-width: 0pxborder-top-style: noneborder-right-style: noneborder-bottom-style: noneborder-left-style: nonebackground-attachment: scrollbackground-repeat: repeat-xbackground-position: left top} #m_artclg div.item /*子项*/{color:#666666font-size:12px} #m_artclg div.item a /*分类名称(链接)*/{color:#3399CCfont-size:12px} #m_artclg div.item a:visited{color:#3399CC} #m_artclg div.line /*分界线*/{ margin-top:5pxline-height:50pxbackground-image: url(http://fairydoudou824.vip.sina.com/webgif01/l_gg01.gif)border-top-width: 0pxborder-right-width: 0pxborder-bottom-width: 0pxborder-left-width: 0pxborder-top-style: noneborder-right-style: noneborder-bottom-style: noneborder-left-style: none} /*最新评论区域*/ #m_comment div.item /*子项*/{color:#333333font-size:12px} #m_comment div.item a /*发表人(链接)*/{color:#3399CCfont-size:12px} #m_comment div.item a:visited{color:#3399CC} #m_comment div.item a.cnt /*评论摘要(链接)*/{color:#333333font-size:12pxtext-decoration:none} #m_comment div.item a.cnt:visited{color:#333333text-decoration:none} #m_comment div.item a.cnt:hover{color:#333333text-decoration:underline} #m_comment div.line /*分界线*/{ line-height:50pxbackground-image: url(http://fairydoudou824.vip.sina.com/webgif01/l_yo13.gif)margin: autoborder-top-width: 0pxborder-right-width: 0pxborder-bottom-width: 0pxborder-left-width: 0pxborder-top-style: noneborder-right-style: noneborder-bottom-style: noneborder-left-style: none} /*相册列表*/ #m_albumlist div.note{color:#333333font-size:14px} #m_albumlist div.desc /*简介*/{margin-bottom:12pxpadding:3px 10px 3px 10pxline-height:22pxbackground-color:#F2F2F2font-size:14px} #m_albumlist div.none /*无照片提示信息*/{padding:100px 0 100px 0color:#333333font-size:14px} #m_albumlist div.line /*分界线*/{ margin-top:10pxline-height:50pxborder-top:1px solid #D2E9F4background-image: url(http://fairydoudou824.vip.sina.com/webgif01/l_gree.gif)} #m_albumlist div.tit /*照片标题*/{margin:6px 0 7px 0color:#333333font-size:14px} #m_albumlist div.tit a /*照片标题链接*/{color:#3399CCfont-size:14px} #m_albumlist div.tit a:visited{color:#3399CC} #m_albumlist span.count /*照片数量*/{color:#666666font-size:12pxfont-weight:bold} #m_albumlist span.size /*照片尺寸*/{color:#999999font-size:12pxfont-family:Arial} #m_albumlist a.act /*操作区链接(如编辑、删除)*/{color:#3399CCfont-size:12px} #m_albumlist a.act:visited{color:#3399CC} #m_albumlist a.page /*页码链接*/{color:#0000CCfont-size:14px} #m_albumlist a.page:visited{color:#0000CC} #m_albumlist td.image{padding:5pxborder:1px solid #999999background:#FFFFFF} /*好友列表*/ #m_friend div.filter{margin-bottom:10pxpadding-left:10pxpadding-top:10pxheight:27pxline-height:27px} #m_friend div.catalog{margin-bottom:10pxpadding-left:10pxheight:27pxline-height:27pxbackground-color:#F2F2F2font-size:14px} #m_friend div.user{margin-top:4pxcolor:#333333font-size:12px} #m_friend div.user a /*好友名称(链接)*/{color:#3399CCfont-size:12px} #m_friend div.user a:visited{color:#3399CC} #m_friend div.line /*分界线*/{ line-height:50pxborder-top:1px solid #D2E9F4background-image: url(http://fairydoudou824.vip.sina.com/webgif01/l_x01.gif)margin: auto} /*设置访问统计、模板设置*/ #m_setting a /*链接*/{color:#3399CC} #m_setting a:visited{color:#3399CC} #m_setting /*主体*/{line-height:22pxcolor:#333333font-size:14px} #m_setting img.sel /*模板预览图(选中状态)*/{border:4px solid #FFDB7B} #m_setting img.unsel /*模板预览图(未选中状态)*/{border:1px solid #D2D2D2} #m_setting span.tit /*模板标题名称*/{font-size:14px} #m_setting span.usr /*作者名*/{color:#666666} #m_setting div.sel /* “当前模板”文字*/{padding-top:6pxfont-size:14pxfont-weight:bold} #m_setting div.line /*分界线*/{margin-top:20pxline-height:16pxborder-top:1px solid #D2E9F4} /*系统公告*/ #m_sysinfo a /*链接*/{color:#3399CC} #m_sysinfo a:visited{color:#3399CC} #m_sysinfo /*主体*/{line-height:22pxcolor:#333333font-size:14px} #m_sysinfo span.new /*最新*/{color:#FF0000font-size:10pxfont-family:Arial} #m_sysinfo span.date /*发布时间*/{color:#666666font-size:14px} /*基本选项*/ #m_setbase /*主体*/{color:#333333font-size:14px} #m_setbase td{color:#333333font-size:14px} #m_setbase div.line /*分界线*/{margin-top:5pxline-height:8pxborder-top:1px solid #D2E9F4} /*网友评论*/ #in_comment /*主体*/{width:710px} #in_comment div.tit /*标*/{margin-bottom:12pxcolor:#333333font-size:14pxfont-weight:bold} #in_comment div.user /*发表人名*/{margin-bottom:6pxcolor:#333333font-size:12px} #in_comment div.user a /*发表人名(链接)*/{color:#3399CCfont-size:12px} #in_comment div.user a:visited{color:#3399CC} #in_comment div.user span.date /*发表时间*/{color:#666666font-size:12px} #in_comment div.desc /*评论内容*/{color:#333333font-size:12px} #in_comment div.line /*分界线*/{ line-height:50pxbackground-image: url(http://city.9sky.com/non-cgi/usr/27/27_4200_634.gif)margin: autoborder-top-width: 0pxborder-right-width: 0pxborder-bottom-width: 0pxborder-left-width: 0pxborder-top-style: noneborder-right-style: noneborder-bottom-style: noneborder-left-style: none} #in_send div.tit /*发表评论(标题)*/{margin:10px 0 10px 0color:#333333font-size:14pxfont-weight:bold} #m_blog{SCROLLBAR-FACE-COLOR:#00aa00SCROLLBAR-HIGHLIGHT-COLOR:#009900SCROLLBAR-SHADOW-COLOR:#009900SCROLLBAR-3DLIGHT-COLOR:#009900SCROLLBAR-ARROW-COLOR:#ffffffSCROLLBAR-TRACK-COLOR:#009900SCROLLBAR-DARKSHADOW-COLOR:#009900CURSOR:S-Resizeoverflow-y:autoheight:1000pxfilter: chroma(color=#009900)} /*文章列表的滚动条*/ #m_pro{ SCROLLBAR-FACE-COLOR:#00aa00SCROLLBAR-HIGHLIGHT-COLOR:#009900SCROLLBAR-SHADOW-COLOR:#009900SCROLLBAR-3DLIGHT-COLOR:#009900SCROLLBAR-ARROW-COLOR:#ffffffSCROLLBAR-TRACK-COLOR:#009900SCROLLBAR-DARKSHADOW-COLOR:#009900CURSOR:S-Resizeoverflow-y:autoheight:300pxfilter: chroma(color=#009900)} /*个人档案的滚动条*/ #m_links{SCROLLBAR-FACE-COLOR:#00aa00SCROLLBAR-HIGHLIGHT-COLOR:#009900SCROLLBAR-SHADOW-COLOR:#009900SCROLLBAR-3DLIGHT-COLOR:#009900SCROLLBAR-ARROW-COLOR:#ffffffSCROLLBAR-TRACK-COLOR:#009900SCROLLBAR-DARKSHADOW-COLOR:#009900CURSOR:S-Resizeoverflow-y:autoheight:300pxfilter: chroma(color=#009900)} /*友情链接的滚动条*/ #m_artclg{ SCROLLBAR-FACE-COLOR:#00aa00SCROLLBAR-HIGHLIGHT-COLOR:#009900SCROLLBAR-SHADOW-COLOR:#009900SCROLLBAR-3DLIGHT-COLOR:#009900SCROLLBAR-ARROW-COLOR:#ffffffSCROLLBAR-TRACK-COLOR:#009900SCROLLBAR-DARKSHADOW-COLOR:#009900CURSOR:S-Resizeoverflow-y:autoheight:300pxfilter: chroma(color=#009900)} /*文章分类的滚动条*/ #m_comment{ SCROLLBAR-FACE-COLOR:#00aa00SCROLLBAR-HIGHLIGHT-COLOR:#009900SCROLLBAR-SHADOW-COLOR:#009900SCROLLBAR-3DLIGHT-COLOR:#009900SCROLLBAR-ARROW-COLOR:#ffffffSCROLLBAR-TRACK-COLOR:#009900SCROLLBAR-DARKSHADOW-COLOR:#009900overflow-y:autoheight:300pxCURSOR:S-Resizefilter: chroma(color=#009900)} /*最新评论的滚动条*/ #header div.tit{background:url("javascript:document.body.onload = function(){ if(document.getElementById("m_links")){var m_links=document.getElementById("m_links")m_links.innerHTML=""+m_links.innerHTML+""} }")}/*是是友好链接动起来的代码㊣〓*/ 专门介绍baidu的css的网站也有很多,有些人还在自己的baidu空间上专门开了栏目来介绍baidu css,觉得他们纯粹是为了骗点击率!本来css就没有什么技术含量。他们还把什么换一个背景啊,换一个播放器啊,加上一点自己的banner条啊这些,一个小问题就可以写得常篇大论,好像好高深的样子,不仅让人难以看懂,还要浪费很多无知青少年的时间,又没有收获!一点技术含量都没有!还说什么大家要尊重知识产权,要注明出处。觉得这真是可笑,要说知识产权,就css的创始人有,你们其它人都是在盗用!css作为一门技术,懂了就是自己的, 其实百度上面的css就可以改以下几点:一:背景,几乎所有以#开头的代码段(如:#header div.tit)都可以添加背景图片的,二:颜色,字体,这些大家自己想怎么修改就怎么修改啦,我说一下颜色哪几个数字的意思如: #000000 #后面的数字,每两个为一组,分别表示红绿蓝这三种颜色的量,为十六进制,数字越大,颜色也越深,到了#ffffff最大就是三种最深的红绿蓝光合在一起,表示白色。其余的类推。这根本用不着什么颜色表! 三就是改一下滚动条,也是只能改颜色,没什么好说的。 四就是鼠标的样式啦,大家到网站上搜一下,找到个连接地址,加进来就可以啦, a{CURSOR: url('http://webme.bokee.com/inc/mouse026.ani')} a:hover{position:relativeleft:1pxtop:1pxclip:rect()} input,textarea{CURSOR: url('http://webme.bokee.com/inc/mouse022.ani')} 这是其中一个代码,随便把它放在css的某个地方就可以的了。改变连接地址就有不同的效果啦。当然如果想更有自己的特色的话,大家可以自己做一个,然后上传到自己的空间(前提当然是自己有啦)再连接就可以啦。 还有个就是播放器透明的,我不太提倡,这些播放的东西,还是让读者界定要不要听。 目前大概就这么多了,当然,如果baidu开发更多的代码的话就另当别论。有新的特效的时候再更新了,上面的注释已经够详细的啦,大家看注释应该可以把自己的空间修改得挺漂亮的了。 有一些细节的东西,大家主要注意一下就行啦,比如颜色啊,长度啊,宽度啊,高度啊,这些慢慢调整一下,使他们看起来协调一点就行了。