mirror of
https://github.com/atapas/html-tips-tricks.git
synced 2024-11-16 00:38:26 +01:00
Merge pull request #61 from ummeq/feature/embed-youtube
Feature: Adding Ifram tag to the list
This commit is contained in:
commit
5dc82b852f
3 changed files with 34 additions and 0 deletions
25
iframe/index.html
Normal file
25
iframe/index.html
Normal file
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset='utf-8'>
|
||||
<meta http-equiv='X-UA-Compatible' content='IE=edge'>
|
||||
<title>HTML Tips and Tricks - Meter</title>
|
||||
<meta name='viewport' content='width=device-width, initial-scale=1'>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Chilanka&display=swap" rel="stylesheet">
|
||||
<link rel='stylesheet' type='text/css' media='screen' href='../main.css'>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="demo">
|
||||
<a href="../index.html" class="home">
|
||||
<img src="../home.svg" alt="home" />
|
||||
</a>
|
||||
<h1>Iframe Tag</h1>
|
||||
<iframe src="https://www.youtube.com/embed/tgbNymZ7vqY"
|
||||
width="560" height="315" frameborder="0" allowfullscreen
|
||||
class="embed-youtube"></iframe>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
|
@ -91,6 +91,10 @@
|
|||
<a href='./lazy-loading/index.html'>
|
||||
Lazy Loading</a> - Lazy Load html images natively
|
||||
</li>
|
||||
<li>
|
||||
<a href='./iframe/index.html'>
|
||||
Iframe</a> - Embed YouTube Videos
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</body>
|
||||
|
|
5
main.css
5
main.css
|
@ -75,3 +75,8 @@ dialog::backdrop {
|
|||
);
|
||||
backdrop-filter: blur(3px);
|
||||
}
|
||||
|
||||
|
||||
.embed-youtube {
|
||||
border: 1px solid #ffffff;
|
||||
}
|
Loading…
Reference in a new issue