标签 CSS 下的文章 - 吾爱分享资源网—全网最全最完整的网络资源发布站!
首页
壁纸
直播
统计
留言互动
友情链接
站点帮助/侵权处理
Search
1
Typecho 定时发布每天60秒读懂世界
79 阅读
2
Xiuno·Light(修罗·轻鸿)v3.3 一款不简单的修罗论坛程序主题
68 阅读
3
稀有卡牌手游【射雕三部曲之金将三界版-优化重整】最/新整理单机一键即玩镜像服务端
60 阅读
4
Typecho文章AI摘要插件 AISummary
27 阅读
5
战神引擎传奇手游【霸业沙城白猪3.1】最/新整理单机一键即玩镜像服务端+WIN系服务端
23 阅读
商业源码
网站源码
主题源码
功能插件
游戏GM端
游戏分享
游戏源码
手游
PC端
精品软件
教程笔记
投稿赚米!
新闻日报
登录
/
注册
标签搜索
网站源码
主题插件
插件
TYPECHO
CSS
JOE
美化
手游
服务端
xiuno
修罗论坛
AI
新闻
60s
传奇
战神引擎
卡牌手游
单机
PC游戏学习
PC
青帝ོ
累计撰写
14
篇文章
累计收到
5
条评论
首页
栏目
商业源码
网站源码
主题源码
功能插件
游戏GM端
游戏分享
游戏源码
手游
PC端
精品软件
教程笔记
投稿赚米!
新闻日报
页面
壁纸
直播
统计
留言互动
友情链接
站点帮助/侵权处理
用户登录
登录
注册
找到
2
篇与
CSS
相关的结果
2024-11-10
typecho——Joe美化文章列表添加渐变颜色效果
1.png图片 接下来需要编辑的文件以及相对Joe主题的文件路径: joe.index.js /Joe/assets/js joe.index.css /Joe/assets/css joe.mode.css /Joe/assets/css 开始(共三部分) **一个大气的文章列表CSS渐变动画,也可以使用图片作为渐变背景,,效果如下(鼠标移动到元素上后颜色会更加突出): 需要开启AXJA** 添加Js代码 打开joe.index.js文件找到如图所示位置 2.jpg图片 可以直接搜 joe_list__item wow default 定位到,其实一打开就是了。在第一个a标签元素后面加入如下代码: 隐藏内容,请前往内页查看详情 添加CSS代码 直接将下面的css代码复制粘贴到joe.index.css文件的最后面就行了 隐藏内容,请前往内页查看详情 其中的background可以改成图片地址,这样效果就是图片了,但图片会拖累网站加载速度,可自行决定是否要换成图片。 适配夜间模式 打开joe.mode.css文件,将以下CSS代码加入文件底部即可。 隐藏内容,请前往内页查看详情 这么简单不要问作者了
教程笔记
# CSS
# JOE
# 美化
# HTML
# JS
# 文章列表美化
青帝
一天前
1
6
0
2024-11-01
Typecho文章AI摘要插件 AISummary
f79102 插件的json模式的json变量名就是当你输入返回格式是json的时候提取文字的那个变量 例如访问https://api.qster.top/API/v1/chat/?type=json&msg= 返回格式是{ "code": 400, "problem": "", "answer": "请给出一个问题" } 那么answer这个是我们需要的内容 你就可以把返回的变量里有文字的这个变量名填上去就可以了 f0ad4e 首先下载插件到usr/plugins/目录进行解压(文件名必须是 AISummary 不然会报错) 然后在后台启用AISummary插件 接着把AI.php上传到主题的任意一个位置当然你要知道路径 等会要用(Joe再续前缘版可以上传到usr/themes/Joe/module/目录) Joe再续前缘专用AI.php - <div class="title-theme">AI摘要</div> <div class="joe_header__slideout-menu panel-b"> <?php if ($this->fields->content) :?> <div class="ai-summary-block"> <p>AI 摘要:<span class="typing-effect"><?php echo $this->fields->content;?></span></p> </div> <?php endif;?> <style> .ai-summary-block { background-color: #f5f5f5; padding: 15px; border: 1px solid #ddd; border-radius: 5px; margin-bottom: 20px; } .typing-effect { white-space: nowrap; overflow: hidden; animation: typing 2s steps(40) forwards; } @keyframes typing { from { width: 0; } to { width: 100%; } } .joe_header__slideout-menu.panel-b { overflow-y: scroll; } h2 { text-align: center; } h3 { color: black; font-size: smaller; text-align: center; } </style> <script> document.addEventListener('DOMContentLoaded', function () { const typingElements = document.querySelectorAll('.typing-effect'); typingElements.forEach(element => { element.classList.remove('typing-effect'); const text = element.textContent; element.textContent = ''; let i = 0; const typingInterval = setInterval(() => { if (i < text.length) { element.textContent += text[i]; i++; } else { clearInterval(typingInterval); } }, 50); }); }); </script> </div> <br> 通用AI.php代码 - <div class="title-theme">AI摘要</div> <div class="joe_header__slideout-menu panel-b"> <?php if ($this->fields->content) :?> <div class="ai-summary-block"> <p>AI 摘要:<span class="typing-effect"><?php echo $this->fields->content;?></span></p> </div> <?php endif;?> <style> .title-theme { position: relative; padding-left: 1.2em; font-size: 15px; color: var(--main-color); } .title-theme small { font-size: 80%; opacity: .7 } .title-theme:before { position: absolute; content: ''; width: 4px; background: var(--theme); top: 10%; left: 2px; bottom: 10%; border-radius: 5px; box-shadow: 1px 1px 3px -1px var(--theme) } .ai-summary-block { background-color: #f5f5f5; padding: 15px; border: 1px solid #ddd; border-radius: 5px; margin-bottom: 20px; } .typing-effect { white-space: nowrap; overflow: hidden; animation: typing 2s steps(40) forwards; } @keyframes typing { from { width: 0; } to { width: 100%; } } .joe_header__slideout-menu.panel-b { overflow-y: scroll; } h2 { text-align: center; } h3 { color: black; font-size: smaller; text-align: center; } </style> <script> document.addEventListener('DOMContentLoaded', function () { const typingElements = document.querySelectorAll('.typing-effect'); typingElements.forEach(element => { element.classList.remove('typing-effect'); const text = element.textContent; element.textContent = ''; let i = 0; const typingInterval = setInterval(() => { if (i < text.length) { element.textContent += text[i]; i++; } else { clearInterval(typingInterval); } }, 50); }); }); </script> </div> <br> 然后在主题的post.php里面合适的位置添加以下代码 <?php $this->need('module/AI.php'); ?>Joe再续前缘版本可以添加在post.php的第120行下面第121行 下载地址:https://wwpb.lanzouw.com/iyMBL2dw41ad 提取码: 下载地址:https://github.com/xliaoy/AISummary 提取码:
教程笔记
# CSS
# 网站源码
# 主题插件
# AI
# 插件
青帝
11月1日
0
27
0
浏览量:
👀 | 访客数:
👦