You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何用CSS修改Xaringan演示文稿缩进文本块样式?

解决Xaringan演示文稿中引用块样式修改与自定义缩进环境的问题

一、修改默认引用块(>生成)的样式

Markdown里>生成的缩进文本块,对应HTML的<blockquote>标签,直接用该选择器编写CSS就能调整间距等样式。

实现方法:

在你的Xaringan R-Markdown文档中添加<style>块(可放在YAML头下方,或引用外部CSS文件),示例代码如下:

<style>
/* 调整默认引用块的间距与样式 */
blockquote {
  margin-top: 0.5em;    /* 上方间距 */
  margin-bottom: 0.5em; /* 下方间距 */
  margin-left: 1.5em;   /* 左侧缩进量 */
  padding-left: 0.8em;  /* 内部左侧填充 */
  line-height: 1.6;     /* 行高 */
  border-left: 3px solid #666; /* 可选:左侧添加分隔边框 */
}
</style>

二、创建自定义缩进环境

如果需要和默认引用块区分开的专属缩进样式,可通过Markdown自定义div容器实现:

1. 定义CSS样式

在<style>块中添加自定义类的样式:

<style>
/* 自定义缩进环境样式 */
.custom-indent {
  margin-left: 1.5em;
  margin-top: 0.3em;
  margin-bottom: 0.3em;
  padding: 0.4em 0.8em;
  background-color: #f5f5f5; /* 可选:添加浅背景色 */
}
</style>

2. 在R-Markdown中调用

用:::包裹需要缩进的内容即可:

- Renewable and Non-Renewable Energy  
::: custom-indent
[Renewable energy](https://www.nrcan.gc.ca/our-natural-resources/energy-sources-distribution/renewable-energy/about-renewable-energy/7295) is energy derived from natural processes that are replenished at a rate that is equal to or faster than the rate at which they are consumed, e.g. energy generated from solar, wind, geothermal, hydropower and ocean resources.  
:::
- *Clean* vs *Dirty* Energy  

补充说明

你提供的HTML源码显示的&amp;gt;是未完成渲染的转义字符,实际生成的演示文稿会自动转换为<blockquote>标签,因此直接使用blockquote选择器即可生效。所有CSS属性可根据需求灵活调整(如颜色、字体、边框等)。

内容的提问来源于stack exchange,提问作者Andrew Leach

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.05 06:50:33