Typecho富文本器标签样式CSS美化代码

寻梦xunm| 785| 收集

2年前

超过1086天温馨提示

本文最后更新于2021年09月30日，已超过1086天没有更新，若内容或图片失效，请留言反馈。

Typecho富文本器标签样式CSS美化代码

提示：相关代码取自Joe主题模板，在此非常感谢作者的奉献。

/*自定义样式(相关css样式代码取自Joe主题模板)*/
.xm-content-c h1,
.xm-content-c h2,
.xm-content-c h3,
.xm-content-c h4,
.xm-content-c h5,
.xm-content-c h6 {
 color:black;
 font-size:18px;
 line-height:24px;
 margin-bottom:18px;
 position:relative
}
.xm-content-c h1 {
 padding:0 15px 0 20px
}
.xm-content-c h1::before {
 content:'¶';
 color:#ffbb50;
 position:absolute;
 top:0;
 left:0;
 font-size:22px
}
.xm-content-c h2 {
 padding:0 15px
}
.xm-content-c h2::before {
 content:'';
 position:absolute;
 top:10%;
 bottom:10%;
 left:0;
 width:4px;
 border-radius:2px;
 background:#FD6363;
}
.xm-content-c h3 {
 padding:0 15px
}
.xm-content-c h3::before {
 content:'';
 position:absolute;
 top:0;
 bottom:0;
 left:0;
 width:4px;
 background:#ffbb50;
 border-radius:0 4px 4px 0
}
.xm-content-c h4::before {
 content:'「';
 color:#9999FF;
 font-weight:600;
 margin-right:5px
}
.xm-content-c h4::after {
 content:'」';
 color:#9999FF;
 font-weight:600;
 margin-left:5px
}
.xm-content-c h5 {
 padding:0 15px 0 28px
}
.xm-content-c h5::before {
 content:'';
 position:absolute;
 top:2px;
 left:0;
 width:20px;
 height:20px;
 background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAC8klEQVRYR+3WP2gTURwH8O/vKnVRRHKXP52cBO3g4p/BqYNIhy4muajUQRBFKjQV1En6ZxJBcmlRCoJDRe3FDiJVwamLS3FwqbgIgss1l2ZQF5XeT3I1Z3NJ7u5dLlAwN9699/t97vfe7/EIO/yhHe5DD9jpCv3fFVTu856+Xzi62Y/35hj9CFPNrlUwWeRJAJfBGADwBcBNI0/PRZFdAdo4xlQLjCqKjBzogat7hZCRAgPghJGBgbFnxglAOvS7b/fLb+q+qnv5BHBCyEBAWTdnANy2IxOtWSC1qsY+1jOFwAVG+gIVvXyHQbcaKuZCxmf5iMQogXFQtEsBeO5JT6BcMu+Bcb1lUhcyqfExACUAB6JEtgUqi+U5JrrmmcyFHCjwSYtQO+tSUSFbAmXdnAdwJVASdyWLPAS2kbFA8xsHNS13EzCmlx8R6KJQcBcypfFpho3cKxRna3ADsgEo6+ZjAKMhgjZ1d2KWR2gTSyD0h4jnIB2gXDIXwciFCPZvSnMl0wwshYrJGDImaMUGKovlLBPVOrDjh8APzFx8zDkjNa7FzYoGZsKT9XEarQOHmei1aJA246cqOWW6/i2l8VMGzoWIPW/k6eq2Ja6UwCz8pw2JGZ8sS8pUz8fWau/jGp+SgLchcGBgZD1Py41NUuoI+ZloV8ZU93+ogZKzfBiWfXAPCgMJU8Y42avQdMzI4ZBfmSizocqrUeJaAmsvBZGGBCtTziXeRY1rCxRAViEhXckqK93AeQJ9kYTvlmVlqmcTdhNEtefc+9X3utVmuX+CkK6oyqtu4nwrWP8bF5IZdGYjJ79wDuMCz4D+XmhFWnZbt7ab5ltBB6mbkyAaBPFCJassuwMmNb4L4EZgXwBc4AoGTZrUeA6A9x1yK6tzzvnFDlxBv0D176kCP2TCpbbjBXCRV9DZk0VeAONCE1IQ1zWg3dlF1sFQHWQIXFeBNrLAw5BwHBZWjQl6E3SbbB8X+R4Mg/Ca0wN2WtFeBTut4B84mFI4VpekyAAAAABJRU5ErkJggg==");
 background-size:100% 100%
}
.xm-content-c h6 {
 padding:0 15px 0 28px
}
.xm-content-c h6::before {
 content:'';
 position:absolute;
 top:2px;
 left:0;
 width:20px;
 height:20px;
 background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAEI0lEQVRYR+3Xb2wTZRwH8G/vL22RPy5GW8fK6rJpGeFFY9RO3TRRE1HfmEAammEyjZmOSEg1RrPZaTD6xjhU/Ndlf0CZgwmD+qcgZBRIETeqY0Vcnc7pGonhRY2l3m2t5upqjq693l2vcy+8N81zz/NcPvf75fd7rjos8ku3yH34HyjK0PqlDLPzD56vMNL0VHxmpgXAoUIZXKgI3sMSpK+cNTAbylaj/9IkprnLM3+mkg8XQi4EsJ4lSL+ZNbAfVd+JG/XLcSERg3M8IAtZauBtDEkeNdN6fX9NfRqXueQiSwm00wQRMDMGw94snBJkqYBrSYIIXs/ojftqGq6IXHZRFIpkKYC2JSw9SJE663W0nthlqcMawwrJYpVCag1M48pNy1YNvLWRffGNIYSCv6Cnog7rjCtVIbUEXoG7qeqaNMj51F58dWoKPZY62JeWyUJG+ctcIplcIizWCpgTl9EIyODJn9BtceDWq/6B57tO/H4R688fFaZ7AWzWAiiJEyMDx39Ed6UDdyy7Ni/w1ekxbP95VJi/F8CRYoGycGLksaEJdFU6cPdy0zxkR/RbtE6FhPvHATQUm2JFODHSfyyCLmsd7lth/hf53q/jcE8OC+NTAG7PTKiNoCqcGPnpF+PotDrwwNXl+OC3H9A8cVqYPgPgFnFo1QCLwomRg4cvoPMGBzZHTgq3zwKwZ+ddKVATXAZhf+gdnPvuojAUqmJdrspRAtQU93pXEM+8clgwhQHU5itruUBNcTt6TsP9sl8weQC0S/VFOUBNcW/2folt2z+XhZPTZh6kSKJ79aqVRuFszRxfUm8sNbdz9xlsfekz2bhCQBvDMMM8z+ubN92Mjrb71brS+97dM4wtnk8U4SSBBEGErVarzeVywePxoHVLA1pb6lUh3+8bwZMv+BTjpIAVACa9Xq+uqakJ7e3tqpGd/WfR3Jr+81awIJS0mY0A+sLhMGw2W3qfGmTXvhAef/6gapxUBDuqqqoejUQiBvFbKUH2DHyNx54bLAqXF0jT9HBjY6Pd6/XOi7oc5K7936Dp2QNF4/IBrTqdLuLxeIi2tracRSGF/PDgKB55er8muHzATQB2m81m+P1+1NbmPoVyIfsOnUOj+2PNcPmAO1iWbeE4TmexWODz+WQhayrL4No2oCkuJ5Bl2VGO49ZmcisXObdeVSuRaq7ZZ3G10KBTqRQl3pQPGY1GEQgE4HQ6heVDAO5S1cklNmUDXQRB9KZSqXkfESaTCW63G7FYDKFQKDEyMoJoNKqfe/bbAJ7QGpcrxa8xDLOV5/k0kGXZv2ZnZ5FMJtNjmqYvURR1IpFInAcwAeD7ud/pUuDmAY1G41g8Hl9DkmScoqggx3FHAIyJMMlSQfI9V5zKagDC93dsoRFKimQx2dIWOV/U/yn6bx0WyDj8vgLOAAAAAElFTkSuQmCC");
 background-size:100% 100%
}
.xm-content-c hr {
  border: none;
  height: 1px;
  background-color: #f0f0f0;
  margin-bottom: 18px;
}

.xm-content-c blockquote{
line-height: 26px;
margin-bottom: 18px;
background: #ecf8ff;
border-left: 5px solid #50bfff;
color: #50bfff;
padding: 8px 15px;
}

.xm-content-c pre {
 position:relative;
 margin:0 0 18px;
 padding:30px 0 0;
 font-size:14px;
 overflow:hidden
}
.xm-content-c pre code {
 display:block;
 overflow:auto;
 padding:0 15px 12px
}
.xm-content-c pre::before {
 content:'';
 position:absolute;
 top:9px;
 left:15px;
 width:12px;
 height:12px;
 border-radius:50%;
 background:#fc625d;
 box-shadow:20px 0 #fdbc40, 40px 0 #35cd4b;
 z-index:1
}

.xm-content-c ol,
.xm-content-c ul {
 margin-bottom:18px;
 padding-left:36px
}
.xm-content-c ol li,
.xm-content-c ul li {
 line-height:26px;
 margin: 5px 0;
}
.xm-content-c ol li {
 list-style:decimal
}
.xm-content-c ul li {
 list-style:disc
}
/*自定义样式结束*/

css 美化标签代码

本作品采用知识共享许可协议知识共享署名-非商业性使用-禁止演绎 3.0 中国大陆许可协议进行许可授权。即要求您在需要转载、引用本文全文或者部分时，请按照协议要求署名，并在保证不进行任何修改、续写等演绎形式，并不用于商业性项目的情况下使用。如果本文有侵犯到您的权益，请直接向我们留言反馈。

0 赞 or 打赏

喜欢就打赏一点