<!DOCTYPE html><html class="theme-next mist use-motion"><head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta http-equiv="Cache-Control" content="no-transform">
<meta http-equiv="Cache-Control" content="no-siteapp">
<meta name="keywords" content="Hexo, NexT">
<link rel="alternate" href="/atom.xml" title="我的博客" type="application/atom+xml">
<link rel="shortcut icon" type="image/x-icon" href="/favicon.ico?v=5.0.2">
<meta property="og:type" content="website">
<meta property="og:title" content="我的博客">
<meta property="og:url" content="https://jjeejj.github.io/index.html">
<meta property="og:site_name" content="我的博客">
<meta property="og:locale">
<meta property="article:author" content="jjeejj">
<meta name="twitter:card" content="summary">
<script type="text/javascript" id="hexo.configuration">
var NexT = window.NexT || {};
var CONFIG = {
scheme: 'Mist',
sidebar: {"position":"left","display":"post"},
fancybox: true,
motion: true,
duoshuo: {
userId: '0',
author: '博主'
}
};
</script>
<link rel="canonical" href="https://jjeejj.github.io/">
<title> 我的博客 </title>
<meta name="generator" content="Hexo 5.4.0"><script>function loadCss(l){var d=document,h=d.head,s=d.createElement('link');s.rel='stylesheet';s.href=l;!function e(f){if (d.body)return f();setTimeout(function(){e(f)})}(function(){h.appendChild(s);});}loadCss('/style.css');loadCss('//fonts.googleapis.com/css?family=Lato:300,300italic,400,400italic,700,700italic&subset=latin,latin-ext');loadCss('https://jjeejj.github.io/css/gitment.css');</script><style>/* normalize.css v3.0.2 | MIT License | git.io/normalize */
html {
font-family: sans-serif; /* 1 */
-ms-text-size-adjust: 100%; /* 2 */
-webkit-text-size-adjust: 100%; /* 2 */
}
body {
margin: 0;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
display: block;
}
audio,
canvas,
progress,
video {
display: inline-block; /* 1 */
vertical-align: baseline; /* 2 */
}
audio:not([controls]) {
display: none;
height: 0;
}
[hidden],
template {
display: none;
}
a {
background-color: transparent;
}
a:active,
a:hover {
outline: 0;
}
abbr[title] {
border-bottom: 1px dotted;
}
b,
strong {
font-weight: bold;
}
dfn {
font-style: italic;
}
h1 {
font-size: 2em;
margin: 0.67em 0;
}
mark {
background: #ff0;
color: #000;
}
small {
font-size: 80%;
}
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -0.5em;
}
sub {
bottom: -0.25em;
}
img {
border: 0;
}
svg:not(:root) {
overflow: hidden;
}
figure {
margin: 1em 40px;
}
hr {
-moz-box-sizing: content-box;
box-sizing: content-box;
height: 0;
}
pre {
overflow: auto;
}
code,
kbd,
pre,
samp {
font-family: monospace, monospace;
font-size: 1em;
}
button,
input,
optgroup,
select,
textarea {
color: inherit; /* 1 */
font: inherit; /* 2 */
margin: 0; /* 3 */
}
button {
overflow: visible;
}
button,
select {
text-transform: none;
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
-webkit-appearance: button; /* 2 */
cursor: pointer; /* 3 */
}
button[disabled],
html input[disabled] {
cursor: default;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0;
}
input {
line-height: normal;
}
input[type="checkbox"],
input[type="radio"] {
box-sizing: border-box; /* 1 */
padding: 0; /* 2 */
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
height: auto;
}
input[type="search"] {
-webkit-appearance: textfield; /* 1 */
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box; /* 2 */
box-sizing: content-box;
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
fieldset {
border: 1px solid #c0c0c0;
margin: 0 2px;
padding: 0.35em 0.625em 0.75em;
}
legend {
border: 0; /* 1 */
padding: 0; /* 2 */
}
textarea {
overflow: auto;
}
optgroup {
font-weight: bold;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
td,
th {
padding: 0;
}
::selection {
background: #262a30;
color: #fff;
}
body {
position: relative;
font-family: 'Lato', "PingFang SC", "Microsoft YaHei", sans-serif;
font-size: 14px;
line-height: 2;
color: #555;
background: #fff;
}
@media (max-width: 767px) {
body {
padding-right: 0 !important;
}
}
@media (min-width: 768px) and (max-width: 991px) {
body {
padding-right: 0 !important;
}
}
@media (min-width: 1600px) {
body {
font-size: 16px;
}
}
h1,
h2,
h3,
h4,
h5,
h6 {
margin: 0;
padding: 0;
font-weight: bold;
line-height: 1.5;
font-family: 'Lato', "PingFang SC", "Microsoft YaHei", sans-serif;
}
h2,
h3,
h4,
h5,
h6 {
margin: 20px 0 15px;
}
h1 {
font-size: 24px;
}
@media (max-width: 767px) {
h1 {
font-size: 20px;
}
}
h2 {
font-size: 22px;
}
@media (max-width: 767px) {
h2 {
font-size: 18px;
}
}
h3 {
font-size: 20px;
}
@media (max-width: 767px) {
h3 {
font-size: 16px;
}
}
h4 {
font-size: 18px;
}
@media (max-width: 767px) {
h4 {
font-size: 14px;
}
}
h5 {
font-size: 16px;
}
@media (max-width: 767px) {
h5 {
font-size: 12px;
}
}
h6 {
font-size: 14px;
}
@media (max-width: 767px) {
h6 {
font-size: 10px;
}
}
p {
margin: 0 0 25px 0;
}
a {
color: #555;
text-decoration: none;
border-bottom: 1px solid #999;
word-wrap: break-word;
}
a:hover {
color: #222;
border-bottom-color: #222;
}
ul {
list-style: none;
}
blockquote {
margin: 0;
padding: 0;
}
img {
display: block;
margin: auto;
max-width: 100%;
height: auto;
}
hr {
margin: 40px 0;
height: 3px;
border: none;
background-color: #ddd;
background-image: repeating-linear-gradient(-45deg, #fff, #fff 4px, transparent 4px, transparent 8px);
}
blockquote {
padding: 0 15px;
color: #666;
border-left: 4px solid #ddd;
}
blockquote cite::before {
content: "-";
padding: 0 5px;
}
dt {
font-weight: 700;
}
dd {
margin: 0;
padding: 0;
}
.text-left {
text-align: left;
}
.text-center {
text-align: center;
}
.text-right {
text-align: right;
}
.text-justify {
text-align: justify;
}
.text-nowrap {
white-space: nowrap;
}
.text-lowercase {
text-transform: lowercase;
}
.text-uppercase {
text-transform: uppercase;
}
.text-capitalize {
text-transform: capitalize;
}
.center-block {
display: block;
margin-left: auto;
margin-right: auto;
}
.clearfix:before,
.clearfix:after {
content: " ";
display: table;
}
.clearfix:after {
clear: both;
}
.pullquote {
width: 45%;
}
.pullquote.left {
float: left;
margin-left: 5px;
margin-right: 10px;
}
.pullquote.right {
float: right;
margin-left: 10px;
margin-right: 5px;
}
.affix.affix.affix {
position: fixed;
}
.translation {
margin-top: -20px;
font-size: 14px;
color: #999;
}
.scrollbar-measure {
width: 100px;
height: 100px;
overflow: scroll;
position: absolute;
top: -9999px;
}
.use-motion .motion-element {
opacity: 0;
}
#local-search-input {
padding: 3px;
border: none;
text-indent: 14px;
border-radius: 0;
width: 140px;
outline: none;
border-bottom: 1px solid #999;
background: inherit;
opacity: 0.5;
}
#local-search-input:focus {
opacity: 1;
}
.search-icon {
position: absolute;
top: 9px;
}
table {
margin: 20px 0;
width: 100%;
border-collapse: collapse;
border-spacing: 0;
border: 1px solid #ddd;
font-size: 14px;
table-layout: fixed;
word-wrap: break-all;
}
table>tbody>tr:nth-of-type(odd) {
background-color: #f9f9f9;
}
table>tbody>tr:hover {
background-color: #f5f5f5;
}
caption,
th,
td {
padding: 8px;
text-align: left;
vertical-align: middle;
font-weight: normal;
}
th,
td {
border-bottom: 3px solid #ddd;
border-right: 1px solid #eee;
}
th {
padding-bottom: 10px;
font-weight: 700;
}
td {
border-bottom-width: 1px;
}
html,
body {
height: 100%;
}
.container {
position: relative;
min-height: 100%;
}
.header-inner {
margin: 0 auto;
padding: 100px 0 70px;
width: 700px;
}
@media (min-width: 1600px) {
.container .header-inner {
width: 900px;
}
}
.main {
padding-bottom: 150px;
}
.main-inner {
margin: 0 auto;
width: 700px;
}
@media (min-width: 1600px) {
.container .main-inner {
width: 900px;
}
}
.footer {
position: absolute;
left: 0;
bottom: 0;
width: 100%;
min-height: 50px;
}
.footer-inner {
box-sizing: border-box;
margin: 20px auto;
width: 700px;
}
@media (min-width: 1600px) {
.container .footer-inner {
width: 900px;
}
}
pre,
.highlight {
overflow: auto;
margin: 20px 0;
padding: 15px;
font-size: 13px;
color: #4d4d4c;
background: #f7f7f7;
line-height: 1.6;
}
pre,
code {
font-family: consolas, Menlo, "PingFang SC", "Microsoft YaHei", monospace;
}
code {
padding: 2px 4px;
word-wrap: break-all;
color: #4d4d4c;
background: #f7f7f7;
border-radius: 3px;
font-size: 13px;
}
pre code {
padding: 0;
color: #4d4d4c;
background: none;
text-shadow: none;
}
.highlight pre {
border: none;
margin: 0;
padding: 1px;
}
.highlight table {
margin: 0;
width: auto;
border: none;
}
.highlight td {
border: none;
padding: 0;
}
.highlight figcaption {
font-size: 1em;
color: #4d4d4c;
line-height: 1em;
margin-bottom: 1em;
}
.highlight figcaption:before,
.highlight figcaption:after {
content: " ";
display: table;
}
.highlight figcaption:after {
clear: both;
}
.highlight figcaption a {
float: right;
color: #4d4d4c;
}
.highlight figcaption a:hover {
border-bottom-color: #4d4d4c;
}
.highlight .gutter pre {
color: #666;
text-align: right;
padding-right: 20px;
}
.highlight .line {
height: 20px;
}
.gist table {
width: auto;
}
.gist table td {
border: none;
}
pre .deletion {
background: #fdd;
}
pre .addition {
background: #dfd;
}
pre .meta {
color: #8959a8;
}
pre .comment {
color: #8e908c;
}
pre .variable,
pre .attribute,
pre .tag,
pre .regexp,
pre .ruby .constant,
pre .xml .tag .title,
pre .xml .pi,
pre .xml .doctype,
pre .html .doctype,
pre .css .id,
pre .css .class,
pre .css .pseudo {
color: #c82829;
}
pre .number,
pre .preprocessor,
pre .built_in,
pre .literal,
pre .params,
pre .constant,
pre .command {
color: #f5871f;
}
pre .ruby .class .title,
pre .css .rules .attribute,
pre .string,
pre .value,
pre .inheritance,
pre .header,
pre .ruby .symbol,
pre .xml .cdata,
pre .special,
pre .number,
pre .formula {
color: #718c00;
}
pre .title,
pre .css .hexcolor {
color: #3e999f;
}
pre .function,
pre .python .decorator,
pre .python .title,
pre .ruby .function .title,
pre .ruby .title .keyword,
pre .perl .sub,
pre .javascript .title,
pre .coffeescript .title {
color: #4271ae;
}
pre .keyword,
pre .javascript .function {
color: #8959a8;
}
.full-image.full-image.full-image {
border: none;
max-width: 100%;
width: auto;
margin: 20px auto;
}
@media (min-width: 992px) {
.full-image.full-image.full-image {
max-width: none;
width: 126%;
margin: 0 -13%;
}
}
.blockquote-center,
.page-home .post-type-quote blockquote,
.page-post-detail .post-type-quote blockquote {
position: relative;
margin: 40px 0;
padding: 0;
border-left: none;
text-align: center;
}
.blockquote-center::before,
.page-home .post-type-quote blockquote::before,
.page-post-detail .post-type-quote blockquote::before,
.blockquote-center::after,
.page-home .post-type-quote blockquote::after,
.page-post-detail .post-type-quote blockquote::after {
position: absolute;
content: ' ';
display: block;
width: 100%;
height: 24px;
opacity: 0.2;
background-repeat: no-repeat;
background-position: 0 -6px;
background-size: 22px 22px;
}
.blockquote-center::before,
.page-home .post-type-quote blockquote::before,
.page-post-detail .post-type-quote blockquote::before {
top: -20px;
background-image: url("../images/quote-l.svg");
border-top: 1px solid #ccc;
}
.blockquote-center::after,
.page-home .post-type-quote blockquote::after,
.page-post-detail .post-type-quote blockquote::after {
bottom: -20px;
background-image: url("../images/quote-r.svg");
border-bottom: 1px solid #ccc;
background-position: 100% 8px;
}
.blockquote-center p,
.page-home .post-type-quote blockquote p,
.page-post-detail .post-type-quote blockquote p,
.blockquote-center div,
.page-home .post-type-quote blockquote div,
.page-post-detail .post-type-quote blockquote div {
text-align: center;
}
.post .post-body .group-picture img {
box-sizing: border-box;
padding: 0 3px;
border: none;
}
.post .group-picture-row {
overflow: hidden;
margin-top: 6px;
}
.post .group-picture-row:first-child {
margin-top: 0;
}
.post .group-picture-column {
float: left;
}
.page-post-detail .post-body .group-picture-column {
float: none;
margin-top: 10px;
width: auto !important;
}
.page-post-detail .post-body .group-picture-column img {
margin: 0 auto;
}
.page-archive .group-picture-container {
overflow: hidden;
}
.page-archive .group-picture-row {
float: left;
}
.page-archive .group-picture-row:first-child {
margin-top: 6px;
}
.page-archive .group-picture-column {
max-width: 150px;
max-height: 150px;
}
.btn {
display: inline-block;
padding: 0 20px;
font-size: 14px;
color: #fff;
background: #222;
border: 2px solid #222;
text-decoration: none;
border-radius: 0;
transition-property: background-color;
transition-duration: 0.2s;
transition-timing-function: ease-in-out;
transition-delay: 0s;
}
.btn:hover,
.post-more-link .btn:hover {
border-color: #222;
color: #222;
background: #fff;
}
.btn-bar {
display: block;
width: 22px;
height: 2px;
background: #555;
border-radius: 1px;
}
.btn-bar+.btn-bar {
margin-top: 4px;
}
.pagination {
margin: 120px 0 40px;
text-align: center;
border-top: 1px solid #eee;
}
.page-number-basic,
.pagination .prev,
.pagination .next,
.pagination .page-number,
.pagination .space {
display: inline-block;
position: relative;
top: -1px;
margin: 0 10px;
padding: 0 10px;
line-height: 30px;
}
@media (max-width: 767px) {
.page-number-basic,
.pagination .prev,
.pagination .next,
.pagination .page-number,
.pagination .space {
margin: 0 5px;
}
}
.pagination .prev,
.pagination .next,
.pagination .page-number {
border-bottom: 0;
border-top: 1px solid #eee;
transition-property: border-color;
transition-duration: 0.2s;
transition-timing-function: ease-in-out;
transition-delay: 0s;
}
.pagination .prev:hover,
.pagination .next:hover,
.pagination .page-number:hover {
border-top-color: #222;
}
.pagination .space {
padding: 0;
margin: 0;
}
.pagination .prev {
margin-left: 0;
}
.pagination .next {
margin-right: 0;
}
.pagination .page-number.current {
color: #fff;
background: #ccc;
border-top-color: #ccc;
}
@media (max-width: 767px) {
.pagination {
border-top: none;
}
.pagination .prev,
.pagination .next,
.pagination .page-number {
margin-bottom: 10px;
border-top: 0;
border-bottom: 1px solid #eee;
}
.pagination .prev:hover,
.pagination .next:hover,
.pagination .page-number:hover {
border-bottom-color: #222;
}
}
.comments {
margin: 60px 20px 0;
}
.tag-cloud {
text-align: center;
}
.tag-cloud a {
display: inline-block;
margin: 10px;
}
.back-to-top {
box-sizing: border-box;
position: fixed;
bottom: -100px;
right: 50px;
z-index: 1050;
padding: 0 6px;
width: 25px;
background: #222;
font-size: 12px;
opacity: 1;
color: #fff;
cursor: pointer;
text-align: center;
-webkit-transform: translateZ(0);
transition-property: bottom;
transition-duration: 0.2s;
transition-timing-function: ease-in-out;
transition-delay: 0s;
}
@media (max-width: 767px) {
.back-to-top {
display: none;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.back-to-top {
display: none;
}
}
.back-to-top.back-to-top-on {
bottom: 19px;
}
.header {
background: #fff;
}
.header-inner {
position: relative;
}
.headband {
height: 3px;
background: #222;
}
.site-meta {
margin: 0;
text-align: left;
}
@media (max-width: 767px) {
.site-meta {
text-align: center;
}
}
.brand {
position: relative;
display: inline-block;
padding: 0 40px;
color: #222;
background: #222;
border-bottom: none;
}
.brand:hover {
color: #222;
}
.logo {
display: inline-block;
margin-right: 5px;
line-height: 36px;
vertical-align: top;
}
.site-title {
display: inline-block;
vertical-align: top;
line-height: 36px;
font-size: 20px;
font-weight: normal;
font-family: 'Lato', "PingFang SC", "Microsoft YaHei", sans-serif;
}
.site-subtitle {
margin-top: 10px;
font-size: 13px;
color: #999;
}
.use-motion .brand {
opacity: 0;
}
.use-motion .logo,
.use-motion .site-title,
.use-motion .site-subtitle {
opacity: 0;
position: relative;
top: -10px;
}
.site-nav-toggle {
display: none;
position: absolute;
top: 10px;
left: 10px;
}
@media (max-width: 767px) {
.site-nav-toggle {
display: block;
}
}
.site-nav-toggle button {
margin-top: 2px;
padding: 9px 10px;
background: transparent;
border: none;
}
@media (max-width: 767px) {
.site-nav {
display: none;
margin: 0 -10px;
padding: 0 10px;
clear: both;
border-top: 1px solid #ddd;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.site-nav {
display: block !important;
}
}
@media (min-width: 992px) {
.site-nav {
display: block !important;
}
}
.menu {
margin-top: 20px;
padding-left: 0;
text-align: center;
}
.menu .menu-item {
display: inline-block;
margin: 0 10px;
}
@media screen and (max-width: 767px) {
.menu .menu-item {
margin-top: 10px;
}
}
.menu .menu-item a {
display: block;
font-size: 13px;
text-transform: capitalize;
line-height: inherit;
border-bottom: 1px solid transparent;
transition-property: border-color;
transition-duration: 0.2s;
transition-timing-function: ease-in-out;
transition-delay: 0s;
}
.menu .menu-item a:hover {
border-bottom-color: #222;
}
.menu .menu-item .fa {
margin-right: 5px;
}
.use-motion .menu-item {
opacity: 0;
}
.post-body {
font-family: 'Lato', "PingFang SC", "Microsoft YaHei", sans-serif;
}
@media (max-width: 767px) {
.post-body {
word-break: break-word;
}
}
.post-body .fancybox img {
display: block !important;
margin: 0 auto;
cursor: pointer;
cursor: zoom-in;
cursor: -webkit-zoom-in;
}
.post-body .image-caption,
.post-body .figure .caption {
margin: 10px auto 15px;
text-align: center;
font-size: 14px;
color: #999;
font-weight: bold;
line-height: 1;
}
.post-sticky-flag {
display: inline-block;
font-size: 16px;
-ms-transform: rotate(30deg);
-webkit-transform: rotate(30deg);
-moz-transform: rotate(30deg);
-ms-transform: rotate(30deg);
-o-transform: rotate(30deg);
transform: rotate(30deg);
}
.posts-expand {
padding-top: 40px;
}
@media (max-width: 767px) {
.posts-expand {
margin: 0 20px;
}
.post-body pre,
.post-body .highlight {
padding: 10px;
}
.post-body pre .gutter pre,
.post-body .highlight .gutter pre {
padding-right: 10px;
}
}
@media (min-width: 992px) {
.posts-expand .post-body {
text-align: justify;
}
}
.posts-expand .post-body h2,
.posts-expand .post-body h3,
.posts-expand .post-body h4,
.posts-expand .post-body h5,
.posts-expand .post-body h6 {
padding-top: 10px;
}
.posts-expand .post-body h2 .header-anchor,
.posts-expand .post-body h3 .header-anchor,
.posts-expand .post-body h4 .header-anchor,
.posts-expand .post-body h5 .header-anchor,
.posts-expand .post-body h6 .header-anchor {
float: right;
margin-left: 10px;
color: #ccc;
border-bottom-style: none;
visibility: hidden;
}
.posts-expand .post-body h2 .header-anchor:hover,
.posts-expand .post-body h3 .header-anchor:hover,
.posts-expand .post-body h4 .header-anchor:hover,
.posts-expand .post-body h5 .header-anchor:hover,
.posts-expand .post-body h6 .header-anchor:hover {
color: inherit;
}
.posts-expand .post-body h2:hover .header-anchor,
.posts-expand .post-body h3:hover .header-anchor,
.posts-expand .post-body h4:hover .header-anchor,
.posts-expand .post-body h5:hover .header-anchor,
.posts-expand .post-body h6:hover .header-anchor {
visibility: visible;
}
.posts-expand .post-body ul li {
list-style: circle;
}
.posts-expand .post-body img {
box-sizing: border-box;
margin: auto;
padding: 3px;
border: 1px solid #ddd;
}
.posts-expand .fancybox img {
margin: 0 auto;
}
@media (max-width: 767px) {
.posts-collapse {
margin: 0 20px;
}
.posts-collapse .post-title,
.posts-collapse .post-meta {
display: block;
width: auto;
text-align: left;
}
}
.posts-collapse {
position: relative;
z-index: 1010;
margin-left: 0;
}
.posts-collapse::after {
content: " ";
position: absolute;
top: 20px;
left: 0;
margin-left: -2px;
width: 4px;
height: 100%;
background: #f5f5f5;
z-index: -1;
}
@media (max-width: 767px) {
.posts-collapse {
margin: 0 20px;
}
}
.posts-collapse .collection-title {
position: relative;
margin: 60px 0;
}
.posts-collapse .collection-title h2 {
margin-left: 20px;
}
.posts-collapse .collection-title small {
color: #bbb;
}
.posts-collapse .collection-title::before {
content: " ";
position: absolute;
left: 0;
top: 50%;
margin-left: -4px;
margin-top: -4px;
width: 8px;
height: 8px;
background: #bbb;
border-radius: 50%;
}
.posts-collapse .post {
margin: 30px 0;
}
.posts-collapse .post-header {
position: relative;
transition-duration: 0.2s;
transition-timing-function: ease-in-out;
transition-delay: 0s;
transition-property: border;
border-bottom: 1px dashed #ccc;
}
.posts-collapse .post-header::before {
content: " ";
position: absolute;
left: 0;
top: 12px;
width: 6px;
height: 6px;
margin-left: -4px;
background: #bbb;
border-radius: 50%;
border: 1px solid #fff;
transition-duration: 0.2s;
transition-timing-function: ease-in-out;
transition-delay: 0s;
transition-property: background;
}
.posts-collapse .post-header:hover {
border-bottom-color: #666;
}
.posts-collapse .post-header:hover::before {
background: #222;
}
.posts-collapse .post-meta {
position: absolute;
font-size: 12px;
left: 20px;
top: 5px;
}
.posts-collapse .post-comments-count {
display: none;
}
.posts-collapse .post-title {
margin-left: 60px;
font-size: 16px;
font-weight: normal;
line-height: inherit;
}
.posts-collapse .post-title::after {
margin-left: 3px;
opacity: 0.6;
}
.posts-collapse .post-title a {
color: #666;
border-bottom: none;
}
.page-home .post-type-quote .post-header,
.page-post-detail .post-type-quote .post-header,
.page-home .post-type-quote .post-tags,
.page-post-detail .post-type-quote .post-tags {
display: none;
}
.posts-expand .post-title {
font-size: 26px;
text-align: center;
word-break: break-word;
font-weight: 400;
}
@media (max-width: 767px) {
.posts-expand .post-title {
font-size: 22px;
}
}
.posts-expand .post-title-link {
display: inline-block;
position: relative;
color: #555;
border-bottom: none;
line-height: 1.2;
vertical-align: top;
}
.posts-expand .post-title-link::before {
content: "";
position: absolute;
width: 100%;
height: 2px;
bottom: 0;
left: 0;
background-color: #000;
visibility: hidden;
-webkit-transform: scaleX(0);
-moz-transform: scaleX(0);
-ms-transform: scaleX(0);
-o-transform: scaleX(0);
transform: scaleX(0);
transition-duration: 0.2s;
transition-timing-function: ease-in-out;
transition-delay: 0s;
}
.posts-expand .post-title-link:hover::before {
visibility: visible;
-webkit-transform: scaleX(1);
-moz-transform: scaleX(1);
-ms-transform: scaleX(1);
-o-transform: scaleX(1);
transform: scaleX(1);
}
.posts-expand .post-title-link .fa {
font-size: 16px;
}
.posts-expand .post-meta {
margin: 3px 0 60px 0;
color: #999;
font-family: 'Lato', "PingFang SC", "Microsoft YaHei", sans-serif;
font-size: 12px;
text-align: center;
}
.posts-expand .post-meta .post-category-list {
display: inline-block;
margin: 0;
padding: 3px;
}
.posts-expand .post-meta .post-category-list-link {
color: #999;
}
.post-meta-item-icon {
display: none;
margin-right: 3px;
}
@media (min-width: 768px) and (max-width: 991px) {
.post-meta-item-icon {
display: inline-block;
}
}
@media (max-width: 767px) {
.post-meta-item-icon {
display: inline-block;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.post-meta-item-text {
display: none;
}
}
@media (max-width: 767px) {
.post-meta-item-text {
display: none;
}
}
@media (max-width: 767px) {
.posts-expand .post-comments-count {
display: none;
}
}
.post-more-link {
margin-top: 50px;
}
.post-more-link .btn {
color: #555;
font-size: 14px;
background: transparent;
border-radius: 0;
line-height: 2;
}
.posts-expand .post-tags {
margin-top: 40px;
text-align: center;
}
.posts-expand .post-tags a {
display: inline-block;
margin-right: 10px;
font-size: 13px;
}
.post-nav {
overflow: hidden;
margin-top: 60px;
padding: 10px;
white-space: nowrap;
border-top: 1px solid #eee;
}
.post-nav-item {
display: inline-block;
width: 50%;
white-space: normal;
}
.post-nav-item a {
position: relative;
display: inline-block;
line-height: 25px;
font-size: 14px;
color: #555;
border-bottom: none;
}
.post-nav-item a:hover {
color: #222;
border-bottom: none;
}
.post-nav-item a:active {
top: 2px;
}
.post-nav-item a i {
font-size: 12px;
}
.post-nav-prev {
text-align: right;
}
.posts-expand .post-eof {
display: block;
margin: 80px auto 60px;
width: 8%;
height: 1px;
background: #ccc;
text-align: center;
}
.post:last-child .post-eof.post-eof.post-eof {
display: none;
}
.post-gallery {
display: table;
table-layout: fixed;
width: 100%;
border-collapse: separate;
}
.post-gallery-row {
display: table-row;
}
.post-gallery .post-gallery-img {
display: table-cell;
text-align: center;
vertical-align: middle;
border: none;
}
.post-gallery .post-gallery-img img {
max-width: 100%;
max-height: 100%;
border: none;
}
.fancybox-close,
.fancybox-close:hover {
border: none;
}
.sidebar {
position: fixed;
right: 0;
top: 0;
bottom: 0;
width: 0;
z-index: 1040;
box-shadow: inset 0 2px 6px #000;
background: #222;
-webkit-transform: translateZ(0);
}
.sidebar a {
color: #999;
border-bottom-color: #555;
}
.sidebar a:hover {
color: #eee;
}
@media (min-width: 768px) and (max-width: 991px) {
.sidebar {
display: none !important;
}
}
@media (max-width: 767px) {
.sidebar {
display: none !important;
}
}
.sidebar-inner {
position: relative;
padding: 20px 10px;
color: #999;
text-align: center;
}
.sidebar-toggle {
position: fixed;
right: 50px;
bottom: 45px;
width: 15px;
height: 15px;
padding: 5px;
background: #222;
line-height: 0;
z-index: 1050;
cursor: pointer;
-webkit-transform: translateZ(0);
}
@media (min-width: 768px) and (max-width: 991px) {
.sidebar-toggle {
display: none;
}
}
@media (max-width: 767px) {
.sidebar-toggle {
display: none;
}
}
.sidebar-toggle-line {
position: relative;
display: inline-block;
vertical-align: top;
height: 2px;
width: 100%;
background: #fff;
margin-top: 3px;
}
.sidebar-toggle-line:first-child {
margin-top: 0;
}
.site-author-image {
display: block;
margin: 0 auto;
padding: 2px;
max-width: 96px;
height: auto;
border: 2px solid #333;
}
.site-author-name {
margin: 5px 0 0;
text-align: center;
color: #f5f5f5;
font-weight: normal;
}
.site-description {
margin-top: 5px;
text-align: center;
font-size: 14px;
color: #999;
}
.site-state {
overflow: hidden;
line-height: 1.4;
white-space: nowrap;
text-align: center;
}
.site-state-item {
display: inline-block;
padding: 0 15px;
border-left: 1px solid #333;
}
.site-state-item:first-child {
border-left: none;
}
.site-state-item a {
border-bottom: none;
}
.site-state-item-count {
display: block;
text-align: center;
color: inherit;
font-weight: 600;
font-size: 18px;
}
.site-state-item-name {
font-size: 13px;
color: inherit;
}
.feed-link {
margin-top: 20px;
}
.feed-link a {
display: inline-block;
padding: 0 15px;
color: #fc6423;
border: 1px solid #fc6423;
border-radius: 4px;
}
.feed-link a i {
color: #fc6423;
font-size: 14px;
}
.feed-link a:hover {
color: #fff;
background: #fc6423;
}
.feed-link a:hover i {
color: #fff;
}
.links-of-author {
margin-top: 20px;
}
.links-of-author a {
display: inline-block;
vertical-align: middle;
margin-right: 10px;
margin-bottom: 10px;
border-bottom-color: #555;
font-size: 13px;
}
.links-of-author a:before {
display: inline-block;
vertical-align: middle;
margin-right: 3px;
content: " ";
width: 4px;
height: 4px;
border-radius: 50%;
background: #c9600d;
}
.links-of-blogroll {
font-size: 13px;
}
.links-of-blogroll-title {
margin-top: 20px;
font-size: 14px;
font-weight: 600;
}
.links-of-blogroll-list {
margin: 0;
padding: 0;
}
.links-of-blogroll-item {
padding: 2px 10px;
}
.sidebar-nav {
margin: 0 0 20px;
padding-left: 0;
}
.sidebar-nav li {
display: inline-block;
cursor: pointer;
border-bottom: 1px solid transparent;
font-size: 14px;
color: #555;
}
.sidebar-nav li:hover {
color: #f5f5f5;
}
.page-post-detail .sidebar-nav-toc {
padding: 0 5px;
}
.page-post-detail .sidebar-nav-overview {
margin-left: 10px;
}
.sidebar-nav .sidebar-nav-active {
color: #87daff;
border-bottom-color: #87daff;
}
.sidebar-nav .sidebar-nav-active:hover {
color: #87daff;
}
.sidebar-panel {
display: none;
}
.sidebar-panel-active {
display: block;
}
.post-toc-empty {
font-size: 14px;
color: #666;
}
.post-toc-wrap {
overflow: hidden;
}
.post-toc {
overflow: auto;
}
.post-toc ol {
margin: 0;
padding: 0 2px 5px 10px;
text-align: left;
list-style: none;
font-size: 14px;
}
.post-toc ol > ol {
padding-left: 0;
}
.post-toc ol a {
transition-duration: 0.2s;
transition-timing-function: ease-in-out;
transition-delay: 0s;
transition-property: all;
color: #999;
border-bottom-color: #555;
}
.post-toc ol a:hover {
color: #ccc;
border-bottom-color: #ccc;
}
.post-toc .nav-item {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
line-height: 1.8;
}
.post-toc .nav .nav-child {
display: none;
}
.post-toc .nav .active > .nav-child {
display: block;
}
.post-toc .nav .active-current > .nav-child {
display: block;
}
.post-toc .nav .active-current > .nav-child > .nav-item {
display: block;
}
.post-toc .nav .active > a {
color: #87daff;
border-bottom-color: #87daff;
}
.post-toc .nav .active-current > a {
color: #87daff;
}
.post-toc .nav .active-current > a:hover {
color: #87daff;
}
.footer {
font-size: 14px;
color: #999;
}
.footer img {
border: none;
}
.footer-inner {
text-align: center;
}
.with-love {
display: inline-block;
margin: 0 5px;
}
.powered-by,
.theme-info {
display: inline-block;
}
.powered-by {
margin-right: 10px;
}
.powered-by::after {
content: "|";
padding-left: 10px;
}
.cc-license {
margin-top: 10px;
text-align: center;
}
.cc-license .cc-opacity {
opacity: 0.7;
border-bottom: none;
}
.cc-license .cc-opacity:hover {
opacity: 0.9;
}
.cc-license img {
display: inline-block;
}
.theme-next #ds-thread #ds-reset {
color: #555;
}
.theme-next #ds-thread #ds-reset .ds-replybox {
margin-bottom: 30px;
}
.theme-next #ds-thread #ds-reset .ds-replybox .ds-avatar,
.theme-next #ds-reset .ds-avatar img {
box-shadow: none;
}
.theme-next #ds-thread #ds-reset .ds-textarea-wrapper {
border-color: #c7d4e1;
background: none;
border-top-right-radius: 3px;
border-top-left-radius: 3px;
}
.theme-next #ds-thread #ds-reset .ds-textarea-wrapper textarea {
height: 60px;
}
.theme-next #ds-reset .ds-rounded-top {
border-radius: 0;
}
.theme-next #ds-thread #ds-reset .ds-post-toolbar {
box-sizing: border-box;
border: 1px solid #c7d4e1;
background: #f6f8fa;
}
.theme-next #ds-thread #ds-reset .ds-post-options {
height: 40px;
border: none;
background: none;
}
.theme-next #ds-thread #ds-reset .ds-toolbar-buttons {
top: 11px;
}
.theme-next #ds-thread #ds-reset .ds-sync {
top: 5px;
}
.theme-next #ds-thread #ds-reset .ds-post-button {
top: 4px;
right: 5px;
width: 90px;
height: 30px;
border: 1px solid #c5ced7;
border-radius: 3px;
background-image: linear-gradient(#fbfbfc, #f5f7f9);
color: #60676d;
}
.theme-next #ds-thread #ds-reset .ds-post-button:hover {
background-position: 0 -30px;
color: #60676d;
}
.theme-next #ds-thread #ds-reset .ds-comments-info {
padding: 10px 0;
}
.theme-next #ds-thread #ds-reset .ds-sort {
display: none;
}
.theme-next #ds-thread #ds-reset li.ds-tab a.ds-current {
border: none;
background: #f6f8fa;
color: #60676d;
}
.theme-next #ds-thread #ds-reset li.ds-tab a.ds-current:hover {
background-color: #e9f0f7;
color: #60676d;
}
.theme-next #ds-thread #ds-reset li.ds-tab a {
border-radius: 2px;
padding: 5px;
}
.theme-next #ds-thread #ds-reset .ds-login-buttons p {
color: #999;
line-height: 36px;
}
.theme-next #ds-thread #ds-reset .ds-login-buttons .ds-service-list li {
height: 28px;
}
.theme-next #ds-thread #ds-reset .ds-service-list a {
background: none;
padding: 5px;
border: 1px solid;
border-radius: 3px;
text-align: center;
}
.theme-next #ds-thread #ds-reset .ds-service-list a:hover {
color: #fff;
background: #666;
}
.theme-next #ds-thread #ds-reset .ds-service-list .ds-weibo {
color: #fc9b00;
border-color: #fc9b00;
}
.theme-next #ds-thread #ds-reset .ds-service-list .ds-weibo:hover {
background: #fc9b00;
}
.theme-next #ds-thread #ds-reset .ds-service-list .ds-qq {
color: #60a3ec;
border-color: #60a3ec;
}
.theme-next #ds-thread #ds-reset .ds-service-list .ds-qq:hover {
background: #60a3ec;
}
.theme-next #ds-thread #ds-reset .ds-service-list .ds-renren {
color: #2e7ac4;
border-color: #2e7ac4;
}
.theme-next #ds-thread #ds-reset .ds-service-list .ds-renren:hover {
background: #2e7ac4;
}
.theme-next #ds-thread #ds-reset .ds-service-list .ds-douban {
color: #37994c;
border-color: #37994c;
}
.theme-next #ds-thread #ds-reset .ds-service-list .ds-douban:hover {
background: #37994c;
}
.theme-next #ds-thread #ds-reset .ds-service-list .ds-kaixin {
color: #fef20d;
border-color: #fef20d;
}
.theme-next #ds-thread #ds-reset .ds-service-list .ds-kaixin:hover {
background: #fef20d;
}
.theme-next #ds-thread #ds-reset .ds-service-list .ds-netease {
color: #f00;
border-color: #f00;
}
.theme-next #ds-thread #ds-reset .ds-service-list .ds-netease:hover {
background: #f00;
}
.theme-next #ds-thread #ds-reset .ds-service-list .ds-sohu {
color: #ffcb05;
border-color: #ffcb05;
}
.theme-next #ds-thread #ds-reset .ds-service-list .ds-sohu:hover {
background: #ffcb05;
}
.theme-next #ds-thread #ds-reset .ds-service-list .ds-baidu {
color: #2831e0;
border-color: #2831e0;
}
.theme-next #ds-thread #ds-reset .ds-service-list .ds-baidu:hover {
background: #2831e0;
}
.theme-next #ds-thread #ds-reset .ds-service-list .ds-google {
color: #166bec;
border-color: #166bec;
}
.theme-next #ds-thread #ds-reset .ds-service-list .ds-google:hover {
background: #166bec;
}
.theme-next #ds-thread #ds-reset .ds-service-list .ds-weixin {
color: #00ce0d;
border-color: #00ce0d;
}
.theme-next #ds-thread #ds-reset .ds-service-list .ds-weixin:hover {
background: #00ce0d;
}
.theme-next #ds-thread #ds-reset .ds-service-list .ds-more-services {
border: none;
}
.theme-next #ds-thread #ds-reset .ds-service-list .ds-more-services:hover {
background: none;
}
.theme-next #ds-reset .duoshuo-ua-admin {
display: inline-block;
color: #f00;
}
.theme-next #ds-reset .duoshuo-ua-platform,
.theme-next #ds-reset .duoshuo-ua-browser {
color: #ccc;
}
.theme-next #ds-reset .duoshuo-ua-platform .fa,
.theme-next #ds-reset .duoshuo-ua-browser .fa {
display: inline-block;
margin-right: 3px;
}
.theme-next #ds-reset .duoshuo-ua-separator {
display: inline-block;
margin-left: 5px;
}
.theme-next .this_ua {
background-color: #ccc !important;
border-radius: 4px;
padding: 0 5px !important;
margin: 1px 1px !important;
border: 1px solid #bbb !important;
color: #fff;
display: inline-block !important;
}
.theme-next .this_ua.admin {
background-color: #d9534f !important;
border-color: #d9534f !important;
}
.theme-next .this_ua.platform.iOS,
.theme-next .this_ua.platform.Mac,
.theme-next .this_ua.platform.Windows {
background-color: #39b3d7 !important;
border-color: #46b8da !important;
}
.theme-next .this_ua.platform.Linux {
background-color: #3a3a3a !important;
border-color: #1f1f1f !important;
}
.theme-next .this_ua.platform.Android {
background-color: #00c47d !important;
border-color: #01b171 !important;
}
.theme-next .this_ua.browser.Mobile,
.theme-next .this_ua.browser.Chrome {
background-color: #5cb85c !important;
border-color: #4cae4c !important;
}
.theme-next .this_ua.browser.Firefox {
background-color: #f0ad4e !important;
border-color: #eea236 !important;
}
.theme-next .this_ua.browser.Maxthon,
.theme-next .this_ua.browser.IE {
background-color: #428bca !important;
border-color: #357ebd !important;
}
.theme-next .this_ua.browser.baidu,
.theme-next .this_ua.browser.UCBrowser,
.theme-next .this_ua.browser.Opera {
background-color: #d9534f !important;
border-color: #d43f3a !important;
}
.theme-next .this_ua.browser.Android,
.theme-next .this_ua.browser.QQBrowser {
background-color: #78ace9 !important;
border-color: #4cae4c !important;
}
#gitment-display-button {
display: inline-block;
padding: 0 15px;
color: #0a9caf;
cursor: pointer;
font-size: 14px;
border: 1px solid #0a9caf;
border-radius: 4px;
}
#gitment-display-button:hover {
color: #fff;
background: #0a9caf;
}
.post-spread {
margin-top: 20px;
text-align: center;
}
.jiathis_style {
display: inline-block;
}
.jiathis_style a {
border: none;
}
.post-spread {
margin-top: 20px;
text-align: center;
}
.bdshare-slide-button-box a {
border: none;
}
.bdsharebuttonbox {
display: inline-block;
}
.bdsharebuttonbox a {
border: none;
}
ul.search-result-list {
padding-left: 0px;
margin: 0px 5px 0px 8px;
}
p.search-result {
border-bottom: 1px dashed #ccc;
padding: 5px 0;
}
a.search-result-title {
font-weight: bold;
}
a.search-result {
border-bottom: transparent;
display: block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.search-keyword {
border-bottom: 1px dashed #f00;
font-size: 14px;
font-weight: bold;
color: #f00;
}
#local-search-result {
height: 88%;
overflow: auto;
}
.popup {
display: none;
position: fixed;
top: 10%;
left: 50%;
width: 700px;
height: 80%;
margin-left: -350px;
padding: 3px 0 0 10px;
background: #fff;
color: #333;
z-index: 9999;
border-radius: 5px;
}
@media (max-width: 767px) {
.popup {
padding: 3px;
top: 0;
left: 0;
margin: 0;
width: 100%;
height: 100%;
border-radius: 0px;
}
}
.popoverlay {
position: fixed;
width: 100%;
height: 100%;
top: 0px;
left: 0px;
z-index: 2080;
background-color: rgba(0,0,0,0.3);
}
#local-search-input {
margin-bottom: 10px;
padding: 10px;
width: 97%;
font-size: 18px;
}
.popup .fa-search {
padding-top: 8px;
}
.popup-btn-close {
position: absolute;
top: 6px;
right: 14px;
color: #4ebd79;
font-size: 14px;
font-weight: bold;
text-transform: uppercase;
cursor: pointer;
}
#no-result {
position: absolute;
left: 44%;
top: 42%;
color: #ccc;
}
.site-uv,
.site-pv,
.page-pv {
display: inline-block;
}
.site-uv .busuanzi-value,
.site-pv .busuanzi-value,
.page-pv .busuanzi-value {
margin: 0 5px;
}
.site-uv {
margin-right: 10px;
}
.site-uv::after {
content: "|";
padding-left: 10px;
}
.use-motion .post {
opacity: 0;
}
.page-archive .archive-page-counter {
position: relative;
top: 3px;
left: 20px;
}
@media (max-width: 767px) {
.page-archive .archive-page-counter {
top: 5px;
}
}
.page-archive .posts-collapse .archive-move-on {
position: absolute;
top: 11px;
left: 0;
margin-left: -6px;
width: 10px;
height: 10px;
opacity: 0.5;
background: #555;
border: 1px solid #fff;
border-radius: 50%;
}
.category-all-page .category-all-title {
text-align: center;
}
.category-all-page .category-all {
margin-top: 20px;
}
.category-all-page .category-list {
margin: 0;
padding: 0;
list-style: none;
}
.category-all-page .category-list-item {
margin: 5px 10px;
}
.category-all-page .category-list-count {
color: #bbb;
}
.category-all-page .category-list-count:before {
display: inline;
content: " (";
}
.category-all-page .category-list-count:after {
display: inline;
content: ") ";
}
.category-all-page .category-list-child {
padding-left: 10px;
}
.page-post-detail .sidebar-toggle-line {
background: #87daff;
}
.page-post-detail .comments {
overflow: hidden;
}
h1,
h2,
h3,
h4,
h5,
h6 {
margin: 20px 0 10px;
}
p {
margin: 0 0 25px 0;
}
a {
border-bottom-color: #ccc;
}
hr {
margin: 20px 0;
height: 2px;
}
.main-inner {
margin-top: 80px;
}
.header {
background: #f5f5f5;
}
.header-inner {
padding: 25px 0 20px;
}
.header-inner:before,
.header-inner:after {
content: " ";
display: table;
}
.header-inner:after {
clear: both;
}
@media (max-width: 767px) {
.header-inner {
width: auto;
margin-bottom: 50px;
padding: 10px;
}
}
.site-meta {
float: left;
margin-left: -20px;
line-height: normal;
}
@media (max-width: 767px) {
.site-meta {
margin-left: 10px;
}
}
.site-meta .brand {
padding: 2px 1px;
background: none;
}
@media (max-width: 767px) {
.site-meta .brand {
display: block;
}
}
.site-meta .logo {
display: none;
}
.site-meta .site-title {
font-size: 22px;
font-weight: bolder;
}
@media (max-width: 767px) {
.site-meta .site-title {
line-height: 34px;
}
}
.logo-line-before,
.logo-line-after {
display: block;
overflow: hidden;
margin: 0 auto;
width: 75%;
}
@media (max-width: 767px) {
.logo-line-before,
.logo-line-after {
display: none;
}
}
.logo-line-before i,
.logo-line-after i {
position: relative;
display: block;
height: 2px;
background: #222;
}
@media (max-width: 767px) {
.logo-line-before i,
.logo-line-after i {
height: 3px;
}
}
.use-motion .logo-line-before i {
left: -100%;
}
.use-motion .logo-line-after i {
right: -100%;
}
.site-subtitle {
display: none;
}
.site-nav-toggle {
position: static;
float: right;
}
.menu {
float: right;
margin: 8px 0 0 0;
}
@media (max-width: 767px) {
.menu {
margin: 20px 0 0 0;
padding: 0;
}
}
.menu br {
display: none;
}
.menu .menu-item {
margin: 0;
}
@media (max-width: 767px) {
.menu .menu-item {
display: block;
}
}
.menu .menu-item a {
padding: 0 10px;
background: none;
border: none;
border-radius: 2px;
transition-property: background;
}
@media (max-width: 767px) {
.menu .menu-item a {
text-align: left;
}
}
.menu .menu-item a:hover {
background: #e1e1e1;
}
.menu a::before {
display: none;
}
@media (max-width: 767px) {
.menu a::before {
display: block;
}
}
@media (max-width: 767px) {
.menu {
float: none;
}
}
.site-search form {
display: none;
}
.posts-expand {
padding-top: 0;
}
.posts-expand .post-title,
.posts-expand .post-meta {
text-align: left;
}
@media (max-width: 767px) {
.posts-expand .post-title,
.posts-expand .post-meta {
text-align: center;
}
}
.posts-expand .post-eof {
display: none;
}
.posts-expand .post {
margin-top: 120px;
}
.posts-expand .post:first-child {
margin-top: 0;
}
.posts-expand .post-meta {
margin-top: 5px;
margin-bottom: 20px;
}
.posts-expand .post-title {
position: relative;
font-size: 26px;
font-weight: 400;
}
@media (max-width: 767px) {
.posts-expand .post-title {
font-size: 20px;
}
}
@media (min-width: 1600px) {
.posts-expand .post-title {
font-size: 26px;
}
}
.posts-expand .post-title:hover:before {
background: #222;
}
.posts-expand .post-body img {
margin: 0;
}
.posts-expand .post-tags {
text-align: left;
}
.posts-expand .post-tags a {
padding: 1px 5px;
background: #f5f5f5;
border-bottom: none;
}
.posts-expand .post-tags a:hover {
background: #ccc;
}
.posts-expand .post-nav {
margin-top: 40px;
}
.post-more-link {
margin-top: 20px;
text-align: left;
}
.post-more-link a {
padding: 0;
font-size: 14px;
color: #666;
background: none;
border: none;
border-bottom: 2px solid #666;
transition-property: border;
}
@media (max-width: 767px) {
.post-more-link a {
font-size: 12px;
}
}
@media (min-width: 1600px) {
.post-more-link a {
font-size: 16px;
}
}
.post-more-link a:hover {
border-bottom-color: #222;
}
.links-of-blogroll-inline .links-of-blogroll-item {
display: inline-block;
}
.btn {
padding: 0 10px;
border-width: 2px;
border-radius: 0;
}
.headband {
display: none;
}
.site-search {
position: relative;
float: right;
margin-top: 5px;
padding-top: 3px;
}
@media (max-width: 767px) {
.site-search {
float: none;
padding: 0 10px;
}
}
@media (max-width: 767px) {
.container .main-inner {
width: auto;
}
}
.page-post-detail .post-title,
.page-post-detail .post-meta {
text-align: center;
}
.page-post-detail .post-title:before {
display: none;
}
.page-post-detail .post-meta {
margin-bottom: 60px;
}
.pagination {
margin: 120px 0 0;
text-align: left;
}
@media (max-width: 767px) {
.pagination {
margin: 80px 10px 0;
text-align: center;
}
}
.footer {
margin-top: 80px;
padding: 10px 0;
background: #f5f5f5;
color: #666;
}
.footer-inner {
margin: 0 auto;
text-align: left;
}
@media (max-width: 767px) {
.footer-inner {
width: auto;
text-align: center;
}
}
img.emoji {
height: 3em;
width: 3em;
margin: 0 0.05em 0 0.1em;
vertical-align: -0.1em;
}
</style><noscript><link rel="stylesheet" href="/style.css"><link rel="stylesheet" href="//fonts.googleapis.com/css?family=Lato:300,300italic,400,400italic,700,700italic&subset=latin,latin-ext"><link rel="stylesheet" href="https://jjeejj.github.io/css/gitment.css"></noscript></head>
<body itemscope="" itemtype="//schema.org/WebPage" lang="zh-Hans">
<div class="container one-collumn sidebar-position-left
page-home
">
<div class="headband"></div>
<header id="header" class="header" itemscope="" itemtype="//schema.org/WPHeader">
<div class="header-inner"><div class="site-meta ">
<div class="custom-logo-site-title">
<a href="/" class="brand" rel="start">
<span class="logo-line-before"><i></i></span>
<span class="site-title">我的博客</span>
<span class="logo-line-after"><i></i></span>
</a>
</div>
<p class="site-subtitle">web前端</p>
</div>
<div class="site-nav-toggle">
<button>
<span class="btn-bar"></span>
<span class="btn-bar"></span>
<span class="btn-bar"></span>
</button>
</div>
<nav class="site-nav">
<ul id="menu" class="menu">
<li class="menu-item menu-item-home">
<a href="/" rel="section">
<i class="menu-item-icon fa fa-fw fa-home"></i> <br>
首页
</a>
</li>
<li class="menu-item menu-item-archives">
<a href="/archives" rel="section">
<i class="menu-item-icon fa fa-fw fa-archive"></i> <br>
归档
</a>
</li>
<li class="menu-item menu-item-tags">
<a href="/tags" rel="section">
<i class="menu-item-icon fa fa-fw fa-tags"></i> <br>
标签
</a>
</li>
<li class="menu-item menu-item-link">
<a href="/link" rel="section">
<i class="menu-item-icon fa fa-fw fa-link"></i> <br>
网址链接
</a>
</li>
<li class="menu-item menu-item-book">
<a href="/book" rel="section">
<i class="menu-item-icon fa fa-fw fa-book"></i> <br>
电子书
</a>
</li>
<li class="menu-item menu-item-about">
<a href="/about" rel="section">
<i class="menu-item-icon fa fa-fw fa-user"></i> <br>
关于我
</a>
</li>
</ul>
</nav>
</div>
</header>
<main id="main" class="main">
<div class="main-inner">
<div class="content-wrap">
<div id="content" class="content">
<section id="posts" class="posts-expand">
<article class="post post-type-normal " itemscope="" itemtype="//schema.org/Article">
<header class="post-header">
<h1 class="post-title" itemprop="name headline">
<a class="post-title-link" href="/2018/09/23/%E4%B8%BAhexo%E5%8D%9A%E5%AE%A2%E6%B7%BB%E5%8A%A0serviceworker%E7%9A%84%E5%8A%9F%E8%83%BD/" itemprop="url">
为hexo博客添加service worker的功能
</a>
</h1>
<div class="post-meta">
<span class="post-time">
<span class="post-meta-item-icon">
<i class="fa fa-calendar-o"></i>
</span>
<span class="post-meta-item-text">发表于</span>
<time itemprop="dateCreated" datetime="2018-09-23T10:40:48+00:00" content="2018-09-23">
2018-09-23
</time>
</span>
</div>
</header>
<div class="post-body" itemprop="articleBody">
<hr>
<p>为 <code>hexo</code> 博客添加 <code>Service worker</code> 功能,方便离线访问</p>
<hr>
<div class="post-more-link text-center">
<a class="btn" href="/2018/09/23/%E4%B8%BAhexo%E5%8D%9A%E5%AE%A2%E6%B7%BB%E5%8A%A0serviceworker%E7%9A%84%E5%8A%9F%E8%83%BD/#more" rel="contents">
阅读全文 »
</a>
</div>
</div>
<div>
</div>
<div>
</div>
<footer class="post-footer">
<div class="post-eof"></div>
</footer>
</article>
<article class="post post-type-normal " itemscope="" itemtype="//schema.org/Article">
<header class="post-header">
<h1 class="post-title" itemprop="name headline">
<a class="post-title-link" href="/2018/04/10/Tampermonkey%E7%9A%84%E4%BD%BF%E7%94%A8/" itemprop="url">
Tampermonkey的使用
</a>
</h1>
<div class="post-meta">
<span class="post-time">
<span class="post-meta-item-icon">
<i class="fa fa-calendar-o"></i>
</span>
<span class="post-meta-item-text">发表于</span>
<time itemprop="dateCreated" datetime="2018-04-10T23:41:48+00:00" content="2018-04-10">
2018-04-10
</time>
</span>
</div>
</header>
<div class="post-body" itemprop="articleBody">
<hr>
<p>今天就介绍一款浏览器插件的使用:<code>Tampermonkey</code>,又称为<strong>油猴</strong>, 是一款流行的<strong>用户脚本管理器</strong></p>
<p>基本可是适用与各种浏览器:<code>Chrome,Edge,Saair,Opera,Firefox</code></p>
<hr>
<div class="post-more-link text-center">
<a class="btn" href="/2018/04/10/Tampermonkey%E7%9A%84%E4%BD%BF%E7%94%A8/#more" rel="contents">
阅读全文 »
</a>
</div>
</div>
<div>
</div>
<div>
</div>
<footer class="post-footer">
<div class="post-eof"></div>
</footer>
</article>
<article class="post post-type-normal " itemscope="" itemtype="//schema.org/Article">
<header class="post-header">
<h1 class="post-title" itemprop="name headline">
<a class="post-title-link" href="/2018/03/25/atom%E9%85%8D%E7%BD%AEftp%E6%9C%8D%E5%8A%A1/" itemprop="url">
atom配置ftp服务
</a>
</h1>
<div class="post-meta">
<span class="post-time">
<span class="post-meta-item-icon">
<i class="fa fa-calendar-o"></i>
</span>
<span class="post-meta-item-text">发表于</span>
<time itemprop="dateCreated" datetime="2018-03-25T12:02:53+00:00" content="2018-03-25">
2018-03-25
</time>
</span>
</div>
</header>
<div class="post-body" itemprop="articleBody">
<hr>
<p>通常我们本地写代码是需要上传到测试服务器上进行测试,但是每次都登录服务器,通过<code>scp</code>命令进行文件传输,比较麻烦</p>
<p>下面就在开发工具<code>atom</code>配置<code>ftp</code>服务使<code>项目文件与服务器文件直接对应上</code>,达到文件夹共享的功能</p>
<hr>
<div class="post-more-link text-center">
<a class="btn" href="/2018/03/25/atom%E9%85%8D%E7%BD%AEftp%E6%9C%8D%E5%8A%A1/#more" rel="contents">
阅读全文 »
</a>
</div>
</div>
<div>
</div>
<div>
</div>
<footer class="post-footer">
<div class="post-eof"></div>
</footer>
</article>
<article class="post post-type-normal " itemscope="" itemtype="//schema.org/Article">
<header class="post-header">
<h1 class="post-title" itemprop="name headline">
<a class="post-title-link" href="/2018/03/22/linux%E5%91%BD%E4%BB%A4%E4%B9%8Bhtpasswd/" itemprop="url">
linux命令之htpasswd
</a>
</h1>
<div class="post-meta">
<span class="post-time">
<span class="post-meta-item-icon">
<i class="fa fa-calendar-o"></i>
</span>
<span class="post-meta-item-text">发表于</span>
<time itemprop="dateCreated" datetime="2018-03-22T21:46:56+00:00" content="2018-03-22">
2018-03-22
</time>
</span>
</div>
</header>
<div class="post-body" itemprop="articleBody">
<hr>
<p><code>htpasswd</code>是<code>Apache</code>的<code>Web</code>服务器内置的工具,用于创建和更新储存用户名和用户基本认证的密码文件</p>
<hr>
<div class="post-more-link text-center">
<a class="btn" href="/2018/03/22/linux%E5%91%BD%E4%BB%A4%E4%B9%8Bhtpasswd/#more" rel="contents">
阅读全文 »
</a>
</div>
</div>
<div>
</div>
<div>
</div>
<footer class="post-footer">
<div class="post-eof"></div>
</footer>
</article>
<article class="post post-type-normal " itemscope="" itemtype="//schema.org/Article">
<header class="post-header">
<h1 class="post-title" itemprop="name headline">
<a class="post-title-link" href="/2018/03/04/%E6%9C%89%E5%85%B3Promise-catch%E6%96%B9%E6%B3%95%E7%9A%84%E7%90%86%E8%A7%A3/" itemprop="url">
有关Promise.catch方法的理解
</a>
</h1>
<div class="post-meta">
<span class="post-time">
<span class="post-meta-item-icon">
<i class="fa fa-calendar-o"></i>
</span>
<span class="post-meta-item-text">发表于</span>
<time itemprop="dateCreated" datetime="2018-03-04T13:50:13+00:00" content="2018-03-04">
2018-03-04
</time>
</span>
</div>
</header>
<div class="post-body" itemprop="articleBody">
<hr>
<p>之前写了一篇有关<code>Promise</code>的<code>then</code><a target="_blank" rel="noopener" href="https://mp.weixin.qq.com/s/PnoRPIgr1xYzOqLPNpqK5g">方法的文章</a>,现在在讲解一下有关<code>Promise</code>原型上<code>catch</code>的方法</p>
<hr>
<div class="post-more-link text-center">
<a class="btn" href="/2018/03/04/%E6%9C%89%E5%85%B3Promise-catch%E6%96%B9%E6%B3%95%E7%9A%84%E7%90%86%E8%A7%A3/#more" rel="contents">
阅读全文 »
</a>
</div>
</div>
<div>
</div>
<div>
</div>
<footer class="post-footer">
<div class="post-eof"></div>
</footer>
</article>
<article class="post post-type-normal " itemscope="" itemtype="//schema.org/Article">
<header class="post-header">
<h1 class="post-title" itemprop="name headline">
<a class="post-title-link" href="/2018/02/11/%E5%88%A9%E7%94%A8CI%E8%87%AA%E5%8A%A8%E9%83%A8%E7%BD%B2hexo%E5%8D%9A%E5%AE%A2/" itemprop="url">
利用CI自动部署hexo博客
</a>
</h1>
<div class="post-meta">
<span class="post-time">
<span class="post-meta-item-icon">
<i class="fa fa-calendar-o"></i>
</span>
<span class="post-meta-item-text">发表于</span>
<time itemprop="dateCreated" datetime="2018-02-11T22:41:58+00:00" content="2018-02-11">
2018-02-11
</time>
</span>
</div>
</header>
<div class="post-body" itemprop="articleBody">
<hr>
<p>每次写完一篇文章,都会手动执行<code>hexo g</code>和<code>hexo d</code>去生成静态网页后在进行部署到<code>Github page上去</code> </p>
<p>而且为了保存文章的源码<code>md</code>文件还需要<code>push</code>到对应的仓库分支上,比较麻烦</p>
<p>都说<code>懒惰</code>推动着新的东西出现,那么能不能只保存原<code>md</code>文件<code>push</code>上去,其他的操作都让它自动去完成呢 ？</p>
<p>答案肯定是可以的,下面就来讲解一下CI具体的实现方法(<strong>这里只讲解如何把travis接入</strong>):</p>
<hr>
<div class="post-more-link text-center">
<a class="btn" href="/2018/02/11/%E5%88%A9%E7%94%A8CI%E8%87%AA%E5%8A%A8%E9%83%A8%E7%BD%B2hexo%E5%8D%9A%E5%AE%A2/#more" rel="contents">
阅读全文 »
</a>
</div>
</div>
<div>
</div>
<div>
</div>
<footer class="post-footer">
<div class="post-eof"></div>
</footer>
</article>
<article class="post post-type-normal " itemscope="" itemtype="//schema.org/Article">
<header class="post-header">
<h1 class="post-title" itemprop="name headline">
<a class="post-title-link" href="/2018/02/04/JavaScript%E4%B8%AD%E7%9A%84Object%E5%9F%BA%E7%A1%80%E5%86%85%E9%83%A8%E6%96%B9%E6%B3%95/" itemprop="url">
JavaScript中的Object基础内部方法
</a>
</h1>
<div class="post-meta">
<span class="post-time">
<span class="post-meta-item-icon">
<i class="fa fa-calendar-o"></i>
</span>
<span class="post-meta-item-text">发表于</span>
<time itemprop="dateCreated" datetime="2018-02-04T14:22:23+00:00" content="2018-02-04">
2018-02-04
</time>
</span>
</div>
</header>
<div class="post-body" itemprop="articleBody">
<hr>
<p>对于<code>JavaScript</code>对象的操作基本上都会调用底层的对象内部方法,我们可以看出在<a target="_blank" rel="noopener" href="http://www.ecma-international.org/ecma-262/6.0/index.html#table-5"><code>ES6</code></a>标准中定了<strong>14</strong>种内部方法.</p>
<p>双 <strong>[[]]</strong> 代表内部方法,在一般的<code>JS</code>代码中不可见,你可以调用、删除或覆写(<code>通过Proxy对象</code>)普通方法,但是无法操作内部方法.</p>
<hr>
<div class="post-more-link text-center">
<a class="btn" href="/2018/02/04/JavaScript%E4%B8%AD%E7%9A%84Object%E5%9F%BA%E7%A1%80%E5%86%85%E9%83%A8%E6%96%B9%E6%B3%95/#more" rel="contents">
阅读全文 »
</a>
</div>
</div>
<div>
</div>
<div>
</div>
<footer class="post-footer">
<div class="post-eof"></div>
</footer>
</article>
<article class="post post-type-normal " itemscope="" itemtype="//schema.org/Article">
<header class="post-header">
<h1 class="post-title" itemprop="name headline">
<a class="post-title-link" href="/2018/01/28/linux%E4%B8%8B%E5%90%84%E6%96%87%E4%BB%B6%E5%A4%B9%E7%9A%84%E4%BD%9C%E7%94%A8/" itemprop="url">
linux下各文件夹的作用
</a>
</h1>
<div class="post-meta">
<span class="post-time">
<span class="post-meta-item-icon">
<i class="fa fa-calendar-o"></i>
</span>
<span class="post-meta-item-text">发表于</span>
<time itemprop="dateCreated" datetime="2018-01-28T14:38:00+00:00" content="2018-01-28">
2018-01-28
</time>
</span>
</div>
</header>
<div class="post-body" itemprop="articleBody">
<hr>
<p>接触<code>linux</code>的新手看到<code>linux</code>有好多系统生成的文件夹,但是不知道每个文件夹有什么作用</p>
<p>下面来简单讲解一下<code>linux</code>下各文件夹的结构及用途介</p>
<hr>
<div class="post-more-link text-center">
<a class="btn" href="/2018/01/28/linux%E4%B8%8B%E5%90%84%E6%96%87%E4%BB%B6%E5%A4%B9%E7%9A%84%E4%BD%9C%E7%94%A8/#more" rel="contents">
阅读全文 »
</a>
</div>
</div>
<div>
</div>
<div>
</div>
<footer class="post-footer">
<div class="post-eof"></div>
</footer>
</article>
<article class="post post-type-normal " itemscope="" itemtype="//schema.org/Article">
<header class="post-header">
<h1 class="post-title" itemprop="name headline">
<a class="post-title-link" href="/2018/01/21/%E5%86%85%E7%A9%BF%E7%A9%BF%E9%80%8F%E5%B7%A5%E5%85%B7lanproxy%E7%9A%84%E9%85%8D%E7%BD%AE%E4%BD%BF%E7%94%A8/" itemprop="url">
内穿穿透工具lanproxy的配置使用
</a>
</h1>
<div class="post-meta">
<span class="post-time">
<span class="post-meta-item-icon">
<i class="fa fa-calendar-o"></i>
</span>
<span class="post-meta-item-text">发表于</span>
<time itemprop="dateCreated" datetime="2018-01-21T12:56:19+00:00" content="2018-01-21">
2018-01-21
</time>
</span>
</div>
</header>
<div class="post-body" itemprop="articleBody">
<hr>
<p>做微信开发或者把内网服务穿透出去,都会需要一个公网的地址。</p>
<p>经常使用的内网穿透工具有:<strong>花生壳</strong>,<strong>ngrok</strong>,<strong>魔法隧道</strong>等,但是这些域名都是第三方随机的，自定义域名的都是收费。</p>
<p>本来在<strong>window</strong>是使用的<strong>n2n</strong>内网穿透服务的,但是换了<code>Mac</code>之后没有找到<code>Mac</code>端的客户端。</p>
<p>所以本文讲解一下怎么用<strong>lanproxy</strong>搭建一个内网穿透的服务</p>
<hr>
<div class="post-more-link text-center">
<a class="btn" href="/2018/01/21/%E5%86%85%E7%A9%BF%E7%A9%BF%E9%80%8F%E5%B7%A5%E5%85%B7lanproxy%E7%9A%84%E9%85%8D%E7%BD%AE%E4%BD%BF%E7%94%A8/#more" rel="contents">
阅读全文 »
</a>
</div>
</div>
<div>
</div>
<div>
</div>
<footer class="post-footer">
<div class="post-eof"></div>
</footer>
</article>
<article class="post post-type-normal " itemscope="" itemtype="//schema.org/Article">
<header class="post-header">
<h1 class="post-title" itemprop="name headline">
<a class="post-title-link" href="/2018/01/13/homebrew%E7%9A%84tap%E5%8A%9F%E8%83%BD%E8%AF%A6%E8%A7%A3/" itemprop="url">
homebrew的tap功能详解
</a>
</h1>
<div class="post-meta">
<span class="post-time">
<span class="post-meta-item-icon">
<i class="fa fa-calendar-o"></i>
</span>
<span class="post-meta-item-text">发表于</span>
<time itemprop="dateCreated" datetime="2018-01-13T15:14:55+00:00" content="2018-01-13">
2018-01-13
</time>
</span>
</div>
</header>
<div class="post-body" itemprop="articleBody">
<hr>
<p><code>Homebrew</code>是使用<code>ruby</code>开发的<code>Mac</code>的软件包管理器.<br>这里就说明一下有关<code>Taps(third-party-repositories)</code>的知识</p>
<hr>
<div class="post-more-link text-center">
<a class="btn" href="/2018/01/13/homebrew%E7%9A%84tap%E5%8A%9F%E8%83%BD%E8%AF%A6%E8%A7%A3/#more" rel="contents">
阅读全文 »
</a>
</div>
</div>
<div>
</div>
<div>
</div>
<footer class="post-footer">
<div class="post-eof"></div>
</footer>
</article>
</section>
<nav class="pagination">
<span class="page-number current">1</span><a class="page-number" href="/page/2/">2</a><span class="space">…</span><a class="page-number" href="/page/8/">8</a><a class="extend next" rel="next" href="/page/2/"><i class="fa fa-angle-right"></i></a>
</nav>
</div>
</div>
<div class="sidebar-toggle">
<div class="sidebar-toggle-line-wrap">
<span class="sidebar-toggle-line sidebar-toggle-line-first"></span>
<span class="sidebar-toggle-line sidebar-toggle-line-middle"></span>
<span class="sidebar-toggle-line sidebar-toggle-line-last"></span>
</div>
</div>
<aside id="sidebar" class="sidebar">
<div class="sidebar-inner">
<section class="site-overview sidebar-panel sidebar-panel-active ">
<div class="site-author motion-element" itemprop="author" itemscope="" itemtype="//schema.org/Person">
<img class="site-author-image" itemprop="image" src="/images/avatar.gif" alt="">
<p class="site-author-name" itemprop="name"></p>
<p class="site-description motion-element" itemprop="description"></p>
</div>
<nav class="site-state motion-element">
<div class="site-state-item site-state-posts">
<a href="/archives">
<span class="site-state-item-count">72</span>
<span class="site-state-item-name">日志</span>
</a>
</div>
<div class="site-state-item site-state-tags">
<a href="/tags">
<span class="site-state-item-count">27</span>
<span class="site-state-item-name">标签</span>
</a>
</div>
</nav>
<div class="feed-link motion-element">
<a href="/atom.xml" rel="alternate">
<i class="fa fa-rss"></i>
RSS
</a>
</div>
<div class="links-of-author motion-element">
</div>
<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width="330" height="86" src="//music.163.com/outchain/player?type=2&id=25706282&auto=0&height=66"></iframe>
</section>
</div>
</aside>
</div>
</main>
<footer id="footer" class="footer">
<div class="footer-inner">
<script async="" src="//dn-lbstatics.qbox.me/busuanzi/2.3/busuanzi.pure.mini.js">
</script>
<div class="copyright">
©
<span itemprop="copyrightYear">2021</span>
<span class="with-love">
<i class="fa fa-heart"></i>
</span>
<span class="author" itemprop="copyrightHolder">jjeejj</span>
</div>
<span id="busuanzi_container_site_pv">
本站总访问量<span id="busuanzi_value_site_pv"></span>次
</span>
|
<span id="busuanzi_container_site_uv">
本站访客数<span id="busuanzi_value_site_uv"></span>人
</span>
</div>
</footer>
<div class="back-to-top">
<i class="fa fa-arrow-up"></i>
</div>
</div>
<script type="text/javascript">
if (Object.prototype.toString.call(window.Promise) !== '[object Function]') {
window.Promise = null;
}
</script>
<script src="https://jjeejj.github.io/js/gitment.js"></script>
<script src="/bundle.js"></script><script>
var gitment = new Gitment({
id: document.title.split('|')[0].trim(),
owner: 'jjeejj',
repo: 'jjeejj.github.io',
oauth: {
client_id: '1addc006b271fda6ba89',
client_secret: '01bb905e097684490c838ce9b20ca84d409e25f2',
}});
gitment.render('gitment-container');
</script></body></html>