편집 요약 없음 |
편집 요약 없음 |
||
| 3번째 줄: | 3번째 줄: | ||
<onlyinclude><includeonly>{{#css: @media screen and (max-width: 768px) { {{{1}}} { {{{mobile}}} } } @media screen and (min-width: 768px) { {{{1}}} { {{{pc}}} } } {{{1}}} { {{{common}}} } }}</includeonly></onlyinclude> | <onlyinclude><includeonly>{{#css: @media screen and (max-width: 768px) { {{{1}}} { {{{mobile}}} } } @media screen and (min-width: 768px) { {{{1}}} { {{{pc}}} } } {{{1}}} { {{{common}}} } }}</includeonly></onlyinclude> | ||
<pre style="white-space: pre-wrap;">{{반응형 style|요소|mobile=모바일 style|pc=PC style|common=공통 style(선택)}}</pre> | <pre style="white-space: pre-wrap;">{{반응형 style|요소|mobile=모바일 style|pc=PC style|common=공통 style(선택)}}</pre> | ||
모바일과 PC에서{{툴팁|1|정확히는 보고 있는 화면의 절대 너비가 768px보다 클 경우 PC처럼, 768px보다 작을 경우 모바일처럼 나타납니다.}} 각각 다른 스타일이 적용되는 요소를 만들어 낼 수 있는 틀입니다. | |||
{|{{style|class=wiki|width=100%}} | {|{{style|class=wiki|width=100%}} | ||
|- | |- | ||
2024년 8월 1일 (목) 23:31 판
| 틀:반응형 style | |
|---|---|
사용문서
|
|
넘겨주기
|
이동하기
|
{{반응형 style|요소|mobile=모바일 style|pc=PC style|common=공통 style(선택)}}
모바일과 PC에서[1][1] 정확히는 보고 있는 화면의 절대 너비가 768px보다 클 경우 PC처럼, 768px보다 작을 경우 모바일처럼 나타납니다. 각각 다른 스타일이 적용되는 요소를 만들어 낼 수 있는 틀입니다.
| 예시 | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
| 모바일에서 빨간 박스, PC에서 파란 박스 (PC에서는 F12 개발자 도구의 모바일 화면 모드에서, 모바일에서는 기기를 가로 모드로 기울여서 각각의 차이를 볼 수 있습니다.) |
|||||||||||
[ 사용 팁 ]
| |||||||||||
