Information Technology Reference
In-Depth Information
glance, and consistent throughout projects. If you end up naming files
“
supercooldocument12-667.html
,” you make the documents harder for your end users to
find, and it can cause issues down the road if you ever come back to your application to
make future updates and edits.(Trust us: you'll completely forget what those files do.)
Another tip would be to name files with the current date or to use a version control
system to keep things straight. So remember, when it comes to naming files, keep it
simple and/or meaningful!
The CSS
Our CSS is going to look similar to the previous application we built, as well. There are a
few key differences here and there and a few neat CSS properties that we are
showcasing in this application, such as the
text-shadow
CSS property, which allows you
to apply some pretty fantastic shadow effects to your text live in the client's browser.
This doesn't rely on having a designer to whip up some overly compressed image with
the new fancy text as we would have done back in the old days (and by old days, I mean
a few years ago!).
Listing 3-2 covers the basic resetting of spacing and font sizes of common elements
that will be used throughout our application.
Listing 3-2.
CSS for I Love Ham -Part 1
/*** RESET ***/
html, body, header, section, div, p, ul, li, h2 {
margin:0;
padding:0;
}
ul, li {
list-style:none;
}
/*** GLOBAL CSS ***/
html, body {
width:100%;
height:600px;
overflow-x:hidden;
}
body {
font-size:14px;
font-family: 'Droid Sans', Arial, Helvetica, sans-serif;
background:#993366;
}
h2 {
font-size:18px;
color:#fff;
text-shadow:1px 1px 5px rgba(0,0,0,0.9);
}
