728x90 반응형 mediaquery2 [CSS] 화면 늘리면 이미지 커질 때, 이미지 사이즈 설정 .slide-box img { /* width: 100%; */ max-width: 820px; /* padding: 20px; */ height: auto; border-radius: 2vw; /* 뷰포트 너비에 따라 둥근 모서리 크기 조정 */ display: block; margin: auto; /* text-align: center; */ /* height: auto; 이미지가 세로로 늘어나지 않도록 추가 */ } max-width: 820px; 를 줬더니 화면은 늘려도 이미지가 엄청 크게 늘어나지 않음. .slide-box img { /* 사진 조금 잘리는 걸 아래의 코드로 해결.*/ width: 100%; max-width: 920px; height: auto; border-radius: 20.. 2024. 3. 24. [생활코딩] CSS 수업 정리 (9) 미디어쿼리: 반응형 디자인의 심장과 같은 역할을 함 @media : 미디어쿼리의 시작 화면크기가 500px이 됐을 때, body태그의 background-color을 붉은색으로 지정한다는 뜻. 더 크거나 작아지면 아무런 색깔 X max-width 의 사용 max = 최대 최대 500px일 때, 즉 최대 500px 이하일 때 미디어쿼리 실행. min-width를 사용하면 min = 최소 500px 이상일 때 배경색 설정됨 이유: 500px 이하 구간에서는 red 와 green 모두 영향을 주고 있는 상태 색 지정할 땐 우선순위 생각하기 601픽셀 이상의 색상 지정하기 나머지는 빨간색 모바일 화면 적용 show media queries 2023. 7. 17. 이전 1 다음 728x90 반응형