代码部署:
用Notepad++打开知更鸟Begin主题(5.2版本)样式表 (style.css),大概在6269行(不同版本的主题,也许行数不一样),找到下面的代码
- /** 喜欢分享 **/
- #social {
- position: relative;
- margin: 50px auto;
- }
- .social-main {
- position: relative;
- margin: 0 auto;
- width: 243px;
- }
- .social-main span {
- float: left;
- }
- .social-main a {
- color: #999;
- line-height: 36px;
- border-radius: 2px;
- }
- .share-s a, .shang-s a {
- text-align: center;
- }
- .like a {
- float: left;
- padding-left: 15px;
- }
- .social-main a:hover {
- background: #f1f1f1;
- color: #444;
- transition: all 0.2s ease-in 0s;
- }
- .like a {
- background: #fff;
- width: 120px;
- display: block;
- border: 1px solid #ddd;
- }
- .share-s a {
- background: #fff;
- width: 120px;
- display: block;
- padding-left: 15px;
- border: 1px solid #ddd;
- }
- .social-main i {
- color: #999;
- margin: 0 5px 0 0;
- }
- /** 赏 **/
- .shang-empty {
- position: absolute;
- left: 90px;
- top: 0px;
- width: 62px;
- height: 38px;
- overflow: hidden;
- }
- .shang-empty span {
- background: #fff;
- width: 60px;
- height: 60px;
- display: block;
- margin: -10px 0 0 0;
- border-radius: 60px;
- border: 1px solid #ddd;
- }
- .shang-p a {
- position: absolute;
- background: #fff;
- left: 96px;
- top: -5px;
- width: 48px;
- height: 48px;
- font-size: 16px;
- line-height: 45px;
- display: block;
- border: 1px solid #ddd;
- border-radius: 40px;
- left: 101px\9;
- top: 0\9;
- width: 38px\9;
- height: 38px\9;
- line-height: 35px\9;
- }
- .shang-s {
- height: 37px;
- }
- #shang {
- width: 280px;
- display: block;
- }
- .shang-img {
- float: left;
- }
- .shang-img img {
- width: 140px;
- height: auto;
- }
- .shang-main h4 {
- font-size: 15px;
- font-size: 1.5rem;
- text-align: center;
- margin-bottom: 10px;
- }
- .shang-main i {
- color: #ff0000;
- }
- /** 分享 **/
- #share {
- position: absolute;
- top: -60px;
- rightright: -29px;
- width: 302px;
- height: 68px;
- display: none;
- z-index: 999;
- }
- #share a {
- float: left;
- background: #999;
- font-size: 20px !important;
- color: #fff;
- width: 40px;
- height: 40px;
- line-height: 40px;
- margin-left: 4px;
- padding-left: 0;
- text-align: center;
- border-radius: 3px;
- background: rgba(128, 128, 128, 0.9);
- }
- #share .be-addbox:hover {
- background: #7ab951 !important;
- }
- #share .be-qzone:hover {
- background: #ff7400 !important;
- }
- #share .be-stsina:hover {
- background: #ff0000 !important;
- }
- #share .be-tqq:hover {
- background: #46c0e6 !important;
- }
- #share .be-renren:hover {
- background: #3b68ac !important;
- }
- #share .be-weixin:hover {
- background: #006f1d !important;
- }
- .bd_weixin_popup {
- height: 250px !important;
- }
- .bd_weixin_popup_foot {
- display: none;
- }
- /** 弹窗 **/
- .fancybox-wrap {
- position: absolute;
- top: 0;
- left: 0;
- z-index: 8020;
- }
- .fancybox-skin {
- position: relative;
- background: #fff;
- color: #444;
- text-shadow: none;
- border-radius: 4px;
- }
- .fancybox-opened {
- z-index: 8030;
- }
- .fancybox-opened .fancybox-skin {
- box-shadow: 0 10px 10px rgba(0, 0, 0, 0.5);
- }
- .fancybox-outer, .fancybox-inner {
- position: relative;
- }
- .fancybox-inner {
- overflow: hidden;
- }
- .fancybox-error {
- padding: 30px;
- whitewhite-space: nowrap;
- }
- .fancybox-image, .fancybox-iframe {
- display: block;
- width: 100%;
- height: 100%;
- }
- .fancybox-image {
- max-width: 100%;
- max-height: 100%;
- }
- #fancybox-loading {
- position: fixed;
- top: 50%;
- left: 50%;
- margin: -22px 0 0 -22px;
- z-index: 8060;
- }
- #fancybox-loading div {
- width: 79px;
- height: 10px;
- background: url(img/infinite.gif) center center no-repeat;
- }
- .fancybox-nav {
- position: absolute;
- top: 0;
- width: 45%;
- height: 100%;
- cursor: pointer;
- background: transparent url(img/blank.gif);
- /* helps IE */
- -webkit-tap-highlight-color: rgba(0,0,0,0);
- z-index: 8040;
- }
- .fancybox-prev {
- left: 0;
- }
- .fancybox-next {
- rightright: 0;
- }
- .fancybox-nav span {
- position: absolute;
- top: 50%;
- width: 30px;
- height: 30px;
- margin-top: -18px;
- cursor: pointer;
- z-index: 8040;
- visibility: hidden;
- }
- .fancybox-nav .be {
- font-size: 30px !important;
- }
- .fancybox-prev span {
- left: 10px;
- }
- .fancybox-next span {
- rightright: 10px;
- }
- .fancybox-nav:hover span {
- visibility: visible;
- }
- .fancybox-tmp {
- position: absolute;
- top: -99999px;
- left: -99999px;
- visibility: hidden;
- max-width: 99999px;
- max-height: 99999px;
- overflow: visible !important;
- }
- .fancybox-overlay {
- position: absolute;
- top: 0;
- left: 0;
- overflow: hidden;
- display: none;
- z-index: 8010;
- background: url(img/fancy.png);
- }
- .fancybox-overlay-fixed {
- position: fixed;
- bottombottom: 0;
- rightright: 0;
- }
- .fancybox-overlay {
- overflow: auto;
- overflow-y: scroll;
- }
- #fancybox-buttons {
- position: fixed;
- left: 0;
- width: 100%;
- z-index: 8050;
- }
- #fancybox-buttons.top {
- top: 10px;
- }
- #fancybox-buttons.bottombottom {
- bottombottom: 10px;
- }
- #fancybox-buttons ul {
- background: #000;
- background: rgba(0, 0, 0, 0.1);
- display: block;
- width: 177px;
- height: 31px;
- margin: 0 auto;
- border: 1px solid #999;
- border-radius: 2px;
- }
- #fancybox-buttons ul li {
- float: left;
- margin: 0;
- padding: 0;
- }
- #fancybox-buttons a {
- display: block;
- color: #fff;
- width: 35px;
- height: 30px;
- line-height: 30px;
- text-align: center;
- outline: none;
- }
- #fancybox-buttons a:hover {
- color: #04a4cc;
- }
- #fancybox-buttons .be {
- font-size: 15px !important;
- }
- #fancybox-buttons .be-arrowright {
- border-right: 1px solid #999;
- }
- #fancybox-buttons .be-cross {
- border-left: 1px solid #999;
- }
- .btnDisabled {
- cursor: default;
- opacity: 0.4;
- filter: alpha(opacity=40);
- }
- .icon-fancy-close {
- position: absolute;
- top: -20px;
- rightright: -20px;
- width: 24px;
- height: 24px;
- color: #e50000;
- font-size: 18px;
- line-height: 24px;
- cursor: pointer;
- }
- .fancybox-close {
- position: absolute;
- background: #cf0000;
- top: -25px;
- rightright: 0;
- color: #fff;
- padding: 0 8px;
- border-radius: 5px 5px 0 0;
- }
- .fancybox-close:hover {
- color: #ccc;
- }
修改成以下
美化后的效果图
若文章图片、下载链接等信息出错,请在评论区留言反馈,博主将第一时间更新!如果喜欢,请打赏支持本站,谢谢大家!
2019年1月3日 10:09 41楼
很不错 棒棒哒
2019年1月8日 11:01 42楼
很不错的分享,谢谢博主。但点击社交分享按钮会跳出登陆界面不是分享内容界面,不知是不是手机浏览器问题(小米手机自带浏览器)
2019年1月12日 16:23 43楼
产
2019年3月10日 15:30 44楼
妈的好看
2019年3月29日 16:50 45楼
66666啊
2019年5月15日 23:51 46楼
看看
2019年5月22日 22:11 47楼
666啊
2019年6月3日 19:23 48楼
不错哦
2019年6月6日 18:08 49楼
学习学习
2019年6月14日 10:21 50楼
支持
2019年6月18日 22:56 51楼
感谢博主的分享
2019年6月18日 22:56 52楼
这个美化的很好看,收藏一个
2019年6月22日 17:10 53楼
我来了
2019年7月17日 21:03 54楼
学习学习
2019年7月19日 23:04 55楼
很好看啊
2019年8月7日 01:42 56楼
挺好的
2019年8月7日 01:45 57楼
学习
2019年10月12日 11:57 58楼
厉害
2019年11月5日 23:58 59楼
对着说明操作下吧
2019年12月17日 13:44 60楼
感觉不错哦,看看效果