Untitled
unknown
plain_text
2 years ago
2.0 kB
17
Indexable
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>A4E1</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fork-awesome@1.2.0/css/fork-awesome.min.css"
integrity="sha256-XoaMnoYC5TH6/+ihMEnospgm0J1PM/nioxbOUdnM8HY=" crossorigin="anonymous">
<link rel="stylesheet" href="style.css">
<script type="module" src="infomessage.js"></script>
</head>
<body>
<div class="wrapper">
<info-message>
<span slot="title">Important!</span>
<ul slot="message">
<li>
<strong>Custom Element:</strong>
A set of JavaScript APIs that allow you to define custom elements and their behavior, which can then be
used as desired in your user interface.
</li>
<li>
<strong>Shadow DOM:</strong>
A set of JavaScript APIs for attaching
an encapsulated "shadow" DOM tree to an element — which is rendered
separately from the main document DOM — and controlling associated
functionality. In this way, you can keep an element's features
private, so they can be scripted and styled without the fear of
collision with other parts of the document.
</li>
<li>
<strong>HTML templates:</strong>
The <code><template></code> and <code><slot></code> elements
enable you to write markup templates that are not displayed in the
rendered page. These can then be reused multiple times as the basis
of a custom element's structure.
</li>
</ul>
</info-message>
</div>
</body>
</html>Editor is loading...
Leave a Comment