博客侧边栏公告(支持HTML代码)(支持JS代码)

<div id='btnList'>

<a class="ivu-btn ivu-btn-primary" href="https://cn.vuejs.org/v2/api/" target="_blank">Vue</a>
<a class="ivu-btn ivu-btn-primary" href="https://www.iviewui.com/" target="_blank">iView</a>
<a class="ivu-btn ivu-btn-primary" href="http://www.dicts.cn/" target="_blank">dicts</a>
<a class="ivu-btn ivu-btn-primary" href="https://gitee.com/" target="_blank">gitee</a> <a class="ivu-btn ivu-btn-primary" href="https://tw.voicetube.com/" target="_blank">voicetube</a>
<a class="ivu-btn ivu-btn-primary" href="https://www.buzzfeed.com/" target="_blank">buzzfeed</a>
<a class="ivu-btn ivu-btn-primary" href="http://www.ozdic.com/" target="_blank">ozdic词组</a>
<a class="ivu-btn ivu-btn-primary" href="http://electronjs.org/docs" target="_blank">electronjs</a>
<a class="ivu-btn ivu-btn-primary" href="http://huziketang.mangojuice.top/books/react/lesson28" target="_blank">react</a>
<a class="ivu-btn ivu-btn-primary" href="https://react.docschina.org/docs/hello-world.html" target="_blank">react2</a>
<a class="ivu-btn ivu-btn-primary" href="https://juejin.im/book/5bc844166fb9a05cd676ebca" target="_blank">掘金</a>
<a class="ivu-btn ivu-btn-primary" href="https://ant.design/docs/react/introduce-cn" target="_blank">AntDesign</a>
<a class="ivu-btn ivu-btn-primary" href="https://github.com/yezihaohao/react-admin" target="_blank">reactAdmin</a>
<a class="ivu-btn ivu-btn-primary" href="https://www.processon.com/" target="_blank">processOn</a>
<a class="ivu-btn ivu-btn-primary" href="https://www.draw.io/" target="_blank">draw.io</a>
<a class="ivu-btn ivu-btn-primary" href="http://www.demigods.top/" target="_blank">demigods</a>
<a class="ivu-btn ivu-btn-primary" href="https://medium.com/" target="_blank">medium</a> <div style="height:10px"></div>
<img width='100%' src='http://images.cnblogs.com/cnblogs_com/pengchenggang/110921/o_ask.jpg' />
</div> <script>
$(document).ready(function(){ // $("#subtitle").html("<button type='button' class='ivu-btn ivu-btn-default'><span>Default</span></button>"); $("#content > p:eq(0)").before(document.getElementById('btnList')); }); </script>
页脚Html代码
<link rel="stylesheet" type="text/css" href="https://www.layuicdn.com/layui-v2.5.4/css/layui.css" />
<script src="https://www.layuicdn.com/layui-v2.5.4/layui.js"></script>
<script type="text/javascript">
layui.use(['laydate', 'laypage', 'layer', 'table', 'carousel', 'upload', 'element'], function() {
var laydate = layui.laydate //日期
,laypage = layui.laypage //分页
,layer = layui.layer //弹层
,table = layui.table //表格
,carousel = layui.carousel //轮播
,upload = layui.upload //上传
,element = layui.element; //元素操作 等等... /*layer弹出一个示例*/
layer.msg('waiting for VUE3.0');
});
</script>
<style>
body { margin-left: 20px;
margin-right: 20px;
margin-top: ;
margin-bottom: 10px;
padding: 30px;
padding-bottom: 10px;
padding-top: ;
}
#cnblogs_post_body .toc {
position: fixed;
right: 100px;
top: 150px;
} .ivu-btn {
display: inline-block;
margin-bottom: 5px;
font-weight: ;
text-align: center;
-ms-touch-action: manipulation;
touch-action: manipulation;
cursor: pointer;
background-image: none;
border: 1px solid transparent;
white-space: nowrap;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
padding: 5px 15px 6px;
font-size: 12px;
border-radius: 4px;
transition: color .2s linear,background-color .2s linear,border .2s linear,box-shadow .2s linear !important;
color: #515a6e;
background-color: #fff;
border-color: #dcdee2;
}
.ivu-btn-primary {
color: #2d8cf0;
background: ;
text-decoration: none;
outline: ;
cursor: pointer;
transition: color .2s ease; color: #fff;
background-color: #2d8cf0;
border-color: #2d8cf0;
}
.ivu-btn-primary.active, .ivu-btn-primary:active {
color: #f2f2f2;
background-color: #2b85e4;
border-color: #2b85e4;
}
.ivu-btn-primary:hover {
text-decoration: none;
color: #fff;
background-color: #57a3f3;
border-color: #57a3f3;
}
</style>

代码备份 | 博客侧边栏公告(支持HTML代码)(支持JS代码)的更多相关文章

  1. 博客侧边栏公告html代码

    前一小段是时钟: 后一段是百度统计,但是显示不出来. 网站概况 - 百度统计 https://tongji.baidu.com/web/25880379/overview/index 趋势分析 - 百 ...

  2. 【wget】一条命令轻松备份博客(包括图片)

    h2:first-child, body>h1:first-child, body>h1:first-child+h2, body>h3:first-child, body>h ...

  3. nginx博客系统(内含nginx图片缩略图处理代码,不错)

    一直以来都在Qzone.CSDN等上面写博客,偶尔有些想法就在Paas平台上搭建服务,新浪和曾经的google上都用过其appengine.可是在别人的平台上写东西,总归有些不方便,有受制于人的感觉. ...

  4. 使用CSS/JS代码修改博客模板plus

    之前对CSS/JavaScript了解还不深,只是把模板的CSS胡乱修改了几个属性.最近正好也在做一个网站的前端,学习了不少东西,再来改一改~ 上次最后之所以铩羽而归,是因为从CSS里找不到那些#和. ...

  5. 使用mathjax在博客中完美显示数学公式,支持PC,手机浏览器

    在博客园的设置选项里 有页头HTML的框内输入: <script type="text/javascript" src="http://cdn.mathjax.or ...

  6. Linux内核分析第二周学习博客——完成一个简单的时间片轮转多道程序内核代码

    Linux内核分析第二周学习博客 本周,通过实现一个简单的操作系统内核,我大致了解了操作系统运行的过程. 实验主要步骤如下: 代码分析: void my_process(void) { int i = ...

  7. 第三代微服务架构:基于 Go 的博客微服务实战案例,支持分布式事务

    这是一个可一键部署在 Kubernetes-Istio 集群中的,基于 Golang 的博客微服务 Demo,支持分布式事务. 项目地址:https://github.com/jxlwqq/blog- ...

  8. 欢迎来到L T X的博客 & 博客转型公告

    这里是L T X,一位来自重庆的学生的个人博客. 由于博主以前是OIer,目前博客里主要是OI相关的内容. 但是现在博主已经退役了,因此博客将会转向...嗯...那种...就是那种...比较奇怪的类型 ...

  9. 第一次写博客,关于前端开发deMVC在js中的应用

    对前端MVC MVC分别是model.view.controller的缩写,模型.视图.控制器.这些更加偏向于后台,在以前MVC是只属于后台的.当然随着技术的进步,前端的大牛们将后台的一些东西应用于前 ...

随机推荐

  1. 蛋白质修饰|phosphors|mascot+X|

    生物医学大数据 重点:蛋白质定量 新蛋白可以是全新的蛋白质,也可以是知结构但未知功能的蛋白质,也可以是知道结构有新功能的蛋白质. 新蛋白鉴定可以使用以下方法. 基于基因组,可以基因组中的coding区 ...

  2. 关于使用css变量实现主题的切换效果

    现在要实现网页主题的切换成本较小的一种方案就是使用css的变量来实现 HTML 在HTML的body标签上先定义一个id元素属性 <body id="sm-theme"> ...

  3. 使用记事本编写html代码并运行

    在使用记事本编写html代码,运行时需要将其.txt后缀改为.html双击运行即可. 有时电脑会默认的隐藏其后缀,这时需要修改一下. win7系统修改方法: 双击  我的电脑: 选择  组织: 选择  ...

  4. WWW 2015:一个神奇的会议

    2015:一个神奇的会议" title="WWW 2015:一个神奇的会议"> 作者:微软亚洲研究院研究员 袁进辉 WWW 2015(24th Internatio ...

  5. Mac系列萎靡 大棒能否敲醒苹果?

    大棒能否敲醒苹果?" title="Mac系列萎靡 大棒能否敲醒苹果?">     iPhone在智能手机市场中的一骑绝尘,不断将苹果推向神坛位置.即使新品更新幅度 ...

  6. AI超越人类大脑,或许是场“别有用心者”的骗局

    ​ 谷歌.微软.苹果.特斯拉.百度.腾讯.阿里等互联网巨头企业,以及纳德拉.马斯克.扎克伯格.马云等互联网大佬,近年来一直都对人工智能--AI非常上心.在众多场合对AI给予了或肯定,或恐惧的评价.但无 ...

  7. Java线程知识

    概念 线程生命周期 Java线程模型 线程方法 线程优先级 线程同步 线程在多任务处理应用程序中有着至关重要的作用 概念 基本概念 进程:在操作系统中每个独立运行的程序就是一个进程 线程:程序执行的一 ...

  8. 安卓权威编程指南 挑战练习 25章 深度优化 PhotoGallery 应用

    你可能已经注意到了,提交搜索时, RecyclerView 要等好一会才能刷新显示搜索结果.请接受挑战,让搜索过程更流畅一些.用户一提交搜索,就隐藏软键盘,收起 SearchView 视图(回到只显示 ...

  9. redis集群配置及python操作

    之前我们分析过喜马拉雅的爬取信息,使用分布式爬取,而且需要修改scrapy-redis的过滤算法为布隆过滤来减少redis内存占用,最后考虑这样还是不一定够,那么redis集群就是更好的一种选择方式了 ...

  10. 如何正确使用redis分布式锁

    前言   笔者在公司担任技术面试官,在笔者面试过程中,如果面试候选人提到了reids分布式锁,笔者都会问一下redis分布式锁的知识点,但是令笔者遗憾的是,该知识点十个人中有九个人都答得不清楚,或者回 ...