左固定，右自适应的博客布局--part0
主题: SimpleMemory
/*Skins*/
.cover-blue {
background-color: rgba(37, 104, 163, 0.6);
background-image: -webkit-linear-gradient(-410deg, rgba(37, 104, 163, 0.6) 20%, rgba(18, 51, 80, 0.8));
background-image: linear-gradient(140deg,rgba(37, 104, 163, 0.6) 20%, rgba(18, 51, 80, 0.8));
}
.cover-green {
background-color: rgba(21, 111, 120, 0.6);
background-image: -webkit-linear-gradient(-410deg, rgba(21, 111, 120, 0.6) 20%, rgba(6, 31, 33, 0.8));
background-image: linear-gradient(140deg,rgba(21, 111, 120, 0.6) 20%, rgba(6, 31, 33, 0.8));
}
.cover-purple {
background-color: rgba(73, 50, 82, 0.6);
background-image: -webkit-linear-gradient(-410deg, rgba(73, 50, 82, 0.6) 20%, rgba(17, 11, 19, 0.8));
background-image: linear-gradient(140deg,rgba(73, 50, 82, 0.6) 20%, rgba(17, 11, 19, 0.8));
}
.cover-red {
background-color: rgba(119, 31, 18, 0.6);
background-image: -webkit-linear-gradient(-410deg, rgba(119, 31, 18, 0.6) 20%, rgba(30, 8, 5, 0.8));
background-image: linear-gradient(140deg,rgba(119, 31, 18, 0.6) 20%, rgba(30, 8, 5, 0.8));
}
.cover-orange {
background-color: rgba(174, 80, 4, 0.6);
background-image: -webkit-linear-gradient(-410deg, rgba(174, 80, 4, 0.6) 20%, rgba(74, 34, 2, 0.8));
background-image: linear-gradient(140deg,rgba(174, 80, 4, 0.6) 20%, rgba(74, 34, 2, 0.8));
}
.cover-slate {
background-color: rgba(61, 66, 96, 0.6);
background-image: -webkit-linear-gradient(-410deg, rgba(61, 66, 96, 0.6) 20%, rgba(21, 23, 34, 0.8));
background-image: linear-gradient(140deg,rgba(61, 66, 96, 0.6) 20%, rgba(21, 23, 34, 0.8));
}
.cover-disabled {
background: none;
}
.panel-cover--overlay {
display: block;
position: absolute;
z-index: 0;
top: 0;
right: 0;
bottom: 0;
left: 0;
/*background-color: rgba(68, 68, 68, 0.6);
background-image: -webkit-linear-gradient(-410deg, rgba(68, 68, 68, 0.6) 20%, rgba(0, 0, 0, 0.9));
background-image: linear-gradient(140deg,rgba(68, 68, 68, 0.6) 20%, rgba(0, 0, 0, 0.9));*/
}
/**************************************************
第一部分：所有的模板都使用的公共样式。公告样式是为了更好的向前和向后兼容。
如果不符合你皮肤的要求，你可以在后面通过更高的优先级覆盖着这些样式，但是
你不能删除这些样式。
**************************************************/
.topicListFooter {
text-align: right;
margin-right: 10px;
margin-top: 10px;
}
#divRefreshComments{
text-align: right;
margin-right: 10px;
margin-bottom: 5px;
font-size: 9pt;
}
/********************第一部分结束*******************/
/**************************************************
第二部：公共样式（全局样式）。公共会对所有页面的标签都起作用。这个部分你
可以随意的更改，并不会牵扯到其他的皮肤模板。但是每次更改都要注意你的皮肤
模板所有页面的变化。因为它们是全局的。
**************************************************/
* {
margin: 0;
padding: 0;
}
html {
height: 100%;
}
body {
color: #000;
background: #FFF;
font-family: "verdana","Arial","微软雅黑", "Helvetica", "sans-serif";
font-size: 9pt;
min-height: 101%;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
fieldset, img {
border: 0;
}
ul {
word-break: break-all;
}
li {
list-style: none;
}
h1, h2, h3, h4, h5, h6 {
font-size: 110%;
font-weight: normal;
}
a:link {
color: black;
text-decoration: none;
}
a:visited {
color: black;
text-decoration: none;
}
a:hover {
color: #F60;
text-decoration: underline;
}
a:active {
color: black;
text-decoration: none;
}
.clear {
clear: both;
}
/*****第二部分结束*******************************/
/**************************************************
第三部分：各个页面元素的样式。你可以根据需要随意的更改，并不会牵扯到其他
的皮肤模板。这个部分是最能展现你想象力的部分。其中头部和侧边栏部分是此皮
肤公共的部分。而每个页面特有的部分会有相应的注释和说明。
**************************************************/
/*****home和头部开始**************************/
#home {
margin: 0 auto;
}
#header {
font-family: "verdana","Arial","微软雅黑", "Helvetica", "sans-serif";
position: fixed;
height: 100%;
width: 25%;
background: url(https://img2018.cnblogs.com/blog/1281523/202001/1281523-20200104223557349-2053953392.jpg) no-repeat center;
background-size: ,100% ;
font-size: 8 px;
color: black；
letter-spacing: 2px;
word-spacing: 4px;
box-shadow: 2px 2px 1px #888888;
}
#.header-cover{
height: 100%;
background-color: rgba(0,0,0,0);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(20%,rgba(61,66,96,0.6)),color-stop(100%,rgba(21,23,34,0.8)));
background-image: -webkit-linear-gradient(-410deg,rgba(61,66,96,0.6) 20%,rgba(21,23,34,0.8));
background-image: linear-gradient(140deg,rgba(61,66,96,0.6) 20%,rgba(21,23,34,0.8));
}
#blogTitle {
height: 30%;
clear: both;
font-size: 90%;
}
#blogTitle h1 {
font-size: 320%;
font-weight: bolder;
line-height: 2em;
padding-top: 50%;
width: 100%;
text-align: center;
transition:0.3s ease-out;
-webkit-transition:0.3s ease-out;
-o-transition:0.3s ease-out;
-moz-transition:0.3s ease-out;
}
#blogTitle h1:hover{
transform: scale(1.02);
-ms-transform: scale(1.02);
-webkit-transform:scale(1.02);
-moz-transform:scale(1.02);
-o-transform:scale(1.02);
}
#blogTitle h1 a.headermaintitle{
color: rgba(255,255,255,0.85);
text-decoration: none;
text-shadow: 0 1px 1px rgba(0,0,0,0.4);
}
#blogTitle h1 a.headermaintitle:hover{
color: rgba(255,255,255,1);
text-decoration: none;
}
#blogTitle h2 {
text-shadow: 0 1px 1px rgba(0,0,0,0.4);
font-size: 120%;
line-height: 2em;
text-align: center;
width: 100%;
color: #fff;
letter-spacing: 0.1em;
}
#blogLogo {
float: right;
}
/* 正文文章标题 */
#cb_post_title_url {
padding-left: 10px;
border-left-width: 3px;
border-left-style: solid;
border-left-color: #eb5055;
}
#navigator {
height: 50%;
padding-top: 30%;
clear: both;
}
#navList {
width: 25.5em;
margin: 0 auto;
overflow: hidden;
}
#navList li {
float: left;
margin-right: 15px;
}
#navList a {
border-bottom: 0px solid #ccc;
display: block;
width: 5em;
height: 22px;
float: left;
text-align: center;
padding-top: 8px;
}
/*#navList a[href="PostsList.htm"],#navList a[href="EntryList.htm"], #navList a[href="GalleryThumbNailViewer.htm"],#navList a[href="#"]{
display: none;
}*/
#navList a:link, #navList a:visited, #navList a:active {
color: #fff;
}
#navList a:hover {
border-top: 2px solid #ccc;
border-bottom-width: 0;
color: white;
text-decoration: none;
}
.blogStats {
position: absolute;
bottom: 61px;
width: 100%;
color: #fff;
margin-bottom: 30px;
text-align: center;
text-shadow: 1px 1px 1px rgba(0,0,0,0.4);
}
/*****home和头部结束**************************/
/*****主页文章列表开始**************************/
#main{
float:left;
margin-left: 25%;
width: 65%; /*改成auto以后会过宽*/
height: 100%；
min-width: 950px;
text-align: left;
padding: 5% 5.7% 7% 4%;
}
#mainContent .forFlow{
float: none;
width: auto;
}
#mainContent {
min-height: 200px;
padding: 0px 0px 10px 0;
*padding-top:10px;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
word-break: break-all;
float: left;
width: 100%;
}
.day {
min-height: 10px;
_height: 10px;
margin-bottom: 40px;
padding-bottom: 40px;
border-bottom: 0px solid #999;
}
.dayTitle {
width: 100%;
color: #ccc;
font-weight: bold;
line-height: 1.5em;
font-size: 1.1em;
margin-top: 3px;
margin-bottom: 10px;
clear:both;
font-family: "微软雅黑" , "黑体" ,Arial;
text-align:right;
}
/* 首页文章标题样式 */
.postTitle {
font-size: 2em;
float: right;
line-height: 1.5em;
width: 100%;
clear:both;
color: #333333;
}
/* 首页 文章列表 */
.postTitle a{
padding-left: 10px;
border-left-width: 3px;
border-left-style: solid;
border-left-color: #cbcbc1;
}
.postTitle a:link, .postTitle a:visited, .postTitle a:active {
color: #444;
}
.postTitle a:hover {
color: #b9301c;
text-decoration: none;
}
.postCon {
float: right;
line-height: 1.5em;
width: 100%;
clear:both;
color: #666;
padding: 10px 0;
text-align:justify;
font-family: "微软雅黑" , "黑体" ,Arial;
}
.post .postTitle .postTitle2 {
font-weight:360!important
}
.post .postTitle .postTitle2 :hover {
font-size:102%
}
.postDesc {
float: right;
width: 100%;
clear:both;
text-align: right;
padding-right: 5px;
color: #aaa;
margin-top: 5px;
margin-bottom: 10px;
font-size: .9em;
font-family: "微软雅黑" , "黑体" ,Arial;
}
.postDesc a:link, .postDesc a:visited, .postDesc a:active {
color: #666;
}
.postDesc a:hover {
/*color: #F60;*/
color:#b9301c;
text-decoration: none;
}
.postSeparator {
font-family: "微软雅黑" , "黑体" ,Arial;
clear: both;
height: 2px;
border-top: 1px dotted #00f;
display: none;
width: 100%;
clear:both;
float: right;
margin: 15px auto 15px auto;
}
/* 未登录的样式*/
.login_tips {
color: #ccc;
background-image:none;
font-style:normal;
font-size: 14px;
}
.login_tips:before{
content: "🍟";
}
.login_tips a {
color: #ccc;
}
/*博客园去除文章页底部的推广链接*/
#ad_c1,
#ad_c2,
#ad_t2,
#sidebar_imagecategory,
#sidebar_postarchive,
#sidebar_recentcomments,
#sidebar_recentposts,
#under_post_kb,
#under_post_news,
#tip_comment2,
#comment_form_container p:nth-of-type(3),
#comments_pager_top,
#homepage_top_pager,
.c_ad_block {
display: none;
}
/*******标签列表*******/
/* 标题 */
#taglist_title {
font-size: 30px;
line-height: 2em ;
position:relative;
left:-100px
}
/* 括号数字样式*/
#taglist td{
color:#666;
font-size: 18px;
line-height: 1.5em;
}
#taglist a::before{
content: ' 📌 ';
font-size: 14px;
}
/*页脚自定义样式*/
.linkInbottem {
bottom: 0pt;
margin: 0pt;
width: 100%;
z-index: 10 ! important;
bottom: -50px;
}
.linkInbottem div{
text-align: center;
background-color: white;
border-top: 0px solid #8BAABF;
padding: 5px;
}
/*****主页文章列表开始**************************/
/*****侧边栏开始********************************/
#sideBar {
min-height: 150px;
padding: 0px 0 0px 5px;
float: left;
display: none; /*禁用侧边栏*/
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
word-break: break-all;
}
.newsItem .catListTitle {
display: none;
}
.newsItem {
padding: 15px 0 5px 0px;
margin-bottom: 8px;
}
/**日历控件样式开始**/
#calendar {
width: 200px;
}
#calendar .Cal {
width: 100%;
line-height: 1.5em;
}
.Cal {/**日历容器table**/
border: none;
color: #666;
}
#calendar table a:link, #calendar table a:visited, #calendar table a:active {
font-weight: bold;
}
#calendar table a:hover {
color: white;
text-decoration: none;
background-color: #F60;
}
.CalTodayDay{/**今天日期样式**/
color:#f60;
}
#calendar .CalNextPrev a:link,#calendar .CalNextPrev a:visited, #calendar .CalNextPrev a:active {/**上个月、下个月箭头样式**/
font-weight: bold;
background-color: white;
}
.CalDayHeader{
border-bottom:1px solid #ccc;
}
.CalTitle{/**日历年月头部样式**/
width:100%;
background:white;
color:black;
border-bottom:1px solid #666;
}
/**日历控件样式结束**/
.catListTitle {
font-weight: bold;
line-height: 1.5em;
font-size: 110%;
margin-top: 15px;
margin-bottom: 10px;
border-bottom: 1px solid black;
text-align: center;
}
.catListComment {
line-height: 1.5em;
}
.divRecentComment {
text-indent: 2em;
color: #666;
}
#sideBarMain ul {
line-height: 1.5em;
}
/*****侧边栏结束********************************/
/****查看文章页面开始*************************/
#topics {
width: 100%;
min-height: 200px;
padding: 0px 0px 80px 0;
float: left;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
word-break: break-all;
}
#topics .postTitle {
font-size: 130%;
font-weight: bold;
color:#333;
font-size: 3em;
line-height: 1.2em;
float: left;
line-height: 1.5em;
width: 100%;
padding-left: 5px;
padding-bottom: 25px;
}
.postBody {
padding: 5px 2px 5px 5px;
line-height: 1.5em;
color: #000;
border-bottom:1px solid #eef2f8
}
/* 文内链接有下划线提醒 */
.postBody a{
/*! text-decoration:underline; */
}
/* 取消 上下一篇 下划线*/
#post_next_prev a{
text-decoration:none;
}
/* 文章内尾部：分类、标签样式*/
#BlogPostCategory a ,#BlogPostCategory,
#EntryTag {
font-size: 12px;
color: #666;
font-family: "微软雅黑" , ,Consolas;
}
#BlogPostCategory ::before {
content: ' 📕 '
}
#EntryTag ::before {
content: ' 🔖 '
}
#BlogPostCategory a,
#EntryTag a {
margin-left: 0px;
text-decoration:none;
}
#BlogPostCategory a:link, #EntryTag a:visited, #EntryTag a:active,
#EntryTag a:link, #EntryTag a:visited, #EntryTag a:active {
color: #666;
}
#BlogPostCategory a:hover,
#EntryTag a:hover {
color: #f60;
}
/* posted @ xxx 阅读评论 ...*/
#topics .postDesc {
float: right;
width: 100%;
text-align: right;
padding-right: 0px;
color: #666;
margin: 5px;
}
.feedback_area_title {
font-weight: bold;
margin-top: 20px;
/* border-bottom: 1px solid #333;*/
margin-bottom: 10px;
padding-left: 8px;
padding-bottom: 10px;
}
.louzhu {
background:transparent url('images/icoLouZhu.gif') no-repeat scroll right top;
padding-right:16px;
}
.feedbackListSubtitle {
color: #666;
}
.feedbackListSubtitle a:link, .feedbackListSubtitle a:visited, .feedbackListSubtitle a:active {
color: #666;
font-weight: normal;
}
.feedbackListSubtitle a:hover {
color: #f60;
text-decoration: none;
}
.feedbackManage {
width: 200px;
text-align: right;
float: right;
}
.feedbackCon {
border-bottom: 1px solid #ccc;
background: url('images/comment.gif') no-repeat 5px 0px;
padding: 15px 18px 10px 40px;
min-height: 35px;
_height: 35px;
margin-bottom: 1em;
line-height: 1.5em;
width:100%;
}
#divRefreshComments {
text-align: right;
margin-bottom: 10px;
}
.commenttb {
width: 320px;
}
/****查看文章页面开始*************************/
/****列表页面开始******************************/
.entrylistTitle,.PostListTitle,.thumbTitle{/**几个分类列表的标题样式**/
font-size: 110%;
font-weight: bold;
border-bottom: 0px solid black;
text-align: right;
padding-bottom: 3px;
padding-right: 10px;
}
.entrylistDescription {
color: #666;
text-align: right;
padding-top: 5px;
padding-bottom: 5px;
padding-right: 10px;
margin-bottom: 10px;
}
/* 随笔分类 */
.entrylistItem {
min-height: 20px;
_height: 20px;
margin-bottom: 40px;
padding-bottom: 5px;
width: 100%;
}
.entrylistPosttitle{
font-size: 1.5em;
line-height: 1。5em;
width: auto;
clear:both;
color: #333333;
}
.entrylistPosttitle a:hover {
text-decoration: none;
}
.entrylistPostSummary {
margin-top: 5px;
padding-left: 0px;
margin-bottom: 5px;
}
.entrylistItemPostDesc {
text-align: right;
color: #666;
}
.entrylistItemPostDesc a:link, .entrylistItemPostDesc a:visited, .entrylistItemPostDesc a:active {
color: #666;
}
.entrylistItemPostDesc a:hover {
color: #f60;
}
.entrylist .postSeparator {
clear: both;
width: 100%;
font-size: 0;
line-height: 0;
margin: 0;
padding: 0;
height: 0;
border: none;
}
/* 修改 上一页 下一页 选择条*/
#nav_next_page,
.pager {
margin-right:0;
color:#314659;
text-align: center;
margin-right: 0px;
}
#nav_next_page a,
.pager a {
padding:3px 7px;
border:1px solid #314659;
border-radius:2px;
margin:0 3px;
text-decoration:none;
color:inherit;
transition:border .2s ease-in-out,color .2s ease-in-out
}
#nav_next_page a:hover,
.pager a:hover {
color:#ccc;
border:1px solid #ccc
}
.pager span.current {
padding:3px 7px;
border:1px solid #2D8CF0;
border-radius:4px;
font-family:Monospaced Number;
margin:0 3px;
text-decoration:none;
background-color:#2D8CF0
}
.PostList {
border-bottom: 1px solid #ccc;
clear: both;
min-height: 1.5em;
_height: 1.5em;
padding-top: 10px;
padding-left: 5px;
padding-right: 5px;
margin-bottom: 5px;
}
.postTitl2 {
float: left;
}
.postDesc2 {
color: #666;
float: right;
margin-right: ;
}
.postText2 {
clear: both;
color: #666;
}
.pfl_feedback_area_title {
text-align: right;
line-height: 1.5em;
font-weight: bold;
border-bottom: 1px solid #666;
margin-bottom: 10px;
}
.pfl_feedbackItem {
border-bottom: 1px solid black;
margin-bottom: 20px;
}
.pfl_feedbacksubtitle {
width: 100%;
border-bottom: 1px dotted #666;
height: 1.5em;
}
.pfl_feedbackname {
float: left;
}
.pfl_feedbackManage {
float: right;
}
.pfl_feedbackCon {
color: black;
padding-top: 5px;
padding-bottom: 5px;
}
.pfl_feedbackAnswer {
color: #F40;
text-indent: 2em;
}
.tdSentMessage {
text-align: right;
}
.errorMessage {
width: 300px;
float: left;
}
.mySearch #q {
height: 1.4em;
width: 175px;
}
/****列表页面结束******************************/
/****相册页面开始******************************/
.divPhoto {
border: 1px solid #ccc;
padding: 2px;
margin-right: 10px;
}
.thumbDescription {
color: #666;
text-align: right;
padding-top: 5px;
padding-bottom: 5px;
padding-right: 10px;
margin-bottom: 10px;
}
/****相册页面开始******************************/
/*****留言页面开始*****************************/
#footer {
text-align: center;
min-height: 15px;
_height: 15px;
border-top: 1px solid black;
margin-top: 10px;
padding-top: 10px;
margin-bottom: 10px;
display: none;
}
/*留言查看页面的个人信息*/
.personInfo {
margin-bottom: 20px;
}
/*留言分页区域*/
.pages {
text-align: right;
}
/*****留言页面结束*****************************/
/*****第三部分结束*******************************/
/**************************************************
第四部分：文章内容常用标签格式。这个部分是设置作者写作内容的部分。例如：
如果作者的文章用有p标签，则可通过这个对这些文章中的p标签进行设置。前面
的“.postBody”明确的指出了这里样式的作用范围。仅仅适用于文章主体部分。
建议这个不要设置过于详细的细节。因为，一些样式，一篇文章比较适合的话，
并不能保证所有的文章都适合。
**************************************************/
/*文章内部常用标签格式*/
.postBody {
line-height: 1.5em;
}
.postBody p,.postCon p{
text-indent: 2em;
margin: 0 auto 1em auto;
}
.postBody h2{
font-size: 150%;
margin: 25px auto 10px auto;
font-weight:bold;
}
.postBody h3 {
font-size: 120%;
margin: 15px auto 2px auto;
font-weight:bold;
}
.postBody h4{
font-size:110%;
margin:15px auto 2px auto;
font-weight:bold;
color:#333;
}
.postBody h5{
font-size:100%;
margin:15px auto 2px auto;
font-weight:bold;
color:#333;
}
.postBody a:link,.postBody a:visited,.postBody a:active{
}
.postCon a:link,.postCon a:visited,.postCon a:active{
text-decoration:underline;
}
.postBody ul,.postCon ul{
margin-left:2em;
}
.postBody li,.postCon li{
list-style-type:disc;
margin-bottom:1em;
}
.postBody blockquote{
background:url('images/comment.gif')) no-repeat 25px 0px;
padding:10px 60px 5px 60px;
min-height:35px;
_height:35px;
line-height:0em;
color:#333;
}
/* 隐藏小名片，默认顶贴*/
#author_profile,
#green_channel {
display:none
}
/*****第四部分结束*******************************/
/*新增顶贴按钮*/
#div_digg {
float:none;
margin:35px auto 85px auto;
z-index:-2;
width:300px
}
#div_digg .buryit,
#div_digg .diggit,
#div_digg .div-follow {
background:#FFF;
margin:0;
display:inline-block;
width:auto;
height:32px;
border-width:0;
cursor:pointer;
color:#fff;
user-select:none;
padding:0 10px;
border-radius:5px;
transition:color .2s linear,background-color .2s linear,border .2s linear,box-shadow .2s linear
}
#div_digg .div-follow {
background-color:#e7d105;
border-color:#e7d105
}
#div_digg .div-follow:hover {
background-color:#ffe603;
border-color:#ffe603
}
#div_digg .diggit {
background-color:#18b566;
border-color:#18b566
}
#div_digg .diggit:hover {
background-color:#47cb89;
border-color:#47cb89
}
#div_digg .buryit {
background-color:#ed4014;
border-color:#ed4014
}
#div_digg .buryit:hover {
background-color:#f16643;
border-color:#f16643
}
#div_digg .buryit .burynum,
#div_digg .diggit .diggnum,
#div_digg .div-follow .span-follow {
color:snow;
display:inline-block;
font-size:15px;
position:relative;
top:5px;
width:65px
}
#div_digg .diggit .diggnum:before {
content:'\63a8\8350';
font-size:15px;
margin-right:5px
}
#div_digg .buryit .burynum:before {
content:'\53cd\5bf9';
font-size:15px;
margin-right:5px
}
/** 优化评论区样式 */
#comment_nav {
visibility:hidden
}
/*
评论框底图
这个时代不会阻止你自己闪耀,但你也覆盖不了任何人的光辉。而学习的本质是一个不断抄袭、模仿、练习、理解再创新的过程。即使知道无法超越的同主题博文，本人还会继续坚持学习，不断探索；总结是本能，分享是爱好。由于人固有能力的永久局限性，文中可能存在描述不正确；想听鼓励，更想听批评。恳请指正、也希望本人的博客对于家有帮助。
.tbCommentBody_bg{
background: url(https://img2018.cnblogs.com/blog/1281523/202001/1281523-20200106212251302-121067186.png) no-repeat;
background-color: rgba(0, 0, 0, 0);
}
*/
.feedbackCon {
background:0 0;
padding:10px 0 10px 0;
border-bottom:1px solid #eef2f8
}
.feedbackCon .esa-comment-avatar {
float:left;
margin-right:10px
}
.feedbackCon .esa-comment-avatar img {
border-radius:50%;
width:48px;
transition:all .5s ease-out;
-webkit-transition:all .6s ease-out;
-moz-transition:all .5s ease-out;
-ms-transition:all .5s ease-out;
-o-transition:all .5s ease-out
}
.feedbackCon .esa-comment-avatar img:hover {
-webkit-transform:rotateZ(360deg);
-moz-transform:rotateZ(360deg);
-ms-transform:rotateZ(360deg);
-o-transform:rotateZ(360deg);
transform:rotateZ(360deg)
}
.feedbackCon .blog_comment_body {
border-radius:3px;
padding:8px;
margin-top:5px;
margin-left:6px;
font-size:13px;
display:block;
color:#434b69;
background-color:rgba(193,193,193,.2);
width:auto
}
.feedbackItem .feedbackListSubtitle {
color:transparent
}
.feedbackItem .feedbackListSubtitle .sendMsg2This {
background:0 0;
padding-left:0;
font-size:15px
}
.feedbackItem .feedbackListSubtitle .sendMsg2This::before {
content:'✉️'
}
.feedbackItem a {
color:#314659
}
.feedbackItem .louzhu {
background:#2D8CF0!important;
color:#fff;
border-radius:2px;
margin:0 2px;
padding:0 6px 2px 6px!important
}
.feedbackItem .comment_date {
color:#666
}
.feedbackItem .comment_quote {
border:1px dashed #2D8CF0;
border-radius:3px
}
.comment_textarea{
padding: 15px;
border-radius: 10px;
outline: 0;
resize: none;
overflow: hidden;
}
div .commentform textarea{
width: 95%;
}
.feedbackCon .comment_vote {
margin-top:12px
}
.comment_btn {
border: 1px solid #f7f7f7;
border-radius: 30px;
background-color: #f7f7f7;
font-size: 13px;
cursor: pointer;
height: 32px;
padding: 0 20px;
right:7%;
width: auto;
}
.comment_btn:hover {
border: 1px solid #eb5055;
background-color: white;
color: #eb5055;
transition-duration: .4s;
}
.feedback_area_title{
display: none;
}
#commentform_title {
background-image:none;
padding-left: 0;
font-size:15px;
color: #ccc;
}
.commentbox_title{
display: none;
}
.commentbox_main{
margin-top: 20px;
}
/* 链接 提示样式*/
#cnblogs_post_body a::after, .uri::after{
content: '💬';
font-size:10px;
}
/* 正文段落 间距*/
#cnblogs_post_body p {
margin: 15px auto;
text-indent: 0;
line-height: 28px;
}
/*标题h1 h2 h3样式*/
#cnblogs_post_body
{
color: black;
font: 0.875em/1.5em "微软雅黑" , "PTSans" , "Arial" ,sans-serif;
font-size: 15px;
}
#cnblogs_post_body h1 {
/* schips*/
padding-right: 10px;
border-right-width: 3px;
border-right-style:solid;
border-right-color:#eb5055;
font-family: "微软雅黑" , "黑体" ,Arial;
font-size: 23px;
text-align: right;
}
#cnblogs_post_body h1::after {
/* schips*/
content: '🚩'
}
#cnblogs_post_body h2{
font-family: "微软雅黑" , "黑体" ,Arial;
font-size: 20px;
font-weight: bold;
}
.cnblogs-markdown h2:before{
content: "#";
color: #eb5055;
position: relative;
top: 0;
left: 0px;
}
#cnblogs_post_body h3 {
font-family: "微软雅黑" , "黑体" ,Arial;
font-size: 18px;
height: 25px;
}
.cnblogs-markdown h3:before{
content: "##";
color: #2175bc;
position: relative;
top: 0;
left: -2px;
}
#cnblogs_post_body h4{
font-family: "微软雅黑" , "黑体" ,Arial;
font-size: 16px;
font-weight: bold;
height: 24px;
}
order-top:2px solid #CBCFD2
}
/** MarkDown样式调整 */
.cnblogs-markdown {
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
color: #333;
overflow: hidden;
font-family: "Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif;
font-size: 16px;
line-height: 1.6;
word-wrap: break-word;
}
.cnblogs-markdown a {
background: transparent;
}
.cnblogs-markdown a:active,
.cnblogs-markdown a:hover {
outline: 0;
}
.cnblogs-markdown strong {
font-weight: bold;
}
.cnblogs-markdown h1 {
font-size: 2em;
margin: 0.67em 0;
}
.cnblogs-markdown img {
border: 0;
}
.cnblogs-markdown hr {
box-sizing: content-box;
height: 0;
}
.cnblogs-markdown pre {
overflow: auto;
}
.cnblogs-markdown code,
.cnblogs-markdown kbd,
.cnblogs-markdown pre {
font-family: monospace, monospace;
font-size: 1em;
}
.cnblogs-markdown input {
color: inherit;
font: inherit;
margin: 0;
}
.cnblogs-markdown html input[disabled] {
cursor: default;
}
.cnblogs-markdown input {
line-height: normal;
}
.cnblogs-markdown input[type="checkbox"] {
box-sizing: border-box;
padding: 0;
font-size: 16px;
}
.cnblogs-markdown table {
border-collapse: collapse;
border-spacing: 0;
}
.cnblogs-markdown td,
.cnblogs-markdown th {
padding: 0;
}
.cnblogs-markdown * {
box-sizing: border-box;
/*! font-size: 16px; */
}
.cnblogs-markdown input {
font: 13px/1.4 Helvetica, arial, nimbussansl, liberationsans, freesans, clean, sans-serif, "Segoe UI Emoji", "Segoe UI Symbol";
}
.cnblogs-markdown a {
color: #4183c4;
text-decoration: none;
}
.cnblogs-markdown a:hover,
.cnblogs-markdown a:active {
text-decoration: underline;
}
.cnblogs-markdown hr {
height: 0;
margin: 15px 0;
overflow: hidden;
background: transparent;
border: 0;
border-bottom: 1px solid #ddd;
}
.cnblogs-markdown hr:before {
display: table;
content: "";
}
.cnblogs-markdown hr:after {
display: table;
clear: both;
content: "";
}
.cnblogs-markdown h1,
.cnblogs-markdown h2,
.cnblogs-markdown h3,
.cnblogs-markdown h4,
.cnblogs-markdown h5,
.cnblogs-markdown h6 {
margin-top: 15px;
margin-bottom: 10px;
line-height: 1.1;
}
.cnblogs-markdown blockquote {
margin: 0;
line-height: 1.7 !important;
}
.cnblogs-markdown ul,
.cnblogs-markdown ol {
padding: 0;
margin-top: 0;
margin-bottom: 0;
}
.cnblogs-markdown ol ol,
.cnblogs-markdown ul ol {
list-style-type: lower-roman;
}
.cnblogs-markdown ul ul ol,
.cnblogs-markdown ul ol ol,
.cnblogs-markdown ol ul ol,
.cnblogs-markdown ol ol ol {
list-style-type: lower-alpha;
}
.cnblogs-markdown dd {
margin-left: 0;
}
.cnblogs-markdown pre {
margin-top: 0;
margin-bottom: 0;
font: 12px Consolas, "Liberation Mono", Menlo, Courier, monospace;
}
.cnblogs-markdown .octicon {
font: normal normal normal 16px/1 octicons-anchor;
display: inline-block;
text-decoration: none;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.cnblogs-markdown .octicon-link:before {
content: '\f05c';
}
.cnblogs-markdown>*:first-child {
margin-top: 0 !important;
}
.cnblogs-markdown>*:last-child {
margin-bottom: 0 !important;
}
.cnblogs-markdown a:not(:link):not(:visited) {
color: inherit;
text-decoration: none;
}
.cnblogs-markdown .anchor {
position: absolute;
top: 0;
left: 0;
display: block;
padding-right: 6px;
padding-left: 30px;
margin-left: -30px;
}
.cnblogs-markdown .anchor:focus {
outline: none;
}
.cnblogs-markdown h1,
.cnblogs-markdown h2,
.cnblogs-markdown h3,
.cnblogs-markdown h4,
.cnblogs-markdown h5,
.cnblogs-markdown h6 {
position: relative;
margin-top: 1em;
margin-bottom: 16px;
font-weight: bold;
line-height: 1.4;
}
.cnblogs-markdown h1 .octicon-link,
.cnblogs-markdown h2 .octicon-link,
.cnblogs-markdown h3 .octicon-link,
.cnblogs-markdown h4 .octicon-link,
.cnblogs-markdown h5 .octicon-link,
.cnblogs-markdown h6 .octicon-link {
display: none;
color: #000;
vertical-align: middle;
}
.cnblogs-markdown h1:hover .anchor,
.cnblogs-markdown h2:hover .anchor,
.cnblogs-markdown h3:hover .anchor,
.cnblogs-markdown h4:hover .anchor,
.cnblogs-markdown h5:hover .anchor,
.cnblogs-markdown h6:hover .anchor {
padding-left: 8px;
margin-left: -30px;
text-decoration: none;
}
.cnblogs-markdown h1:hover .anchor .octicon-link,
.cnblogs-markdown h2:hover .anchor .octicon-link,
.cnblogs-markdown h3:hover .anchor .octicon-link,
.cnblogs-markdown h4:hover .anchor .octicon-link,
.cnblogs-markdown h5:hover .anchor .octicon-link,
.cnblogs-markdown h6:hover .anchor .octicon-link {
display: inline-block;
}
.cnblogs-markdown h1 {
padding-bottom: 0.3em;
font-size: 2.25em !important;
line-height: 1.2;
border-bottom: 1px solid #eee;
}
.cnblogs-markdown h1 .anchor {
line-height: 1;
}
.cnblogs-markdown h2 {
padding-bottom: 0.3em;
font-size: 1.75em !important;
line-height: 1.225;
/*! border-bottom: 1px solid #eee; */
}
.cnblogs-markdown h2 .anchor {
line-height: 1;
}
.cnblogs-markdown h3 {
font-size: 1.5em!important;
line-height: 1.43;
}
.cnblogs-markdown h3 .anchor {
line-height: 1.2;
}
.cnblogs-markdown h4 {
font-size: 1.25em !important;
}
.cnblogs-markdown h4 .anchor {
line-height: 1.2;
}
.cnblogs-markdown h5 {
font-size: 1em !important;
}
.cnblogs-markdown h5 .anchor {
line-height: 1.1;
}
.cnblogs-markdown h6 {
font-size: 1em !important;
color: #777;
}
.cnblogs-markdown h6 .anchor {
line-height: 1.1;
}
.cnblogs-markdown p,
.cnblogs-markdown blockquote,
.cnblogs-markdown ul,
.cnblogs-markdown ol,
.cnblogs-markdown dl,
.cnblogs-markdown table,
.cnblogs-markdown pre {
margin-top: 0;
margin-bottom: 16px;
}
.cnblogs-markdown hr {
height: 4px;
padding: 0;
margin: 16px 0;
background-color: #e7e7e7;
border: 0 none;
}
.cnblogs-markdown ul,
.cnblogs-markdown ol {
padding-left: 2em;
font-size: 14px;
}
.cnblogs-markdown ul ul,
.cnblogs-markdown ul ol,
.cnblogs-markdown ol ol,
.cnblogs-markdown ol ul {
margin-top: 0;
margin-bottom: 0;
}
.cnblogs-markdown li>p {
margin-top: 16px;
}
.cnblogs-markdown dl {
padding: 0;
}
.cnblogs-markdown dl dt {
padding: 0;
margin-top: 16px;
font-size: 1em;
font-style: italic;
font-weight: bold;
}
.cnblogs-markdown dl dd {
padding: 0 16px;
margin-bottom: 16px;
}
.cnblogs-markdown blockquote {
color: #333;
padding: 2px 10px;
border: none;
border-left: 5px solid #D6DBDF;
line-height: 1.6;
}
.cnblogs-markdown blockquote>:first-child {
margin-top: 0;
}
.cnblogs-markdown blockquote>:last-child {
margin-bottom: 0;
}
.cnblogs-markdown table {
display: block;
width: 100%;
overflow: auto;
word-break: normal;
word-break: keep-all;
}
.cnblogs-markdown table th {
font-weight: bold;
}
.cnblogs-markdown table th,
.cnblogs-markdown table td {
padding: 6px 13px;
border: 1px solid #ddd;
}
.cnblogs-markdown table tr {
background-color: #fff;
border-top: 1px solid #ccc;
}
.cnblogs-markdown table tr:nth-child(2n) {
background-color: #f8f8f8;
}
.cnblogs-markdown img {
max-width: 100%;
box-sizing: border-box;
}
.cnblogs-markdown code {
font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace !important;
font-size: 12px;
padding: 0;
padding-top: 0.2em;
padding-bottom: 0.2em;
/*! margin: 0; */
font-size: 85%;
background-color: rgba(0,0,0,0.04);
border-radius: 3px;
/*! border: none !important; */
display: inline-block;
}
.cnblogs-markdown code:before,
.cnblogs-markdown code:after {
letter-spacing: -0.2em;
content: "\00a0";
}
/*only for syntaxhighlighter */
/*--start--*/
.cnblogs-markdown .syntaxhighlighter table td.code {
width:95% !important;
}
.cnblogs-markdown .syntaxhighlighter code {
font-family: "Consolas","Bitstream Vera Sans Mono","Courier New",Courier,monospace!important;
padding: 0 !important;
border-radius: 0 !important;
background-color: transparent !important;
}
.cnblogs-markdown .syntaxhighlighter code:before,
.cnblogs-markdown .syntaxhighlighter code:before {
letter-spacing: -0.5em;
}
/*--end--*/
.cnblogs-markdown pre>code {
padding: 0;
margin: 0;
font-size: 100%;
word-break: normal;
white-space: pre;
background: transparent;
border: 0;
}
.cnblogs-markdown .highlight {
margin-bottom: 16px;
}
.cnblogs-markdown .highlight pre,
.cnblogs-markdown pre {
overflow: auto;
font-size: 85%;
line-height: 1.45;
background-color: #f7f7f7;
border-radius: 3px;
}
.cnblogs-markdown .highlight pre {
margin-bottom: 0;
word-break: normal;
}
.cnblogs-markdown pre {
word-wrap: normal;
}
.cnblogs-markdown pre code {
display: inline;
max-width: initial;
padding: 0;
margin: 0;
overflow: initial;
line-height: inherit;
word-wrap: normal;
background-color: transparent;
border: 0;
}
.cnblogs-markdown pre code:before,
.cnblogs-markdown pre code:after {
content: normal;
}
.cnblogs-markdown kbd {
display: inline-block;
padding: 3px 5px;
font-size: 11px;
line-height: 10px;
color: #555;
vertical-align: middle;
background-color: #fcfcfc;
border: solid 1px #ccc;
border-bottom-color: #bbb;
border-radius: 3px;
box-shadow: inset 0 -1px 0 #bbb;
}
.cnblogs-markdown .pl-c {
color: #969896;
}
.cnblogs-markdown .pl-c1,
.cnblogs-markdown .pl-mdh,
.cnblogs-markdown .pl-mm,
.cnblogs-markdown .pl-mp,
.cnblogs-markdown .pl-mr,
.cnblogs-markdown .pl-s1 .pl-v,
.cnblogs-markdown .pl-s3,
.cnblogs-markdown .pl-sc,
.cnblogs-markdown .pl-sv {
color: #0086b3;
}
.cnblogs-markdown .pl-e,
.cnblogs-markdown .pl-en {
color: #795da3;
}
.cnblogs-markdown .pl-s1 .pl-s2,
.cnblogs-markdown .pl-smi,
.cnblogs-markdown .pl-smp,
.cnblogs-markdown .pl-stj,
.cnblogs-markdown .pl-vo,
.cnblogs-markdown .pl-vpf {
color: #333;
}
.cnblogs-markdown .pl-ent {
color: #63a35c;
}
.cnblogs-markdown .pl-k,
.cnblogs-markdown .pl-s,
.cnblogs-markdown .pl-st {
color: #a71d5d;
}
.cnblogs-markdown .pl-pds,
.cnblogs-markdown .pl-s1,
.cnblogs-markdown .pl-s1 .pl-pse .pl-s2,
.cnblogs-markdown .pl-sr,
.cnblogs-markdown .pl-sr .pl-cce,
.cnblogs-markdown .pl-sr .pl-sra,
.cnblogs-markdown .pl-sr .pl-sre,
.cnblogs-markdown .pl-src {
color: #183691;
}
.cnblogs-markdown .pl-v {
color: #ed6a43;
}
.cnblogs-markdown .pl-id {
color: #b52a1d;
}
.cnblogs-markdown .pl-ii {
background-color: #b52a1d;
color: #f8f8f8;
}
.cnblogs-markdown .pl-sr .pl-cce {
color: #63a35c;
font-weight: bold;
}
.cnblogs-markdown .pl-ml {
color: #693a17;
}
.cnblogs-markdown .pl-mh,
.cnblogs-markdown .pl-mh .pl-en,
.cnblogs-markdown .pl-ms {
color: #1d3e81;
font-weight: bold;
}
.cnblogs-markdown .pl-mq {
color: #008080;
}
.cnblogs-markdown .pl-mi {
color: #333;
font-style: italic;
}
.cnblogs-markdown .pl-mb {
color: #333;
font-weight: bold;
}
.cnblogs-markdown .pl-md,
.cnblogs-markdown .pl-mdhf {
background-color: #ffecec;
color: #bd2c00;
}
.cnblogs-markdown .pl-mdht,
.cnblogs-markdown .pl-mi1 {
background-color: #eaffea;
color: #55a532;
}
.cnblogs-markdown .pl-mdr {
color: #795da3;
font-weight: bold;
}
.cnblogs-markdown .pl-mo {
color: #1d3e81;
}
.cnblogs-markdown kbd {
display: inline-block;
padding: 3px 5px;
font: 11px Consolas, "Liberation Mono", Menlo, Courier, monospace;
line-height: 10px;
color: #555;
vertical-align: middle;
background-color: #fcfcfc;
border: solid 1px #ccc;
border-bottom-color: #bbb;
border-radius: 3px;
box-shadow: inset 0 -1px 0 #bbb;
padding-top: 20px;
}
.cnblogs-markdown .task-list-item {
list-style-type: none;
}
.cnblogs-markdown .task-list-item+.task-list-item {
margin-top: 3px;
}
.cnblogs-markdown .task-list-item input {
margin: 0 0.35em 0.25em -1.6em;
vertical-align: middle;
}
.cnblogs-markdown :checked+.radio-label {
z-index: 1;
position: relative;
border-color: #4183c4;
}
/*
Monokai Sublime style. Derived from Monokai by noformnocontent https://nn.mit-license.org/
*/
pre {
/*控制代码不换行*/
white-space: pre;
word-wrap: normal;
}
.cnblogs-markdown .hljs {
font-size: 16px!important;
font-family: consolas,monospace !important;
display: block;
overflow-x: auto;
padding: 0.5em;
background: #23241f !important;
color: #FFF;
white-space: pre;
word-break: normal;
padding: 10px 15px !important;
}
.hljs,
.hljs-tag,
.hljs-subst {
color: #f8f8f2;
}
.hljs-strong,
.hljs-emphasis {
color: #a8a8a2;
}
.hljs-bullet,
.hljs-quote,
.hljs-number,
.hljs-regexp,
.hljs-literal,
.hljs-link {
color: #ae81ff;
}
.hljs-code,
.hljs-title,
.hljs-section,
.hljs-selector-class {
color: #a6e22e;
}
.hljs-strong {
font-weight: bold;
}
.hljs-emphasis {
font-style: italic;
}
.hljs-keyword,
.hljs-selector-tag,
.hljs-name,
.hljs-attr {
color: #f92672;
}
.hljs-symbol,
.hljs-attribute {
color: #66d9ef;
}
.hljs-params,
.hljs-class .hljs-title {
color: #f8f8f2;
}
.hljs-string,
.hljs-type,
.hljs-built_in,
.hljs-builtin-name,
.hljs-selector-id,
.hljs-selector-attr,
.hljs-selector-pseudo,
.hljs-addition,
.hljs-variable,
.hljs-template-variable {
color: #e6db74;
}
.hljs-comment,
.hljs-deletion,
.hljs-meta {
color: #75715e;
}
/* 让图片正常显示，而不是越界*/
#cnblogs_post_body img {
/*max-width: 60%;*/
max-width: 100%;
height: auto;
}
/*添加按钮*/
.cnblogs-markdown pre {
position: relative;
}
/* 博客园Markdown编辑模式下代码复制功能 */
.cnblogs-markdown pre > span {
position: absolute;
top: 0;
right: 0;
border-radius: 2px;
padding: 5px 15px 5px;
font-size: 12px;
background: rgba(255, 0, 0, 0.4);
color: #fff;
cursor: pointer;
}
.cnblogs-markdown pre > .copyed {
background: #67c23a;
}
如果说我的文章对你有用，只不过是我站在巨人的肩膀上再继续努力罢了。
若在页首无特别声明，本篇文章由 Schips 经过整理后发布。
博客地址：https://www.cnblogs.com/schips/
若在页首无特别声明，本篇文章由 Schips 经过整理后发布。
博客地址：https://www.cnblogs.com/schips/
浙公网安备 33010602011771号