Cách tạo các nút tròn

Question

Làm cách nào để tạo các nút tròn bằng HTML và CSS? Tôi đã cố gắng sử dụng một hình nền, và làm cho nó có kích thước nhất định, nhưng điều đó dường như không hoạt động. Cụ thể, tôi muốn tạo một nút tròn, mà trên một lần nhấp sẽ khởi chạy một tập lệnh Javascript.

Answer 1

Hai cách:

1.) Tạo hình ảnh với các góc tròn và đặt giữa bằng màu sắc css.

2.) Sử dụng các thuộc tính css được giới hạn trong một số trình duyệt (FF sử dụng bộ, safari một số trình duyệt khác, không chắc chắn nếu chrome sử dụng một bộ khác).

Kiểm tra this list

Answer 2

Với border-radius.

http://jsfiddle.net/12w83vtn/

button { 
    height: 50px; 
    width: 50px; 
    border-radius: 50%; 
    border: 1px solid #000; 
} 

Answer 3

Bạn có thể làm điều này khá đơn giản với css3:

HTML -

<div id="button"> 
</div> 

CSS -

#button { 
    width:100px; 
    height: 100px; 
    border-radius:100%; 
    background-color:red; 
} 

Và sử dụng một sự kiện onclicked để làm một nút.