ink 你的主题好看，能分享下吗？

[未知用户] ``` /* 跳动标题 */ .Hero-title { animation: my-face 5s infinite ease-in-out; display: inline-block; margin: 0 5px; } @keyframes my-face { 2% { transform: translate(0,1.5px) rotate(1.5deg); } 4% { transform: translate(0,-1.5px) rotate(-0.5deg); } 6% { transform: translate(0,1.5px) rotate(-1.5deg); } 8% { transform: translate(0,-1.5px) rotate(-1.5deg); } 10% { transform: translate(0,2.5px) rotate(1.5deg); } 12% { transform: translate(0,-0.5px) rotate(1.5deg); } 14% { transform: translate(0,-1.5px) rotate(1.5deg); } 16% { transform: translate(0,-0.5px) rotate(-1.5deg); } 18% { transform: translate(0,0.5px) rotate(-1.5deg); } 20% { transform: translate(0,-1.5px) rotate(2.5deg); } 22% { transform: translate(0,0.5px) rotate(-1.5deg); } 24% { transform: translate(0,1.5px) rotate(1.5deg); } 26% { transform: translate(0,0.5px) rotate(0.5deg); } 28% { transform: translate(0,0.5px) rotate(1.5deg); } 30% { transform: translate(0,-0.5px) rotate(2.5deg); } 32% { transform: translate(0,1.5px) rotate(-0.5deg); } 34% { transform: translate(0,1.5px) rotate(-0.5deg); } 36% { transform: translate(0,-1.5px) rotate(2.5deg); } 38% { transform: translate(0,1.5px) rotate(-1.5deg); } 40% { transform: translate(0,-0.5px) rotate(2.5deg); } 42% { transform: translate(0,2.5px) rotate(-1.5deg); } 44% { transform: translate(0,1.5px) rotate(0.5deg); } 46% { transform: translate(0,-1.5px) rotate(2.5deg); } 48% { transform: translate(0,-0.5px) rotate(0.5deg); } 50% { transform: translate(0,0.5px) rotate(0.5deg); } 52% { transform: translate(0,2.5px) rotate(2.5deg); } 54% { transform: translate(0,-1.5px) rotate(1.5deg); } 56% { transform: translate(0,2.5px) rotate(2.5deg); } 58% { transform: translate(0,0.5px) rotate(2.5deg); } 60% { transform: translate(0,2.5px) rotate(2.5deg); } 62% { transform: translate(0,-0.5px) rotate(2.5deg); } 64% { transform: translate(0,-0.5px) rotate(1.5deg); } 66% { transform: translate(0,1.5px) rotate(-0.5deg); } 68% { transform: translate(0,-1.5px) rotate(-0.5deg); } 70% { transform: translate(0,1.5px) rotate(0.5deg); } 72% { transform: translate(0,2.5px) rotate(1.5deg); } 74% { transform: translate(0,-0.5px) rotate(0.5deg); } 76% { transform: translate(0,-0.5px) rotate(2.5deg); } 78% { transform: translate(0,-0.5px) rotate(1.5deg); } 80% { transform: translate(0,1.5px) rotate(1.5deg); } 82% { transform: translate(0,-0.5px) rotate(0.5deg); } 84% { transform: translate(0,1.5px) rotate(2.5deg); } 86% { transform: translate(0,-1.5px) rotate(-1.5deg); } 88% { transform: translate(0,-0.5px) rotate(2.5deg); } 90% { transform: translate(0,2.5px) rotate(-0.5deg); } 92% { transform: translate(0,0.5px) rotate(-0.5deg); } 94% { transform: translate(0,2.5px) rotate(0.5deg); } 96% { transform: translate(0,-0.5px) rotate(1.5deg); } 98% { transform: translate(0,-1.5px) rotate(-0.5deg); } 0%,100% { transform: translate(0,0) rotate(0deg); } if(window.hljsLoader && !document.currentScript.parentNode.hasAttribute('data-s9e-livepreview-onupdate')) { window.hljsLoader.highlightBlocks(document.currentScript.parentNode); } } /* 不要在全部标签页上展示竖排、信息流广告，以及在线用户、论坛统计 */ .TagsPage .item-forumStatisticsWidget { display: none !important; } @media screen and (max-width: 600px) { .item-forumStatisticsWidget { display: none; } } body { background-image: linear-gradient(135deg, rgba(186, 186, 186, 0.03) 0%, rgba(186, 186, 186, 0.03) 10%,rgba(133, 133, 133, 0.03) 10%, rgba(133, 133, 133, 0.03) 14%,rgba(38, 38, 38, 0.03) 14%, rgba(38, 38, 38, 0.03) 17%,rgba(93, 93, 93, 0.03) 17%, rgba(93, 93, 93, 0.03) 25%,rgba(80, 80, 80, 0.03) 25%, rgba(80, 80, 80, 0.03) 45%,rgba(239, 239, 239, 0.03) 45%, rgba(239, 239, 239, 0.03) 100%),linear-gradient(135deg, rgba(236, 236, 236, 0.03) 0%, rgba(236, 236, 236, 0.03) 47%,rgba(182, 182, 182, 0.03) 47%, rgba(182, 182, 182, 0.03) 63%,rgba(223, 223, 223, 0.03) 63%, rgba(223, 223, 223, 0.03) 81%,rgba(86, 86, 86, 0.03) 81%, rgba(86, 86, 86, 0.03) 89%,rgba(23, 23, 23, 0.03) 89%, rgba(23, 23, 23, 0.03) 90%,rgba(226, 226, 226, 0.03) 90%, rgba(226, 226, 226, 0.03) 100%),linear-gradient(45deg, rgba(52, 52, 52, 0.03) 0%, rgba(52, 52, 52, 0.03) 31%,rgba(246, 246, 246, 0.03) 31%, rgba(246, 246, 246, 0.03) 63%,rgba(188, 188, 188, 0.03) 63%, rgba(188, 188, 188, 0.03) 71%,rgba(15, 15, 15, 0.03) 71%, rgba(15, 15, 15, 0.03) 87%,rgba(127, 127, 127, 0.03) 87%, rgba(127, 127, 127, 0.03) 93%,rgba(234, 234, 234, 0.03) 93%, rgba(234, 234, 234, 0.03) 100%),linear-gradient(90deg, #ffffff,#ffffff); .CommentPost.Post–by-actor { // This sets the left border to be the same color as the forum primary. border-left: solid @config-primary-color; } .Hero { background-image: linear-gradient(135deg, #fdfcfb 0%, #e2d1c3 100%); } /* 卡片主题 / .IndexPage .DiscussionListItem, .UserPage .DiscussionListItem, .DiscussionPage-discussion .DiscussionListItem { transition: all 0.1s; / 动画时间 */; } @media (min-width: 991px) { .IndexPage .DiscussionList-discussions>li:not(:first-child) .DiscussionListItem:hover { /* 悬浮效果 / transform: scale(1.01); / 缩放 */; } } @media (min-width: 768px) { /* pc 端 / .IndexPage .DiscussionListItem-content, .UserPage .DiscussionListItem-content, .DiscussionPage-discussion .DiscussionListItem-content { / 首页、用户页、讨论页卡片大小、描边 */ padding-left: 80px; padding-right: 80px; padding-top: 10px; border-radius: 8px; padding-bottom: 10px; border: 1px solid #dbdfe6!important; } .IndexPage .Post.CommentPost, if(window.hljsLoader && !document.currentScript.parentNode.hasAttribute('data-s9e-livepreview-onupdate')) { window.hljsLoader.highlightBlocks(document.currentScript.parentNode); } .UserPage .Post.CommentPost, .DiscussionPage-discussion .Post.CommentPost { margin-top: 20px; border-radius: 8px; border: 1px solid #dbdfe6 !important; } .IndexPage .DiscussionListItem-info>.item-tags, if(window.hljsLoader && !document.currentScript.parentNode.hasAttribute('data-s9e-livepreview-onupdate')) { window.hljsLoader.highlightBlocks(document.currentScript.parentNode); } .UserPage .DiscussionListItem-info>.item-tags { top: 23px !important; } .DiscussionListItem { position: relative; margin-right: 0; padding-right: 0; padding-left: 0; margin-left: 0; border-radius: 8px; margin-top: 15px; } if(window.hljsLoader && !document.currentScript.parentNode.hasAttribute('data-s9e-livepreview-onupdate')) { window.hljsLoader.highlightBlocks(document.currentScript.parentNode); } } @media (min-width: 768px) { .IndexPage .DiscussionListItem:hover { background-color: #fff; -webkit-box-shadow: 0px 8px 24px 3px rgba(84,102,134,0.1) !important; box-shadow: 0px 8px 24px 3px rgba(84,102,134,0.1) !important; } } /* banner */ .WelcomeHero { color: #282828; } .Hero h2 { font-size: 25px; font-weight: 700; } .Hero { box-shadow: 0px 1px 10px 0 rgba(151,158,181,0.28); background-color: #fff; margin-bottom: 15px; } / .DiscussionHero .TagsLabel .TagLabel { color: #4D698E; } / .WelcomeHero .Hero-subtitle { color: #000; } } /* 固定左侧标签栏 */ if(window.hljsLoader && !document.currentScript.parentNode.hasAttribute('data-s9e-livepreview-onupdate')) { window.hljsLoader.highlightBlocks(document.currentScript.parentNode); } @media (min-width: 992px) { .sideNav, .sideNav>ul { width: 190px; position: sticky; top: 80px; } .App { overflow-x: visible; } /* 版块页不受影响 */ .CategoriesPage.TagsPage .sideNav, .CategoriesPage.TagsPage .sideNav>ul { position: unset; } /* 标签页不受影响 */ .TagsPage.TagsPage .sideNav, .TagsPage.TagsPage .sideNav>ul { position: unset; } if(window.hljsLoader && !document.currentScript.parentNode.hasAttribute('data-s9e-livepreview-onupdate')) { window.hljsLoader.highlightBlocks(document.currentScript.parentNode); } } / 右上角楼主 / div.PostStream-item[data-index=“0”] article.CommentPost.Post.Post–by-start-user header.Post-header ul:not(ul.PostUser-badges.badges):after { content: “楼主”; background: #F05D1D; padding: 1px 10px 0px; color: white; border-radius: 4px; font-size: 14px; float: right; } / 沙发 / div.PostStream-item[data-index=“1”] article.CommentPost.Post header.Post-header ul:not(ul.PostUser-badges.badges)::after { content: “沙发”; background: #f947c8; padding: 1px 10px 0px; color: white; border-radius: 4px; font-size: 14px; float: right; } / 板凳 / div.PostStream-item[data-index=“2”] article.CommentPost.Post header.Post-header ul:not(ul.PostUser-badges.badges)::after { content: “板凳”; background: #db45fb; padding: 1px 10px 0px; color: white; border-radius: 4px; font-size: 14px; float: right; } / 地板 / div.PostStream-item[data-index=“3”] article.CommentPost.Post header.Post-header ul:not(ul.PostUser-badges.badges)::after { content: “地板”; background: #2a92f4; padding: 1px 10px 0px; color: white; border-radius: 4px; font-size: 14px; float: right; } /* 不要在分区版块上显示论坛统计、在线会员、地球 */ .CategoriesPage.TagsPage .item-forumStatisticsWidget, .CategoriesPage.TagsPage .item-onlineUsers, .CategoriesPage.TagsPage .item-flagrow-ad { display: none !important; } .TagsPage .OnlineUsers { display: none; } @media (max-width: 721px) { .OnlineUsers { display: none; } } if(window.hljsLoader && !document.currentScript.parentNode.hasAttribute('data-s9e-livepreview-onupdate')) { window.hljsLoader.highlightBlocks(document.currentScript.parentNode); }

okccn /* 跳动标题 */ .Hero-title { animation: my-face 5s infinite ease-in-out; display: inline-block; margin: 0 5px; } @keyframes my-face { 2% { transform: translate(0,1.5px) rotate(1.5deg); } 4% { transform: translate(0,-1.5px) rotate(-0.5deg); } 6% { transform: translate(0,1.5px) rotate(-1.5deg); } 8% { transform: translate(0,-1.5px) rotate(-1.5deg); } 10% { transform: translate(0,2.5px) rotate(1.5deg); } 12% { transform: translate(0,-0.5px) rotate(1.5deg); } 14% { transform: translate(0,-1.5px) rotate(1.5deg); } 16% { transform: translate(0,-0.5px) rotate(-1.5deg); } 18% { transform: translate(0,0.5px) rotate(-1.5deg); } 20% { transform: translate(0,-1.5px) rotate(2.5deg); } 22% { transform: translate(0,0.5px) rotate(-1.5deg); } 24% { transform: translate(0,1.5px) rotate(1.5deg); } 26% { transform: translate(0,0.5px) rotate(0.5deg); } 28% { transform: translate(0,0.5px) rotate(1.5deg); } 30% { transform: translate(0,-0.5px) rotate(2.5deg); } 32% { transform: translate(0,1.5px) rotate(-0.5deg); } 34% { transform: translate(0,1.5px) rotate(-0.5deg); } 36% { transform: translate(0,-1.5px) rotate(2.5deg); } 38% { transform: translate(0,1.5px) rotate(-1.5deg); } 40% { transform: translate(0,-0.5px) rotate(2.5deg); } 42% { transform: translate(0,2.5px) rotate(-1.5deg); } 44% { transform: translate(0,1.5px) rotate(0.5deg); } 46% { transform: translate(0,-1.5px) rotate(2.5deg); } 48% { transform: translate(0,-0.5px) rotate(0.5deg); } 50% { transform: translate(0,0.5px) rotate(0.5deg); } 52% { transform: translate(0,2.5px) rotate(2.5deg); } 54% { transform: translate(0,-1.5px) rotate(1.5deg); } 56% { transform: translate(0,2.5px) rotate(2.5deg); } 58% { transform: translate(0,0.5px) rotate(2.5deg); } 60% { transform: translate(0,2.5px) rotate(2.5deg); } 62% { transform: translate(0,-0.5px) rotate(2.5deg); } 64% { transform: translate(0,-0.5px) rotate(1.5deg); } 66% { transform: translate(0,1.5px) rotate(-0.5deg); } 68% { transform: translate(0,-1.5px) rotate(-0.5deg); } 70% { transform: translate(0,1.5px) rotate(0.5deg); } 72% { transform: translate(0,2.5px) rotate(1.5deg); } 74% { transform: translate(0,-0.5px) rotate(0.5deg); } 76% { transform: translate(0,-0.5px) rotate(2.5deg); } 78% { transform: translate(0,-0.5px) rotate(1.5deg); } 80% { transform: translate(0,1.5px) rotate(1.5deg); } 82% { transform: translate(0,-0.5px) rotate(0.5deg); } 84% { transform: translate(0,1.5px) rotate(2.5deg); } 86% { transform: translate(0,-1.5px) rotate(-1.5deg); } 88% { transform: translate(0,-0.5px) rotate(2.5deg); } 90% { transform: translate(0,2.5px) rotate(-0.5deg); } 92% { transform: translate(0,0.5px) rotate(-0.5deg); } 94% { transform: translate(0,2.5px) rotate(0.5deg); } 96% { transform: translate(0,-0.5px) rotate(1.5deg); } 98% { transform: translate(0,-1.5px) rotate(-0.5deg); } 0%,100% { transform: translate(0,0) rotate(0deg); } } /* 不要在全部标签页上展示竖排、信息流广告，以及在线用户、论坛统计 */ .TagsPage .item-forumStatisticsWidget { display: none !important; } @media screen and (max-width: 600px) { .item-forumStatisticsWidget { display: none; } } body { background-image: linear-gradient(135deg, rgba(186, 186, 186, 0.03) 0%, rgba(186, 186, 186, 0.03) 10%,rgba(133, 133, 133, 0.03) 10%, rgba(133, 133, 133, 0.03) 14%,rgba(38, 38, 38, 0.03) 14%, rgba(38, 38, 38, 0.03) 17%,rgba(93, 93, 93, 0.03) 17%, rgba(93, 93, 93, 0.03) 25%,rgba(80, 80, 80, 0.03) 25%, rgba(80, 80, 80, 0.03) 45%,rgba(239, 239, 239, 0.03) 45%, rgba(239, 239, 239, 0.03) 100%),linear-gradient(135deg, rgba(236, 236, 236, 0.03) 0%, rgba(236, 236, 236, 0.03) 47%,rgba(182, 182, 182, 0.03) 47%, rgba(182, 182, 182, 0.03) 63%,rgba(223, 223, 223, 0.03) 63%, rgba(223, 223, 223, 0.03) 81%,rgba(86, 86, 86, 0.03) 81%, rgba(86, 86, 86, 0.03) 89%,rgba(23, 23, 23, 0.03) 89%, rgba(23, 23, 23, 0.03) 90%,rgba(226, 226, 226, 0.03) 90%, rgba(226, 226, 226, 0.03) 100%),linear-gradient(45deg, rgba(52, 52, 52, 0.03) 0%, rgba(52, 52, 52, 0.03) 31%,rgba(246, 246, 246, 0.03) 31%, rgba(246, 246, 246, 0.03) 63%,rgba(188, 188, 188, 0.03) 63%, rgba(188, 188, 188, 0.03) 71%,rgba(15, 15, 15, 0.03) 71%, rgba(15, 15, 15, 0.03) 87%,rgba(127, 127, 127, 0.03) 87%, rgba(127, 127, 127, 0.03) 93%,rgba(234, 234, 234, 0.03) 93%, rgba(234, 234, 234, 0.03) 100%),linear-gradient(90deg, #ffffff,#ffffff); .CommentPost.Post--by-actor { // This sets the left border to be the same color as the forum primary. border-left: solid @config-primary-color; } .Hero { background-image: linear-gradient(135deg, #fdfcfb 0%, #e2d1c3 100%); } /* 卡片主题 */ .IndexPage .DiscussionListItem, .UserPage .DiscussionListItem, .DiscussionPage-discussion .DiscussionListItem { transition: all 0.1s; /* 动画时间 */; } @media (min-width: 991px) { .IndexPage .DiscussionList-discussions>li:not(:first-child) .DiscussionListItem:hover { /* 悬浮效果 */ transform: scale(1.01); /* 缩放 */; } } @media (min-width: 768px) { /* pc 端 */ .IndexPage .DiscussionListItem-content, .UserPage .DiscussionListItem-content, .DiscussionPage-discussion .DiscussionListItem-content { /* 首页、用户页、讨论页卡片大小、描边 */ padding-left: 80px; padding-right: 80px; padding-top: 10px; border-radius: 8px; padding-bottom: 10px; border: 1px solid #dbdfe6!important; } .IndexPage .Post.CommentPost, .UserPage .Post.CommentPost, .DiscussionPage-discussion .Post.CommentPost { margin-top: 20px; border-radius: 8px; border: 1px solid #dbdfe6 !important; } .IndexPage .DiscussionListItem-info>.item-tags, .UserPage .DiscussionListItem-info>.item-tags { top: 23px !important; } .DiscussionListItem { position: relative; margin-right: 0; padding-right: 0; padding-left: 0; margin-left: 0; border-radius: 8px; margin-top: 15px; } } @media (min-width: 768px) { .IndexPage .DiscussionListItem:hover { background-color: #fff; -webkit-box-shadow: 0px 8px 24px 3px rgba(84,102,134,0.1) !important; box-shadow: 0px 8px 24px 3px rgba(84,102,134,0.1) !important; } } /* banner */ .WelcomeHero { color: #282828; } .Hero h2 { font-size: 25px; font-weight: 700; } .Hero { box-shadow: 0px 1px 10px 0 rgba(151,158,181,0.28); background-color: #fff; margin-bottom: 15px; } /*.DiscussionHero .TagsLabel .TagLabel { color: #4D698E; }*/ .WelcomeHero .Hero-subtitle { color: #000; } } /* 固定左侧标签栏 */ @media (min-width: 992px) { .sideNav, .sideNav>ul { width: 190px; position: sticky; top: 80px; } .App { overflow-x: visible; } /* 版块页不受影响 */ .CategoriesPage.TagsPage .sideNav, .CategoriesPage.TagsPage .sideNav>ul { position: unset; } /* 标签页不受影响 */ .TagsPage.TagsPage .sideNav, .TagsPage.TagsPage .sideNav>ul { position: unset; } } /*右上角楼主*/ div.PostStream-item[data-index="0"] article.CommentPost.Post.Post--by-start-user header.Post-header ul:not(ul.PostUser-badges.badges):after { content: "楼主"; background: #F05D1D; padding: 1px 10px 0px; color: white; border-radius: 4px; font-size: 14px; float: right; } /*沙发*/ div.PostStream-item[data-index="1"] article.CommentPost.Post header.Post-header ul:not(ul.PostUser-badges.badges)::after { content: "沙发"; background: #f947c8; padding: 1px 10px 0px; color: white; border-radius: 4px; font-size: 14px; float: right; } /*板凳*/ div.PostStream-item[data-index="2"] article.CommentPost.Post header.Post-header ul:not(ul.PostUser-badges.badges)::after { content: "板凳"; background: #db45fb; padding: 1px 10px 0px; color: white; border-radius: 4px; font-size: 14px; float: right; } /*地板*/ div.PostStream-item[data-index="3"] article.CommentPost.Post header.Post-header ul:not(ul.PostUser-badges.badges)::after { content: "地板"; background: #2a92f4; padding: 1px 10px 0px; color: white; border-radius: 4px; font-size: 14px; float: right; } /* 不要在分区版块上显示论坛统计、在线会员、地球 */ .CategoriesPage.TagsPage .item-forumStatisticsWidget, .CategoriesPage.TagsPage .item-onlineUsers, .CategoriesPage.TagsPage .item-flagrow-ad { display: none !important; } .TagsPage .OnlineUsers { display: none; } @media (max-width: 721px) { .OnlineUsers { display: none; } } if(window.hljsLoader && !document.currentScript.parentNode.hasAttribute('data-s9e-livepreview-onupdate')) { window.hljsLoader.highlightBlocks(document.currentScript.parentNode); }

ink 非常感谢您的回复和分享，还想请教一下。是不是还需要的主题插件控制横板？

okccn 不需要的，复制上面那个代码，到网站后台的外观里，拉到最下面有个自定义样式，把代码粘贴进去，点击保存就可以

ink 就是这个标题的背景，在未使用您这个模板之前，是随着标签的背景颜色的，使用之后就不变了，好像。

你的主题好看，能分享下吗？

ceshi123

ink

大佬，主页有一点小bug，麻烦大佬看看gif动画，我录下过程了。

Image description

WuLoos

ink 您好，这个主题，帖子阅读页，帖子标题的背景在哪里修改？谢谢！

ink

WuLoos 😅不明白

WuLoos

ink Image description

就是这个标题的背景，在未使用您这个模板之前，是随着标签的背景颜色的，使用之后就不变了，好像。

ink

是的，这是我设置的

WuLoos

ink 是的，我想知道这个背景在哪里改呢？多谢哈。

ink

.Hero {
background-image: linear-gradient(135deg, #fdfcfb 0%, #e2d1c3 100%);
修改。不用删除这行即可

WuLoos

ink 好的，多谢多谢。

WuLoos

ink 把这个删除后，之前的帖子标题背景变成一片白了。晕。

ink

WuLoos 刷新，清楚缓存

ink

能发发网址吗？

WuLoos

ink 私信你了。

witchsman

大佬，，我把代码都复制之后，发现有个问题，就是文字的颜色是那种白色，然后加上背景颜色衬托，就更加看不清了，我想修改文字颜色变成深色一点，比如黑色，蓝色之类的，但在这里代码里没找到修改文字颜色相关的地方，然后我尝试把带有#的颜色代码，修改了下，几乎都是背景啊或者别的之类的，唯独这字体不知道在哪，麻烦请告知