當網站頁面的總體佈局設計好後,接下來有不少細節的實現是很讓人頭疼的。
其中之一就是圓角矩形的實現。 javascript
在網上看了不少圓角矩形的實現方法,基本有兩種:
一種是:用純css實現,不須要背景圖片;
一種是:用背景圖像實現;
可是無論是哪種,都有一個共同的缺點:須要使用不少代碼來嵌套,而這些代碼對搜索引擎來講毫無心義;
在《css cookbook》一書中介紹了一種實現圓角矩形十分簡潔的方法,那就是用Nifty Corners Cube。
支持主流瀏覽器:IE5.5, IE6 and IE7 beta 2 preview, Opera 8.5, Firefox 1.5 and Safari 2.0 css
<script type="text/javascript" src="niftycube.js"></script> <script type="text/javascript"> window.onload=function(){ Nifty("div#box","big"); } </script>
詳情訪問 Nifty Corners Cube官網:http://www.html.it/articoli/niftycube/index.html html
另外還有一個使用jQuery插件的多角(圓角、方角、等等N多種效果)
那就是jQuery Corner
官網:http://malsup.com/jquery/corner/ java