모바일 화면 가로에 맞게 이미지, 동영상 크기 조절하는 방법 다시 질문해요,
본문
모바일에서 화면보다 큰 이미지나 동영상의 폭을 폰의 화면과 맞춤하게 하고 싶습니다.
어떤 폰으로 보던 그 폰의 화면보다 넓은 이미지나 넓은 동영상을 폰의 화면안에 다 들어오게 하고 싶어요.
이 방법 아시는 분 답변주시면 고맙겠습니다.
답변 2
답변 고맙습니다.
첫번째 URL의 방법으로 적용하였습니다.
모바일에서 이미지는 css로 조절이 가능합니다.
예를들어
<div class="position">
<div class="img-area">
<img src="img.jpg" />
</div>
</div>
위와 같은 형태로 UI를 작성했다면
<style>
.position{position:relative;width:100%;overflow:hidden}
.position .img-area{display:block;padding:5%}
.position .img-area img{display:block;width:100%;}
</style>
위와 같이 작성을 한다면 전체 사이즈 100% 안에 패딩이5%로 가로 90%안으로 이미지가 리사이징 되어 들어가게 됩니다.
위 예제를 참고로 해보세요.
동영상도 마찬가지로 width:100% 로 잡아주시면 됩니다.
답변을 작성하시기 전에 로그인 해주세요.
