也为CSDN Blog加效果

虽然开通CSDN Blog已经很久了,但却一直不知道该怎么加效果,看着别人的Blog那么眩,真是羡慕死了。直到前段时间在网上看到一篇文章,《CSDN blog 添加音乐和天气预报效果》,这才恍然大悟,原来给自己的Blog加效果这么简单。于是利用五一的空档,为自己的Blog增加了效果。
  登陆自己的Blog后,选择“配置”,然后在“公告”栏中编写自己想要的效果。你可能很奇怪,怎么在这里编写?没错,就是在这里编写,公告栏可是支持HTML的。至于我加的效果呢,就比较简单了,只是在公告栏显示一个日期,增加了背景音乐,别的也没什么,惟一能吹一下的就是日期显示的颜色和背景音乐在每次登陆时都会改变(喂,别拿鸡蛋飞我)。那么我是怎么做的呢?看一下代码:
  
  

  
以上代码可以根据登陆时的秒数分别显示10种不同的效果。不过这里还想说明几件事:
  1.标记并不是W3C推荐的,W3C推荐的是标记;
  2.这里访问id为media的
标记用的是document.getElementById("media"),而不是document.all.media,这里使用的方式才是被推荐的;
  3.innerHTML属性,用来改变标记内部的HTML代码,还有一个innerText属性,可以用来改变标记内部的字符串,利用innerHTML和innerText属性,可以对页面实现动态刷新;
  4.我这里的歌曲都直接引自网上,这不是一个好的方式,相关内容可以参考《CSDN blog 添加音乐和天气预报效果》。
  至此,HTML代码虽然已经写好了,但是相应的样式还没加呢,所以还要在了“自定义CSS样式”栏中做些处理,我编写的样式如下:
  #media {width : 100%; text-align : center; line-height : 12; font-weight : bold; font-size : 24;}
  #media0 {color : maroon;}
  #media1 {color : #fc6;}
  #media2 {color : #3c0;}
  #media3 {color : #0cf;}
  #media4 {color : #00c;}
  #media5 {color : #609;}
  #media6 {color : black;}
  #media7 {color : #36f;}
  #media8 {color : #f60;}
  #media9 {color : #fcf;}
这里用的都是id样式。
  修改之后点击“保存”按钮,提示已更新后,就可以去自己Blog的首页看看了。

你可能感兴趣的:(其它,blog,音乐,html,div,公告,javascript)