HTML HTML intro.
  1. HTML intro
  2. Web pages and you
HTML basics
  1. HTML getting started
  2. HTML basics
  3. HTML document
HTML text
  1. HTML text formatting 1
  2. HTML text formatting 2
  3. HTML text formatting 3
  4. HTML fonts
  5. HTML entities
HTML links
  1. HTML links
  2. HTML email links
HTML images
  1. HTML images
  2. HTML image maps
HTML forms
  1. HTML forms
  2. HTML form labels
  3. HTML fieldset/legend
HTML tables
  1. HTML tables
  2. HTML tables concepts
HTML frames
  1. HTML frames
HTML backgrounds/color
  1. HTML backgrounds
  2. HTML colors
  3. HTML color shades
  4. HTML color usage
HTML style/layout
  1. HTML stylesheets
  2. HTML div/span
HTML media
  1. HTML audio
  2. HTML video
  3. HTML objects
  4. HTML download media
HTML declaratives
  1. HTML head section
  2. HTML meta tags
  3. HTML scripts
  4. HTML declarations
  5. HTML document types
Practical HTML
  1. HTML tag rules
  2. HTML things to avoid
  3. URL formatting
  4. URL encoding/decoding
  5. HTML use/access
  6. HTML publish work
HTML extras
  1. HTML marquees
HTML wrap-up
  1. HTML history
  2. HTML summary

HTML fieldset/legend tags

HTML provides some tags that place an emphasis on certain content and at the same time add some style to a webpage.

This tutorial focuses on:

The <fieldset> tag

The <fieldset> tag creates a box around content that places emphasis on it.

Example:
<fieldset> <p>HTML is a markup language</p> <p>HTML is used for the web</p> <p>HTML is good to know</p> <p>Another web language is Javascript</p> </fieldset>
Output:

HTML is a markup language

HTML is used for the web

HTML is good to know

Another web language is Javascript

The <legend> tag

The <legend> tag will add some title text to the box created by the <fieldset> tag. This title text will appear at the top left of the box created by the <fieldset> tag.

Example:
<fieldset> <legend>Web languages</legend> <p>HTML is a markup language</p> <p>HTML is used for the web</p> <p>HTML is good to know</p> <p>Another web language is Javascript</p> </fieldset>
Output:
Web languages

HTML is a markup language

HTML is used for the web

HTML is good to know

Another web language is Javascript

Combining a fieldset/legend with a form

A fieldset/legend combination can be used with just about any content you want, but using it with forms is probably the best option.

Adding a fieldset/legend to a form makes the form stand out, adds style to it, and makes it more official by having a title at the top of it.

A form without a fieldset/legend:
<form> Name: <input type="text" name="Name" size="15" /> <br /> Email: <input type="email" name="Email" size="15" /> <br /> Message: <br /> <textarea cols="20" rows="20"></textarea> <br /> <input type="submit" value="Submit" /> </form>
Output:
Name: Email:
Message:
The same form but this time with a fieldset/legend:
<form> <fieldset> <legend>Contact Us</legend> Name: <input type="text" name="Name" size="15" /> <br /> Email: <input type="email" name="Email" size="15" /> <br /> Message: <br /> <textarea cols="20" rows="20"></textarea> <br /> <input type="submit" value="Submit" /> </fieldset> </form>
Output:
Contact Us Name: Email:
Message:
© Copyright 2013-2014 Landofcode.com
Terms of use | Privacy policy | Copyright information