50 lines
753 B
HTML
50 lines
753 B
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="utf-8">
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
|
|
<title>Web Components</title>
|
||
|
|
<link rel="stylesheet" href="main.css">
|
||
|
|
<script src="main.js" type="module"></script>
|
||
|
|
<script src="poots.js" type="module"></script>
|
||
|
|
|
||
|
|
</head>
|
||
|
|
|
||
|
|
<body>
|
||
|
|
<header>
|
||
|
|
|
||
|
|
<h1>Web Components Practice</h1>
|
||
|
|
|
||
|
|
</header>
|
||
|
|
|
||
|
|
<h3>Check out these custom web components below!</h3>
|
||
|
|
|
||
|
|
|
||
|
|
<h4>Web Component 1</h4>
|
||
|
|
<poots-poot>
|
||
|
|
|
||
|
|
<h4 slot="keyblades">my favorite keyblades</h4>
|
||
|
|
<ul slot="list">
|
||
|
|
|
||
|
|
<li>
|
||
|
|
Kingdom Key
|
||
|
|
</li>
|
||
|
|
|
||
|
|
<li>
|
||
|
|
Ultima Weapon
|
||
|
|
</li>
|
||
|
|
|
||
|
|
<li>
|
||
|
|
Decisive Pumpkin
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</poots-poot>
|
||
|
|
|
||
|
|
<h4>Web Component 2</h4>
|
||
|
|
|
||
|
|
|
||
|
|
<h4>Web Component 3</h4>
|
||
|
|
|
||
|
|
|
||
|
|
<h4>Web Component 4</h4>
|
||
|
|
</html>
|