Home > Tutorials > CSS > Borders
Borders
Now that we have some fonts and background colors, shouldn't we be having fun with borders? Let's get started:
- border-width
- Specifies the current element's border width. Accepted values:
- thin
- medium
- thick
- A relative length to the parent element.
- An absolute length, in px, cm, mm, or in
- border-style
- Specifies the current element's border style. Accepted values:
- none
- dotted
- dashed
- solid
- double
- groove
- ridge
- inset
- outset
- border-color
- Specifies the current element's border color. Accepted values:
- Spelled out like a color.
- A 3 or 6-digit hex code.
- rgb(x,x,x), where x is a number between 0 and 255 (inclusive).
- border
- Specifies all (or just some) of the above properties, in the order listed.
- border-collapse
- Used on tables, specifies whether child element's borders should be collapsed into a single border. Accepted values:
- collapse
- separate
Just like the padding and margin properties, you can also specify a border property for just one side of an element, using something such as border-top-width, or border-bottom. The specific styles may also use the notation where up to 4 styles are given, one for each direction.
Excercise: Open "MyFirstPage.html". Use the border property on at least one of your elements.
If your code looks like mine, you've succeeded, and can go on to another lesson.
Comment on this page:
Comments
No one has commented on this lesson yet. You can be the first!