Borders,borders,borders
BY MICHELLE GOODRICH
(March 15, 2002)
You want borders? We've got borders.
Borders around type.
Borders around images.
Borders around tables.
1. Define CSS Style named myborder
We'll skip the gory details and jump right in by defining one border style named myborder.
Copy the paste the CSS style code in the HEAD section
of your HTML page between the <head> and the </head> or to your External Style Sheet.
2. Use myborder
Copy and paste this in your blog or Web page.
It will look like this.
This is my bordered text
Tables
For tables we can use the same myborder
style we defined in the HEAD section.
<table class="myborder">
| This is my table |
| cc6600 | 990000 | 003399 |
| ff9933 | 996633 | ffffdd |
| 708090 | ffcc66 | 000000 |
| |
Images
For images we can use the same myborder style.
BOX TIPS
The Boxes and Borders page has
more copy-and-paste examples for dotted boxes, dashed boxes, centered boxes, and more.
|
|
Navigation Button Style
This is the navbutton style.
There are four sides to a border and you can specify each side. Here is an example where the
left and top are a lighter color to give the text button that 3-D look.
Copy and paste this in your page.
It will look like this.
This is the navbutton style
More please...
What else? Keep experimenting.
Put the class="myborder"
in the TD tag, the DIV tag, and more.
This is text that I have entered inside
the DIV tag using the class=myborder.
CSS Inline Box Style
Want it real quick and dirty?
Copy and and paste this anwhere below the body in your Blog or Web page.
It will look like this.
This is my bordered text
The Inline Style is good for Blogs or if
you just want to try it out real quick.
You may want to keep the STYLE
between your HEAD tags (or in an
external style sheet).
|
