杨韬的Markdown自定义CSS样式

效果

Markdown例子链接页面

代码


/*主标题*/
#cb_post_title_url{ font-size: 31px; }

/*h2 h3 底纹*/
h2,h3{ background-color: #CBCACA;}

/*引用-左侧线条颜色*/
blockquote {
    border:1em;
    border-left:.5em solid #D9861A;
    background-color: #F2DCF4;
}
/*引用-文字颜色*/
blockquote p {
    color: #713C99;
}

/*代码*/
pre {
    border-radius: 4px;
    border-left: 5px solid #6CE26C;
}

/*表格*/
table {
    width: 100%;
    border: solid #ccc 1px;
}
table tr:hover {
    background: #fbf8e9;
}
table td, .table th {
    border-left: 1px solid #ccc;
    border-top: 1px solid #ccc;
    padding: 10px;
    text-align: left;
}

table th {
    background-color: #dce9f9;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#ebf3fc), to(#dce9f9));
    background-image: -webkit-linear-gradient(top, #ebf3fc, #dce9f9);
    background-image: linear-gradient(top, #ebf3fc, #dce9f9);
    text-shadow: 0 2px 0 rgba(255,255,255,.5);
    padding: 5px;
}

table th:first-child {
    border-radius: 6px 0 0 0;
}
table th:last-child {
    border-radius: 0 6px 0 0;
}
table th:only-child{
    border-radius: 6px 6px 0 0;
}
table tr:last-child td:first-child {
    border-radius: 0 0 0 6px;
}
table tr:last-child td:last-child {
    border-radius: 0 0 6px 0;
}

位置

选项--博客设置--页面定制CSS代码

本文地址
杨韬的学习备忘录

原文地址:https://www.cnblogs.com/ytyt2002ytyt/p/8343674.html

时间: 2024-07-30 10:41:52

杨韬的Markdown自定义CSS样式的相关文章

博客园自定义CSS样式设置

关于博客园自定义CSS样式设置 关于博客园自定义CSS样式设置 首先,选择一个博客皮肤模板,如下 然后,F12审查元素,可对右侧的元素规则进行自定义更改,然后覆盖原CSS 譬如看看取消掉自定义背景图片是什么样子,同理也可以添加CSS样式代码 如此修改完后,就可在页面定制CSS代码框中填上你所需要修改的代码 下面是我的页面定制CSS代码: 1.html,body{2. color: #807C7C;3. font-family: "Helvetica Neue",Helvetica,Ar

CNbolgs自定义CSS样式

适用于页面定制CSS代码 #cnblogs_post_body { color: rgba(0, 0, 0, 0.815); font: 0.875em/1.5em "Times New Roman" , "Arial" ,sans-serif; font-size: 18px; } #cnblogs_post_body h1 { background: #4d4d97; border-radius: 6px 6px 6px 6px; box-shadow: 0 0

CSS自定义滚动条样式

相信很多人都遇到过在设计中自定义滚动条样式的情景,之前我都是努力说服设计师接受浏览器自带的滚动条样式,但是这样只能规避还是解决不了问题,最近在项目中遇到了,正好来总结一下.当然,兼容所有浏览器的滚动条样式目前是不存在的. IE下的滚动条样式 IE是最早提供滚动条的样式支持,好多年了,但是其它浏览器一直没有支持,IE独孤求败了. 这些样式规则很简单: scrollbar-arrow-color: color; /*三角箭头的颜色*/ scrollbar-face-color: color; /*立

CSS使用自定义光标样式-遁地龙卷风

测试环境是chrome浏览器 Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/43.0.2357.132 Safari/537.36 css样式 div { cursor:url('1.jpg'),pointer; } HTML <body> <div style="width:100px;height:100px;background-color:red;">

自定义动画animate可以操作css样式属性总结

自定义动画animate可以操作css样式属性总结 backgroundPosition * borderWidth * borderBottomWidth * borderLeftWidth * borderRightWidth * borderTopWidth * borderSpacing * marginBottom * marginLeft * marginRight * marginTop * outlineWidth * paddingBottom * paddingLeft *

如何自定义CSS滚动条的样式?

欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 本文由前端林子发表 本文会介绍CSS滚动条选择器,并在demo中展示如何在Webkit内核浏览器和IE浏览器中,自定义一个横向以及一个纵向的滚动条. 0.需求 有的时候我们不想使用浏览器默认的滚动条样式,因为不够定制化和美观.那么如何自定义滚动条的样式呢?下面一起来看看吧. 1 基础知识 1.1 Webkit内核的css滚动条选择器 ::-webkit-scrollbar CSS伪类选择器影响了一个元素的滚动条的样式 属性: ::-we

vue项目引入自定义.css的样式文件

ES6的引入方式: .vue文件中 css文件引入 <template></template> <style scoped> @import "../assets/common/common.css";//自定义.css的样式路径 </style> js文件的引入 在main.js中: import API from './assets/api/api.config.js' Vue.prototype.$API = API; P.S.:传

ASP.NET重写Render 加载CSS样式文件和JS文件(切换CSS换皮肤)

网页换皮肤的方式有很多种,最简单的通常就是切换页面CSS,而CSS通常写在外部CSS文件里.那么切换CSS其实就是更换html里的link href路径.我在网上搜索了下. 一般有两种方式: 1.页面放一个Holder控件.然后用编程方式把当前用户的风格css link写入页面. 2.过反射机制,逐个控件设置css样式. 上面两种方式都挺麻烦的,第一种需要在每个页面上放一个holder控件,类似的做法还有把link标签加runat=server的做法,页面多了,都比较麻烦.第二种不用考虑了,性能

HTML+CSS样式设置——CSS一学就会

HTML+CSS样式设置 CSS:(Cascading Style Sheets)层叠样式设置表. 网页的展示效果跟其排版有很大的关系.排版则主要依靠CSS来设置.调节. 下面说CSS与HTML的联合使用的过程: (1)新建CSS文件(一般放在与HTML文件同一路径下的css文件夹中) (2)在HTML的<head>标签中,用<link />对CSS进行引用 <link rel="stylesheet" type="text/css"