Несколько изображений (логотип и фоновое изображение) в титульном слайде xaringan

Я пытаюсь использовать логотип и фоновое изображение на слайдах, подготовленных с помощью xaringan (rmarkdown). Я не нашел инструкции, как это сделать.

Пока что у меня это (только логотип):

---
output:
  xaringan::moon_reader:
    css: ["xaringan-themer.css","mi_estilo.css"]
    lib_dir: libs
    nature:
      titleSlideClass: ["left", "bottom"]
      ratio: '16:9'
      highlightStyle: github
      highlightLines: true
      countIncrementalSlides: false
---

И это в файле CSS:

/* Add image and change bg color */
.title-slide {
  background-image: url(logo-ean-blanco.png);
  background-position: 11% 15%;
  background-size: 200px;
  padding-left: 100px;  
}

Итак, как теперь добавить фоновое изображение на первую страницу или титульный слайд? Спасибо!

css r-markdown xaringan

25.11.2022 15:33

Приемы CSS-макетирования - floats и Flexbox

Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...

Введение в CSS

CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.

Как выровнять Div по центру?

Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...

Навигация по приложениям React: Исчерпывающее руководство по React Router

React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

CSS: FlexBox

Ранее разработчики использовали макеты с помощью Position и Float. После появления flexbox сценарий полностью изменился.

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вы можете указать пути к двум изображениям (одно для логотипа и другое для фонового изображения) в свойстве background-image css, разделив запятой пути URL-адресов, а также указать другие свойства фона для двух изображений, разделив их запятой. Смотрите здесь чтобы узнать больше об этом.

---
title: "xaringan"
author: "None"
output:
  xaringan::moon_reader:
    css: ["xaringan-themer.css","mi_estilo.css"]
    lib_dir: libs
    nature:
      titleSlideClass: ["left", "bottom"]
      ratio: '16:9'
      highlightStyle: github
      highlightLines: true
      countIncrementalSlides: false
---

mi_estilo.css

.title-slide {
  background-image: url(https://placeholder.pics/svg/100),
                    url(https://picsum.photos/id/870/800/600?grayscale);
  background-position: 2% 2%, center;
  background-size: 100px, cover;
}

25.11.2022 17:00

Другие вопросы по теме

Большой разделитель для тысяч в flextable и vtable

Как добавить изображение на титульный слайд в Rmarkdown (xaringan)?

Как получить MIN и MAX из подмножества данных, состоящего из факторов

Как показать только раздел коэффициентов, включая значащие коды из сводки (модели) в rmarkdown?

Как правильно выровнять математическое уравнение в rmarkdown?

Встроенный код в PDF-файле R markdown отображается неправильно

Сводная таблица с диаграммой на выходе

Специальные символы неправильно отображаются при переходе с git_book на bs4_book в bookdown

Кодирование внутри фрагментов приводит к отсутствию символов, несмотря на UTF-8

Встроенная ссылка на фрагмент кода в документе

Несколько изображений (логотип и фоновое изображение) в титульном слайде xaringan

Ответы 1

Другие вопросы по теме

Похожие вопросы