How to set Default CSS Settings of <legend> element

Most browsers will display the <legend> element with the following default values.

Change the default CSS settings to see the effect.

index.html

Example: HTML

<!DOCTYPE html>
<html>
<head>
<style>
legend { 
  display: block;
  padding-left: 2px;
  padding-right: 2px;
  border: none;
}
</style>
</head>
<body>

<p>A legend element is displayed like this:</p>

<fieldset>
  <legend>Personalia:</legend>
  Name: <input type="text"><br>
  Email: <input type="text"><br>
  Date of birth: <input type="text">
</fieldset>

<p>Change the default CSS settings to see the effect.</p>

</body>
</html>

Output should be:

Type:	html
Category:	Web Tutorial
Sub Category:	HTML Tag
Uploaded by:	Admin