نتیجه
امتحان کنید
<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> .button { background-color: #4CAF50; /* Green */ border: none; color: white; padding: 20px; text-align: center; text-decoration: none; display: inline-block; font-size: 16px; margin: 4px 2px; cursor: pointer; } .button1 {border-radius: 2px;} .button2 {border-radius: 4px;} .button3 {border-radius: 8px;} .button4 {border-radius: 12px;} .button5 {border-radius: 50%;} </style> </head> <body> <h2>دکمه های دایره ای شکل</h2> <p>با استفاده از ویژگی زیر به دکمه ، حاشیه های دورانی اضافه کنید</p> <p>"border-radius"</p> <button class="button button1">2px</button> <button class="button button2">4px</button> <button class="button button3">8px</button> <button class="button button4">12px</button> <button class="button button5">50%</button> </body> </html>
امتحان کنید