More about WEB PAGE
Anatomy of the <head>
Grouping content
- Understanding the need to group content
- Using the div Element
- Grouping content into lists
- Dealing with figures
Creating advanced tables
- Adding table headers cells
- Denoting the headings and the table body
- Creating irregular tables
- Applying borders to the table element
Form Handling
- The action attribute
- The method attribute
- Configuring the Data Encoding
- Controlling form completion
- Setting the name of the form
- Adding labels to a form
- Automatically focusing on an input element
- Disabling individual input elements
- Grouping form elements together
- Using the button element
Customizing the input element
- Using the input element for text input
- Setting values and using placeholders
- Using a data list
- Creating read-only and disabled text boxes
- Restrict data entry
Using input validation
The div element doesn’t have a specific meaning. You use it to create structure and give meaning to content when the other HTML elements are insufficient. The div element is the flow equivalent of the span element. It is an element that has no specific meaning, and can, therefore, be used to add customized structure to a document.
Using the div Element
<html>
<head>
<title>Example</title>
<meta name="author" content="Adam Freeman"/>
<meta name="description" content="A simple example"/>
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
<style>
.favorites {
background:grey;
color:white;
border: thin solid black;
padding: 0.2em;
}
</style>
</head>
<body>
<div class="favorites">
<p>I like apples and oranges.
I also like bananas, mangoes, cherries, apricots, plums, peaches and grapes.
You can see other fruits I like <a href="fruitlist.html">here</a>.</p>
<p>My favorite kind of orange is the mandarin, properly known
as <i>citrus reticulata</i>.
Oranges at my local store cost <s>$1 each</s> $2 for 3.</p>
</div>
<p><strong>Warning:</strong> Eating too many oranges can give you heart burn.</p>
<p>The <abbr title="Florida Department of Citrus">FDOC</abbr> regulates the
Florida citrus industry.</p>
<p>I still remember the best apple I ever tasted.
I bought it at <time datetime="15:00">3 o'clock</time>
on <time datetime="1984-12-7">December 7th</time>. </p>
</body>
</html>In this example, we have shown a slightly different use for the div element, which is to group multiple elements of a different type together so that they can be styled consistently. We could have added a class attribute to both of the p elements contained within the div, but this approach can be simpler and relies on the way that styles are inherited.