Tạo bo góc không dùng ảnh

Bạn hãy truy cập vào website http://www.curvycorners.net/ và dowload thư viên về (Free). Bạn cũng có thể xem demo theo link http://www.curvycorners.net/demos/

Cách sử dụng mình thấy là khá đơn giản nhất trong các thư viện tạo góc bo tròn, sau khi include script này: Thì mình chẳng còn đụng gì tới javascript để khởi tạo, hay thiết lập cái gì cả, plugin này sẽ tự động tìm trong CSS các box nào bạn quy định bo tròn góc.
vd thẻ div có “div.test {-webkit-border-radius: 4px; -moz-border-radius: 4px;}”, đối với các trình duyệt mới và không phải IE6,7..thì nó sẽ tự động bo tròn mà không cần sử dụng script này, còn đối với các trình duyệt không hỗ trợ bo tròn, thì script này sẽ bo tròn giúp bạn. Hoàn toàn tự động.
Ví dụ khi mình tạo bo góc với code như sau:

<head>
<title>hmweb.com.vn</title>
<script type=”text/JavaScript” src=”curvycorners.src.js”></script>
<style type=”text/css”>
.myBox {
width: 260px;
height: 100px;
padding: 10px;
text-align: left;
background-color: #fff;
border: 3px solid #fff;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
}
html,body{
height: 100%;
text-align: center;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: small;
margin: 0;
background-color:#666666;
}
</style>
</head>
<body>
<div class=”myBox”>
https://tieuyeuit.wordpress.com -tuyệt quá
</div>
</body>
</html>

Về tieuyeuit
Lập trình viên Asp.net Tôi chia sẻ một,bạn chia sẻ một và chúng ta có rất nhiều!

Gửi phản hồ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 Log Out / Thay đổi )

Twitter picture

Bạn đang bình luận bằng tài khoản Twitter Log Out / Thay đổi )

Facebook photo

Bạn đang bình luận bằng tài khoản Facebook Log Out / Thay đổi )

Google+ photo

Bạn đang bình luận bằng tài khoản Google+ Log Out / Thay đổi )

Connecting to %s

%d bloggers like this: