运行 ❯
获取您
自己的
网站
×
更改方向
保存代码
更改主题，深色/浅色
前往 Spaces
<!DOCTYPE html> <html> <head> <style> #example1 { background-color: lightblue; height: 100px; width: 200px; border-start-end-radius: 50px; } #example2 { background-color: lightblue; height: 100px; width: 200px; border-start-end-radius: 50px 20px; } #example3 { background-color: lightblue; height: 100px; width: 200px; border-start-end-radius: 50%; direction: rtl; } #example4 { background-color: lightblue; height: 100px; width: 200px; border-start-end-radius: 50%; writing-mode: vertical-rl; } </style> </head> <body> <h2>The border-start-end-radius property</h2> <p>The border-start-end-radius property defines the radius of the corner between the block-start and the inline-end sides of the element. </p> <div id="example1"> <p>border-start-end-radius: 50px;</p> </div> <br> <div id="example2"> <p>border-start-end-radius: 50px 20px;</p> </div> <br> <div id="example3"> <p>border-start-end-radius: 50% and direction: rtl</p> </div> <br> <div id="example4"> <p>border-start-end-radius: 50% and writing mode: vertical-rl;</p> </div> </body> </html>
