如何定制我的 CSS 样式?

字体 -
标签:,

尽管无忧博客给您提供了很多的模版供您选择,您可以很方便地更改博客外观,但可能还是不能满足您的要求,比如,您希望上传您自己喜欢的主题照片,或者您的公司的标志 LOGO,或者您很熟悉 CSS 样式表的设计,希望修改一些颜色、图片,“秀”出自己的风格。这些要求并不过分,无忧博客可以也应该满足您。

激活插件 Jason’s Customciser

首先,要定制您的 CSS 文件,您需要在管理后台的“插件菜单”下选择激活插件“Jason’s Customciser”。但请注意,正如这个插件的说明所示,使用这个插件,您可能需要了解一点 HTML 和 CSS 的基本知识,否则,可能会有些摸不着头脑。当然,您可以 Google 一下,网上有关 HTML 和 CSS 的介绍很多。

定制 CSS 中的背景图和配色

插件激活后,您可以在管理后台的“外观”菜单下看到子菜单“定制 CSS 样式表”,点击进入。就可以修改目前您使用的模版主题下定义的背景图和所有的样式文件颜色值。

要修改背景图片,在对应的图片左方的输入框中填写您希望使用的图片的 URL 地址即可。有两点必须注意:

  1. 图片是在网上可调用的,不是您计算机中的本地图片。要使用本地图片,请先将其上传到网上,并经过测试可用,否则,此图片将不能显示,在您的博客显示页面中也将会是空的一块。因此,在填写链接前,先将复制到浏览器的地址栏测试一下,看是否可以正常显示;
  2. 图片的大小最好和原CSS文件中使用的图片大小一致,您可以用鼠标右键点击右侧的图片块,选择“将背景图另存”获取该图片,再在图片编辑软件中打开,查看或直接编辑它,再将其上传到网上(参见“如何上传和插入图片”以及“如何在博主介绍中添加照片?”)。

要修改 CSS 样式表定义的颜色,在色块左侧编辑相应色彩的 HTML 编码,如黑色是 #000000 或者 #000,红色 #FF0000 或者 #F00。具体的配色就看您的喜好了。

在编辑好这些设定后,点击页面下方的“更新选项”,即可保存您的新设置,这时候您可以点击页面头部的“查看网站”,看看在套用了您定制的 CSS 样式文件后,您的博客新形象。可能需要不断地调整,才能达到满意的效果。

模版样式文件中的一些常见定义

每个模版主题的样式表文件中有很多的样式定义。因为 Wordpress 的模版有很多的开发者,无忧博客不过是将收集一些好的模版主题,并将其修改至符合中文显示习惯而已,所以,具体到每个模版,它们的 CSS 样式定义都可能略有不同,甚至差别巨大。您在编辑前可能需要查看页面的源文件,或者在源文件中找到 css 文件的链接,下载下来研究一下。

如果有空的话,也可以看看 Wordpress 的主题开发文档,以下是一些大致通用的定义(不能保证一定如此 微笑

  • header 一般是头部的信息
  • content 或者container 一般是主体内容部分的定义
  • post、entry、entrybody 是文章显示部分
  • commentarea、commentform 是评论部分
  • sidebar 是侧栏部分
  • footer 是页面脚部的定义
  • albumlist 是相册列表部分,相册内容部分的定义和文章内容显示基本上为共用
  • taglevel 是侧栏标签云的各类权重标签的显示定义

恢复默认设置

如果您订制的 CSS 文件乱了,或者想恢复使用默认的模版主题设置,点击页面下方的“重置选项”按钮,就会删除您的个人设置,恢复到默认的背景图片和配色。

定制的局限

鉴于 Wordpress 的模版设计原理,目前的样式定制还只能局限在编辑主题中 CSS 文件中已定义的背景图和颜色,其他部分不能修改,也就是说,大的框架是不能变化的。

还有个别的模版,如 water-1.0,因为已经有了“主题选项”,其 css 文件不再可使用此方式定制。

分享博文至:

    48 条评论

  1. 41. mold removal spray wood - 2018年4月16日 20:02

    Learn how to choose an air duct cleaning firm?

  2. 42. basement waterproofing near me - 2018年4月26日 02:17

    It entails repairs, sanding, ending and coating.

  3. 43. mold removal spray home depot - 2018年5月2日 10:15

    Spores require moisture so as to develop.

  4. 44. mold removal spray menards - 2018年5月4日 16:03

    Apply baking soda on to moldy surfaces.

  5. 45. mold removal companies in atlanta ga - 2018年5月6日 16:22

    Clear mould or mildew from leather-based.

  6. 46. stair contractors nj - 2018年5月9日 09:59

    1 Step By Step Stairbuilder evaluations.

  7. 47. hi - 2018年5月15日 12:36

    Hey There. I discovered your weblog the usage of msn. That is a really well written article. I’ll be sure to bookmark it and come back to learn more of your useful info. Thanks for the post. I’ll definitely return.

  8. 48. garage door repair houston 77041 - 2018年7月14日 15:38

    The storage door springs can also be nonoperational.

发表评论