모바일 이미지 처리
본문
Pc버젼에선 로고가
정상크기로 보이는데
모바일에서는 비울에 맞게 작아지지 않고
사이즈 대로 출력이 되는데
Pc비울에 맞게 모바일에서 보이게 할려면
어떻게 처리해야 하나요?
답변 1
해당 이미지에 스타일 width를 % , min-width, max-width , media 를 이용해 주세요
작업하신 사이즈가 1024px이면
만약 로고이미지 클래스를 class='logo_img' 로 지정하셨으면
@media (max-width: 1024px) {
img.logo_img {
width:15%/*로고가 차지하는 비율로 정의합니다*/
height:auto/*높이는 너비의 비율을 맞춥니다*/
max-width:200px;/*최대너비를 지정합니다*/
min-width:80px;/*최소너비를 지정합니다*/
}
}
해주시면 되시고요
좀더 디테일 하게 하시려면 각 뷰사이즈 별로 나누시면 됩니다
소중한 답변 감사합니다
답변을 작성하시기 전에 로그인 해주세요.
