Monday, February 12, 2007

Linda's How-Do-I-Series? How Do I Add Color To My Borders and Text?

Last time in our "Linda's How-Do-I Series? How Do I Use Margins, Padding, and Borders?" we drew borders around text and showed how to code for margins and padding.

Well, let's say we want to add color to our borders and text - how would we do it?

Well, here's how:

Let's start with our basic text "Linda Walsh Originals" with a border around it. We would HTML code this as follows (minus the ***'s which are there so you can view the HTML in this article):

<***span style="border: 1px solid ;">Linda Walsh Originals<***/span>

and that would produce this:

Linda Walsh Originals

Now, let's say I want my border to be thicker so I might increase the px # to 3. And, let's say I want the color of the border and my text to be rgb(0, 0, 105) which is navy blue.

Here's the HTML coding for that (minus the ***'s which are there so you can view the HTML in this article):

<***span style="color: rgb(0, 0, 105);"><***span style="border: 3px solid ;">Linda Walsh Originals<***/span><***/span>

and that would produce this:

Linda Walsh Originals

Now, let's say I want my border to be thicker but I want some padding around the text and I want the color of my border and my text to still be rgb(0, 0, 105) which is navy blue.

Here's the HTML coding for that (minus the ***'s which are there so you can view the HTML in this article):

<***span style="color: rgb(0, 0, 105);"><***span style="border: 3px solid ; padding: 15px;">Linda Walsh Originals<***/span> <***/span>

and that would produce this:


Linda Walsh Originals


I hope this helped to show you how to draw border with color around your colored text.

Next time we'll add color to the borders around our pictures.



Posted by: "Doll Patterns for Grown-up Girls!"
Linda Walsh Originals E-Patterns - "Instant Download E-Patterns for Grown-up Girls!"

No comments:

Post a Comment