* 이런 기능 있었으면 좋겠다 하시면 잡담방에서 에주를 찾아주세요(실제로 가능할진 모름)

[[목차]]

== 텍스트 꾸밈 ==
=== 타이핑 효과 ===
[[TypingEffect(타이핑 효과입니다. 페이지가 로드될 때 효과가 나타납니다.|0.05)]]
{{{ [[TypingEffect(텍스트(개행은 \n)|타이핑 속도(초 단위)]] }}}

=== 흐르는 텍스트 ===
[[MarqueeText(흐르는 텍스트입니다.|speed=8s|color=black|fontsize=15px|direction=right|bgcolor=skyblue)]]
{{{ [[MarqueeText(흐르는 텍스트입니다.|speed=흐르는 속도(초 단위)|color=글자색|fontsize=글자 크기|direction=흐르는 방향|bgcolor=배경색)]] }}}

== 이미지 관련 ==
=== 슬라이드쇼 ===
[[ImageSlideshow(https://i.postimg.cc/DzbHyFp7/123124.jpg, https://i.postimg.cc/4d60VPTM/1529640292.jpg, https://i.postimg.cc/XJShrhtd/1530889324-IMG-20180701-152356.jpg, https://i.postimg.cc/FH6w41ZP/1536386468165b2fda0bc4a354f.jpg|width=300px|height=300px|interval=3)]]
{{{ [[ImageSlideshow(이미지 주소(여러장은 콤마로 구분)|width=가로 길이|height=세로 길이|interval=슬라이드 자동 전환 시간(초 단위)]] }}}

=== 갤러리 ===
[[ImageGallery(https://i.postimg.cc/DzbHyFp7/123124.jpg|클릭하면 확대돼요,https://i.postimg.cc/4d60VPTM/1529640292.jpg|개조심,https://i.postimg.cc/XJShrhtd/1530889324-IMG-20180701-152356.jpg|꽉낀밈미)]]
{{{ [[ImageGallery(이미지 주소|캡션(생략 가능),여러개는 쉼표로 구분)]] }}}

== 기타 ==
=== 실시간 시계 ===
[[LiveClock]]
{{{ [[LiveClock]] }}}

현재 시간을 실시간으로 보여줍니다.

=== 뒤집히는 카드 ===
[[FlipCard(눌러보세요|밈미|width=350px|height=220px|frontBg=url(https://i.postimg.cc/XJShrhtd/1530889324-IMG-20180701-152356.jpg)|backBg=#34495e|frontColor=#ecf0f1|backColor=#bdc3c7|fontSize=1.1em)]]

{{{ [[FlipCard(앞면 텍스트|뒷면 텍스트(개행은 \n)|width=가로 길이|height=세로 길이|frontBg=앞면 배경색|backBg=뒷면 배경색|frontColor=앞면 글자색|backColor=뒷면 글자색|fontSize=글자 크기)] ]}}}

fontBg, backBg에 url(이미지 주소) 형식으로 입력하면 이미지 삽입도 가능합니다

{{{#!folding 고급 설정용
내용 텍스트 뒤에 <style>...</style> 태그로 CSS 스타일을 지정할 수 있습니다.

[[FlipCard(완전한 커스텀 디자인|CSS를 직접 제어합니다.|<style>{ID} {  border-radius: 20px;}{ID} .flip-front {  background: linear-gradient(45deg, #6a11cb, #2575fc);  color: white;  font-family: 'Verdana', sans-serif;  font-weight: bold;}{ID} .flip-back {  background: #f1f3f5;  color: #343a40;  border: 2px dashed #868e96;}</style>)]]

 * 예시 : {{{ [[FlipCard(완전한 커스텀 디자인|CSS를 직접 제어합니다.|<style>{ID} {  border-radius: 20px;}{ID} .flip-front {  background: linear-gradient(45deg, #6a11cb, #2575fc);  color: white;  font-family: 'Verdana', sans-serif;  font-weight: bold;}{ID} .flip-back {  background: #f1f3f5;  color: #343a40;  border: 2px dashed #868e96;}</style>)]] }}}
 참고로 <style>에 포함되는 {ID}는 빼거나 수정하면 안됩니다
------
FlipCard 매크로의 주요 CSS 클래스

1. {ID}
설명: 카드 전체를 감싸는 최상위 컨테이너입니다. 카드의 전체적인 크기, 위치, 3D 효과의 깊이 등을 제어합니다.
주요 기본 속성 및 역할:
width, height: 카드의 너비와 높이를 결정합니다.
perspective: 3D 뒤집기 효과의 원근감(깊이)을 설정합니다. 값이 클수록 효과가 밋밋해지고, 작을수록 왜곡이 심해집니다.
cursor: pointer: 마우스를 올렸을 때 클릭할 수 있다는 것을 알려주는 손가락 모양 커서입니다.
margin: 카드 주변의 바깥 여백입니다.

2. {ID} .flip-inner
설명: 카드 앞면과 뒷면을 실제로 감싸고, 회전 애니메이션이 일어나는 핵심 요소입니다.
주요 기본 속성 및 역할:
transition: 뒤집히는 애니메이션의 속도를 제어합니다. (예: transition: transform 0.6s;는 0.6초 동안 뒤집힌다는 의미)
transform-style: preserve-3d: 자식 요소들(앞면, 뒷면)이 3D 공간에 함께 있도록 만듭니다. 이 속성이 없으면 카드가 평면적으로 뒤집힙니다.

3. {ID} .flip-front, {ID} .flip-back
설명: 앞면과 뒷면 모두에게 공통으로 적용되는 스타일을 정의하는 부분입니다. 여기서 글자의 정렬, 테두리, 그림자, 안쪽 여백 등을 한 번에 제어할 수 있습니다.
주요 기본 속성 및 역할:
border: 카드의 테두리 스타일입니다.
border-radius: 카드의 모서리를 둥글게 만듭니다.
box-shadow: 카드에 그림자 효과를 줍니다.
display: flex, align-items: center, justify-content: center: 카드 안의 텍스트를 수직/수평 중앙에 정렬시킵니다.
padding: 카드 테두리와 내부 텍스트 사이의 안쪽 여백입니다.
font-size: 기본 글자 크기입니다.

4. {ID} .flip-front
설명: 앞면에만 적용되는 스타일을 정의합니다. 주로 배경색이나 글자색을 개별적으로 지정할 때 사용합니다.
주요 기본 속성 및 역할:
background, color 등

5. {ID} .flip-back
설명: 뒷면에만 적용되는 스타일을 정의합니다.
주요 기본 속성 및 역할:
background, color 등
transform: rotateY(180deg): 뒷면을 미리 180도 뒤집어 놓아, 전체가 회전할 때 올바른 면이 보이도록 준비시킵니다.

6. {ID}.flipped .flip-inner (상태 클래스)
설명: 사용자가 카드를 클릭했을 때 적용되는 스타일입니다. .flipped 클래스는 클릭 시 {ID} 컨테이너에 동적으로 추가됩니다.
주요 기본 속성 및 역할:
transform: rotateY(180deg): .flip-inner 요소를 Y축(세로축) 기준으로 180도 회전시켜 뒷면이 보이게 합니다.
(응용): 이 부분을 transform: rotateX(180deg);로 바꾸면 카드가 세로가 아닌 가로로 뒤집히는 효과를 만들 수 있습니다.
}}}

=== 탭 ===


{{{#!folding 고급 설정용
내용 텍스트 뒤에 <style>...</style> 태그로 CSS 스타일을 지정할 수 있습니다.


 참고로 <style>에 포함되는 {ID}는 빼거나 수정하면 안됩니다

https://i.postimg.cc/cHmH16mn/tabs.png
}}}

=== 세로 탭 ===
[[VerticalTabs(메뉴1=첫 번째 탭의 내용입니다.\n줄바꿈도 잘 됩니다.|메뉴2=두 번째 탭의 내용입니다.|메뉴3=세 번째 탭의 내용입니다.)]]