12. slider.html

Salida

Ábrelo en otra pestaña.

1<!DOCTYPE html>
2<html lang="es">
3
4<head>
5 <meta charset="UTF-8">
6 <meta name="viewport"
7 content="width=device-width">
8
9 <title>
10 Sliders - PWA con MD
11 </title>
12
13 <meta name="theme-color"
14 content="#fffbfe">
15 <link rel="icon" sizes="32x32"
16 href="favicon.ico">
17 <link rel="manifest"
18 href="site.webmanifest">
19
20 <link rel="stylesheet"
21 href="css/estilos.css">
22 <script
23 src="ungap/custom-elements.js">
24 </script>
25 <script type="module"
26 src="js/configura.js"></script>
27
28</head>
29
30<body>
31
32 <md-top-app-bar>
33
34 <h1>Sliders</h1>
35
36 <button is="md-menu-button"
37 slot="navigation"
38 onclick="nav.abre()"></button>
39
40 </md-top-app-bar>
41
42 <main>
43
44 <md-slider-field>
45 <label>Rango</label>
46 <input type="range"
47 slot="slider" min="1"
48 max="10">
49 <small slot="supporting">
50 Calcúlalo bien
51 </small>
52 </md-slider-field>
53
54 </main>
55
56 <nav-drw id="nav"></nav-drw>
57
58</body>
59
60</html>

Solo para los más rudos

skip_previous skip_next