Как я могу настроить таргетинг на определенные слайды с помощью пользовательского CSS в презентации ioslide? - PullRequest
0 голосов
/ 08 января 2019

Чтение этот вводный текст, я думал, что будет просто закрасить тело или точки маркера на определенном зеленом слайде. Я создал свой собственный файл CSS, содержащий следующие строки:

body p {
 font-size: 24px;
 font-family: Frutiger Light;
 color: orange;
}

li {
 font-family: Frutiger Light;
 font-size: 20px;
 color: green;
}

.change {
 color: green;
}

и сослался на изменение класса css, добавив {.change} к моему заголовку в файле rmarkdown. Однако это полностью игнорируется. Я заблудился и очень хотел бы подсказать, как решить эту проблему.

Здесь - простой воспроизводимый пример. Пожалуйста, убедитесь, что CSS находится в той же папке, что и RMD.

1 Ответ

0 голосов
/ 09 января 2019

Это действительно зависит от того, что именно вы хотели бы стилизовать. Ioslides управляет «содержимым» ** каждого слайда с помощью <article>, которому присваивается id с названием слайда. Например, если вы делаете в вашем файле R Markdown:

## Introduction

* Bullet 1
* Bullet 2

Это (после knit) будет преобразовано в HTML, похожий на:

<hgroup> <h2>Introduction</h2> </hgroup>
<article  id="introduction">
<ul>
  <li>Bullet 1</li>
  <li>Bullet 2</li>
</ul>
</article>

Это означает, что вы можете использовать свой .css, чтобы нацелить пули <li> на этом слайде, как это - очень глупый пример, но вы сразу же увидите, правильно ли вы это поняли (правильный документ по этому здесь ) :

#introduction ul li {
    font-size: 50px;
}

** Я сказал, что содержание там расплывчато, поскольку управление всем <slide> осуществляется с помощью таких классов, как «current», который является переменным и затрудняет нацеливание на конкретный слайд

РЕДАКТИРОВАТЬ: Если вы действительно хотите, вы также можете включить CSS прямо в .Rmd, используя пример выше, вы могли бы сделать в вашем .Rmd:

<style type="text/css">
#introduction ul li {
  font-size: 50px;
} 
</style>

## Introduction

* Bullet 1
* Bullet 2
...