Searchbox is here: Alt plus 4 |
|Go to main content|
Accessibility information page| |
||||||
![]() |
Online Accessibility
D
...a better web for everyone! |
||||||
Navigation begins hereHome (1)| |
Tutorial (U)| | Formats (F)| | Tags (G)| | Tools (L)| | Resources (R)| | Questions? (Q)| | |
Tags|Alt| Div| I D| Meta| T H| |
DIVThe DIV tag stands for "division" and can be an effective way to arrange page content when used in conjuction with style sheets. It is especially helpful as an alternative to table-based layout. Since screen readers read from top to bottom through html code, sections of content can be read in a different order than they appear visually. For example, a page layout can have navigation appear at the top of a document, followed by the content by using style sheets. However, content will be read first if the code for it precedes the code for navigation, eliminating the need for a "skip to content" tag. This can be seen in an example of the div tag. The C S S code used to position and format the div tag example is shown below: Code Example: .NavigationLocation {
font-family: Arial, Helvetica, sans-serif;
font-size: 0.75em;
top: 0%;
font-weight: bold;
position: absolute;
left: 10%;
background-image: none;
background-color: #66FFFF;
height: 50px;
width: 40%;
text-indent: 2em;
margin: 0px;
padding-top: 5px;
padding-left: 2px;
}
.ContentLocation {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 0.9em;
top: 50px;
position: absolute;
left: 10%;
height: 30%;
width: 40%;
padding-left: 2px;
padding-top: 10px;
}
.SectionLocation {
font-family: "Courier New", Courier, mono;
font-size: 0.7em;
position: absolute;
left: 0px;
top: 0px;
overflow: visible;
width: 10%;
height: 150px;
font-weight: bold;
background-image: none;
background-color: #FFFF00;
text-align: left;
text-indent: 2px;
padding: 15px 0px 0px 2px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
|
||||||
|
|
Secondary navigation begins here| About this site (B) | Email (E) | Site Map (3) | Comments (9) | |
||||||