P粉8659009942023-09-02 14:35:18
You can also provide a special HTML class for each table and collect all styles in a css
block instead of specifying CSS in each block:
--- output: html_document --- ```{r setup, include=FALSE} knitr::opts_chunk$set(echo=FALSE) ``` ```{css} .mytable1 > caption { color: blue; } .mytable2 > caption { color: red; } ``` ```{r results="asis"} knitr::kable(head(iris), format="html", digits=4, row.names=FALSE, caption='Caption blue', escape=TRUE)|> kableExtra::kable_styling(font_size=14, htmltable_class = "mytable1") |> kableExtra::kable_paper(c('hover', 'condensed', 'responsive'), full_width=T) |> kableExtra::scroll_box(width="100%", height="200px") ``` ```{r results="asis"} knitr::kable(head(iris), format="html", digits=4, row.names=FALSE, caption='Caption red', escape=TRUE) |> kableExtra::kable_styling(font_size=14, htmltable_class = "mytable2") |> kableExtra::kable_paper(c('hover', 'condensed', 'responsive'), full_width=T) |> kableExtra::scroll_box(width="100%", height="200px") ```
Alternatively, we can insert inline CSS outside the block.
<style> .mytable1 > caption { color: blue; } .mytable2 > caption { color: red; } </style>
P粉1569834462023-09-02 00:44:29
Because the second CSS overwrites the first CSS.
Better to do this:
cat(" <style> .blue-caption { color: blue; } .red-caption { color: red; } </style> ")
Then use like this:
caption='<span class=\"blue-caption\">Caption blue</span>', caption='<span class=\"red-caption\">Caption red</span>',
Is it valid?
greeting, Noel