首页 > Web开发 > 详细

css打造自己的博客园

时间:2014-02-16 17:54:26      阅读:438      评论:0      收藏:0      [点我收藏+]

 现在互联网上提供的社区、博客、免费空间的网站有很多。像交友类的社区网站有myspace、facebook,国内的则有校内、亿聚、占座等,而博客则有像博客中国、新浪博客、博客园等。我学习web前端技术也有一定的时间了,最近在博客园这个国内著名的开发网站上注册了一个帐户。昨天刚考完试,今天周末,bubuko.com,布布扣有一把时间供自己挥霍。就开始自己整整博客。
    当然,自我臭屁一下,作为一个学css的csser。拿模板来对付自己也有点太不负责了吧。好,那我就自己设计一下自己的博客页面吧。
    说干就干,具体的小步骤如下:
    1:打开自己的博客,在“管理”-“博客设置”中勾选“禁用模板默认CSS”复选框;
    2:用firefox的插件firebug查看一下自己的博客首页的html文件结构(此步骤可选),查看页面源代码;
    3:在文本编辑器(如:Dreamweaver,Expresion Web,Editplus)中打开源文件,针对html设置css样式;
    4:css样式写完后,预览,直到自己满意为止。然后将css代码copy到“管理”-“博客设置”中“通过CSS定制页面”的文本框中;
    5:预览,自己的页面就呈现在你面前了。
    可是,还有一个最大的问题是,一张页面中完全不用图片做背景或是设置其它的样式那多不爽啊。我遇到的问题是自己的在css设置的背景图片一个都没显示出来。所以页面的质量也就大打折扣了。心想:应该要上传以个图片文件夹然后让css文件读取这个文件夹,图片就出来了。可是找了半天都没有找到上传图片的按钮。
    最后找到了一个笨办法:将用到的背景图片上传到相册里。这样图片就会存在于网络服务器上而不是本机上,然后在css文件中引用绝对路径。这样,背景图片也就能顺利显示了,自己的页面也就能够完整地呈现在面前了。
    博客园的个人主页的html主要分为5大块:top,leftmenu,rightmenu,main,footer。其中主内容区的三大块leftmenu,rightmenu,main水平方向并列显示,可以设置它们分别向左、向右、向左浮动,再在footer添加清除浮动,这样页面的基本布局就差不多出来了。
   

css打造自己的博客园

原文:http://www.cnblogs.com/sdgjytu/p/3551019.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!