Fieldsets and labels : label « Form « HTML / CSS






  1. HTML / CSS
  2. Form
  3. label

Fieldsets and labels

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>Fieldsets and labels</title>
</head>

<body>
 
  <form method="post" action="/">
    
    <fieldset> 
      <legend>Subscribe to our mailing list</legend> 
        <p> 
          <label for="email">Your E-mail address</label> 
          <input type="text" name="email" id="email" /> 
        </p> 
        <fieldset> 
          <legend>Select your preferred format</legend> 
          <ul> 
            <li> 
              <label for="text"> 
                <input type="radio" name="pref" value="text" id="text" /> Plain text 
              </label> 
            </li> 
            <li> 
               <label for="html"> 
                 <input type="radio" name="pref" value="html" id="html" /> HTML 
               </label> 
            </li> 
          </ul> 
        </fieldset> 
      <p><input type="submit" id="subscribe" value="Subscribe" /></p> 
    </fieldset>
     
  </form>

</body>
</html>








Related examples in the same category

1.'label' creates a label and associates it with another element
2.label:after
3.Using the label for element
4.Set style for form label
5.Set font for label
6.Use different font for label and other form controls
7.Set margin-top and display style for label
8.Set label control for right text alignment, padding right 20px
9.Set label after style
10.Set color, background color and font for a label control
11.Set Label padding and text transformation
12.Set label font family and font size
13.Inline label
14.Label style text-align: right
15.label background-color: pink;
16.label color: black;
17.label font-weight: bold;
18.label padding: 4px;
19.label text-transform: uppercase;
20.label font-family: Verdana, Arial, Helvetica, sans-serif;
21.label font-size: xx-small;
22.Positioning labels
23.Label above
24.label display: block;
25.label font-weight:bold;
26.label margin:5px 0;
27.label font-weight:bold;
28.label font-family: "Trebuchet MS", Verdana, Halvetica, Arial;
29.label font-size: 12px;
30.label color: #040507;
31.label display: block;
32.label text-align: right;
33.label width: 100px;
34.Adding underline for labels
35.Place label on the top of a field
36.label text-align: left; text-align: center;
37.Labelled fields
38.Using the label element
39.Implicit labels
40.label float:left; width:100px;
41.Aligning labels with List
42.Block-level labels
43.Top-positioned Text Labels
44.Left-aligned Text Labels