테스트 사이트 - 개발 중인 베타 버전입니다

모바일에서 이미지 양쪽을 자르면서 가운데 정렬 하는법 채택완료

morrie 5년 전 조회 2,301

이렇게 pc에서 이미지가 중앙에 위치한걸 모바에서보면 너무 작아져요.

 

그래서 이미지를 키우면서 양쪽에 있는 선을 히든으로 없애면서 가운데로 마추려고 했더니

왼쪽을 기준으로 치우쳐지는데 가운데 위치를 유지하는법이 없나요?

화면 전체 width: 470px 이고 이미지의 크기는 width:450px height:100px 입니다.

 

그냥 모바일요 이미지를 따로 만들어서 넣는방법밖에 없는건가요?

댓글을 작성하려면 로그인이 필요합니다.

답변 2개

채택된 답변
+20 포인트
e
5년 전

이미지를  background 로 처리하면 됩니다.

background-image:url('이미지경로'); background-size:cover; background-position:center center;

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

m
morrie
5년 전
답변 감사합니다~

댓글을 작성하려면 로그인이 필요합니다.

서동준
5년 전

음 저라면 

<div>
<span></span>

<h1>이벤트 BEST기종</h1>

<span></span>
<div>
위와같이 html을 만들고

div{width:100%;}

div>span{width:30%; display:inline-block; vertical-align:middle; height:1px; background:#ccc;}

div>h1{ display:inline-block; vertical-align:middle; width:40%; text-align:center;}

이렇게하고

h1에 폰트단위를 vw단위로해서하면
모바일 화면크기에 다 대응도되고 편리하더라구요 

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

m
morrie
5년 전
답글 감사합니다~

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인