Table of Contents
|
All Slides
|
Link List
|
Examples
|
CSCI E-75
<< previous
|
next >>
id selectors
Example 10.6
Example 10.6 Source:
<div id="header" ><h1>Lorem ipsum dolor</h1></div> <div id="main" > <!-- main content --> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras sollicitudin, orci nec facilisis vehicula, neque urna porta risus, ut sagittis enim velit at orci. Fusce velit. Integer sapien enim, rhoncus vitae, cursus non, commodo vitae, felis. Nulla convallis ante sit amet urna. Maecenas condimentum hendrerit turpis. </div> <div id="footer" >Nulla turpis erat, faucibus commodo, iaculis id, aliquet quis, lectus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</div>
In
style
element (
<style type="text/css">
) within
head
element:
#main { font-family: Times, serif; } #header { font-family: arial, helvetica, sans-serif; background-color: #900; color: #fff; text-align: center; } #footer { font-family: arial, helvetica, sans-serif; padding: 1em; margin-top: 1em; color: #999; border-top: thin solid #999; text-align: center; font-size: 80%; }
Example 10.6 Rendered:
With Styles
Without Styles
Table of Contents
|
All Slides
|
Link List
|
Examples
|
CSCI E-75
<< previous
|
next >>