djames617.com MadSay.com SayMad.com

Complete and vetted infomation about this and more topics can be found at w3schools and Mozilla Developer Network

The border-style Property

This property specifies what kind of border to display:

A dotted border.

A dashed border.

A solid border.

A double border.

A groove border.

A ridge border. The 3D effect depends on the color chosen for the page

An inset border. The 3D effect depends on the color chosen for the page

An outset border. The 3D effect depends on the color chosen for the page

No border.

A mixed border.

The border-width Property and The border-color Property

The border-width property specifies the width of the four borders, while the border-color property specifies the color of the four borders

Here we have some colored borders of varying sizes and colors.

Some text.

Some text.

Some text.

Some text.

Some text.

Some text.

A solid red border

A solid green border

A dotted blue border

A red inset border with slateblue text.

The border-radius Property

This property is used to add rounded borders to an element:

Normal border

Round border

Rounder border

Roundest border

Note:No "border-(control property)" will work without having the border-style property set first. Always specify the "border-style" property to set the borders firs, then use additonal control properties to modify the borders.

<

Borders Continued...

Borders can have more than one color

One-colored border, Big Deal!

Two-colored border, Better than the 1 color I guess!

Three-colored border, Getting kinda fancy there!

Four-colored border, Now you're just showing off!

Note: The "border-color" property does not work if it is used alone. Use the "border-style" property to set the borders first.




That was alot of work on just borders. I can tell that this is going to be a long journey. Might as well get started. On to Margins!




CSS Margins

This element has a margin of 70px.
This element has a top margin of 100px, a right margin of 150px, a bottom margin of 100px, and a left margin of 80px.

All CSS Margin Properties

Property : Description

margin: A shorthand property for setting the margin properties in one declaration

margin-bottom: Sets the bottom margin of an element

margin-left: Sets the left margin of an element

margin-right: Sets the right margin of an element

margin-top: Sets the top margin of an element

This topic really deserves a page of it's own. Since I'm only writing about the topics I used to create the hompage, it's not absolutely mission critical right now. Note to self Remember to make a "Margins" page.

There is way too much information for me include and most of what I'm reading right now I don't completely get. I'll try to avoid adding information I really don't fully understand. Once I have a better handle on margins I'll post a page on them.



Backgrounds
Home