Exercise

Now that we are familiar with the various elements that make up a form, it is time for you to try to put one together yourself. Open up your index.html file and copy the above example into it. Now you can experiment around with the various different input types available to us, and explore what happens when you submit the form. How are the values displayed in the draft email? Try removing a name attribute from one of the fields. How does it affect things? Why not try expanding upon the example given above and introduce field sets and legends to improve its usability?

Divs and spans

Div

A div is a block-level element that acts a bit like a container. It is used to group together content on our webpage. It is most useful as a method of grouping content into an easily targetable element. The <div> element has no required attributes; however, both id and class attributes are often used in conjunction with divs as a method of giving the content a name that canbe used for styling the group. The syntax for using a <div> element is nice and simple. We simply wrap our <div> opening and closing tags around the content we want to group logically. For example, we might have an <h1> tag followed by a series of paragraphs about the headline, relating to a topic like so: