본문 바로가기

mediaqueries

반응형웹, Typical Device Breakpoints, media queries 반응형웹, Typical Device Breakpoints, media queries https://www.w3schools.com/css/tryit.asp?filename=trycss_mediaqueries_fontsize Tryit Editor v3.6 div.example { background-color: lightgrey; padding: 20px; } @media screen and (min-width: 600px) { div.example { font-size: 80px; } } @media screen and (max-width: 600px) { div.example { font-size: 30px; } } Change the font size of an element on differen.. 더보기
CSS3 Media Queries CSS3 Media Queries /* Smartphones (portrait and landscape) ----------- */ @media only screen and (min-device-width : 320px) and (max-device-width : 480px) { /* Styles */ } /* Smartphones (landscape) ----------- */ @media only screen and (min-width : 321px) { /* Styles */ } /* Smartphones (portrait) ----------- */ @media only screen and (max-width : 320px) { /* Styles */ } /* iPads (portrait and .. 더보기