依星源码资源网,依星资源网

 找回密码
 立即注册

QQ登录

只需一步,快速开始

【好消息,好消息,好消息】VIP会员可以发表文章赚积分啦 !
查看: 17|回复: 0

网站美化代码-文章列表仿MAC三色小圆点

[复制链接] 主动推送

1万

主题

1万

帖子

1万

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
14809
发表于 4 天前 | 显示全部楼层 |阅读模式
网站美化代码-文章列表仿MAC三色小圆点
代码投放:网站后台 -> Zibll主题设置 -> 全局&功能 -> 自定义代码 -> 自定义CSS样式
(目前经过测试子比主题正常运行 其他程序或者主题自测)

网站美化代码-文章列表仿MAC三色小圆点

网站美化代码-文章列表仿MAC三色小圆点



  1. /*列表左上角MAC边框美化 xkwo.com*/
  2. .posts-item.card:last-child {
  3.     margin-bottom: 8px !important;
  4. }

  5. .training-camp__wrapper .header__title-wrapper {
  6.     font-size: 16px;
  7. }

  8. .sec-wrapper {
  9.     margin-bottom: 10px;
  10. }

  11. .training-camp__wrapper .header__title-wrapper {
  12.     color: #22ab80;
  13. }

  14. .training-camp__wrapper {
  15.     background-image: linear-gradient(150deg, #cff0fb 20%, #cbf4e4 40%);
  16.     padding: 0 12px 12px;
  17.     border-radius: 16px;
  18. }

  19. button.button---AUM5ZP.text---pn4pHz.medium---OGt5iw.header__btn {
  20.     background: #ffffff00;
  21.     border: 1px solid #fc3c2d00;
  22.     border-radius: 0px;
  23. }

  24. .training-camp__wrapper .training-camp__header {
  25.     padding: 24px 0 24px 12px;
  26.     display: -webkit-flex;
  27.     display: flex;
  28.     background: url(/pic/kuangwenlu.png) 100% 0/433px 126px no-repeat;
  29. }

  30. .training-camp__wrapper .header__title-wrapper {
  31.     display: -webkit-flex;
  32.     display: flex;
  33.     -webkit-align-items: center;
  34.     align-items: center;
  35. }

  36. .training-camp__wrapper .title__img-wrapper {
  37.     height: 20px;
  38. }

  39. .training-camp__wrapper .header__btn-wrapper {
  40.     margin-left: auto;
  41.     display: -webkit-flex;
  42.     display: flex;
  43. }

  44. .training-camp__wrapper .header__btn-wrapper button[class*=button---] {
  45.     height: 20px;
  46.     line-height: 20px;
  47.     padding: 0 12px;
  48. }

  49. .training-camp__wrapper .header__btn {
  50.     display: -webkit-flex;
  51.     display: flex;
  52.     -webkit-align-items: center;
  53.     align-items: center;
  54.     font-size: 14px;
  55.     color: #22ab80;
  56. }

  57. .medium---OGt5iw {
  58.     height: 36px;
  59.     padding: 8px 24px;
  60.     font-size: 14px;
  61. }

  62. .outlined---BKvHAe,
  63. .text---pn4pHz {
  64.     background-color: initial;
  65.     color: #3e454d;
  66. }

  67. .button---AUM5ZP {
  68.     position: relative;
  69.     display: inline-block;
  70.     height: 36px;
  71.     padding: 8px 24px;
  72.     border-radius: 22px;
  73.     cursor: pointer;
  74.     border: unset;
  75.     font-size: 14px;
  76.     -webkit-user-select: none;
  77.     -moz-user-select: none;
  78.     user-select: none;
  79. }

  80. .ke-icon---zeGrGg+i {
  81.     display: inline-block;
  82.     vertical-align: middle;
  83. }

  84. .training-camp__wrapper>div.sec-bd {
  85.     background-color: var(--body-bg-color);

  86. }

  87. .sec-wrapper .sec-bd {
  88.     position: relative;
  89.     display: -webkit-flex;
  90.     display: flex;
  91.     -webkit-flex-wrap: wrap;
  92.     flex-wrap: wrap;

  93. }

  94. .training-camp__wrapper .sec-bd {
  95.     padding: 12px;
  96.     border-radius: 16px;
  97. }

  98. img.title-macyingyong {
  99.     /* width: 120px; */
  100.     height: 50px;
  101. }

  102. .posts-item.card {
  103.     padding: 35px 10px 10px 10px !important;
  104. }

  105. .posts-item {
  106.     position: relative !important;
  107. }

  108. .posts-item.card::before {
  109.     content: "";
  110.     display: block;
  111.     background: #fc625d;
  112.     top: 13px;
  113.     left: 15px;
  114.     border-radius: 50%;
  115.     width: 9px;
  116.     height: 9px;
  117.     box-shadow: 16px 0 #fdbc40, 32px 0 #35cd4b;
  118.     margin: 0px 2px -7px;
  119.     z-index: 1;
  120.     position: absolute;
  121. }
  122. .enlighter::before {
  123.     content: "";
  124.     display: block;
  125.     background: #fc625d;
  126.     top: 9px;
  127.     left: 15px;
  128.     border-radius: 50%;
  129.     width: 15px;
  130.     height: 15px;
  131.     box-shadow: 20px 0 #fdbc40, 40px 0 #35cd4b;
  132.     margin: 0px 2px -7px;
  133.     z-index: 1;
  134.     position: absolute;
  135. }
  136. .enlighter-overflow-scroll.enlighter-v-standard .enlighter {
  137.     padding: 35px 0 12px 0;
  138. }
  139. /*列表左上角MAC边框美化 xkwo.com*/
复制代码


扫码关注微信公众号,及时获取最新资源信息!下载附件优惠VIP会员6折;永久VIP4折
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

免责声明:
1、本站提供的所有资源仅供参考学习使用,版权归原著所有,禁止下载本站资源参与商业和非法行为,请在24小时之内自行删除!
2、本站所有内容均由互联网收集整理、网友上传,并且以计算机技术研究交流为目的,仅供大家参考、学习,请勿任何商业目的与商业用途。
3、若您需要商业运营或用于其他商业活动,请您购买正版授权并合法使用。
4、论坛的所有内容都不保证其准确性,完整性,有效性,由于源码具有复制性,一经售出,概不退换。阅读本站内容因误导等因素而造成的损失本站不承担连带责任。
5、用户使用本网站必须遵守适用的法律法规,对于用户违法使用本站非法运营而引起的一切责任,由用户自行承担
6、本站所有资源来自互联网转载,版权归原著所有,用户访问和使用本站的条件是必须接受本站“免责声明”,如果不遵守,请勿访问或使用本网站
7、本站使用者因为违反本声明的规定而触犯中华人民共和国法律的,一切后果自己负责,本站不承担任何责任。
8、凡以任何方式登陆本网站或直接、间接使用本网站资料者,视为自愿接受本网站声明的约束。
9、本站以《2013 中华人民共和国计算机软件保护条例》第二章 “软件著作权” 第十七条为原则:为了学习和研究软件内含的设计思想和原理,通过安装、显示、传输或者存储软件等方式使用软件的,可以不经软件著作权人许可,不向其支付报酬。若有学员需要商用本站资源,请务必联系版权方购买正版授权!
10、本网站如无意中侵犯了某个企业或个人的知识产权,请来信【站长信箱312337667@qq.com】告之,本站将立即删除。
郑重声明:
本站所有资源仅供用户本地电脑学习源代码的内含设计思想和原理,禁止任何其他用途!
本站所有资源、教程来自互联网转载,仅供学习交流,不得商业运营资源,不确保资源完整性,图片和资源仅供参考,不提供任何技术服务。
本站资源仅供本地编辑研究学习参考,禁止未经资源商正版授权参与任何商业行为,违法行为!如需商业请购买各资源商正版授权
本站仅收集资源,提供用户自学研究使用,本站不存在私自接受协助用户架设游戏或资源,非法运营资源行为。
 
在线客服
点击这里给我发消息 点击这里给我发消息 点击这里给我发消息
售前咨询热线
312337667

微信扫一扫,私享最新原创实用干货

QQ|免责声明|小黑屋|依星资源网 ( 鲁ICP备2021043233号-3 )|网站地图

GMT+8, 2025-4-4 04:44

Powered by Net188.com X3.4

邮箱:312337667@qq.com 客服QQ:312337667(工作时间:9:00~21:00)

快速回复 返回顶部 返回列表