【可可】资源素材库下载中心插件PC端辅助样式全局样式首页辅助样式列表页辅助样式素材内容页辅助样式等UI美化分享

admin · 发表于 2024-2-5 14:24:12

马上注册，免费下载更多dz插件网资源。

您需要登录才可以下载或查看，没有账号？立即注册

×

【可可】资源素材库下载中心插件PC端辅助样式全局样式首页辅助样式列表页辅助样式素材内容页辅助样式等UI美化分享：
参考效果：https://down.dz-x.net/
图示：（还有更多美化空间，期待各位建站站长跟帖分享~）

【可可】资源素材库下载中心插件PC端辅助样式全局样式首页辅助样式列表页辅助样式素材内容页辅助样式等UI美化分享可可,素材,下载,文库,文档

细节一：分类文字流光溢彩彩色文字效果：
细节二：标题颜色效果：
细节三：翻页效果
细节四：搜索框效果
细节五：搜索框输入文字效果
……
更多参考来自优秀站长案例库的运营站点提供：https://www.dz-x.net/web.html#3
下面是实操样式代码：[懒人们请在下面给出的参考样式基础上自由发挥扩展，请不要一味照抄！]
后台 —— 【可可】资源素材库 —— 高级设置 —— PC端辅助样式：
【可可】资源素材库下载中心插件PC端辅助样式全局样式首页辅助样式列表页辅助样式素材内容页辅助样式等UI美化分享可可,素材,下载,文库,文档

全局样式分享:

游客，如果您要查看本帖隐藏内容请回复

首页辅助样式分享:

游客，如果您要查看本帖隐藏内容请回复

列表页辅助样式分享:

.menu-light .selected a, .order_right {

background: #f60 !important;

}

.orderbox li.selected a {

background: #ffe1de !important;

color: #f60 !important;

}

.pg a, .pg strong, .pgb a, .pg label {

float: left;

width: 32px;

margin-left: 8px;

padding: 0;

height: 32px;

line-height: 32px;

color: #AAAAAA;

border: 1px solid #DDDDDD;

font-size: 14px;

border-radius: 50%;

box-shadow: none;

text-align: center;

font-family: "Helvetica Neue",Arial,"Hiragino Sans GB","STHeiti","Microsoft Yahei","SimSun","WenQuanYi Micro Hei",sans-serif;

cursor: pointer;

overflow: hidden;

background-color: #FFFFFF;

}

.pg a.nxt {

color: transparent;

padding: 0;

text-indent: -9999px;

background: url(https://www.kekebang.fun/template/win8mi_19th_picture/src/page2.png) no-repeat center center #FFFFFF;

}
复制代码

素材内容页辅助样式分享:

游客，如果您要查看本帖隐藏内容请回复

软件内容页辅助样式分享:
***付费内容***

用户主页辅助样式分享:
***付费内容***

我的辅助样式分享:
***付费内容***

该教程适用于：
【可可】素材资源库 (keke_down)
https://down.dz-x.net/app-item-1.html

【可可】文档文库 (keke_doc)
https://down.dz-x.net/app-item-76.html

[可可]视频点播直播网校 (keke_video_base)
https://down.dz-x.net/app-item-14.html

剩余 3%% 内容需要支付 0.50元后可完整阅读

付费阅读开通会员

支持付费阅读，激励作者创作更好的作品

已有5人购买阅读

©DZ插件网所发布的一切资源仅限用于学习和研究目的；不得将上述内容用于商业或者非法用途，否则，一切后果请用户自负。
网站部分内容来源于网络，版权争议与本站无关。您必须在下载后的24个小时之内，从您的电脑中彻底删除上述内容。如果您喜欢该程序，请支持正版软件，得到更好的正版服务。
您在本站任何的赞助购买、下载、查阅、回复等行为等均表示接受并同意签订《DZ插件网免责声明协议》。
如有侵权请邮件与我们联系处理: discuzaddons@vip.qq.com 并出示相关证明以便删除。敬请谅解！

joqcfjjy · 发表于 2024-2-5 16:35:28

好好，我学习学习

yusr · 发表于 2024-2-5 19:16:42

收藏带走，万一哪天用上了呢

惧愁人 · 发表于 2024-2-6 09:33:19

正愁默认样式好丑~

机器人GPT-AI · 发表于 2024-2-15 20:19:32

非常感谢您提供的样式分享！根据您提供的代码片段，我会逐个解释每个样式的作用并给出相关的解决方法。

1. 全局样式分享：
- .searchArea-container .search-input 样式用于设置搜索输入框的宽度、高度、边框圆角和背景颜色等。
- .list-title 样式用于设置列表标题的颜色。
- .pg strong, .card, .card .o, div.exfm 样式用于设置分页按钮、卡片和div元素的文本颜色、字体粗细和背景颜色等。

2. 首页辅助样式分享：
- .active .nav-link, .index-topnav-right 样式用于设置导航链接和顶部右侧区域的背景颜色等。
- .nav-link 样式用于设置导航链接的渐变背景色和动画效果。

3. 列表页辅助样式分享：
- .menu-light .selected a, .order_right 样式用于设置选中菜单项和.order_right元素的背景颜色等。
- .orderbox li.selected a 样式用于设置选中订单盒子内的链接的背景颜色和字体颜色等。
- .pg a, .pg strong, .pgb a, .pg label 样式用于设置分页链接和标签的浮动、宽度、边距、颜色等。
- .pg a.nxt 样式用于设置下一页按钮的背景图片。

4. 素材内容页辅助样式分享：
- .btn-right 样式用于设置右浮动按钮的宽度、背景渐变色和文本颜色等。
- .img-info 样式用于设置图片信息区域的边框圆角、内外边距、宽度、边框样式和背景色等。
- .title-detail 样式用于设置标题详情的渐变背景色和动画效果。
- .tagBox .tag-list a 样式用于设置标签列表中的a链接的渐变背景色和动画效果。

5. 软件内容页辅助样式分享：
- 参入度继续分享的样式未提供具体代码，您可以补充完整的样式代码。

6. 用户主页辅助样式分享：
- 参入度继续分享的样式未提供具体代码，您可以补充完整的样式代码。

7. 我的辅助样式分享：
- 参入度继续分享的样式未提供具体代码，您可以补充完整的样式代码。

希望上述解答对您有所帮助，如果您有更多疑问或其他问题，请随时提问。
-- 来源：OpenAI ****GPT