Book HomeCascading Style Sheets: The Definitive GuideSearch this book Sunday 25th of February 2018 10:18:19 PM

10.5. Adapting to the Environment

CSS2 offers the ability to both alter the browser's environment and integrate its look more closely to that of the user's operating system.

10.5.1. Cursors

To achieve the former, we have the cursor property, which lets you declare what shape the browser's cursor will take as it passes over a given element. Want to make a humorous point about download times? Change the cursor to the wait cursor (an hourglass or watch) when the cursor passes over hyperlinks. You can even hook this property up to "cursor files" (which are not defined by the specification), so you could theoretically class your anchors based on where they go and load different icons for each type of link. For example, off-site links could cause the cursor to change into a globe, while links intended to provide help could trigger a question-mark cursor.

10.5.2. Colors

In order to let web pages more closely match the user's desktop environment, there are a whole list of new color keywords like button-highlight, three-d-shadow, and gray-text. These are all intended to use the colors of the user's operating system. In all, there are 27 of these new color keywords. I won't list them all out here, but they're listed in Table 10-1, found at the end of this chapter.

10.5.3. Outlines

While you're moving your cursor around, you might want to show where the focus is set. For example, it might be nice to define a button so that it gets a red box around it when the cursor moves over it. Well, there a number of outline properties, including outline, outline-color, should be displayed as though the value of overflow were declared to be visible.

If the overflow is set to hidden, the element's content is clipped, but no mechanism should be provided to make the content accessible to the user. Consider the following styles:

DIV#sidebar {position: absolute; top: 0; left: 0; width: 15%; height: 7em;
outline-style, and
outline-width. To use the example of a red box,
you might declare:

IMG.button:hover {outline: solid red 1px;}

This should have the effect described. The outline styles could also be used to set a visible outline for regions in a client-side image map.



Library Navigation Links

Copyright © 2002 O'Reilly & Associates. All rights reserved.

If we alter the SPAN styles to have a background color, the actual placement of the line boxes becomes quite clear, as we can see in Figure 8-47.

Figure 8-47

Figure 8-47. The full extent of each line box

Here we see that not every line reaches to the right edge of the paragraph's content area, which has been denoted with a dotted gray border. The end of each line box is determined by the content of the line box. For comparison, let's try the same thing, but this time right-justify the paragraph, as shown in Figure 8-48.

WARNING

There is one thing to remember: vertical-align isnot meant to affect the alignment of content intable cells, or within a block-level element. Under CSS1, there is noprovision for duplicating markup such as <TDvalign="top">. (This changes under CSS2; see Section 10.7, "Tables" in Chapter 10, "CSS2: A Look Ahead", for more details.)

So, let's see what can be done with

Web-based applications are similar to app servers, except for one thing: Web-based applications don't have client apps, instead they use web browsers on the client side. They generate their front ends using HTML, which is dynamically generated by the web-based app. In the Java world, Servlets are best suited for this job.

Web-based apps might themselves rely on another app server to gather information that is presented on the client web browser. Also, you can write Servlets that get information from remote or local databases, XML document repositories and even other Servlets. One good use for web-based apps is to be a wrapper around an app server, so that you can allow your customers to access at least part of the services offered by your app server via a simple web browser. So web-based apps allow you to integrate many components including app servers, and provide access to this information over the web via a simple web browser.

Web-based apps are very deployable, since they don't require special Java VMs to be installed on the client side, or any other special plug ins, if the creator of the web-based app relies solely on HTML. Unfortunately, this can restrict the level of service that can be offered by a web-based app when compared to the functionality offered by custom clients of an app server, but they are a good compromise when it comes to providing web-based access to your information. In fact, in a real world scenario, both a web-based app and app server may be used together, in order to provide your customers access to their information. In an Intranet setting, you might deploy the clients that come with the app server, and in an Internet setting it would be better to deploy a web-based app that sits on top of this app server, and gives your customers (relatively) limited access to their data over the web (via a simple web browser).

Web-based apps and app servers integrate very well, and this is another reason why Java and XML make a powerful combination for developing systems that give your customers access to their information from anywhere, using any browser over the web. In the future, you can imagine various different web-based apps servicing different kinds of clients, e.g. web browsers on desktops, web browsers on PDAs, and web browsers on all kinds of different consumer electronics devices. By keeping your information structured in a pure way (by using XML), and by allowing access to this information through app servers, you can write many different web-based apps that render this information by customizing it uniquely for each different device that is allowed access to this information. This is more a more scalable solution that storing all this information in web pages, even if these web pages are dynamically generated. So you can have one app server that stores all the data in XML format. You can write a web-based app (which sits on top of this app-server) that allows PalmPilots to access this information over the web. You can write another web-based app (that also sits on top of the same app server) that allows conventional web browsers to access this information over the web. XML and Java have the potential to make this truly platform independent and device independent computing a reality.

markup would have the result shown in Figure 7-80:

OL LI {list-style-type: decimal;}LI.off {list-style-type: none;}<OL><LI>Item the first<LI CLASS="off">Item the second<LI>Item the third<LI CLASS="off">Item the fourth<LI>Item the fifth