답변 2개
마르스컴퍼니
Expert
7개월 전
1안
</p>
<p>/* 기본 (360px) */
body {
font-size: 20px;
margin: 10px;
padding: 15px;
gap: 10px;
}</p>
<p>/* 720px 이상 */
@media (min-width: 720px) {
body {
font-size: 28px;
margin: 18px;
padding: 25px;
gap: 18px;
}
}</p>
<p>/* 1024px 이상 */
@media (min-width: 1024px) {
body {
font-size: 34px;
margin: 24px;
padding: 32px;
gap: 24px;
}
}</p>
<p>2안
</p>
<p>body {
/* min, preferred, max */
font-size: clamp(20px, 2.5vw, 34px);
margin: clamp(10px, 1.5vw, 24px);
padding: clamp(15px, 2vw, 32px);
gap: clamp(10px, 1.5vw, 24px);
}</p>
<p>
로그인 후 평가할 수 있습니다
댓글을 작성하려면 로그인이 필요합니다.
7개월 전
반응형 분기는 보통 이렇게 합니다.
/* 스마트폰 */
@media (max-width: 480px) {
}
/* 일반 스마트폰 */
@media (min-width: 481px) and (max-width: 767px) {
}
/* 태블릿 */
@media (min-width: 768px) and (max-width: 1023px) {
}
/* 노트북~데스크탑 */
@media (min-width: 1024px) {
}
로그인 후 평가할 수 있습니다
답변에 대한 댓글 1개
�
루2
7개월 전
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인
수치 증가를 어떻게 시키냐는 질문 입니다 ㅠ