html css, youtube iframe responsive > 개발

사이트 내 전체검색

개발

html css, youtube iframe responsive

페이지 정보

작성자 관리자 (112.♡.173.204)
댓글 0건 조회 1,669회 작성일 22-02-03 13:38

본문

CSS
```
.youtube-video-wrapper {position:relative;padding-bottom:56.25%;height:0;overflow:hidden;}
.youtube-video-wrapper iframe, .youtube-video-wrapper object, .youtube-video-wrapper embed {position:absolute;top:0;left:0;width:100%;height:100%;}
```

HTML
```
<div class="youtube-video-wrapper"><iframe src="https://www.youtube.com/embed/WMweEpGlu_U?rel=0" frameborder="0"></iframe></div>
```

## 참고
https://avexdesigns.com/blog/responsive-youtube-embed
https://stackoverflow.com/questions/52393814/css-100-width-of-youtube-embed-video

추천0

댓글목록

등록된 댓글이 없습니다.

개발 목록
번호	제목	조회	날짜
346	Windows 10 , 11 에서 작업표시줄 미리보기 비활성화하기 끄기	3199	06-15
345	PHP simple html dom 에서 find 로 여러 class 명을 한꺼번에 선택하기 multiple	1793	05-04
344	HTTP 상태 코드 http status code 301 302 차이	1526	03-11
343	그누보드 데이터를 json 으로 내보내고, javascript 에서 사용하기	1982	03-04
342	OpenLayers 오픈레이어에서 좌표값 변환	1915	02-21
341	http referer 정보 숨기기	2098	02-20
340	SFTP 에서 상위 디렉토리(폴더) 접근 제한 - 미완성 문서	2256	02-18
339	javascript 함수 순차적 실행 방법, 동기화 지연 등등	1778	02-15
338	gnuboard 스크립트 실행 소요시간 측정 방법 및 유의사항	1613	02-13
337	phpMyAdmin 에서 mysql view 생성(create) 수정(edit) 삭제(drop) 방법	2114	02-08
336	다음 카카오 맵 파라미터 들	1636	02-08
열람중	html css, youtube iframe responsive	1670	02-03
334	css three dots button menu 삼점 버튼 메뉴 만들기	1581	01-31
333	jquery 특정 요소에 포커스 없애기 focus blur	2676	01-29
332	javascript 키보드 이벤트 keydown keyup 를 위한 addEventListener 사용법	1601	01-28
331	PHP 에서 배열 선언시 array() 와 [] 의 차이점	1468	01-13
330	PHP 에서 boolean 변수의 값 true false 를 echo 로 그대로 찍는 방법	1725	12-23
329	gnuboard 그누보드 5 에서의 특이한 함수들	2410	12-20
328	Android WebView 에서 가로 세로 Rotate 전환시에 웹뷰가 새로고침 되는 현상	4470	05-19
327	jQuery The jqXHR.success(), jqXHR.error(), and jqXHR.complete() callbacks are removed as of jQuery 3.0	3681	05-15

개발 목록

번호

제목

조회

추천

날짜

346

Windows 10 , 11 에서 작업표시줄 미리보기 비활성화하기 끄기

3199

06-15

345

PHP simple html dom 에서 find 로 여러 class 명을 한꺼번에 선택하기 multiple

1793

05-04

344

HTTP 상태 코드 http status code 301 302 차이

1526

03-11

343

그누보드 데이터를 json 으로 내보내고, javascript 에서 사용하기

1982

03-04

342

OpenLayers 오픈레이어에서 좌표값 변환

1915

02-21

341

http referer 정보 숨기기

2098

02-20

340

SFTP 에서 상위 디렉토리(폴더) 접근 제한 - 미완성 문서

2256

02-18

339

javascript 함수 순차적 실행 방법, 동기화 지연 등등

1778

02-15

338

gnuboard 스크립트 실행 소요시간 측정 방법 및 유의사항

1613

02-13

337

phpMyAdmin 에서 mysql view 생성(create) 수정(edit) 삭제(drop) 방법

2114

02-08

336

다음 카카오 맵 파라미터 들

1636

02-08

열람중

html css, youtube iframe responsive

1670

02-03

334

css three dots button menu 삼점 버튼 메뉴 만들기

1581

01-31

333

jquery 특정 요소에 포커스 없애기 focus blur

2676

01-29

332

javascript 키보드 이벤트 keydown keyup 를 위한 addEventListener 사용법

1601

01-28

331

PHP 에서 배열 선언시 array() 와 [] 의 차이점

1468

01-13

330

PHP 에서 boolean 변수의 값 true false 를 echo 로 그대로 찍는 방법

1725

12-23

329

gnuboard 그누보드 5 에서의 특이한 함수들

2410

12-20

328

Android WebView 에서 가로 세로 Rotate 전환시에 웹뷰가 새로고침 되는 현상

4470

05-19

327

jQuery The jqXHR.success(), jqXHR.error(), and jqXHR.complete() callbacks are removed as of jQuery 3.0

3681

05-15

1		범죄도시4	148,811
2	2	스턴트맨	8,587
3		애비게일	5,189
4	1	남은 인생 10년	4,673
5	3	쿵푸팬더4	4,575
6	1	파묘	2,286
7	2	챌린저스	1,634
8	5	포켓몬스터: 성도지방 이야기, 최	1,446
9	3	꼬마참새 리차드: 신비한 보석 탐	762
10		혹성탈출: 새로운 시대	624