Как изменить шрифт, размер и цвет текстов в табсете? ⇐ CSS

[Anonymous]

У меня есть квартальный документ, который преобразуется в HTML. В этом документе я использую класс .panel-tabset для создания панелей с вкладками, содержащими графики и текст, созданный в R. Я хочу настроить шрифт, цвет и размер этих текстов, чтобы отличить их от остальной части отчета. Как я могу достичь этого? Я включаю код .qmd и код .css , который я использую для вкладок.---
title: "Untitled"
format:
html:
css:
styles.css
---

```{r include=FALSE}
library(ggplot2)
library(palmerpenguins)
```

The following graphs will show....

::: panel-tabset
## Tab1

```{r echo=FALSE}
ggplot(mtcars, aes(hp, wt)) +
geom_point()
```

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc et elementum velit. Fusce lobortis pulvinar ex quis pharetra. Aenean dapibus turpis neque, sed feugiat lacus rutrum sit amet. Praesent quis fringilla nisl. Pellentesque ac ligula mollis, mattis elit ut, consectetur diam. Maecenas tristique bibendum diam quis blandit. Suspendisse elementum maximus.

## Tab2

```{r echo = FALSE}
ggplot(penguins, aes(bill_depth_mm, body_mass_g, color = sex)) +
geom_point()
```

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc et elementum velit. Fusce lobortis pulvinar ex quis pharetra. Aenean dapibus turpis neque, sed feugiat lacus rutrum sit amet. Praesent quis fringilla nisl. Pellentesque ac ligula mollis, mattis elit ut, consectetur diam. Maecenas tristique bibendum diam quis blandit. Suspendisse elementum maximus.

## Tab3

```{r echo = FALSE}
ggplot(penguins, aes(body_mass_g, color = sex)) +
geom_histogram()
```

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc et elementum velit. Fusce lobortis pulvinar ex quis pharetra. Aenean dapibus turpis neque, sed feugiat lacus rutrum sit amet. Praesent quis fringilla nisl. Pellentesque ac ligula mollis, mattis elit ut, consectetur diam. Maecenas tristique bibendum diam quis blandit. Suspendisse elementum maximus.
:::

## Title1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc et elementum velit. Fusce lobortis pulvinar ex quis pharetra. Aenean dapibus turpis neque, sed feugiat lacus rutrum sit amet. Praesent quis fringilla nisl. Pellentesque ac ligula mollis, mattis elit ut, consectetur diam. Maecenas tristique bibendum diam quis blandit. Suspendisse elementum maximus.
< /code>
Файл .css, который я использую, имеет следующее: < /p>
.panel-tabset .nav-item .nav-link {
font-size: 14px;
font-style: bold;
background-color: #e0e0e0; /* fondo gris claro */
color: #333; /* texto oscuro */
border-radius: 0.25rem; /* esquinas redondeadas */
margin-right: 0.25rem; /* separación entre pestañas */
}

.panel-tabset .nav-item .nav-link.active {
background-color: #007bff !important; /* azul vivo */
color: #fff !important; /* texto blanco */
}

.panel-tabset .nav-item .nav-link:hover {
background-color: #0056b3; /* azul más oscuro al pasar el ratón */
color: #fff;
}


Подробнее здесь: https://stackoverflow.com/questions/797 ... e-a-tabset