<!--.:◂◀▸v▶¤◀v∫∫v▶¤◀v∫∫‡####‡‡‡‡###‡‡‡###‡‡####‡∫∫v▶¤◀v∫∫v▶¤◀v◂▶▸:.
| |
| Filename : NK_text-decoration.html |
| Label : Basics |
| Author : Nina Kahmke |
| Size : 3.163 bytes (4 KB on disk) |
| Created : 02. February 2024 at 17:04 |
| |
::◂◀▸v▶¤◀v∫∫v▶¤‡‡##‡‡‡‡‡‡‡‡###‡‡###‡‡‡‡##‡‡‡‡##‡‡¤◀v∫∫v▶¤◀v◂▶▸::-->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>text-decoration</title>
<style>
@font-face {
font-family: Konsole;
src: url(../_fonts/Konsolev1.1-VF.ttf);
}
body {
font-family: Konsole;
font-size: 6vh;
text-align: center;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
overflow: hidden;
height: 100vh;
}
p {
margin: 0.33em 0;
}
.V01 {
/* defines a basic underline */
text-decoration: underline;
}
.V02 {
/* defines an underline with a specified thickness of 10px */
text-decoration: underline;
-webkit-text-decoration: underline;
-webkit-text-decoration-thickness: 10px;
text-decoration-thickness: 10px;
}
.V03 {
/* defines an underline with a dotted line style */
text-decoration: underline dotted;
-webkit-text-decoration: underline dotted;
}
.V04 {
/* defines an underline with a dotted line style and a specified thickness of 10px */
text-decoration: underline dotted 10px;
-webkit-text-decoration: underline dotted 10px;
}
.V05 {
/* defines a wavy underline */
text-decoration: wavy underline;
-webkit-text-decoration: wavy underline;
}
.V06 {
/* defines a wavy underline with a specified thickness of 0.2px */
text-decoration: wavy underline 0.2px;
-webkit-text-decoration: wavy underline 0.2px;
}
.V07 {
/* defines an combination of under- and overline */
text-decoration: underline overline;
}
.V08 {
/* defines an line-through (strikethrough) */
text-decoration: line-through;
}
.V09 {
/* defines an combination of underline, overline, and line-through */
text-decoration: underline overline line-through;
}
</style>
</head>
<body>
<p class="V01"> underline </p>
<p class="V02"> thick underline </p>
<p class="V03"> underline dotted </p>
<p class="V04"> thick underline dotted </p>
<p class="V05"> wavy underline </p>
<p class="V06"> thin wavy underline </p>
<p class="V07"> underline & overline </p>
<p class="V08"> line-through </p>
<p class="V09"> linethrough & underline & overline </p>
</body>
</html>