Robot
/
html-tips-tricks
mirror of https://github.com/atapas/html-tips-tricks.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Favicons updated for all html files

This commit is contained in:
Shubham Kumar 2022-10-06 03:01:17 +05:30
parent bbb47c5a32
commit 2545136518
15 changed files with 234 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
content-editable/index.html
View File

@ -8,6 +8,20 @@
<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'>
<link rel='stylesheet' type='text/css' media='screen' href='../main.css'>
<link rel="apple-touch-icon" sizes="57x57" href="../favicons//apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="../favicons//apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="../favicons//apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="../favicons//apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="../favicons//apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="../favicons//apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="../favicons//apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="../favicons//apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="../favicons//apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="../favicons//android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="../favicons//favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="../favicons//favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="../favicons//favicon-16x16.png">
</head>
<body>

20
data-attribute/index.html
View File

@ -8,6 +8,20 @@
<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'>
<link rel='stylesheet' type='text/css' media='screen' href='../main.css'>
<link rel="apple-touch-icon" sizes="57x57" href="../favicons//apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="../favicons//apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="../favicons//apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="../favicons//apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="../favicons//apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="../favicons//apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="../favicons//apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="../favicons//apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="../favicons//apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="../favicons//android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="../favicons//favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="../favicons//favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="../favicons//favicon-16x16.png">
<script>
function reveal() {
@ -25,9 +39,9 @@
<img src="../home.svg" alt="home" />
</a>
<h2> Know data attribute </h2>
<div
class="data-attribute"
id="data-attr"
<div
class="data-attribute"
id="data-attr"
data-custom-attr="You are just Awesome!"> I have a hidden secret!
</div>
<button onclick="reveal()">Reveal</button>

16
datalist/index.html
View File

@ -8,6 +8,20 @@
<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'>
<link rel='stylesheet' type='text/css' media='screen' href='../main.css'>
<link rel="apple-touch-icon" sizes="57x57" href="../favicons//apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="../favicons//apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="../favicons//apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="../favicons//apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="../favicons//apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="../favicons//apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="../favicons//apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="../favicons//apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="../favicons//apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="../favicons//android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="../favicons//favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="../favicons//favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="../favicons//favicon-16x16.png">
</head>
<body>
@ -27,7 +41,7 @@
<option value="Avacado">
</datalist>
<input type="submit">
</form>
</form>
</div>
</body>

14
details/index.html
View File

@ -8,6 +8,20 @@
<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'>
<link rel='stylesheet' type='text/css' media='screen' href='../main.css'>
<link rel="apple-touch-icon" sizes="57x57" href="../favicons//apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="../favicons//apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="../favicons//apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="../favicons//apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="../favicons//apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="../favicons//apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="../favicons//apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="../favicons//apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="../favicons//apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="../favicons//android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="../favicons//favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="../favicons//favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="../favicons//favicon-16x16.png">
</head>
<body>

28
dialog/index.html
View File

@ -8,6 +8,20 @@
<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'>
<link rel='stylesheet' type='text/css' media='screen' href='../main.css'>
<link rel="apple-touch-icon" sizes="57x57" href="../favicons//apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="../favicons//apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="../favicons//apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="../favicons//apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="../favicons//apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="../favicons//apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="../favicons//apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="../favicons//apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="../favicons//apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="../favicons//android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="../favicons//favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="../favicons//favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="../favicons//favicon-16x16.png">
</head>
<body>
@ -27,23 +41,23 @@
<button>Close me</button>
</menu>
</form>
</dialog>
</dialog>
</div>
<script>
// Get the modal
const dialog = document.getElementById("dialog");
const btn = document.getElementById("openDlg");
// When the user clicks the button, open the dialog
// When the user clicks the button, open the dialog
btn.onclick = function() {
dialog.showModal();
}
</script>
</body>
</html>

24
inputs/index.html
View File

@ -8,7 +8,19 @@
<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'>
<link rel="apple-touch-icon" sizes="57x57" href="../favicons//apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="../favicons//apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="../favicons//apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="../favicons//apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="../favicons//apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="../favicons//apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="../favicons//apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="../favicons//apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="../favicons//apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="../favicons//android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="../favicons//favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="../favicons//favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="../favicons//favicon-16x16.png">
<script>
function showColor(event) {
let colorHex = event.target.value;
@ -68,14 +80,14 @@
<h2>Regex validations</h2>
<form>
<label for="password">Strong password($Password1234):</label>
<input type="password"
name="password"
id="password"
placeholder="6-20 chars, at least 1 digit, 1 uppercase and one lowercase letter"
<input type="password"
name="password"
id="password"
placeholder="6-20 chars, at least 1 digit, 1 uppercase and one lowercase letter"
pattern="^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{6,20}$" autofocus required>
<button type="submit"> Test </button>
</form>
</div>
</div>
</div>
</body>

14
map/clown.htm
View File

@ -8,6 +8,20 @@
<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'>
<link rel='stylesheet' type='text/css' media='screen' href='../main.css'>
<link rel="apple-touch-icon" sizes="57x57" href="../favicons//apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="../favicons//apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="../favicons//apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="../favicons//apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="../favicons//apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="../favicons//apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="../favicons//apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="../favicons//apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="../favicons//apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="../favicons//android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="../favicons//favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="../favicons//favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="../favicons//favicon-16x16.png">
</head>
<body>

14
map/elephant.htm
View File

@ -8,6 +8,20 @@
<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'>
<link rel='stylesheet' type='text/css' media='screen' href='../main.css'>
<link rel="apple-touch-icon" sizes="57x57" href="../favicons//apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="../favicons//apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="../favicons//apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="../favicons//apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="../favicons//apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="../favicons//apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="../favicons//apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="../favicons//apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="../favicons//apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="../favicons//android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="../favicons//favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="../favicons//favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="../favicons//favicon-16x16.png">
</head>
<body>

14
map/horse.htm
View File

@ -8,6 +8,20 @@
<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'>
<link rel='stylesheet' type='text/css' media='screen' href='../main.css'>
<link rel="apple-touch-icon" sizes="57x57" href="../favicons//apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="../favicons//apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="../favicons//apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="../favicons//apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="../favicons//apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="../favicons//apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="../favicons//apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="../favicons//apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="../favicons//apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="../favicons//android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="../favicons//favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="../favicons//favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="../favicons//favicon-16x16.png">
</head>
<body>

14
map/index.html
View File

@ -8,6 +8,20 @@
<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'>
<link rel='stylesheet' type='text/css' media='screen' href='../main.css'>
<link rel="apple-touch-icon" sizes="57x57" href="../favicons//apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="../favicons//apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="../favicons//apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="../favicons//apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="../favicons//apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="../favicons//apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="../favicons//apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="../favicons//apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="../favicons//apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="../favicons//android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="../favicons//favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="../favicons//favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="../favicons//favicon-16x16.png">
</head>
<body>

14
map/lion.htm
View File

@ -7,6 +7,20 @@
<title>HTML Tips and Tricks - Map</title>
<meta name='viewport' content='width=device-width, initial-scale=1'>
<link rel='stylesheet' type='text/css' media='screen' href='../main.css'>
<link rel='stylesheet' type='text/css' media='screen' href='../main.css'>
<link rel="apple-touch-icon" sizes="57x57" href="../favicons//apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="../favicons//apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="../favicons//apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="../favicons//apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="../favicons//apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="../favicons//apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="../favicons//apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="../favicons//apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="../favicons//apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="../favicons//android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="../favicons//favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="../favicons//favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="../favicons//favicon-16x16.png">
</head>
<body>

14
mark/index.html
View File

@ -8,6 +8,20 @@
<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'>
<link rel='stylesheet' type='text/css' media='screen' href='../main.css'>
<link rel="apple-touch-icon" sizes="57x57" href="../favicons//apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="../favicons//apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="../favicons//apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="../favicons//apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="../favicons//apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="../favicons//apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="../favicons//apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="../favicons//apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="../favicons//apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="../favicons//android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="../favicons//favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="../favicons//favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="../favicons//favicon-16x16.png">
</head>
<body>

16
meter/index.html
View File

@ -8,6 +8,20 @@
<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'>
<link rel='stylesheet' type='text/css' media='screen' href='../main.css'>
<link rel="apple-touch-icon" sizes="57x57" href="../favicons//apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="../favicons//apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="../favicons//apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="../favicons//apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="../favicons//apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="../favicons//apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="../favicons//apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="../favicons//apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="../favicons//apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="../favicons//android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="../favicons//favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="../favicons//favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="../favicons//favicon-16x16.png">
</head>
<body>
@ -18,7 +32,7 @@
<h2> Meter </h2>
<label for="home">/home/atapas</label>
<meter id="home" value="4" min="0" max="10">2 out of 10</meter><br>
<label for="root">/root</label>
<meter id="root" value="0.6">60%</meter><br>

16
output/index.html
View File

@ -6,8 +6,22 @@
<meta http-equiv='X-UA-Compatible' content='IE=edge'>
<title>HTML Tips and Tricks - Output</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 href="https://fonts.googleapis.com/css2?family=Chilanka&display=swap" rel="stylesheet">
<link rel='stylesheet' type='text/css' media='screen' href='../main.css'>
<link rel='stylesheet' type='text/css' media='screen' href='../main.css'>
<link rel="apple-touch-icon" sizes="57x57" href="../favicons//apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="../favicons//apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="../favicons//apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="../favicons//apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="../favicons//apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="../favicons//apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="../favicons//apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="../favicons//apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="../favicons//apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="../favicons//android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="../favicons//favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="../favicons//favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="../favicons//favicon-16x16.png">
</head>
<body>

28
range/index.html
View File

@ -7,8 +7,22 @@
<meta http-equiv='X-UA-Compatible' content='IE=edge'>
<title>HTML Tips and Tricks - Range Slider</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 href="https://fonts.googleapis.com/css2?family=Chilanka&display=swap" rel="stylesheet">
<link rel='stylesheet' type='text/css' media='screen' href='../main.css'>
<link rel='stylesheet' type='text/css' media='screen' href='../main.css'>
<link rel="apple-touch-icon" sizes="57x57" href="../favicons//apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="../favicons//apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="../favicons//apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="../favicons//apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="../favicons//apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="../favicons//apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="../favicons//apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="../favicons//apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="../favicons//apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="../favicons//android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="../favicons//favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="../favicons//favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="../favicons//favicon-16x16.png">
<script>
function changeValue(event) {
@ -26,12 +40,12 @@
</a>
<h1>Slider</h1>
<form method="post">
<input
type="range"
name="range"
min="0"
max="100"
step="1"
<input
type="range"
name="range"
min="0"
max="100"
step="1"
value=""
onchange="changeValue(event)"/>
</form>