博客园自定义样式(去广告、公告栏加头像、按钮…

2019-11-01 09:56:43来源:博客园 阅读 ()

新老客户大回馈,云服务器低至5折

博客园自定义样式(去广告、公告栏加头像、按钮样式)

 前言:

简单的操作

1)可以通过审查元素的方法,来设置自己满意的样式。操作是F12
F12操作可以打开控制面板,具体的样式可以直接在上面修改,然后把修改后的样式保存下来。

2)保存后的样式,复制到[ 管理 ] - [ 设置 ] - 页面定制CSS代码上面,然后[ 保存 ]

 1、隐藏广告 

/*隐藏广告*/
#ad_t2, #cnblogs_c1, #under_post_news, #cnblogs_c2, #under_post_kb {
    display: none;
}

 2、按钮样式 

/* 关注收藏等几个按钮 */
#green_channel {
    padding: 10px;
    margin: 20px 0;
    font-size: 15px;
    width: 400px;
}

#green_channel a {
    border-radius: 3px;
    text-shadow: none;
    font-weight: normal;
    box-shadow: none;
}

 3、侧边公告栏加头像 

 [ 管理 ] - [ 设置 ] - 博客侧边栏公告 这里添加 html 代码,用来添加头像,地址用自己的头像

//图片的地址更换成你的头像的地址
<img src="https://pic.cnblogs.com/avatar/1513806/xxxx.png">

侧边栏公告样式

/*侧边栏公告*/
#blog-news > img {
    /*头像*/
    display: block;
    margin: auto;
    border-radius: 50%;
}

#profile_block {
    font-size: 15px;
    padding: 20px;
    line-height: 1.8;
}

#profile_block > a:link {
    color: #F60;
}

/*公告结束*/

ending...

原文链接:https://www.cnblogs.com/hxun/p/11776123.html
如有疑问请与原作者联系

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:CSS文本属性

下一篇:从浏览器渲染原理,浅谈回流重绘与性能优化