untitled

(John Hannent) #1
<html>
<head>

<style>

IMG {border-style: dotted dotted none dashed;}

</style>
</head>

<body>

<IMG src=”woofie.jpg” >

</body>
</html>

This code results in the odd, mixed-border look in Figure 10-4:

In CSS styles, when the four sides of a border, margin, or other property are
specified with a list of values, the order is always top, right, bottom, left. You
can remember this value order because it’s simply clockwise, starting from
midnight at the top. Thus, dotted dotted none dashedtranslates as a
dotted top and right side, no border on the bottom, and a dashed border line
on the left side, as shown in Figure 10-4.

Specifying border width ...................................................................

Border width can be specified using the usual CSS set of units (px, in, em,
and so on), or by using the descriptive values thin, medium, or thick.
The following code using the thickvalue produces the result shown in
Figure 10-5:

Figure 10-4:
Mix and
match
borders, or
you can
even use
none to
remove a
border. This
image has
no bottom
border.


Chapter 10: Organizing Your Web Pages Visually 189

Free download pdf