THIET KE WEBSITE GIA RE

THIET KE WEBSITE GIA RE

Kỹ thuật bo góc với CSS3

Posted by thietkewebsitegiare trên 15/04/2009

Trước kia khi chúng ta muốn thực hiện định dạng một góc vuông mà bo bốn góc thì chúng ta cần phải dùng đến Javascript hoặc những kỹ thuật khá phức tạp (kỹ thuật 4 div hoặc 3 div). Tuy nhiên hiện nay CSS3 cho phép chúng ta thực hiện điều đó hết sức đơn giản.

Để minh chứng cho điều đó sau đây chúng ta cùng thực hiện một kỹ thuật đơn giản đó là bo góc cho một box vuông với CSS3.

Chưa bo góc….

Chúng ta thực hiện kỹ thuật bo góc của box vuông với đoạn code sau:

<div style=”-moz-border-radius: 5px; -webkit-border-radius: 5px; border: 1px solid #CCCCCC; padding: 10px;” >

Kết quả

Liệu đã được như mong muốn?

Có một vấn đề nảy sinh đó là hiện tại không phải trình duyệt nào cũng hỗ trợ chúng ta làm với CSS3, đối với một số trình duyệt cũ thì cũng ta vẫn phải sử dụng những kỹ thuật cũ để thực hiện bo góc. Còn với một số trình duyệt như Mozila/Firefox, Safari 3 thì chúng ta thỏa sức sáng tạo với những kỹ thuật của CSS3.

Chúc bạn thành công – www.ticsoft.com (Nguồn:  cssyeah)

Trả lời

Mời bạn điền thông tin vào ô dưới đây hoặc kích vào một biểu tượng để đăng nhập:

WordPress.com Logo

Bạn đang bình luận bằng tài khoản WordPress.com Đăng xuất /  Thay đổi )

Google+ photo

Bạn đang bình luận bằng tài khoản Google+ Đăng xuất /  Thay đổi )

Twitter picture

Bạn đang bình luận bằng tài khoản Twitter Đăng xuất /  Thay đổi )

Facebook photo

Bạn đang bình luận bằng tài khoản Facebook Đăng xuất /  Thay đổi )

Connecting to %s

 
%d bloggers like this: