div 크기에 따라 background 사이즈
263
air_guri
작성한 질문수 24
1
선생님 질문이 있습니다.
div태그에 background를 넣었는데 div가 줄어들때 그 비율만큼 줄어들도록 제작을 하고 싶은데 어떻게 하면 좋을까요?
vw vh 퍼센트 등등 제가 아는 선에서 다 해봤는데 브라우저 창이 작아지면 그 비율을 못따라가네요.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
*{
margin: 0;
padding: 0;
box-sizing: border-box;
}
.wrap{
border: 1px solid blue;
width: 50%;
overflow: hidden;
}
.slot{
float: left;
margin: 0;
border: 1px solid #000;
}
.slot1{
background: url(images/machine_icon.png) repeat-y;
width: 33.3333%;
height: 200px;
/* animation: rotate 5s infinite; */
}
.slot2{
background: url(images/machine_icon.png) repeat-y;
width: 33.33333%;
height: 200px;
/* animation: rotate 5s 1s infinite; */
}
.slot3{
background: url(images/machine_icon.png) repeat-y;
width: 33.3333%;
height: 200px;
/* animation: rotate 5s 2s infinite; */
}
.slot3{}
@keyframes rotate {
0%{
background-position: 0;
}
100%{
background-position: 0 800px;
}
}
</style>
</head>
<body>
<div class="wrap">
<div class="slot slot1"></div>
<div class="slot slot2"></div>
<div class="slot slot3"></div>
</div>
</body>
</html>
답변 1
0
background-size: cover 속성이 없는것 같은데요.
이거 넣어주시면 div에 가득찹니다.
0
선생님
div에 넓이 높이를 vw vh 단위로 사용해야 브라우저 크기에 따라 조절 된다고 알고있는데 어느 지점에서 잘 안맞으면 media query 외에 다른 방법이 혹시 있을까요?
class 값 한 번에 부여하는법
2
106
1
@media에서의 flex-direction: column으로 세로배치 관련 질문드립니다.
1
87
1
div#css-checker-widget의 해결방
1
84
2
input의 포커스되었을때 검정선이 사라지지 않아요
0
106
2
강의듣는법
1
99
1
아코디언 만들기 100%이하의 화면으로 보았을때
1
80
2
input checked 질문합니다.
0
82
1
Bracket Pair Colorizer - 비주얼 스튜디오
1
174
2
Part 1 영상 안나옵니다
1
105
1
제이쿼리 작동이 안됩니다
1
219
3
강의 내용 질문있습니다.
1
150
2
일정 부분만 주석하는 방법
1
250
2
폰트어썸
1
159
2
인접선택자에 대한 질문드립니다!
1
145
2
delay 적용 안됨
1
141
1
rotateY(360deg)가 적용이 안됩니다!
1
209
2
세로이동할때 height값
1
158
2
폰트어썸이 안되요..
1
525
2
화면 정중앙에 오게끔 할수있나요?
1
185
1
어코디언 네비게이션 중
1
136
1
라이브서버 문제
1
258
2
넷플릭스 어코디언 예제 질문
1
112
1
이번 강의에선 display flex가 무조건 적으로 필요한건가요 ?
1
170
1
active 관련 질문
1
162
2