知更鸟主题各方面功能已经很完备了,界面也漂亮,但是对样式总会有自己的一些小需求,下面是搜集摸索出的一些CSS样式修改。

更多分类文章:

网站建设 | Python | Linux | 大数据 | 数据库 | Git | Nodejs | Golang | 电脑技巧 | 计算机技术

关于本站图标内容修改

隐藏侧边栏关于本站中微信图标

/* 选择器:id为feed_widget的class为.weixin的所有后代*/
#feed_widget .weixin{display:none;
}

隐藏侧边栏关于本站中微博图标

#feed_widget .tsina{display:none;
}

让剩余两个图标居中

#feed_widget .feed-t {float:left;width:50%;height:40px;line-height:38px;
}

注意

“自定义样式”里的修改会覆盖掉主题目录下style.css中样式

导航栏多色彩美化

#site-nav .down-menu>#menu-item-30>a:hover .font-text,#site-nav .down-menu>#menu-item-30>li.sfHover>a .font-text{background:#992e1e !important}#site-nav .down-menu a{color:#444;margin:0}#site-nav .down-menu a{height:88px;line-height:88px;border-bottom:0 solid #3690cf;transition-duration:.6s}#site-nav .down-menu>.current-menu-item>a{height:88px;line-height:88px;border-bottom:2px solid #3690cf}#site-nav .down-menu>li>a:hover{height:88px;border-bottom:88px solid #333d46}#site-nav .down-menu>

幻灯片缩略图园角美化

#slideshow #slider img{border-radius:5px;border:0}
.thumbnail{border-radius:5px;border:0}

widget选中微光特效

.widget{background:#fff;margin:0 0 10px 0;border:1px solid #eaeaea;border-radius:2px;box-shadow:0 1px 1px rgba(0,0,0,0.04);-webkit-transition:.3s;-moz-transition:.3s;-o-transition:.3s;-ms-transition:.3s}.widget:hover{box-shadow:0 0 20px 3px #dfe9f7;border:1px solid #eaeaea;z-index:2}

文章标题点击平移

.list-title a,.widget.like_most_img ul li a,.widget.hot_post_img ul li a,.widget.new_cat ul li a,.widget.recent_comments ul li a,.widget.hot_comment ul li a,.widget.related_post ul li a,.widget.same_post ul li a,.widget.recently_viewed ul li a{position:relative;}

文章标题前添加箭头美化

.widget.new_cat ul li a:before,.widget.related_post ul li a:before,.widget.same_post ul li a:before,.widget.recently_viewed ul li a:before{content: "\e77a";font-family: be;font-size: 16px;padding: 0 5px 0 0;
}

这个代码已压缩移到style.css

强制文章中图片居中显示

.single-content p img{margin: 0 auto;
}

修改正文字号大小

.single-content {font-size: 20px;font-size: 2.0rem;line-height: 2;
}

去掉幻灯上的标题文字

.slider-caption {display: none; }

标题后加文字

#post-75 h2 a:after {content: "推荐";font-size: 14px;background: #c40000;color: #fff;margin: 0 0 0 5px;padding: 1px 3px;border-radius: 2px;
}

原文链接:知更鸟主题样式修改CSS

知更鸟主题样式修改CSS相关推荐

  1. html5滚动条样式修改,css修改滚动条样式

    在css中怎样改变滚动条的样式 /*IE滚动条颜色设置*/body {scrollbar-arrow-color:#f2f2f3;/*上下箭头*/scrollbar-track-color:#1589 ...

  2. 火狐浏览器滚动条样式修改 css

    纯css设置Firefox火狐浏览器的滚动条样式 设置Firefox滚动条样式的css属性只有 scrollbar-color 和 scrollbar-width 这两个.看名字就知道第一个是设置滚动 ...

  3. html5 input file样式修改,css为input type=file设置自定义样式

    input file上传按钮的美化思路是,先把之前的按钮透明度opacity设置为0,然后,外层用div包裹,就实现了美化功能. 主要有两点需要做: 将input type=file控件透明 将inp ...

  4. html5 按钮css样式修改,css样式制作的漂亮按钮

    复制代码代码如下: Demo: CSS3 Buttons body { background: #ededed; width: 900px; margin: 30px auto; color: #99 ...

  5. Hexo博客 Next更换修改主题样式 不生效的解决

    在对下面的Next主题样式修改时候,博客站点可能无法正常生效. # Schemes scheme: Muse #scheme: Mist #scheme: Pisces #scheme: Gemini ...

  6. Jupyter notebook 不安装主题,通过修改css更改 默认字体,字体大小等

    目标: Jupyter notebook 又不想改更主题的的情况下,可以通过修改css的目的来达到修改默认的字体,字号心达到可以好的阅读效果. 方法 要修改的css文件目录如下, D:\Anacond ...

  7. global.min.css,配置全局及自定义主题样式

    先说问题吧. 最近在看 primeng 的源码,框架是支持主题切换的,主题样式使用 sass,主题的切换是通过动态替换全局主题 css 文件来实现的. 1 2 3 4 5changeTheme(eve ...

  8. 畅言评论的版权及样式如何修改CSS一步简单搞定

    16年9月份差不多,多说就已经开始各种抽风了,让鸡哥这种小老百姓是属实受不了,然而去多说官网反馈并没什么卵用,神奇的是我的反馈帖子只有在我登陆的时候可以看到,一旦退出登陆就消失了,..这种单机模式多说 ...

  9. 用JS查看修改CSS样式(cssText,attribute('style'),currentStyle,getComputedStyle)

    CSS样式定义方法 大家都知道,在为HTML设置样式的时候,通常有三种方法:内联样式,内部样式表,外部样式表. 1.内联样式: 内联样式表就是在HTML元素中的行内直接添加style属性. 1 < ...

最新文章

  1. 机器学习(18)-- SVM支持向量机(根据身高体重分类性别)
  2. 加了好友怎么还掉血_微信聊天窗口出现风险提醒,无法添加好友解决办法
  3. 负债十五万左右,信用卡十万,网贷四五万,怎么上岸?
  4. Linux和Windows下部署BeetleX服务网关
  5. mysql解压包安装linuex_CentOS下安装Apache,php,Mysql
  6. 网站安全配置---挂载路由导航
  7. 2020-01-14 IP/TCP/UDP 对应的RFC编号
  8. BeanFactory的实现原理
  9. 判断web app是否从主屏启动
  10. java.awt Robot 自动化测试 与 KeyEvent 常用按键
  11. main(int argc, char** argv) 参数的含义
  12. 利用EditPlus制作Anki记忆卡批量导入文件
  13. 真实业务订单 拆单 架构与实战
  14. NI Teststand 2014 64bit 调用python脚本指南
  15. android 快速开发,GitHub - limedroid/XDroid: 轻量级Android快速开发框架
  16. 技术实践干货 | 初探大规模 GBDT 训练
  17. TypeScript学习-函数
  18. PostgreSQL逻辑备份pg_dump使用及其原理解析
  19. 华为RH2288H V3服务器 从拆箱开始安装系统
  20. 黑客或可完全控制设备,苹果紧急发布补丁!

热门文章

  1. Python 图片处理介绍
  2. linux 添加源的方法
  3. 配置hadoop集群常见报错汇总
  4. 线程的IsBackground属性
  5. WinCE下的注册表编辑程序
  6. 资金互助社业务(软件)系统在浙江第一家农村资金互助社(临海市涌泉镇忘不了农村资金互助社)试运行(2009.10.21)
  7. Python弹球小游戏
  8. CSS选择器详解(前端系列1)
  9. GIAC2018|全球互联架构大会新增区块链等热点议题!
  10. TP-LINK Mini系列无线路由器设置指南(三)——Repeater模式