답변 3개
2년 전
다음과 같이 해볼 수 있을것 같습니다.
방법1.
</p>
<p>/* CSS */
.parent-div {
width: 1280px;
height: 500px; /* 이미지의 높이에 맞게 조절해주세요 */
background-image: url("배경이미지_파일_경로.png"), url("원하는이미지_파일_경로.png");
background-repeat: no-repeat;
background-position: left top, right top;
background-size: contain;
}이렇게 하면 이미지 뒤에 2460px의 백그라운드를 보이게 할 수 있으며, 이미지의 비율을 유지하면서 이미지를 최대한 확대하여 표시 할 수 있습니다.
방법2.
</p>
<p>/* CSS */
.parent-div {
width: 1280px;
height: 500px; /* 이미지의 높이에 맞게 조절해주세요 */
background-image: url("배경이미지_파일_경로.png"), url("원하는이미지_파일_경로.png");
background-repeat: no-repeat;
background-position: left top, right top;
background-size: contain;
}이렇게 하면 이미지를 부모 요소에 맞추되, 이미지의 비율을 유지하지 않고 잘라내어 배치하며, 이미지 뒤에 2460px의 백그라운드를 보이게 할 수 있고, 이미지를 최대한 확대하여 표시합니다
위의 방법중 테스트 해보시고 원하시는 방법으로 해결 될 수 있을 것 같습니다.
이 이외에도 방법은 다양할 수 있습니다.
로그인 후 평가할 수 있습니다
댓글을 작성하려면 로그인이 필요합니다.
2년 전
백그라운드로 넣으려면 리소스 감당을 어찌 하시려 하시나요...
2460px 의 백그라운드 이미지 렌더링.. 생각만해도 아찔하네요..
부모의 크기가 1280px 이면 국민해상도 1920 기준으로 양 옆에 날개를 붙이세요.
인벤처럼.
그리고 @media 쓰셔서 모바일도 분기 해주시구요
지금 생각하시는 방법은 절대로 권장하는 방법이 아닙니다..
로그인 후 평가할 수 있습니다
답변에 대한 댓글 2개
�
그누초보다
2년 전
오 좋은 말씀 감사합니다 제가 초보라 혹시 양옆에 날개붙이는 방법을 알려주실수있나요?
�
애드프로
2년 전
css 부터 차근히 공부하세요.
시간 투자가 아까우시면 상단에 제작의뢰 라는 아주 멋진 버튼이 있습니다.
시간 투자가 아까우시면 상단에 제작의뢰 라는 아주 멋진 버튼이 있습니다.
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인