如何用CSS实现kableExtra中cell_spec()文本的居中对齐？

我通过kableExtra包的cell_spec()函数的extra_css参数实现了表格单元格的整体背景填充（而非仅文本区域），但在kbl()中设置align = c("l", "c")后，val列的文本依然没有居中对齐。希望在R Markdown报告中实现该列文本的居中，求基于CSS的解决方法。

原代码：

library(kableExtra)

set.seed(123)

name <- paste("Name", LETTERS)
val <- rnorm(26, 100, 50)
d <- data.frame(name, val)

d$val <- cell_spec(d$val,
                   background = dplyr::case_when(
                     d$val > mean(d$val) + sd(d$val) ~ "#DBEBF6",
                     d$val < mean(d$val) - sd(d$val) ~ "#FEE7DA",
                     .default = "transparent"
                   ),
                   extra_css = "margin: -8px; padding: 8px; display: flex;",
                   background_as_tile = FALSE
)

kbl(d, escape = FALSE, align = c("l", "c")) %>%
  kable_styling()

表格效果示意图：

解决方法：修改flex布局的对齐属性 #

问题出在你添加的display: flex属性——flex容器内的内容默认不会自动居中，覆盖了kbl()中设置的对齐规则。只需要在extra_css中添加justify-content: center（水平居中）即可：

library(kableExtra)
library(dplyr)

set.seed(123)

name <- paste("Name", LETTERS)
val <- rnorm(26, 100, 50)
d <- data.frame(name, val)

d$val <- cell_spec(d$val,
                   background = case_when(
                     d$val > mean(d$val) + sd(d$val) ~ "#DBEBF6",
                     d$val < mean(d$val) - sd(d$val) ~ "#FEE7DA",
                     .default = "transparent"
                   ),
                   # 添加justify-content:center实现水平居中
                   extra_css = "margin: -8px; padding: 8px; display: flex; justify-content: center;",
                   background_as_tile = FALSE
)

kbl(d, escape = FALSE, align = c("l", "c")) %>%
  kable_styling()

另一种方案：自定义CSS类 + column_spec #

如果需要更灵活的样式控制，可以定义全局CSS类，再通过column_spec()应用到目标列：

1. 在R Markdown的YAML下方添加自定义CSS：

<style>
.val-center {
  display: flex;
  justify-content: center;
  margin: -8px;
  padding: 8px;
}
</style>

2. 修改R代码：

library(kableExtra)
library(dplyr)

set.seed(123)

name <- paste("Name", LETTERS)
val <- rnorm(26, 100, 50)
d <- data.frame(name, val)

d$val <- cell_spec(d$val,
                   background = case_when(
                     d$val > mean(d$val) + sd(d$val) ~ "#DBEBF6",
                     d$val < mean(d$val) - sd(d$val) ~ "#FEE7DA",
                     .default = "transparent"
                   ),
                   background_as_tile = FALSE
)

kbl(d, escape = FALSE, align = c("l", "c")) %>%
  kable_styling() %>%
  # 将自定义CSS类应用到第2列（val列）
  column_spec(2, extra_css = "class='val-center'")

原理说明 #

• justify-content: center是flex布局中控制容器内元素水平居中的核心属性，配合display: flex就能让单元格内的文本居中。
• 第一种方案直接在cell_spec的extra_css中添加属性，适合快速修改；第二种方案通过全局CSS类，方便复用样式到多个表格或列。

内容的提问来源于stack exchange，提问作者user13973103