Genie of the Lamp 😶‍🌫️ Genie of the Lamp 😶‍🌫️

동영상 반응형

• [CSS] 동영상 반응형 사이트에 추가하기

  Coding 2022. 11. 10. 16:22

  사이트에 동영상을 넣을 때 width값을 넣지 않으면 동영상 사이즈에 맞춰 노출되기 때문에 보통 width 값을 기본으로 넣어주게 됩니다. 하지만 width값을 고정으로 넣어주게 되면 반응형 웹의 경우 모바일이나 태블릿에서 동영상이 옆으로 넘쳐버리는 현상이 나타납니다. 그래서 반응형 웹은 동영상의 넓이와 높이값을 비율대로 늘어나도록 수정해야 합니다. 간단하게 html과 css로 수정할 수 있습니다. Your browser does not support the video tag. padding-bottom: 56.25%; 이 부분을 수정하면 비디오 비율 수정이 가능합니다. 56.25% 는 16:9 비율입니다. HTML 삽입 미리보기할 수 없는 소스 video 태그에 video라는 클래스를 추가해줬기 때문에..

  Read More