[기타] 아이프레임 반응형 100%로 아닌 특정 크기로 가운데 정렬하기

페이지 정보

yadolee 루루아빠 3,370 2015.09.11 02:26:39

평점

  • 평점 : 0점 (0명 참여)

본문

다음 소스를 이용하도록 한다.

    <div class="responsive-video" style="width:넓이수치px;max-width:100%;margin-left:auto;margin-right:auto">
      <iframe src="주소" width="넓이수치" height="높이수치" allowfullscreen="" frameborder="0" >
      </iframe>
    </div>

핵심은 아이프레임을 div로 감싸고 부트스트랩의 클래스(responsive-video)를 사용하며 스타일을 지정하는 것이다.
 
추천인
  • 추천해 주세요
yadolee
6
루루아빠 - 회원등급 : 최고관리자 - 포인트 : 1,332,814
레벨 100
경험치 1,488,440

Progress Bar 11.47%

- 가입일 : 2015-03-04 03:24:54
- 서명 : KNOW YOUR LIMITS BUT NEVER STOP TRYING TO EXCEED THEM !!
- 자기소개 : 루루의 자랑 루루아빠랍니다~~

댓글

첫 번째 댓글을 남겨 주세요

Total 7622739 페이지

제목 글쓴이 날짜 조회 추천
그누•영카트  🏆 그누보드 5.3.1.4 패치 루루아빠 2018.06.06 2,356 0
jQuery  🏆 모바일 및 태블릿에서 스크롤이 아닌 경우에만 터치 제어하기 shadow2fox 2018.08.13 2,350 0
그누•영카트  댓글+1🏆 그누보드 5.4.1.9 shadow2fox 2020.02.08 2,347 1
이윰  🏆 유튜브 재생목록(플레이리스트)이 적용되지 않는다면 shadow2fox 2018.07.29 2,346 0
이윰  🏆 마우스 오버시 이전글 다음글에 제목을 띄우기 shadow2fox 2018.11.27 2,340 0
그누•영카트  🏆 영카트 5.3.3.1 shadow2fox 2019.07.16 2,339 0
이윰  댓글+1🏆 카카오TV 올바르게 적용하기 shadow2fox 2020.01.29 2,329 1
그누•영카트  🏆 그누보드 5.3.1.7 패치 shadow2fox 2018.09.18 2,323 0
이윰  🏆 jQuery-1.8.3를 jQuery-1.9.x 이상으로 업그레이드시 masonry 오류 해결하기 shadow2fox 2018.08.22 2,323 0
이윰  댓글+1🏆 팝업창 페이지에서도 띄우기 shadow2fox 2019.02.05 2,322 1
이윰  댓글+2🏆 EXIF 정보 이미지 넓이에 맞게 조정하기 shadow2fox 2020.11.21 2,314 2
그누•영카트  🏆 영카트 5.3.2.3 shadow2fox 2018.12.29 2,313 0
그누•영카트  댓글+1🏆 그누보드 5.4.4.8 shadow2fox 2021.01.19 2,312 1
그누•영카트  댓글+1🏆 그누보드 5.4.2.5 shadow2fox 2020.05.09 2,312 1
그누•영카트  🏆 영카트 5.3.1.6 패치 shadow2fox 2018.08.25 2,308 0
jQuery  🏆 마우스 클릭 및 엔터를 일정 초 이상 유지하면 특정 url로 이동하기 shadow2fox 2018.07.11 2,306 0
그누•영카트  🏆 영카트 5.3.2.4 shadow2fox 2019.01.08 2,298 0
그누•영카트  🏆 그누보드 5.3.1.6 패치 shadow2fox 2018.08.25 2,293 0
CSS  🏆 특정 아이디나 클래스 이후에 특정 아이디나 클래스가 있을 때 shadow2fox 2018.08.15 2,293 0
이윰  댓글+5🏆 유튜브 "이 동영상은 볼 수 없습니다" 해결하기 shadow2fox 2023.02.20 2,288 3