youtube 동영상을 배경 화면으로
<! DOCTYPE html>
<html lang = "en">
<head>
<meta charset = "UTF-8">
<title> 유튜브 동영상 배경 </ title>
<style type = "text / css">
* {상자 크기 : 테두리 상자; }
.video-background {
배경 : # 000;
위치 : 고정;
상단 : 0; 오른쪽 : 0; 하단 : 0; 왼쪽 : 0;
Z- 색인 : -99;
}
.video-foreground,
.video-background iframe {
위치 : 절대;
상단 : 0;
왼쪽 : 0;
너비 : 100 %;
높이 : 100 %;
포인터 이벤트 : 없음;
}
@ 미디어 (최소 가로 세로 비율 : 16/9) {
.video-foreground {높이 : 300 %; 상단 : -100 %; }
}
@ 미디어 (최대 가로 세로 비율 : 16/9) {
.video-foreground {width : 300 %; 왼쪽 : -100 %; }
}
h1 {color : white;}
</ style>
</ head>
<body>
<div class = "video-background">
<div class = "video-foreground">
<iframe src = "https://www.youtube.com/embed/sbc2yBheAbo?controls=0&showinfo=0&rel=0&autoplay=1&loop=1&playlist=sbc2yBheAbo"frameborder = "0"allowfullscreen> </ iframe>
</ div>
</ div>
<h1> 악동 뮤득 </ h1>
</ body>
</ html>
'사이트관리' 카테고리의 다른 글
| 웹 디자이너 없이 손쉽게 배너 만들기! Canva.com (0) | 2018.03.13 |
|---|---|
| 무료 이미지 종합 모음 사이트 (0) | 2018.03.13 |
| SKT 통신사 기반 빅데이터 공개 서비스 - SKT Data Hub (0) | 2018.03.13 |
| 상업적으로 사용 가능한 한국의 전통문양 (0) | 2018.03.13 |
| 유튜브 동영상을 글 속에서 배경음으로 사용하기 - 자동 및 반복 재생 적용 (0) | 2018.03.13 |
| 공지글 모든 게시판에 보이는 기능 /bbs/ilst.php 수정 (0) | 2018.03.13 |
| 본문 내의 링크 타겟을 새창으로 열기 (0) | 2018.03.13 |
| 텍스트를 움짤로 만들어주는 곳 (0) | 2018.03.13 |