CSS - border-bottom-style Property
Sets style of bottom border of an element.
Possible Values
none − No border. (Equivalent of border-width:0;)
solid − Border is a single solid line.
dotted − Border is a series of dots.
dashed − Border is a series of short lines.
double − Border is two solid lines.
groove − Border looks as though it is carved into the page.
ridge − Border looks the opposite of groove.
inset − Border makes the box look like it is embedded in the page.
outset − Border makes the box look like it is coming out of the canvas.
hidden − Same as none, except in terms of border-conflict resolution for table elements.
Applies to
All the HTML elements.
DOM Syntax
object.style.borderBottomStyle="Any of the values defined above";
Example
Following is the example demonstrates border-bottom-style property:
<html> <head> <style> p { border-style: solid; border-bottom-style: double; } h2{ border-style: groove; border-bottom-style: dashed ; } </style> </head> <body> <h2>Bottom border is ridge</h2> <p>Bottom border is double</p> </body> </html>
Advertisements
To Continue Learning Please Login
Login with Google