支援各瀏覽器圓角 (round corner) 的辦法

我測試 jQuery 的 Tab 功能發現, 在 Chrome 與 Firefox 上都能完美展現圓角, 不論是 Tab 或按鈕, 任何 UI widget 都有圓角效果, 唯獨 IE 例外, 即使 IE 8 也是如此, 方方的不好看, 改天到燦坤試試 IE9 有沒有長進些.
我搜尋 IE 圓角解決方案, 發現這裡有一個不錯的辦法 :
 CSS Rounded Corners In All Browsers (With No Images)

先到這裡下載 border-radius.htc 檔 :
https://code.google.com/p/curved-corner/downloads/list

然後在網頁中替需要圓角的元素加上樣式  (高亮度部份就是專治 IE 的) :

<style type="text/css"></p>
.box {background-color: #ddd;
         width: 210px;
         height: 30px;
         padding: 20px;
         position: absolute;
         top: 5px; left: 5px;

         -moz-border-radius: 15px;
         -webkit-border-radius: 15px;
         border-radius: 15px;
         behavior: url(border-radius.htc);
       }
<style>
<div class="box"> Round Corner</div>

只是不知這有沒有辦法整合到 jQuery UI 中, 有空再測試看看. 下圖上面的是 Chrome/Firefox, 下面是 IE8.