HTML тег <legend>
Опубликовано: 1 Марта, 2022
Тег легенды используется для определения заголовка дочернего содержимого. Элементы легенды являются родительским элементом. Этот тег используется для определения заголовка для элемента <fieldset>.
Синтаксис
<legend> Текст </legend>
Example 1:
html
<!DOCTYPE html><html> <head> </head> <body> <h1>GeeksforGeeks</h1> <strong>HTML Legend Tag</strong> <form> <fieldset> <!-- Legend tag useing --> <legend>STUDENT::</legend> <label>Name:</label> <input type="text"> <br><br> <label>Email:</label> <input type="text"> <br><br> <label>Date of birth:</label> <input type="text"> <br><br> <label>Address:</label> <input type="text"> <br><br> <label>Enroll No:</label> <input type="text"> </fieldset> </form> </body></html> |
Выход:
Example 2: Styling the legend tag using CSS properties.
html
<!DOCTYPE html><html> <head> <style> form{ width: 50%; } legend { display: block; padding-left: 10px; padding-right: 10px; border: 3px solid green; background-color:tomato; color:white;; } label { display: inline-block; float: left; clear: left; width: 90px; margin:5px; text-align: left; } input[type="text"] { width:250px; margin:5px 0px; } .gfg { font-size:40px; color:green; font-weight:bold; } </style> </head> <body> <div class = "gfg">GeeksforGeeks</div> <h2>HTML Legend Tag</h2> <form> <fieldset> <!-- Legend tag using --> <legend>STUDENT:</legend> <label>Name:</label> <input type="text"> <br> <label>Email:</label> <input type="text"> <br> <label>Date of birth:</label> <input type="text"> <br> <label>Address:</label> <input type="text"> <br> <label>Enroll No:</label> <input type="text"> </fieldset> </form> </body></html> |
Выход:
Поддерживаемые браузеры:
- Гугл Хром
- Internet Explorer
- Fire Fox
- Опера
- Сафари