•  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
r46
r25
1[include(틀:A위키 연습장/설명문서)]
r8
2[include(틀:A위키 연습장)]
r28
3[[분류:A위키 연습장]]
r37
4## 여기서부터 연습장입니다. 상부 양식을 임의로 수정하시면 문서 훼손으로 간주될 수 있습니다.
5
6
r46
7
8
9== 테스트 방법 ==
10
11모바일, 태블릿, PC 고정폭 1000px / 1600px[* 당연하지만 모니터 자체 가로 크기가 1600px 이상이여야 통함] / 고정폭 사용하지 않음[* 브라우저 최대화했을때 가로폭 1600px 이하인 모니터는 해당사항없음] 으로 각각 틀을 확인해본다.
12
13
r41
14||<table width=48%><bgcolor=#DDDDDD><table align=right> {{{+1 SIDE A}}} ||
r45
15||<height=300px> 가변폭 48%, PC 환경에서는 좌우폭이 어떤 경우에라도 빈 공간 없이 가장 깔끔하게 가능하나 모바일에서는 B 틀이 아래로 내려갔는데도
16 찌그러져 버림. (52%여백 발생)||
r38
17
r41
18||<table width=48%><bgcolor=#DDDDDD> {{{+1 SIDE B}}} ||
r40
19||<height=400px> ||
20
21
22
23
24
25
26
27
28
29
r42
30||<table width=400px><bgcolor=#DDDDDD><table align=right> {{{+1 SIDE C}}} ||
r44
31||<height=300px> 고정폭 400px, 모바일에서는 D틀이 C틀 밑으로 내려감. PC에서는 양쪽정렬 가능, 하지만 좌우 폭이 커질수록 가운데에 빈공간이 생김. (고정폭 1000px 최적화) ||
r40
32
r42
33||<table width=400px><bgcolor=#DDDDDD> {{{+1 SIDE D}}} ||
34||<height=400px> ||
35
36
37
38
39
r43
40||<table width=550px><bgcolor=#DDDDDD><table align=right> {{{+1 SIDE E}}} ||
r44
41||<height=300px> 고정폭 550px, 모바일에서는 F틀이 E틀 밑으로 내려감. PC 고정폭 1000px에서는 D틀이 C틀 밑으로 내려가는 동시에 각각 틀에 1000px-550px의 여백이 생겨버림. 1280px 에서는
42 양쪽정렬 가능 ||
r42
43
r43
44||<table width=550px><bgcolor=#DDDDDD> {{{+1 SIDE F}}} ||
r44
45||<height=400px> ||
46
47
48
49||<table width=700px><bgcolor=#DDDDDD><table align=right> {{{+1 SIDE G}}} ||
50||<height=300px> 고정폭 700px, 모바일 정상. PC에서는 HD 모니터(가로1280)로는 가로px-700px의 여백이 생김. 가로1920 이상 FHD급 모니터 의 경우 중앙 여백이 상당히 줄어듬. ||
51
52||<table width=700px><bgcolor=#DDDDDD> {{{+1 SIDE H}}} ||
53||<height=400px> ||
54
55
56{{{+1 결론}}}
57가변폭에서 일정 px 수치 내려가면 자동으로 100%로 변환되는 문법이 필요한 부분이다.