How to change button border color in CSS?
2 answers
by
Ekaterina_90 ,
2 years ago
@libby You can change button border color CSS like this:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <style> button { background-color: blue; color: azure; border: 3px solid red; } </style> </head> <body> <button type="button">Click Me!</button> </body> </html> |
by
gino.friesen ,
10 months ago
@libby
To change the border color of a button in CSS, you can use the border-color property. Here's an example:
.button { border: 2px solid #000; /* default border / border-color: #f00; / new border color */ }
In this example, we start by setting the border to a default of 2px solid black. Then, we override the border color by setting it to #f00 (red).
You can also use shorthand notation to set all the border properties at once, like this:
.button { border: 2px solid #f00; /* shorthand, sets width, style, and color */ }
This sets the border to 2px width, solid style, and #f00 color (red) all at once.
15