presentation:marp

차이

문서의 선택한 두 판 사이의 차이를 보여줍니다.

차이 보기로 링크

--- presentation:marp [2022/07/08 19:56]
kwon37xi [중앙 정렬 (lead)]
+++ presentation:marp [2022/07/11 17:17]
kwon37xi [HTML]
@@ 줄 6: / 줄 6: @@
 ===== 예시 =====
   * [[https://github.com/yhatt/marp-cli-example|yhatt/marp-cli-example: The good starter for using Marp via Marp CLI, by the author of Marp]]
+===== background 지정 =====
+  * 최상위 directive 에서 background image 지정시
+  * ''backgroundImage'' : [[https://developer.mozilla.org/en-US/docs/Web/CSS/background-image|background-image]] CSS 스타일 지정
+  * ''backgroundPosition'' : [[https://developer.mozilla.org/en-US/docs/Web/CSS/background-position|background-position]] CSS 스타일 지정
+  * ''backgroundSize'' : [[https://developer.mozilla.org/en-US/docs/Web/CSS/background-size|background-size]] CSS 스타일 지정
+==== background 이미지 예시 ====
+<code>
+backgroundImage: url('https://path/to/image.png')
+backgroundSize: 15%
+# 오른쪽 하단에 두되 살짝씩 마진을 둔다.
+backgroundPosition: bottom 10px right 10px
+</code>
 ===== Markdown =====
@@ 줄 43: / 줄 58: @@
 ==== 노트 ====
   * HTML 주석(''<!-- ... -->'') 안에 일반적으로 내용을 적으면 해당 페이지에 대한 노트로 작동한다. 본인만 볼 수 있고 청중에게는 안보이는 노트.
+==== HTML ====
+  * Markdown 내에 HTML을 활성화 할 수 있다. 하지만 이것은 보안 이슈가 발생할 수 있으므로 주의한다.
+  * VSCode : **Settings -> Marp for VSCode -> Enable HTML** 활성화. ''trusted directory''에서만 활성화됨.
+  * Marp CLI : ''%%--html%%'' 옵션 지정
 ===== marp-cli =====
   * [[https://github.com/marp-team/marp-cli|Marp CLI]]

presentation/marp.txt · 마지막으로 수정됨: 2024/04/15 16:26 저자 kwon37xi