Lena Stanley posted: " The CSS border-top-left-radius property specifies the radius of the top-left corner. Demo: Click the button to change the border-top-left-radius property (50px) of the DIV element: #myDIV { border: 3px solid #333; width: 200px; "
The CSS border-top-left-radius property specifies the radius of the top-left corner.
Demo:
Click the button to change the border-top-left-radius property (50px) of the DIV element:
Hello
Syntax:
border-top-left-radius: length;
length – specifies the shape of the top-left corner (px/%).
Example:
<!DOCTYPE html> <html> <head> <style> #example1 { border: 3px solid #2a9d8f; padding: 10px; border-top-left-radius: 25px; } #example2 { border: 3px solid #2a9d8f; padding: 10px; border-top-left-radius: 50px 20px; } #example3 { border: 3px solid #2a9d8f; padding: 10px; border-top-left-radius: 30%; } </style> </head> <body> <h4>border-top-left-radius: 25px;</h4> <div id="example1"> <p>The border-top-left-radius property defines the radius of the top-left corner.</p> </div> <h4>border-top-left-radius: 50px 20px;</h4> <div id="example2"> <p>If two values are set; the first one is for the top border, the second one for the left border.</p> </div> <h4>border-top-left-radius: 30%;</h4> <div id="example3"> <p>The CSS border-top-left-radius property is set to 30%.</p> </div> </body> </html>
Output:
border-top-left-radius: 25px;
The border-top-left-radius property defines the radius of the top-left corner.
border-top-left-radius: 50px 20px;
If two values are set; the first one is for the top border, the second one for the left border.
border-top-left-radius: 30%;
The CSS border-top-left-radius property is set to 30%.
No comments:
Post a Comment
Note: Only a member of this blog may post a comment.