336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.
CSS로 반응형웹을 만드는데 글자도 줄일 수 있는 예제가 들어있는 사이트를 찾아봤습니다.
들어가셔서 소스보기 하면 볼 수 있습니다.
http://s.codepen.io/naradesign/debug/RNGLeQ?
중요한 부분은.. 일부만 떼왔습니다.
@media 부분이 중요한 것 같습니다.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 | <head> <style> @media (max-width:360px){html{font-size:10px;}} @media (min-width:361px) and (max-width:399px){html{font-size:11px;}} @media (min-width:400px) and (max-width:439px){html{font-size:12px;}} @media (min-width:440px) and (max-width:479px){html{font-size:13px;}} @media (min-width:480px) and (max-width:519px){html{font-size:14px;}} @media (min-width:520px) and (max-width:559px){html{font-size:15px;}} @media (min-width:560px) and (max-width:599px){html{font-size:16px;}} @media (min-width:600px) and (max-width:639px){html{font-size:17px;}} @media (min-width:640px) and (max-width:679px){html{font-size:18px;}} @media (min-width:680px) and (max-width:719px){html{font-size:19px;}} @media (min-width:720px) and (max-width:759px){html{font-size:20px;}} @media (min-width:760px) and (max-width:799px){html{font-size:21px;}} @media (min-width:800px) and (max-width:839px){html{font-size:22px;}} @media (min-width:840px) and (max-width:879px){html{font-size:23px;}} @media (min-width:880px){html{font-size:24px;}} </style> </head> | cs |
'CSS' 카테고리의 다른 글
| (CSS) z-index가 없는 경우의 쌓임 (0) | 2016.05.16 |
|---|---|
| (CSS) 그라디언트 사용 예제와 사이트 (0) | 2016.04.29 |
| (CSS) animation 트랜지션 사용방법 (0) | 2016.04.29 |
| (CSS) 배경위에 텍스트가 떠있는 느낌을 표현 가능 : background-attachment:fixed (0) | 2016.04.29 |
| (CSS) float:left 속성값 썼는데 이상하게 나오면? - 가상태그 float 설정을 해제 하는 방법 (0) | 2016.04.29 |
