如何用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源码显示的&gt;是未完成渲染的转义字符,实际生成的演示文稿会自动转换为<blockquote>标签,因此直接使用blockquote选择器即可生效。所有CSS属性可根据需求灵活调整(如颜色、字体、边框等)。
内容的提问来源于stack exchange,提问作者Andrew Leach
相关产品推荐
相关产品推荐

