해상도 나 브라우저를 바꿀 때까지 내 웹 사이트는 멋지게 보입니다. 갑자기 유튜브 비디오가 코믹하게 비례합니다. 다른 모든 것은 잘 저울 렀고, 나는 그것들을 전혀 확장 할 수 없습니다. 나는 백분율로 설정하려고했지만 가장 가까운 컨테이너 (비디오)로만 확장했습니다. 또한 높이로 비율을 지정하는 것을 거부합니다.삽입 된 YouTube iframe을 확장하려면 어떻게해야합니까?
<aside id="video">
<iframe src="https://www.youtube.com/embed/-i3mX0YRrjM" width="320" height="190"></iframe>
</aside>
#video {
margin: auto;
width:320px;
height:190px;
box-shadow: 15px 15px 10px rgba(0,0,0,0.8);
}
높이 또는 너비 만 지정하면 다른 하나는 크기 조정이됩니다. 둘 다 지정하면 그렇지 않습니다.
위의 코드를 조정하여 개체의 너비 만 지정하면 ... 높이가 사용자의 필요에 맞게 자동 조절됩니까?
<div id="container">
<aside id="video">
<iframe src="https://www.youtube.com/embed/-i3mX0YRrjM" width="320" height="190"></iframe>
</aside>
</div>
#container {
margin:auto;
width:50%;
}
#video {
margin:auto;
position: relative;
padding-bottom: 56.25%;
padding-top: 25px;
box-shadow: 15px 15px 10px rgba(0,0,0,0.8);
}
#video iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
CSS의 #container 너비를 조정하여 크기를 조정하면됩니다.
Nah, 150px라고 생각하는 기본값으로 조정합니다. 하지만 결국 해결책을 생각해 냈습니다. 나는 그것을 게시 할 것이다. –
그리고 결국, 나는 지금 막 의미합니다. 나는 며칠 동안이 일을 해왔다. –