-
반응형
<!DOCTYPE HTML> <html> <head> <style type="text/css"> @media screen and (min-width: 400px) {
body { background-color: red; } } @media screen and (min-width: 600px){ body { background-color: blue; } } @media screen and (min-width: 800px) { body { background-color: #cdcdcd; } } </style> </head> <body> 반응형 디자인 </body> </html>위 프로그램을 그래도 복사해서 넣은다음 웹 페이지를 띄운뒤 브라우저 가로 사이즈를 조절해보면 배경색이 그때 그때 바뀔것이다..! 이것만 알면 끝난거다
min-width
max-width
이 두가지만 적절히 조합해서 사용하면 반응형 코딩끝!!
그 외에는 모두 일반 css와 똑같이 코딩해주면 끝!!!
반응형'CSS3' 카테고리의 다른 글
css ul,li 블릿기호,점 없애기 (0) 2016.12.27