十九域博客这次是亲测五款常用的版权声明样式的美化，我感觉其他的都不好看，我把这八个的放在下面，下面的教程是个大部分的PHP网站主题，大家自测把，如果不合适那就是主题样式冲突大家自行魔改。当做记录一下笔记，前段时间也有人找我要这版权样式，我统计了几个好看的放出来。
样式一
<div class="posts-copyright"><div class="entry-copyright px12">
<!--十九域博客版权样式一-->
<span class="badg badg-sm mr3 c-yellow">1</span> 如果您喜欢本站，<a href="https://www.19yu.cn/" style="color:#a102ff"> <i class="wpcom-icon menu-item-icon">
<svg aria-hidden="true"><use xlink:href="#icon-security-color"></use></svg>
</i>点击这儿
</a>赞助下本站，感谢支持！<br>
<span class="badg badg-sm mr3 c-red">2</span> 可能会帮助到你：
<a href="https://www.19yu.cn/" style="color:#00aeff" title="开发工具" target="_blank">
<i class="wpcom-icon menu-item-icon">
<svg aria-hidden="true"><use xlink:href="#icon-user-auth"></use></svg>
</i> 开发工具
</a> |
<a href="https://www.19yu.cn/" style="color:red" title="解压资源" target="_blank">
<i class="wpcom-icon menu-item-icon">
<svg aria-hidden="true"><use xlink:href="#icon-ontop-color"></use></svg>
</i> 解压资源
</a> |
<a href="https://www.19yu.cn/" style="color:#ffbe02" title="进站必看" target="_blank">
<i class="wpcom-icon menu-item-icon">
<svg aria-hidden="true"><use xlink:href="#icon-comment-color"></use></svg>
</i> 进站必看
</a><br>
<span class="badg badg-sm mr3 c-purple">3</span> 如若转载，请注明文章出处：
<script>var url = window.location.href;document.write(document.URL);</script></span><br>
<span class="badg badg-sm mr3 c-blue">4</span> 本站内容观点不代表本站立场，并不代表本站赞同其观点和对其真实性负责<br>
<span class="badg badg-sm mr3 c-green">5</span> 若作商业用途，请联系原作者授权，若本站侵犯了您的权益请
<a href="https://wpa.qq.com/msgrd?v=3&uin=2413845395&site=qq&menu=yes" style="color:red" title="联系站长qq2413845395" target="_blank">
<i class="wpcom-icon menu-item-icon">
<svg aria-hidden="true"><use xlink:href="#icon-qq-color"></use></svg>
</i> 联系站长
</a> 进行删除处理
<br>
<span class="badg badg-sm mr3">6</span> 本站所有内容均来源于网络，仅供学习与参考，请勿商业运营，严禁从事违法、侵权等任何非法活动，否则后果自负<br>
</div></div>样式二
<!--十九域博客版权样式二 19yu.cn--><div class="single-bottom-html mg-b box b2-radius"><fieldset style="border: 8px dashed; background: #ffffff; padding: 10px; border-radius: 5px; line-height: 1.5em; color: #595959;" data-mce-style="border: 2px dashed; background: #ffffff; padding: 10px; border-radius: 5px; line-height: 1.5em; color: #595959;"> <legend style="color: #ffffff; width: 30%; text-align: center; background-color: #e8b235; border-radius: 5px;" align="center" data-mce-style="color: #ffffff; width: 30%; text-align: center; background-color: #e8b235; border-radius: 8px;">重要声明</legend> <fieldset style="border: 1px dashed #e8b235; padding: 10px; border-radius: 5px; line-height: 2em; font-size: 12px; color: #bdbdbd; text-align: center;" data-mce-style="border: 1px dashed #e8b235; padding: 10px; border-radius: 5px; line-height: 2em; font-size: 12px; color: #bdbdbd; text-align: center;"> <p style="font-size: 12px; text-align: center;" data-mce-style="font-size: 12px; text-align: center;"><span style="color: #000000;" data-mce-style="color: #000000;">本站资源大多来自网络，如有侵犯你的权益请联系管理员</span><span style="color: #000000;" data-mce-style="color: #000000;">E-mail:</span><span style="color: #ff6600;" data-mce-style="color: #ff6600;">sg73410@qq.com</span> <span style="color: #000000;" data-mce-style="color: #000000;">我们会第一时间进行审核删除。站内资源为网友个人学习或测试研究使用，未经原版权作者许可,禁止用于任何商业途径！请在下载24小时内删除！</span></p> <hr> <p style="font-size: 12px; text-align: center;" data-mce-style="font-size: 12px; text-align: center;"><span style="color: #000000;" data-mce-style="color: #000000;">如果遇到</span><span style="color: #ff0000;" data-mce-style="color: #ff0000;">付费</span><span style="color: #000000;" data-mce-style="color: #000000;">才可</span><span style="color: #33cccc;" data-mce-style="color: #33cccc;">观看</span><span style="color: #000000;" data-mce-style="color: #000000;">的文章，建议升级</span><span style="color: #ff0000;" data-mce-style="color: #ff0000;">终身VIP。</span><span style="color: #000000;" data-mce-style="color: #000000;">全站所有资源</span><span style="color: #ff0000;" data-mce-style="color: #ff0000;">“<span style="color: #3366ff;" data-mce-style="color: #3366ff;">任意下免费看</span>”。</span><span style="color: #ff9900;" data-mce-style="color: #ff9900;">本站资源少部分采用</span><span style="color: #00ccff;" data-mce-style="color: #00ccff;">7z压缩，</span><span style="color: #33cccc;" data-mce-style="color: #33cccc;">为防止有人压缩软件不支持7z格式</span><span style="color: #cc99ff;" data-mce-style="color: #cc99ff;">，7z</span><span style="color: #000000;" data-mce-style="color: #000000;">解压，建议下载</span><span style="color: #cc99ff;" data-mce-style="color: #cc99ff;"><em>7-zip</em></span><span style="color: #cc99ff;" data-mce-style="color: #cc99ff;">，zip、rar</span><span style="color: #000000;" data-mce-style="color: #000000;">解压，建议下载</span><span style="color: #cc99ff;" data-mce-style="color: #cc99ff;"><em>WinRAR</em></span><span style="color: #000000;" data-mce-style="color: #000000;">。</span></p> </fieldset> </fieldset></div>样式三
<!--十九域博客版权样式三 19yu.cn-->
<style type="text/css">
.post-copyright {
box-shadow: 2px 2px 5px;
line-height: 2;
position: relative;
margin: 40px 0 10px;
padding: 10px 16px;
border: 1px solid var(--light-grey);
transition: box-shadow .3s ease-in-out;
overflow: hidden;
border-radius: 12px!important;
background-color: var(--main-bg-color);
}
.post-copyright:before {
position: absolute;
right: -26px;
top: -120px;
content: '\f25e';
font-size: 200px;
font-family: 'FontAwesome';
opacity: .2;
}
.post-copyright__title {
font-size: 22px;
}
.post-copyright_type {
font-size: 18px;
color:var(--theme-color)
}
.post-copyright .post-copyright-info {
padding-left: 6px;
font-size: 15px;
}
.post-copyright-m-info .post-copyright-a, .post-copyright-m-info .post-copyright-c,
.post-copyright-m-info .post-copyright-u {
display: inline-block;
width: fit-content;
padding: 2px 5px;
font-size: 15px;
}
.muted-3-color {
color: var(--main-color);
}
/*手机优化*/
@media screen and (max-width:800px){.post-copyright-m-info{display:none}}
</style>
<div class="post-copyright" style="max-width:800px;margin:0 auto;">
<div class="post-copyright__title" style="margin:10px 10px"><span
class="post-copyright_title"><strong><script>document.write
(document.title);</script></strong></span></div>
<div class="post-copyright__type" style="margin:10px 10px"><span
class="post-copyright_type">本文链接：<script>var url =
window.location.href;document.write(document.URL);</script></span></div>
<div class="post-copyright-m">
<div class="post-copyright-m-info">
<div class="post-copyright-a">
<strong>文章作者</strong>
<div class="post-copyright-cc-info">
<strong><a href="https://www.19yu.cn/">十九域博客</a></strong>
</div>
</div>
<div class="post-copyright-c" style="margin:10px 20px">
<strong>隐私政策</strong>
<div class="post-copyright-cc-info">
<strong><a href="https://19yu.cn/privacy"
target="_blank">PrivacyPolicy</a></strong>
</div>
</div>
<div class="post-copyright-u" style="margin:10px 20px">
<strong>用户协议</strong>
<div class="post-copyright-cc-info">
<strong><a href="https://www.19yu.cn/protocol"
target="_blank">UseGenerator</a></strong>
</div>
</div>
<div class="post-copyright-c" style="margin:10px 20px">
<strong>许可协议 </strong>
<div class="post-copyright-cc-info">
<strong><a href="https://creativecommons.org/licenses/by-
nc-sa/4.0/" target="_blank">NC-SA 4.0</a></strong></div>
</div>
</div>
</div>
</div>样式四
<!--十九域博客版权样式四 19yu.cn-->
<div>
<fieldset
style="
border: 1px dashed #008cff;
padding: 10px;
border-radius: 5px;
line-height: 2em;
color: #6d6d6d;
"
>
<legend
align="center"
style="
width: 30%;
text-align: center;
background-color: #008cff;
border-radius: 5px;
background-image: linear-gradient(to right, #FFCC99, #FF99CC); text-align:center;"
"
>
文章版权声明
</legend>
<span class="btn-info btn-xs">1</span> 本网站名称：<span style="color: #3333ff"><span style="color: #09ace2; font-size: 18px"><strong>十九域博客</strong></span></span><br />
<span class="btn-info btn-xs">2</span> 本站永久网址：<font color="#09ace2">https://www.19yu.cn</font><br />
<span class="btn-info btn-xs">3</span> 本网站的文章部分内容可能来源于网络，仅供大家学习与参考，如有侵权，请联系站长 QQ<a href="http://wpa.qq.com/msgrd?v=3&uin=2413845395&site=qq&menu=yes" target="_blank">577669882</a>进行删除处理。<br />
<span class="btn-info btn-xs">4</span> 本站一切资源不代表本站立场，并不代表本站赞同其观点和对其真实性负责。<br />
<span class="btn-info btn-xs">5</span> 本站一律禁止以任何方式发布或转载任何违法的相关信息，访客发现请向站长举报<br />
<span class="btn-info btn-xs">6</span> 本站资源大多存储在云盘，如发现链接失效，请联系我们我们会第一时间更新。<br />
</fieldset>
</div>
<!--版权申明样式-->样式五
<div class="posts-copyright"><div class="box">
<!--十九域博客版权样式五-->
<b class="lurenfen"><p>本站收集的资源仅供内部学习研究软件设计思想和原理使用，学习研究后请自觉删除，请勿传播，因未及时删除所造成的任何后果责任自负。</p>
<p>如果用于其他用途，请购买正版支持作者，谢谢！若您认为「19yu.cn」发布的内容若侵犯到您的权益，请联系站长邮箱:sg73410@qq.com 进行删除处理。</p>
本站资源大多存储在云盘，如发现链接失效，请联系我们，我们会第一时间更新。
</b>
</div>
<style type="text/css">
.box
{
position: relative;
padding: 10px;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
overflow: hidden;
border-radius: 20px;
}
.box:before
{
content: '';
position: absolute;
width: 150%;
height: 50%;
background: linear-gradient(315deg,#00ccff,#d400d4);
animation: animate 6s linear infinite
}
@keyframes animate
{
0%
{
transform: rotate(0deg);
}
100%
{
transform: rotate(360deg);
}
}
.box:after
{
content: '';
position: absolute;
inset : 6px;
background: var(--body-bg-color);
border-radius: 15px;
z-index: 2;
}
.lurenfen
{
position: relative;
font-weight: normal;
color: #2997f7;
z-index: 4;
margin:15px;
}
</style></div>
样式六
<!--十九域博客版权样式六 19yu.cn-->
<div class="posts-copyright">
<fieldset style="padding: 10px;border-radius: 5px;line-height: 2em;font-weight: 700;color: var(--key-color);background-color: var(--body-bg-color);">
<legend align="center" style="margin-bottom: -2px;width: 30%;text-align: center;background-color: #3c59eb;border-radius: 10px;border: 0px dashed #3c59eb;font-size: 16px; color: #ffffff;">
版权声明
</legend>
<span class="btn-info btn-xs" style="background-color: #3c59eb;">1</span> 本站名称：<span style="color: #f7dbdb;"><span style="color: #3c59eb;">
<strong>十九域博客</strong>
</span>
</span>
<br>
<span class="btn-info btn-xs" style="background-color: #3c59eb;">2</span> 本站网址：<font color="#3c59eb">www.19yu.cn</font><br>
<span class="btn-info btn-xs" style="background-color: #3c59eb;">3</span> 本网站的文章部分内容可能来源于网络，仅供大家学习与参考，如有侵权，请联系站长进行删除处理。<br>
<span class="btn-info btn-xs" style="background-color: #3c59eb;">4</span> 本站一切资源不代表本站立场，并不代表本站赞同其观点和对其真实性负责。<br>
<span class="btn-info btn-xs" style="background-color: #3c59eb;">5</span> 本站一律禁止以任何方式发布或转载任何违法的相关信息，访客发现请向站长举报。<br>
<span class="btn-info btn-xs" style="background-color: #3c59eb;">6</span> 本站附件资源、教程等内容如因时效原因失效或不可用，请评论区留言或联系站长及时更新。<br>
</fieldset>
</div>
<!--十九域博客版权样式六 19yu.cn-->样式七
<!--十九域博客版权样式七 19yu.cn-->
<div class="posts-copyright"><section id="author" class="author with-avatar section">
<div class="info">
<p _msttexthash="1502586285" _msthash="58">网站内容来源于网络,如有侵权,请联系我们,我们将及时处理。
<br>分享是一种美德，当你分享时请你附带上本文链接。
</p>
<div class="social">
<a href="http://wpa.qq.com/msgrd?v=3&uin=2413845395&site=qq&menu=yes" class="qq" target="_blank" rel="nofollow noopener">
<i class="fa fa-qq">
</i>
</a>
<a href="mailto:2413845395@qq.com" class="email" title="Follow me on Twitter" target="_blank" rel="nofollow noopener">
<i class="fa fa-envelope">
</i>
</a>
<a href="" class="WeChat" title="Follow me on Facebook" target="_blank" rel="nofollow noopener">
<i class="fa fa-wechat">
</i>
</a>
</div>
</div>
<div class="clear">
</div>
</section>
<style>#author {
padding: 30px;
position: relative;
z-index: 1;
text-align: center;
background: linear-gradient(135deg, #ff005f91 10%, #0097ff 100%);
color: #fff;
margin-top: 15px;
border-radius: 15px
}
#author div.avatar {
position: absolute;
left: 50%;
top: 0;
z-index: 2;
width: 88px;
margin: -44px 0 0 -44px
}
#author div.avatar a {
display: block;
border-radius: 50%;
overflow: hidden;
border: 4px solid #00BEC1
}
#author div.avatar img {
display: block
}
#author #single.fullcover .featured-image .top,#author div.info,#single.fullcover .featured-image #author .top {
font-size: 16px;
max-width: 75%;
margin: 0 auto
}
#author div.social {
margin-top: 15px
}
#author div.social a {
display: inline-block;
margin: 0 12px;
color: #fff;
font-size: 22px
}
#author div.social a:hover {
-webkit-transform: translateY(-2px);
-ms-transform: translateY(-2px);
transform: translateY(-2px)
}
#author .author-name {
margin-top: 35px;
margin-bottom: 20px;
line-height: 1
}
#author #single #comments.hosted .comment .comment-author,#author .author-name a,#author .title,#author .wpcf7 label,#single #comments.hosted .comment #author .comment-author,.wpcf7 #author label {
color: #fff
}
</style></div>
<!--十九域博客版权样式七 19yu.cn-->样式八
<!--十九域博客版权样式八 19yu.cn-->
<style>
@font-face {
font-family: 'iconfont';
/* Project id 4660907 */
src: url('//at.alicdn.com/t/c/font_4660907_in343ww0v0p.woff2?t=1730878397275') format('woff2'),
url('//at.alicdn.com/t/c/font_4660907_in343ww0v0p.woff?t=1730878397275') format('woff'),
url('//at.alicdn.com/t/c/font_4660907_in343ww0v0p.ttf?t=1730878397275') format('truetype');
}
.post-copyright {
background: var(--main-bg-color);
border-width: 1px;
-webkit-transition: .3s;
-moz-transition: .3s;
-o-transition: .3s;
-ms-transition: .3s;
transition: .3s;
position: relative;
margin: 1rem 2rem 0.5rem;
border-radius: 12px;
padding: 34px 0 20px 0;
border: 1px solid #e3e8f7;
color: var(--main-color);
}
.post-copyright .post-copyright__author_group .post-copyright__author_img {
width: 64px;
height: 64px;
margin: auto;
border-radius: 64px;
overflow: hidden;
position: absolute;
left: calc(50% - 33px);
top: -33px;
border: 1px solid #e3e8f7;
box-shadow: 0 8px 12px -3px #24679923;
}
.post-copyright .post-copyright__author_group .post-copyright__author_img img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
position: absolute;
bottom: 0;
left: 0;
transition: 1s ease-in-out;
}
.post-copyright .post-copyright__author_group .post-copyright__author_img img:hover {
-webkit-transform: scale(1.3);
-moz-transform: scale(1.3);
-o-transform: scale(1.3);
-ms-transform: scale(1.3);
transform: scale(1.3)
}
.post-copyright .post-copyright__author_group .post-copyright__author_name {
text-align: center;
font-size: 20px;
font-weight: 700;
margin-top: 16px;
color: var(--main-color);
line-height: 1
}
.post-copyright .post-copyright__author_group .post-copyright__author_desc {
text-align: center;
font-size: 14px;
color: rgba(60, 60, 67, 0.8);
margin: 4px 10px 0;
line-height: 1.5
}
.post-copyright .post-copyright__notice {
font-size: 12px;
margin: .5rem 0;
display: -webkit-box;
display: -moz-box;
display: -webkit-flex;
display: -ms-flexbox;
display: box;
display: flex;
-webkit-box-pack: center;
-moz-box-pack: center;
-o-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center
}
.post-copyright .post-copyright__notice .post-copyright-info {
padding-left: 0;
color: var(--main-color);
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
text-align: center;
max-width: 500px
}
@media screen and (max-width:768px) {
.post-copyright .post-copyright__notice .post-copyright-info {
-webkit-line-clamp: 2
}
}
.post-copyright .post-copyright__notice .post-copyright-info a {
text-decoration: none;
word-break: break-word;
padding: 0 4px;
border-radius: 4px;
color: var(--main-color);
font-weight: 700
}
.post-copyright .post-copyright__notice .post-copyright-info a:hover {
text-decoration: none;
background-color: #246799;
color: #fff;
cursor: pointer;
border-radius: 4px
}
.social-share {
display: flex;
-webkit-box-pack: center;
-moz-box-pack: center;
-o-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
height: 40px;
margin: .5rem auto;
gap: .5rem;
-webkit-box-lines: multiple;
-moz-box-lines: multiple;
-o-box-lines: multiple;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap
}
.social-share-ico i {
font-style: normal;
font-size: 20px;
}
.social-share .social-share-ico {
display: flex;
-webkit-box-pack: center;
-moz-box-pack: center;
-o-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-moz-box-align: center;
-o-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
width: 40px;
height: 40px;
border-radius: 12px;
border: 1px solid #e3e8f7;
cursor: pointer;
-webkit-transition: .3s;
-moz-transition: .3s;
-o-transition: .3s;
-ms-transition: .3s;
transition: .3s
}
@media screen and (max-width:768px) {
.social-share .social-share-ico:nth-child(n+6) {
display: none
}
}
.social-share .social-share-ico:hover {
color: #fff
}
.social-share .icon-qq {
color: #56b6e7;
border-color: #56b6e7
}
.social-share .icon-qq:hover {
background-color: #56b6e7
}
.social-share .icon-weibo {
color: #d44040;
border-color: #d44040
}
.social-share .icon-weibo:hover {
background-color: #d44040
}
.social-share .icon-facebook {
color: #415dc9;
border-color: #415dc9
}
.social-share .icon-facebook:hover {
background-color: #415dc9
}
.social-share .icon-twitter {
color: #56b6e7;
border-color: #56b6e7
}
.social-share .icon-twitter:hover {
background-color: #56b6e7
}
.social-share .icon-link {
color: #425aef;
border-color: #425aef
}
.social-share .icon-link:hover {
background-color: #425aef
}
.social-share .icon-qrcode {
position: relative;
color: #000;
border-color: #000
}
@media screen and (max-width:900px) {
.social-share .icon-qrcode {
display: none
}
}
.social-share .icon-qrcode:hover {
background-color: #000
}
.social-share .icon-qrcode:hover .share-main {
display: -webkit-box;
display: -moz-box;
display: -webkit-flex;
display: -ms-flexbox;
display: box;
display: flex
}
.social-share .icon-qrcode .share-main {
display: none;
position: absolute;
bottom: 1.7rem;
z-index: 100;
padding-bottom: 15px
}
.social-share #qrcode img {
width: 132px;
height: 132px;
}
.social-share .icon-qrcode .share-main-all {
padding: 12px;
border-radius: 12px;
background: #f7f7f9;
-webkit-animation: donate_effcet .3s .1s ease both;
-moz-animation: donate_effcet .3s .1s ease both;
-o-animation: donate_effcet .3s .1s ease both;
-ms-animation: donate_effcet .3s .1s ease both;
animation: donate_effcet .3s .1s ease both;
-webkit-box-orient: vertical;
-moz-box-orient: vertical;
-o-box-orient: vertical;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
border: 1px solid #e3e8f7
}
.social-share .icon-qrcode .share-main-all .reward-dec {
font-size: 1rem;
color: #363636 !important;
text-align: center
}
.social-share #qrcode {
width: 150px;
height: 150px;
min-width: 150px;
min-height: 150px;
background: #fff;
padding: 8px;
border-radius: 8px;
margin-bottom: 8px;
border: 1px solid #e3e8f7
}
.fa-seedling::before {
font-family: 'iconfont';
content: '\e60d';
font-size: 20px;
}
.post-tools {
display: flex;
width: 100%;
margin: 15px 0;
-webkit-box-pack: center;
-moz-box-pack: center;
-o-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
margin-top: 8px;
-webkit-box-lines: multiple;
-moz-box-lines: multiple;
-o-box-lines: multiple;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none
}
.post-tools .post-tools-left {
white-space: nowrap;
display: -webkit-box;
display: -moz-box;
display: -webkit-flex;
display: -ms-flexbox;
display: box;
display: flex;
gap: .5rem;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
-webkit-box-pack: center;
-moz-box-pack: center;
-o-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-lines: multiple;
-moz-box-lines: multiple;
-o-box-lines: multiple;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap
}
.post-tools .post-tools-left #quit-box {
position: fixed;
width: 100vw;
height: 100vh;
background: rgba(0, 0, 0, .2);
top: 0;
left: 0;
opacity: .01;
display: none;
z-index: 101;
margin: 0
}
@media screen and (max-width:768px) {
.post-tools .post-tools-left #quit-box {
height: calc(100vh - 380px)
}
}
.post-tools .post-tools-left .reward-link.mode {
background: #57bd6a;
color: #fff;
padding: 0 16px;
height: 40px;
line-height: 39px;
-webkit-box-shadow: 0 8px 12px -3px rgba(135, 238, 121, 0.212);
box-shadow: 0 8px 12px -3px rgba(135, 238, 121, 0.212);
display: -webkit-box;
display: -moz-box;
display: -webkit-flex;
display: -ms-flexbox;
display: box;
display: flex;
-webkit-box-align: center;
-moz-box-align: center;
-o-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
border-radius: 8px;
cursor: pointer;
text-align: center;
-webkit-transition: .3s;
-moz-transition: .3s;
-o-transition: .3s;
-ms-transition: .3s;
transition: .3s
}
.post-tools .post-tools-left .reward-link.mode a {
color: #fff
}
.post-tools .post-tools-left .reward-link.mode i {
margin-right: 4px
}
.post-tools .post-tools-left .reward-link.mode:hover {
background: #425aef;
-webkit-box-shadow: none;
box-shadow: none
}
.social-share-ico .fa-qq::before {
font-family: 'iconfont';
content: '\e876';
}
.social-share-ico .fa-weibo::before {
font-family: 'iconfont';
content: '\e666';
}
.social-share-ico .fa-twitter::before {
font-family: 'iconfont';
content: '\e613';
}
.social-share-ico .fa-facebook::before {
font-family: 'iconfont';
content: '\e617';
}
.social-share-ico .fa-facebook::before {
font-family: 'iconfont';
content: '\e6e1';
}
.social-share-ico .fa-link::before {
font-family: 'iconfont';
content: '\e706';
}
.social-share-ico .fa-qrcode::before {
font-family: 'iconfont';
content: '\e6bd';
}
@media screen and (max-width:768px) {
.post-copyright {
box-shadow: 0 8px 16px -4px rgba(44, 45, 48, 0.047);
padding: 1rem 1.3rem;
margin: .5rem
}
.social-share {
display: none;
}
.post-copyright__author_name{
margin-top:24px !important;
}
}
</style>
<div class="post-copyright">
<div class="post-copyright__author_group">
<a class="post-copyright__author_img" href="/about.html"><img class="post-copyright__author_img_front"
src="https://q1.qlogo.cn/g?b=qq&nk=2413845395&s=640"></a>
<div class="post-copyright__author_name">
十九域博客
</div>
<div class="post-copyright__author_desc"></div>
</div>
<div class="post-tools" id="post-tools">
<div class="post-tools-left">
<div class="reward-link mode">
<a class="reward-link-button" href="/rss"><i class="solitude fa-solid fa-seedling"></i>订阅</a>
</div>
</div>
</div>
<div class="social-share">
<a class="social-share-ico icon-qq" target="_blank" rel="noopener"
href="https://connect.qq.com/widget/shareqq/index.html?url=" title="分享到QQ">
<i class="solitude fab fa-qq"></i>
</a>
<a class="social-share-ico icon-weibo" target="_blank" rel="noopener"
href="https://service.weibo.com/share/share.php?url=" title="分享到微博">
<i class="solitude fab fa-weibo"></i>
</a>
<a class="social-share-ico icon-twitter" target="_blank" rel="noopener" href="https://twitter.com/intent/tweet?url="
title="分享到Twitter">
<i class="solitude fab fa-twitter"></i>
</a>
<a class="social-share-ico icon-facebook" target="_blank" rel="noopener"
href="https://www.facebook.com/sharer/sharer.php?u=" title="分享到Facebook">
<i class="solitude fab fa-facebook"></i>
</a>
<div class="social-share-ico icon-link" onclick="copyLink()" title="复制文章链接">
<i class="solitude fas fa-link"></i>
</div>
<div class="social-share-ico icon-qrcode" title="使用手机扫码阅读这篇文章">
<i class="solitude fas fa-qrcode"></i>
<div class="share-main">
<div class="share-main-all">
<div class="qrcode" data-size="100"></div>
<div class="reward-dec">
使用手机扫码阅读这篇文章
</div>
</div>
</div>
</div>
</div>
<div class="post-copyright__notice">
<span class="post-copyright-info">本文是原创文章，采用<a target="_blank" rel="noopener"
href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.zh">CC BY-NC-SA 4.0</a>协议，完整转载请注明来自<a
href="/">十九域博客</a></span>
</div>
</div>
<script>
const link = window.location.href;
document.querySelectorAll('a.social-share-ico').forEach(function (element) {
let href = element.getAttribute('href');
element.setAttribute('href', href + encodeURIComponent(link)); // 将链接添加到分享地址中
});
</script>
</script>
<div id="notyn-container"></div>
<script>
function copyLink() {
const link = window.location.href;
navigator.clipboard.writeText(link)
.then(() => {
const notyn = document.createElement('div');
notyn.classList.add('notyn');
const noty1 = document.createElement('div');
noty1.classList.add('noty1');
const notyf = document.createElement('div');
notyf.classList.add('notyf', 'success');
notyf.textContent = '本文链接已复制，可贴粘';
noty1.appendChild(notyf);
notyn.appendChild(noty1);
document.getElementById('notyn-container').appendChild(notyn);
setTimeout(() => {
notyn.style.display = 'block';
}, 100);
setTimeout(() => {
notyn.style.display = 'none';
notyn.remove();
}, 2000);
})
.catch(err => {
console.error('复制失败', err);
});
}
</script>
<!--十九域博客版权样式八 19yu.cn-->使用教程
从以上版权声明样式中选择一款你喜欢的拿来用就行，复制对应代码放入你网站主题的文章页的文件合适的位置即可，一般都放在正文结束的换行代码的位置。大家自行摸索吧
请登录后发表评论
注册
社交账号登录
停留在世界边缘，与之惜别