Twitter Applications: Who's That Tweet? - Beginning Android Web Apps Development - page 28

long? One of the incredible features of CSS3 is the use of including True Type fonts in
your project. From now on, you don't have to rely on poorly compressed images or
horribly intrusive Flash solutions to utilize beautiful typography.
Google has even gone out of their way to do us a favor by creating a free and open
database of web safe fonts to be used to your heart's content. You can visit the Google
Web Fonts website at http://www.google.com/webfonts . Once you find a font that you
would like to use, Google will give you some HTML code to add to your layout to load
the fonts into your browser and call it from your CSS file, as we have called “Droid Sans”
as our page's default font (see Figure 2-5).
Figure 2-5. Viewing the Droid Sans font on the Google Web Fonts website
In Listing 2-3, we will provide the user with a stylish header that will rest on the top of
their browser and will house the player's fake name as well as their score.
Listing 2-3. Who's That Tweet? CSS File, Part 2
/*** HEADER ***/
header {
width:100%;
font-weight:bold;
text-transform:uppercase;
text-shadow: 1px 1px 1px rgba(255,255,255,0.5);
line-height:40px;
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0, rgb(135,135,135)),
color-stop(0.8, rgb(201,201,201))
);
-webkit-box-shadow:0 0 15px rgba(0,0,0,0.5);
box-shadow:0 0 15px rgba(0,0,0,0.5);
}
header h2 {
margin-left:10px;