CODEWITHSUNDEEP
htmlcssrr-markdown
Jaskeil
Jaskeil

Reputation: 1232

How to change tabset colors without using CSS file in RMarkdown?

I have tabs (using tabset) in my Rmarkdown file. I was wondering if there was a way I could change the color of these tabs without needing to use a CSS file. Anyway, I could change this in the yaml part of my code or just wrap some html code around the tabset command to change the color of it? See below:

enter image description here

Upvotes: 0

Views: 1697

Answers (1)

Daniel_j_iii
Daniel_j_iii

Reputation: 3252

With Rmarkdown you can use inline CSS, so it's all contained in the same .Rmd file.

---
title: "tab colors"
output: html_document
---

<style>
  .nav-pills>li>a:hover, .nav-pills>li>a:focus, .nav-pills>li.active>a,     .nav-pills>li.active>a:hover, .nav-pills>li.active>a:focus{
     background-color: green;
     }
</style>

# {.tabset .tabset-fade .tabset-pills}

## green

enter image description here

You can also use CSS code in it's own CSS chunk, both give the same result inline, without an additional file

---
title: "tab colors"
output: html_document
---

```{css, echo = FALSE}
  .nav-pills>li>a:hover, .nav-pills>li>a:focus, .nav-pills>li.active>a,     .nav-pills>li.active>a:hover, .nav-pills>li.active>a:focus{
     background-color: green;
     }
```

# {.tabset .tabset-fade .tabset-pills}

## green

Used this link and this one in my research as they are similar questions

Upvotes: 4

Related Questions