微光云创 微光云创
首页
  • 初衷与诞生
  • 介绍
  • 名词解释
  • 项目案例
  • 优质源码
  • 脚本程序
  • 专享API
  • 引流实战
  • 引流经验分享
  • 自热SOP
  • 投流案例实操
  • 变现方案及思路
  • 资源共享
问题答疑
首页
  • 初衷与诞生
  • 介绍
  • 名词解释
  • 项目案例
  • 优质源码
  • 脚本程序
  • 专享API
  • 引流实战
  • 引流经验分享
  • 自热SOP
  • 投流案例实操
  • 变现方案及思路
  • 资源共享
问题答疑
  • 指南

    • 主题初衷与诞生
    • 介绍
    • 快速上手
    • 目录结构
    • 构建结构化站点的核心配置和约定
    • 自动生成front matter
    • Markdown 容器
    • Markdown 中使用组件
  • 配置

    • 主题配置
    • 首页配置
    • front matter配置
    • 目录页配置
    • 添加摘要
    • 修改主题颜色和样式
    • 评论栏
  • 相关文章

    • 使目录栏支持h2~h6标题
    • 如何让你的笔记更有表现力
    • 批量操作front matter工具
    • 部署
    • 关于写文章和一级标题
    • 关于博客搭建与管理
    • 在线编辑和新增文章的方法
    • 资源

添加摘要

文章摘要会显示于首页的详细版文章列表中,在编写文章时(.md文件中)在合适的位置添加一个<!-- more -->注释。注释前面的内容将会暴露在摘要中。

示例:

# 如何根据系统主题自动响应CSS深色模式

![Dark](https://jsd.cdn.zzko.cn/gh/xugaoyi/image_store/blog/20200427163531.jpg)

很多人喜欢选择APP或网站中的深色模式,也许他们更喜欢这样的外观,或者他们想让自己的眼睛免受疲劳。这篇文章将告诉你如何在网站中实现一个自动的CSS深色模式,根据访客的系统主题来自动响应。

<!-- more -->

## CSS 深色模式 (Dark Mode)

...

如示例的内容,在<!-- more -->注释前面的除了标题之外所有内容将显示到摘要中。摘要在文章列表的显示效果如下:

值得注意的是摘要的内容也是文章内容的一部分,会显示在文章详情页中。

目录页配置
修改主题颜色和样式

← 目录页配置 修改主题颜色和样式→

Theme by Vdoing | Copyright © 2024-2025 北京微光云创科技有限公司
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式