typecho移植版hexo主题Stellar简介

kuhehe.vip发布页 4K影视每日更新

本主题由酷小呵亲自移植，功能目前正在完善中！

简单介绍一下酷小呵移植的这个Stellar主题吧！

Typecho移植版Stellar主题

多级标题测试

这里不能没内容

哈哈

哦哦哦吗😶🙃😞😊😌😁😝😚😛😑😞😙😛😉

标题不能完全一样

鹅鹅鹅

轻轻松松

挺无语4

咯咯

短代码标签

都挺好看的

tab分栏标签

不会弄，有大佬愿意帮我看看吗

[tab]
[nav 这是本分栏的第一个小分栏标题]
这是第一个小分栏内容
[nav 这是本分栏的第2个小分栏标题]
这是第2个小分栏内容
等等，这里重复上述：
从前往后，按顺序分别是第1，2，3，等等个小分栏
[/tab]

mark标签

默认展开

绿色紫色蓝色橙色黄色青色亮色暗色警告色错误色红色默认

hashtag标签

默认展开

蓝色红色橙色绿色默认黄色青色亮暗色警告色错误
目前并未打算公开，因为还有好多功能没实现，和很多bug，所以觉得我移植的不错的话，可以评论支持一下！
哈哈，不支持嵌套😭中间不能加换行😭

哈哈哈哈，换行可以用br标签，哈哈哈🙄
不能放：引用blockquote、 哈哈

诗词标签

游山西村

陆游

莫笑农家腊酒浑，丰年留客足鸡豚。
山重水复疑无路，柳暗花明又一村。
箫鼓追随春社近，衣冠简朴古风存。
从今若许闲乘月，拄杖无时夜叩门。

卷轴标签

滕王阁序

王勃

时维九月，序属三秋。
潦水尽而寒潭清，烟光凝而暮山紫。
俨骖騑于上路，访风景于崇阿。
临帝子之长洲，得天人之旧馆。
层峦耸翠，上出重霄；
飞阁流丹，下临无地。
鹤汀凫渚，穷岛屿之萦回；
桂殿兰宫，即冈峦之体势。

九重日

按钮标签

标题哈哈哈

下载提示主页提示提示
 标题

点击复制

前缀

哦

psw密码隐藏标签

哈哈哈哦哦哦，嗯嗯嗯哈哈哈哈哈哦哦哦，嗯嗯嗯

键盘 Ctrl
波浪线哈哈哈哈哈
着重号哈哈哈哦哦哦，嗯嗯嗯
下划线哈哈哈哦哦哦，嗯嗯嗯

模糊隐藏哦

可以在文章编辑页加入到头部代码，可以自定义此文章的部分css，比如自定义文章字体，就像本文

这是提示

真不错 哈哈哈

哈哈哈哈哈
哈哈哈哈

测试一下

note标签

这是提示

不能和密码短代码并用 加粗文字
哈哈哈，谢谢密码

这是提示

不能和密码短代码并用 加粗文字
哈哈哈，谢谢密码

这是提示

不能和密码短代码并用 加粗文字
哈哈哈，谢谢密码

这是提示

哈哈哈哈
测试 哈
墨墨哦哦哦

哈哈哈

fold折叠标签

默认折叠

折叠标签里不能写md语法的代码块
哈哈哈
<div style="font-weight:bold" class="title">
 前言 </div>

默认展开

这里是折叠框展开后的内容

折叠

这里是折叠框展开后的内容
这里是折叠框展开后的内容这个是嵌套在内部的

展开，不可嵌套加密短代码

哈哈哈

折叠

相同fold短代码不可嵌套，唉！

折叠

哈哈哈

哦哦哦
蓝色

展开

加粗文字 绿色

此处内容已隐藏，需要评论回复后（审核通过）刷新一下，方可阅读

用法：

[\fold summary:展开 color:cyan open]
哈哈哈
[\/fold]

[\fold summary:折叠 color:red]
这里是折叠框展开后的内容
[\/fold]

你好
哈哈哈

文章置顶功能

置顶文章在每个分页都会显示

站内搜索功能

点击最右下角按钮，你可以看到一个搜索框，输入关键词即可，切记不要回车，因为搜索内容会直接显示在下方！回车后页面很难看！😭😭😭还不会弄

Latex公式支持

$$ \begin{align*} y = y(x,t) &= A e^{i\theta} \\ &= A (\cos \theta + i \sin \theta) \\ &= A (\cos(kx - \omega t) + i \sin(kx - \omega t)) \\ &= A\cos(kx - \omega t) + i A\sin(kx - \omega t) \\ &= A\cos \Big(\frac{2\pi}{\lambda}x - \frac{2\pi v}{\lambda} t \Big) + i A\sin \Big(\frac{2\pi}{\lambda}x - \frac{2\pi v}{\lambda} t \Big) \\ &= A\cos \frac{2\pi}{\lambda} (x - v t) + i A\sin \frac{2\pi}{\lambda} (x - v t) \end{align*} $$

$$ \begin{bmatrix} a & b \\ c & d \end{bmatrix} $$

$L_1=3x^2+2x+1+3x^2+2x+1-3x^2+2x+1+3x^2+2x+1z3x^2+2x+1$ 哈哈哈

$\overleftrightarrow{AB}$

评论可见功能

评论可见

此处内容已隐藏，需要评论回复后（审核通过）刷新一下，方可阅读

note嵌套hide测试

此处内容已隐藏，需要评论回复后（审核通过）刷新一下，方可阅读

代码

由于短代码解析问题，下方所有@删掉就是原代码了
**评论可见**
[@hide] **↓ 此区域为隐藏资源 ↓**
[@mark color:green]绿色[@/mark] [@hashtag color:blue]蓝色[@/hashtag]
这里评论才可看到哦
<br>用br标签换行，不会影响字体大小？
**↑ 此区域为隐藏资源 ↑**
[@/hide]

使用部分加密插件

此内容被加密

加密【获取密码】

请输入密码,回车查看

👇密码456，不能放超链接

获取密码

请输入密码,回车查看

此处内容已隐藏，需要评论回复后（审核通过）刷新一下，方可阅读

内置表格搜索功能

下方搜索框，可搜索整个页面中所有md表格内容，不信就试一下🙃

动漫	链接
仙逆 4K	https://pan.quark.cn/s/48817de911a8
沧元图第二季4K	https://pan.quark.cn/s/59a403f5dd24
绝代双骄之天外有天	https://pan.quark.cn/s/6ddf30a9af2e

表格搜索框短代码写法：
[\searchtb]
去掉上方的 \ 就是该短代码写法

// 文本部分
不需要密码的内容

[@ppblock ex="测试"]
需要密码的内容 A，id = 0
[/ppblock]

不需要密码的内容

[@ppblock pwd="喵"]
需要密码的内容 B，id = 1
[/ppblock]

不需要密码的内容

[@ppblock ex="给我密码"]
需要密码的内容 C，id = 2
[/ppblock]

不需要密码的内容

------------------------分割线---------------------------

// 配置部分
{
    "0": "654321",
    "喵": "miao~",
    "2": "000000"
}

正则表达式替换后输出目录content内容
<div id=\"tableOfContents\">{$toc_out}</div>

文章编辑页显示

文章主页封面类型
- 1、无图模式
- 2、半图模式
- 3、大图模式
文章编辑页
- 可以设置文章头图or不设置
- 😬不想介绍了自己看吧！
评论区回复邮箱通知，可以用下面这个插件
https://github.com/jrotty/CommentNotifier

文章编辑页
图片太长，先不放了
主题设置页
图片太长，先不放了

每篇文章都可插入css

通过此功能，可实现：自定义每篇文章的字体
比如👇👇下方代码，可实现本文章字体

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/bofeng/hyksk_webfont/dist/hyksk.css" />
<style>
body {font-family:hyksk}
</style>

有衬线字体

<style>
body{font-family:Serif}
</style>

总之，可插入任意css、js标签！

缺点增加页面加载时间，加载速度变慢，所以此功能可以忽略

代码高亮功能

必须手动填写代码名称，才会被高亮，否则不行

<script src="<?php $this->options->themeUrl('js/ssbg.js'); ?>"></script>

哈哈哈哈哈

哈哈哈哈哈

哈哈哈哈哈

哈哈哈哈哈

哈哈哈哈哈

哈哈哈哈哈

哈哈哈哈哈

哈哈哈哈
墨墨

嗯嗯嗯嗯嗯嗯嗯嗯嗯嗯
哈哈哈哈哈哈哈哈哈哈哈或者是

.wrap {
width: 100%;
height: 100%;
position: absolute;
top: -8px;
left: 8px;
overflow: hidden;
font-size: 17px;
font-weight: 400;
color: #fff;
opacity: 0.5;
-webkit-transition: .3s ease all;
-moz-transition: .3s ease all;
-ms-transition: .3s ease all;
-o-transition: .3s ease all;
transition: .3s ease all;
}
.wrap:hover {
opacity: 0.9;
}
.wraps {
display: inline-block;
text-align: center;
width: 200px;
height: 30px;
line-height: 27px;
position: absolute;
top: 30px;
right: -50px;
z-index: 2;
overflow: hidden;
transform: rotate(45deg);
-ms-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
-o-transform: rotate(45deg);
border: 1px dashed;
box-shadow: 0 0 0 1px #000, 0px 21px 5px -18px rgba(0,0,0,0.6);
background: #048e68;
}

记录

文章创建时间

<?php $this->date('Y-m-d'); ?>

编辑时间

<?php echo date('Y-m-d H:i:s' , $this->modified); ?>

typecho 文章发布时间语义化显示多少分钟多少小时前

functions.php 文件添加下面代码

function t_ago($v) {
    $t = time() - $v;
    if ($t < 60) {
        return $t . ' seconds ago';//文字可以自己修改想要的 秒前
    } elseif ($t < 3600) {
        return floor($t / 60) .' minutes ago';//分钟前
    } elseif ($t < 86400) {
        return floor($t / 3670) .' hours ago';//小时前
    } elseif ($t < 604800) {
        return floor($t / 86400) .' days ago';//天前
    } elseif ($t < 2419200) {
        return floor($t / 604800) .' weeks ago';//周前
    } elseif ($t < 31536000 ) {
        return floor($t / 2592000 ).' months ago';//月前
    } 
    return floor($t / 31536000 ).' years ago';//年前
}

主题调用方法👇👇：显示为创建时间

<?php echo t_ago($this->created);?>

在需要显示时间的地方填入上面代码
效果见本文章顶部面包屑导航

旧的分页CSS样式

**Typecho分页 itbulu.com */
.page-navigator {
  list-style: none;margin: 25px 0;padding: 0;text-align: center;}
.page-navigator li {
  display: inline-block;
  PADDING-RIGHT: 3px; PADDING-LEFT: 3px; PADDING-BOTTOM: 3px; MARGIN: 3px; PADDING-TOP: 3px; TEXT-ALIGN: center; 
}

.page-navigator a {
  BORDER-RIGHT: var(--text) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: var(--text) 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; MARGIN: 2px; BORDER-LEFT: var(--text) 1px solid; COLOR: #036cb4; PADDING-TOP: 2px; BORDER-BOTTOM: var(--text) 1px solid; border-radius: 10px;
}
.page-navigator a:hover {
  BORDER-RIGHT: #999 1px solid; BORDER-TOP: #999 1px solid; BORDER-LEFT: #999 1px solid; COLOR: #666; BORDER-BOTTOM: #999 1px solid;
}
.page-navigator a:active {
  BORDER-RIGHT: #999 1px solid; BORDER-TOP: #999 1px solid; BORDER-LEFT: #999 1px solid; COLOR: #666; BORDER-BOTTOM: #999 1px solid;
}
.page-navigator .current a {
  BORDER-RIGHT: #036cb4 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #036cb4 1px solid; PADDING-LEFT: 5px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; MARGIN: 2px; BORDER-LEFT: #036cb4 1px solid; COLOR: #fff; PADDING-TOP: 2px; BORDER-BOTTOM: #036cb4 1px solid; BACKGROUND-COLOR: #036cb4; border-radius: 10px;
}

新的分页样式

.page-navigator {
  list-style: none;
  margin: 1rem 0 0 0;
  display: center;
  gap: 0.5rem;
  place-content: end;
}

.page-navigator li a {
  display: block;
  text-decoration: none;
  width: 32px;
  height: 32px;
  line-height: 32px;
  color: #6c757d;
  border-radius: 4px;
  background-color: #fff;
  text-align: center;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease-in-out;
}

.page-navigator li.current a,
.page-navigator li a:hover {
  background-color: #212529;
  color: #fff;
}

我改成下面了

.page-navigator {
  list-style: none!important;
  margin: 1rem 0 0 0!important;
  display: flex!important;
  gap: 0.5rem;
  place-content: center!important;
}


.page-navigator li a {
  display: block!important;
  text-decoration: none!important;
  width: auto!important;
  min-width: 32px!important;
  height: 32px!important;
  line-height: 32px!important;
  color: var(--text)!important;
  border-radius: 4px!important;
  background: var(--card)!important;
  text-align: center!important;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.1)!important;
  transition: all 0.3s ease-in-out!important;
}

.page-navigator li.current a {
  display: block!important;
  text-decoration: none!important;
  width: auto!important;
  min-width: 32px!important;
  height: 32px!important;
  line-height: 32px!important;
  color: var(--text)!important;
  font-weight: bold;
  border-radius: 4px!important;
  background-color: #40E0D0!important;
  text-align: center!important;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.1)!important;
  transition: all 0.3s ease-in-out!important;
}

.page-navigator li a:hover {
background-color: var(--block)!important;
font-weight: bold;
transition: all 0.3s ease-in-out!important;
}

评论区删掉的几个lable

<label style="color:var(--text)">昵称</label>
<label style="color:var(--text)">邮箱-有通知</label>
<label style="color:var(--text);color:var(--text)">网站</label>

用来当置顶按钮的代码

<i style='color:#00f2ff' class='fas fa-paw'></i>

guidang.php内容记录

<?php
/**
 * 归档模板
 *
 * @package custom
 *
 */
if (!defined('__TYPECHO_ROOT_DIR__')) exit; 


?>
<?php $this->need('header.php'); ?>

<header class="header mobile-only"><div class="logo-wrap"><a class="avatar" href="/"><div class="bg" style="opacity:0;background-image:url(https://gcore.jsdelivr.net/gh/cdn-x/placeholder@1.0.12/avatar/round/rainbow64@3x.webp);"></div><img no-lazy="" class="avatar lazy" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAAaADAAQAAAABAAAAAQAAAADa6r/EAAAAC0lEQVQIHWNgAAIAAAUAAY27m/MAAAAASUVORK5CYII=" data-src="<?php $this->options->logo(); ?>"></a><a class="title" href="/"><div class="main" ff="title"><?php $this->options->name(); ?></div><div class="sub normal cap"><?php $this->options->logotxt1(); ?></div><div class="sub hover cap" style="opacity:0"><?php $this->options->logotxt2(); ?></div></a></div></header>


<?php $this->need('sidebar.php'); ?>


<div class="post-list archives">

<?php $this->content(); ?>

<article class="" id="archive">

<center>
<div class="archive-header h4"><?php Typecho_Widget::widget('Widget_Stat')->to($stat); ?>
共 <?php $stat->publishedPostsNum() ?> 篇
</div>
</center>

<?php
    Typecho_Widget::widget('Widget_Contents_Post_Recent', 'pageSize='.
    Typecho_Widget::widget('Widget_Stat')->publishedPostsNum)->to($archives);
    $date_y=0;$date_m=0;$output = '';$huan=0;
    while($archives->next()){
      $date_t = explode(",", date('Y,m,d', $archives->created));
      if($date_y > $date_t[0]){
        $date_m  = 0;
        $article_nums[] = $article_num;
        $output .= '';
      }
      if($date_y != $date_t[0]){
        $date_y  = $date_t[0];$article_num=0;
        $article_flag[] = $tmp_flag = 'archives_'.$huan++;
        $output .= '<div class="archive-header h4">🍎'.$date_y.' <span style="font-size:10px">×'. $tmp_flag .'</span></div>';
      }
      $output .= '<div class="archive-list"><a class="post fs14" href="'.$archives->permalink.'"><time>'.$date_t[1].'.'.$date_t[2].'</time>'.$archives->title.'&nbsp<span style="font-size:8px">'.$archives->commentsNum.'</span></a></div>';
      $article_num++;
    }
    $article_nums[] = $article_num;
    $output .= '';
    echo str_replace($article_flag, $article_nums, $output);
  ?>

<br>
<br>
<div class="archive-header h4">⏰时间线模式</div>

<div class="tag-plugin timeline ds-fcircle">
<?php while($archives->next()): ?>
 <div class="timenode"> 
 <div class="header"> 
 <div class="user-info">
 <img src="<?php $this->options->logoUrl(); ?>" onerror="javascript:this.src='https://gcore.jsdelivr.net/gh/cdn-x/placeholder@1.0.12/avatar/round/3442075.svg';"></img>

 <span style="font-weight:bold;"><?php $archives->date('Y-m-d'); ?></span>
 </div>
 <span><?php $archives->category(',', false); ?>
<?php Postviews($archives); ?></span>
 </div>
 <a style="color:var(--text)" class="body" href="<?php $archives->permalink() ?>" target="_blank" rel="external nofollow noopener noreferrer"><?php $archives->title() ?></a>
 </div>
 <?php endwhile; ?>
 
</div>

</article>
</div>
<?php $this->need('footer.php'); ?>

之前设置的pre和code的css代码

pre, code { 
  background: var(--block);
  font-family: Menlo, Monaco, Consolas, "Lucida Console", "Courier New", monospace;
  font-size: .92857em;
  
}
code {
padding: 2px 4px; 
color: #B94A48; 
}
pre {
  border-radius: 15px;
  border: var(--text-meta) dotted 1px;
  padding: 8px;
  overflow: auto;
  max-height: 400px;

}
pre code {
  padding: 3px;
  color: var(--text);
}

迷幻紫

西瓜红

天空之境

小太阳

小宇宙

橄榄绿

优雅紫

深邃黑

无边框

原来archives输出文章使用的代码记录一下

<?php $this->need('article.php'); ?>

旧的广告代码css记录

.tp-ad-text1 {width:100%;padding-top:6px;box-sizing:border-box;overflow: hidden;}
.tp-ad-text1 a {color:#7fba00;font-size:14px;font-weight: bold;line-height:38px;text-align:center;border:2px dashed rgba(200,200,200,.5);border-radius: 5px;padding:0 3px;box-sizing:border-box;float:left;width:24%;height:38px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0 0.5% 6px;text-decoration:none;background-image: none;}
.tp-ad-text1 a:hover {font-weight: bold;color:#fff!important;background:#7fba00;}
.tp-ad-text1 a:nth-child(2n) {color:#f74e1e;}
.tp-ad-text1 a:nth-child(2n):hover {background:#f74e1e;border-color: #f74e1e;}
.tp-ad-text1 a:nth-child(3n) {color:#00a4ef;}
.tp-ad-text1 a:nth-child(3n):hover {background:#00a4ef;border-color: #00a4ef;}
.tp-ad-text1 a:nth-child(4n) {color:#0517c2;}
.tp-ad-text1 a:nth-child(4n):hover {background:#0517c2;border-color: #0517c2;}
.tp-ad-text1 a:nth-child(5n) {color:#0517c2;}
.tp-ad-text1 a:nth-child(5n):hover {background:#0517c2;border-color: #0517c2;}
.tp-ad-text1 a:nth-child(6n) {color:#00a4ef;}
.tp-ad-text1 a:nth-child(6n):hover {background:#00a4ef;border-color: #00a4ef;}
.tp-ad-text1 a:nth-child(7n) {color:#f74e1e;}
.tp-ad-text1 a:nth-child(7n):hover {background:#f74e1e;border-color: #f74e1e;}
.tp-ad-text1 a:nth-child(8n) {color:#7fba00;}
.tp-ad-text1 a:nth-child(8n):hover {background:#7fba00;border-color: #7fba00;}
@media screen and (max-width: 1198px){
    .tp-ad-text1 a{
        width: 48%;
    }
}

目前新的广告css代码

.tp-ad-text1 {
    width: 100%;
    padding-top: 6px;
    box-sizing: border-box;
    overflow: hidden;
}

.tp-ad-text1 a {
    color: #7fba00;
    font-size: 14px;
    
    line-height: 38px;
    text-align: center;
    border: 1px dashed rgba(66,184,130,1.00);
    border-radius: 5px;
    padding: 0 3px;
    box-sizing: border-box;
    float: left;
    width: 24%;
    height: 38px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin: 0 0.5% 6px;
    text-decoration: none;
    background-image: none;
    transition: all 0.1s;  /* 添加过渡效果，0.8 秒内完成所有属性的变化 */
}

.tp-ad-text1 a:hover {
    font-weight: bold;
    color: #fff!important;
    background: #7fba00;
}

.tp-ad-text1 a:nth-child(2n) {
    color: #f74e1e;
}

.tp-ad-text1 a:nth-child(2n):hover {
    background: #f74e1e;
    border-color: #f74e1e;
}

.tp-ad-text1 a:nth-child(3n) {
    color: #00a4ef;
}

.tp-ad-text1 a:nth-child(3n):hover {
    background: #00a4ef;
    border-color: #00a4ef;
}

.tp-ad-text1 a:nth-child(4n) {
    color: #0517c2;
}

.tp-ad-text1 a:nth-child(4n):hover {
    background: #0517c2;
    border-color: #0517c2;
}

.tp-ad-text1 a:nth-child(5n) {
    color: #0517c2;
}

.tp-ad-text1 a:nth-child(5n):hover {
    background: #0517c2;
    border-color: #0517c2;
}

.tp-ad-text1 a:nth-child(6n) {
    color: #00a4ef;
}

.tp-ad-text1 a:nth-child(6n):hover {
    background: #00a4ef;
    border-color: #00a4ef;
}

.tp-ad-text1 a:nth-child(7n) {
    color: #f74e1e;
}

.tp-ad-text1 a:nth-child(7n):hover {
    background: #f74e1e;
    border-color: #f74e1e;
}

.tp-ad-text1 a:nth-child(8n) {
    color: #7fba00;
}

.tp-ad-text1 a:nth-child(8n):hover {
    background: #7fba00;
    border-color: #7fba00;
}

@media screen and (max-width: 1198px) {
  .tp-ad-text1 a {
        width: 48%;
        transition: all 0.8s;  /* 在媒体查询中也添加过渡效果 */
    }
}

弃用的2个自定义字段输出代码记录

<?php if (is_array($this->options->sidebarBlock) && in_array('Showhuanying2', $this->options->sidebarBlock)): ?>

<widget class="widget-wrapper markdown"><div class="widget-header dis-select"><span class="name">🍃右侧公告</span></div><div class="widget-body fs14">
<?php $this->options->右侧欢迎语(); ?>
</div></widget>
<?php endif; ?>


<?php if (is_array($this->options->sidebarBlock) && in_array('Showrightbutton', $this->options->sidebarBlock)): ?>
<widget class="widget-wrapper linklist"><div class="widget-body fs14">
<div class="linklist center" style="grid-template-columns:repeat(2,1fr);">
<?php $this->options->右侧按钮(); ?>
</div></div></widget>
<?php endif; ?>

functions.php文件里删除的判断语句，来自“LeftWelcome左侧栏欢迎函数”

if (is_array($options->sidebarBlock) && in_array('Showhuanying1', $options->sidebarBlock)) {
这里是内容
}

动态变化背景颜色

body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -520;
    pointer-events: none;
}
body::before {
    background: linear-gradient( 90deg, rgba(247, 149, 51, .1), rgba(243, 112, 85, .1) 15%, rgba(239, 78, 123, .1) 30%, rgba(161, 102, 171, .1) 44%, rgba(80, 115, 184, .1) 58%, rgba(16, 152, 173, .1) 72%, rgba(7, 179, 155, .1) 86%, rgba(109, 186, 130, .1)); /*背景颜色*/
    background-size: 500%;
    animation: bgAnimation 15s linear infinite; /*执行动画*/
}
@keyframes bgAnimation{
    0%{
        background-position: 0% 50%;
    }
    50%{
        background-position: 100% 50%;
    }
    100%{
        background-position: 0% 50%;
    }
}

文章banner背景颜色设置无色

style="background:var(--background);"

typecho 博客

测试

不错哦

这样哈哈哈，真不错哈哈哈哈哈
图片前面的字，最好不要和图片写同一行！
哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈，哈哈哈
哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈
哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈
使用 Ctrl+Alt+Del 重启电脑

👍👍👍👍

谢谢

酷小呵博主
2024/12/15 16:56:43 回复

@金毛狗
收到邮箱通知😀😀回复你一下🙃欢迎来访

金毛狗游客
2024/12/18 18:07:16 回复

@酷小呵
你好，请问网站的友链在哪

金毛狗游客
2024/12/18 18:10:43 回复

@金毛狗
就是友情链接

酷小呵博主
2024/12/18 18:23:32

@金毛狗
友情链接页面，我还没弄呢！
啥时候弄好了，再通知你吧！

测试隐藏

隐藏内容

谢谢大佬，看看隐藏内容

测试验证码

typecho移植版hexo主题Stellar简介

多级标题测试

哈哈

标题不能完全一样

轻轻松松

挺无语4

短代码标签

tab分栏标签

mark标签

hashtag标签

诗词标签

卷轴标签

按钮标签

点击复制

psw密码隐藏标签

note标签

fold折叠标签

文章置顶功能

站内搜索功能

Latex公式支持

评论可见功能

使用部分加密插件

内置表格搜索功能

文章编辑页显示

每篇文章都可插入css

代码高亮功能

记录

旧的分页CSS样式

已有 60 条评论