当前位置: 首页 > news >正文

制作自定义CSDNBLOG皮肤

制作自定义CSDNBLOG皮肤

hbzxf(阿好)
http://blog.csdn.net/hbzxf/

如果你已经有了一个比较个性化的计数器的话,下面我教你如何为CSDNBLOG制作自定义皮肤的功能,如果你没有并且需要为你的CSDNBLOG添加一个个性化计数器的话,可以参阅我写的另一篇文章。

关于给CSDNBLOG添加计数器
http://blog.csdn.net/hbzxf/archive/2004/06/26/27040.aspx

1、使用系统定义皮肤
系统为我们已经提供了几个定义好的皮肤界面,我们可以通过'选项'-'配置'-'皮肤'来选择自己喜欢的。

2、自定义皮肤

下面以更改Cogitation皮肤为例

1、选项-配置-皮肤-选择Cogitation

2、CSDNBLOG会默认使用http://blog.csdn.net/skins/Cogitation/style.css为样式表文件(我怎么知道的,呵呵,源代码里面有的)

3、通过记事本或其他编辑工具打开http://blog.csdn.net/skins/Cogitation/style.css可以看到如下内容(截取部分)

.HeaderTitles a:visited,
.HeaderTitles a:active,
.HeaderTitles a:link,
.HeaderTitles a:hover
{
color: White;
text-decoration : none;
font-size: .75em;
font-weight: normal;
}

.HeaderBar
{
font-weight: normal;
font-size: 8pt;
border-collapse: collapse;
background-image: url(images/BlueTabBack.jpg);
background-repeat:repeat-x;
}

.HeaderBar a:visited,
.HeaderBar a:active,
.HeaderBar a:link
{
color: WhiteSmoke;
text-decoration: none;
font-weight: normal;
}

.HeaderBarTab
{
background-image: url(images/BlueTabFace.jpg);
background-repeat:repeat-x;
border-collapse: collapse;
padding: 0px;
}

.BlogStatsBar
{
text-align:right;
font-weight: normal;
font-size: 7pt;
color: Silver;
border-collapse:collapse;
}

4、我们现在重新定义#top,#top定义了版面顶部样式

原始样式内容如下:

#top
{
background-image: url(images/BlueTabBackground.gif);
background-repeat: repeat;
color : WhiteSmoke;
border-top : 4px solid Black;
border-bottom : 4px solid Black;
padding: 0px;
margin: 0px;
}

通过察看自己CSDNBLOG源代码发觉#top应用的位置如下:

<div id="top">

<div>
<table>
<tr>
<td class="HeaderTitles">
<h1><a id="Header1_HeaderTitle" class="headermaintitle" HREF="/hbzxf/">阿好空间(HBZXF)</a></h1>
<p id="tagline">人生不止一次需要反反复复的回忆,也许这才是人生的哲理</p>
</td>
</tr>
</table>
</div>


重新定义后的样式如下:(我们现在要修改背景图片)

#top
{
background-image: url(images/BlueTabBackground.gif);//改变背景图片url为自己图片的位置
background-repeat: repeat;
color : WhiteSmoke;
border-top : 4px solid Black;
border-bottom : 4px solid Black;
padding: 0px;
margin: 0px;
}

5、把定义后的样式粘贴到'选项'-'配置'-'定制css选择器'

6、保存更改后的配置,重新察看自己CSDNBLOG的页面,是不是变成了自己定义好的图片

7、按照以上方法逐个修改,就会产生一个与众不同、个性化的CSDNBLOG

相关文章:

  • 仿知乎ui实现bottomNavigationBar
  • 高效CSDNBLOG技巧终结篇
  • 给BLOG加一个控制菜单展开和收缩的按扭
  • 在自己Blog的导航菜单加动态摄影作品展
  • 给自己的BLOG加一个不用注册申请的计数计。
  • flutter轮播图swiper
  • 给自己的BLOG来点音乐如何?
  • flutter 设置状态栏的颜色,背景appBar
  • 跟我来玩转CSDN BLOG界面
  • flutter的PreferredSize
  • Dev-Cpp/Mingw32 环境介绍(1)
  • 新浪体育图片新闻动态效果代码
  • golang切片的容量长度
  • 看中国足球,哭笑不得
  • golang盲点扫描copy
  • ES2017异步函数现已正式可用
  • ES6系列(二)变量的解构赋值
  • HTTP请求重发
  • Invalidate和postInvalidate的区别
  • Java的Interrupt与线程中断
  • Java小白进阶笔记(3)-初级面向对象
  • Laravel 菜鸟晋级之路
  • ReactNative开发常用的三方模块
  • SegmentFault 社区上线小程序开发频道,助力小程序开发者生态
  • Storybook 5.0正式发布:有史以来变化最大的版本\n
  • zookeeper系列(七)实战分布式命名服务
  • 订阅Forge Viewer所有的事件
  • 七牛云 DV OV EV SSL 证书上线,限时折扣低至 6.75 折!
  • 嵌入式文件系统
  • 如何设计一个微型分布式架构?
  • 直播平台建设千万不要忘记流媒体服务器的存在 ...
  • ​DB-Engines 12月数据库排名: PostgreSQL有望获得「2020年度数据库」荣誉?
  • #100天计划# 2013年9月29日
  • #在 README.md 中生成项目目录结构
  • (2)(2.4) TerraRanger Tower/Tower EVO(360度)
  • (2.2w字)前端单元测试之Jest详解篇
  • (附源码)springboot助农电商系统 毕业设计 081919
  • (附源码)ssm基于web技术的医务志愿者管理系统 毕业设计 100910
  • (七)Knockout 创建自定义绑定
  • (入门自用)--C++--抽象类--多态原理--虚表--1020
  • (数据结构)顺序表的定义
  • (顺序)容器的好伴侣 --- 容器适配器
  • (转)fock函数详解
  • (转)程序员疫苗:代码注入
  • .NET 3.0 Framework已经被添加到WindowUpdate
  • .net core 6 使用注解自动注入实例,无需构造注入 autowrite4net
  • .net core控制台应用程序初识
  • .Net Core与存储过程(一)
  • .NET delegate 委托 、 Event 事件
  • .Net7 环境安装配置
  • .NET版Word处理控件Aspose.words功能演示:在ASP.NET MVC中创建MS Word编辑器
  • .Net的DataSet直接与SQL2005交互
  • .Net中ListT 泛型转成DataTable、DataSet
  • .Net中的集合
  • .pyc文件是什么?