Cara Membuat Legend Berada di Tengah Pada Tag Filedset
Salam hangat teman-teman, semoga teman-teman sehat selalu ya, di panduan kali ini saya akan mencoba membagi Cara Merancang Legend Berada di Tengah Di Tag Filedset.
Guna dari tag fieldset ialah mempercantik tampilan form dimana teman-teman gunakan bagi membangun form login atau yang lain. Nah, guna tag legend sendiri ialah bagi memberi judul di form yang berada di tag fieldset. Di kasus kali ini saya akan membangun legend itu berada di tengah posisinya dimana letak defautl tag legend ialah di posisi kiri.
Kini saya akan mencoba membangun posisi tag legend menjadi di tengah, berikut panduan singkat mengenai Cara Merancang Legend Berada di Tengah Di Tag Filedset:
– Pertama-tama teman-teman ketikan kode HTML di bawah ini:
<!DOCTYPE html>
<html>
<head>
<title>Legend</title>
<link rel=stylesheet href=style.css>
</head>
<body>
<form>
<fieldset>
<legend>Dumenity</legend>
<label for=name>Username:</label>
<input type=text name=name id=name />
<br />
<label for=mail>E-mail:</label>
<input type=email name=mail id=mail />
<br />
<label for=address>Address:</label>
<input type=text name=address id=address size=40 />
</fieldset>
</form>
</body>
</html>
Jangan lupa save dengan nama index.html
– Kedua teman-teman ketikan kode CSS3 di bawah ini:
form{width: 500px; margin: auto}
fieldset {
padding: 1em;
font:80%/1 sans-serif;
border:5px solid #35d5cf
}
input[type=text]{margin-bottom: 10px}
input[type=email]{margin-bottom: 10px}
label {
float:left;
width:25%;
margin-right:0.5em;
padding-top:0.2em;
text-align:right;
font-weight:bold;
}
legend {
padding: 0.2em 0.5em;
border:5px solid #35d5cf;
color:green;
font-size:90%;
text-align:right;
}Save dengan nama style.css, apabila teman-teman buka di browser karenanya akan menjadi seperti ini:
– Ketiga teman-teman buka file html teman-teman lalu ketikan “align=center” di pada tag legend, seperti kode di bawah:
<legend align=center>Dumenity</legend>
Karenanya hasilnya akan seperti ini:
Bagaimana teman-teman lumayan mudahkan Merancang Legend Berada di Tengah Di Tag Filedset.
Sekianlah panduan saya bagi kali ini mengenai Cara Merancang Legend Berada di Tengah Di Tag Filedset.
Sehat selalu ya teman-teman, selamat mencoba.
Sumber https://kursuswebsite.org
