xaringan 슬라이드 쇼에서 배경 이미지 불투명도를 조정할 수 있습니까?

debugcn 에 게시 Dev

Jake

xaringan 및 R 마크 다운으로 프레젠테이션을 만들 때 배경 이미지의 불투명도를 조정할 수 있습니까? 예를 들어, 다음은 배경에 Karl 슬라이드 만있는 Ninja 템플릿입니다. 이 배경의 불투명도를 변경하려면 어떻게해야합니까?

편집 : 명확히하기 위해 슬라이드 쇼의 모든 배경 이미지가 아닌 경우에 따라 배경 불투명도를 조정할 수 있기를 원합니다.

---
title: "Presentation Ninja"
subtitle: "⚔<br/>with xaringan"
author: "Yihui Xie"
institute: "RStudio, PBC"
date: "2016/12/12 (updated: `r Sys.Date()`)"
output:
  xaringan::moon_reader:
    lib_dir: libs
    nature:
      highlightStyle: github
      highlightLines: true
      countIncrementalSlides: false
---


background-image: url(`r xaringan:::karl`)
background-position: 50% 50%
class: right, top

# You only live once!

엄마

<div>CSS를 사용하여 이미지를 포함하는 상위 요소 (a ) 의 불투명도를 조정해야합니다 . 불투명도를 조정하는 CSS 클래스를 정의하는 코드 청크를 포함하는 것이 편리합니다.

```{css, echo = F}
.reduced_opacity {
  opacity: 0.5;
}
```

그런 다음이 클래스를 슬라이드에 적용합니다.

---
background-image: url(`r xaringan:::karl`)
background-position: 50% 50%
class: right, top, reduced_opacity
# You only live once!

그러나 이렇게하면 슬라이드의 모든 항목이이 .NET에 '살아'있기 때문에 전체 슬라이드의 불투명도가 감소합니다 <div>. 이를 방지하려면 ::before슬라이드에 의사 요소 (사용 )를 추가하는 클래스에 이미지를 포함하고 다음 과 같이 불투명도를 조정할 수 있습니다.

```{css, echo = F}
.bg_karl {
  position: relative;
  z-index: 1;
}

.bg_karl::before {    
      content: "";
      background-image: url('https://github.com/yihui/xaringan/releases/download/v0.0.2/karl-moustache.jpg');
      background-size: cover;
      position: absolute;
      top: 0px;
      right: 0px;
      bottom: 0px;
      left: 0px;
      opacity: 0.5;
      z-index: -1;
}
```

그런 다음 .bg_karl슬라이드에 추가 합니다.

---
class: right, top, bg_karl
# You only live once!

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정2021-04-5

몇 마디 만하겠습니다

0리뷰

로그인참여 후 검토

Related 관련 기사

기사

xaringan 슬라이드 쇼에서 배경 이미지 불투명도를 조정할 수 있습니까?

xaringan 슬라이드 쇼에서 배경 이미지 불투명도를 조정할 수 있습니까?

패널 배경 이미지의 불투명도를 설정할 수 있습니까?

Windows 7 Home Basic에서는 배경 화면 슬라이드 쇼를 사용할 수 없습니다.

Windows 7 Home Basic에서는 배경 화면 슬라이드 쇼를 사용할 수 없습니다.

이 슬라이드 쇼 스크립트에 불투명도 전환을 어떻게 추가 할 수 있습니까? 2 부

PowerPoint에서는 전체 이미지를 슬라이드에 배치하는 대신 참조로 이미지를 표시 할 수 있습니까?

웹뷰에서 배경 이미지를 설정할 수 있습니까?

fullScreenCover 배경 불투명도를 설정하는 방법이 있습니까?

부트 스트랩 슬라이더를 사용하여 불투명도 값을 변경할 수 없습니다.

Highchart에서 가리 키지 않은 열의 불투명도를 어떻게 변경할 수 있습니까?

Magick ++를 사용하여 투명한 배경이있는 PNG 이미지에 불투명도를 설정하는 방법

R.drawable에서 문자열 배열 입력을 허용하도록 Android 슬라이드 쇼를 수정 하시겠습니까?

Mac OS X에서 이미 열려있는 창의 투명도를 변경할 수 있습니까?

Mac OS X에서 이미 열려있는 창의 투명도를 변경할 수 있습니까?

Android에서 이미지 슬라이드 쇼를 갖도록 코드를 수정하는 방법은 무엇입니까?

Google Asset Studio에서 배경 이미지를 사용할 수 있습니까?

jquery hover에서 다른 불투명도로 두 이미지를 만들 수 있습니까?

jquery hover에서 다른 불투명도로 두 이미지를 만들 수 있습니까?

코드에서 배경 이미지를 어떻게 설정할 수 있습니까?

코드에서 배경 이미지를 어떻게 설정할 수 있습니까?

불투명도를 사용하여 단락의 배경에만 효과를 적용 할 수 있습니까?

Ionic 4에서 변경하고 다음 슬라이드를 표시 할 수있는 슬라이더 끝에 버튼을 어떻게 만들 수 있습니까?

슬라이드에서 다른 슬라이드로 셰이프를 이동할 수 있습니까?

여기에서 배경 이미지에 필터를 설정할 수 있습니까?

파이 게임-시간에 따라 배경 이미지를 변경할 수 있습니까?

전체 슬라이드 쇼를 어떻게 반복 할 수 있습니까?

전체 슬라이드 쇼를 어떻게 반복 할 수 있습니까?

크기를 조정하지 않고 이미지에 배율을 사용할 수 있습니까?

내 앱에서 직접 아이폰 배경 이미지를 변경할 수 있습니까?

차트 배경에 이미지를 넣을 수 있습니까?