Tutorial HTML <legend>:
HTML legend Tag - belajar html legend, element legend mempunyai definisi sebagai keterangan atau sebagai judul dari element
<fieldset>. Didalam penulisan html element <legend> ditulis setelah tag pembuka element <fieldset>.
Contoh HTML <legend>
<form>
<fieldset>
<legend>KOMENTAR</legend>
<textarea placeholder="masukan komentar kamu disini..."></textarea>
</fieldset>
</form>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Demo Triksonic</title>
<style>
textarea {
width : 100%;
height : 150px;
resize : none;
background : beige;
}
</style>
</head>
<body>
<form>
<fieldset>
<legend>KOMENTAR</legend>
<textarea placeholder="masukan komentar kamu disini..."></textarea>
</fieldset>
</form>
</body>
</html>
Attribute HTML <legend>
align :Digunakan untuk menentukan posisi / keselarasan.
Catatan : attribute ini sudah tidak berlaku lagi di HTML5, sebagai penggantinya gunakan CSS
Contoh :
<form>
<fieldset align="right">
<legend>KOMENTAR</legend>
<textarea placeholder="masukan komentar kamu disini..."></textarea>
</fieldset>
</form>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Demo Triksonic</title>
<style>
textarea {
width : 100%;
height : 150px;
resize : none;
background : beige;
}
</style>
</head>
<body>
<form>
<fieldset align="right">
<legend>KOMENTAR</legend>
<textarea placeholder="masukan komentar kamu disini..."></textarea>
</fieldset>
</form>
</body>
</html>
Global Attributes:
Element
<legend> mencakup Global Attributes HTML.
Event Attributes:
Element
<legend> mencakup Event Attributes HTML.
Browser Support :
Desktop
| Chrome | Ya |
|---|---|
| Safari | Ya |
| Firefox | Ya |
| Opera | Ya |
| IE | Ya |
| Edge | Ya |
Mobile
| Android Webview | Ya |
|---|---|
| Chrome Android | Ya |
| Edge Mobile | Ya |
| Firefox Android | Ya |
| Opera Android | Ya |
| iOs Safari | Ya |
| Samsung Internet | Ya |
Default CSS :
Browser yang support dengan element
<legend>, mempunyai nilai default :legend {
display: block;
padding-left: 2px;
padding-right: 2px;
border: none;
}