jquery.corner.js試してみた。
jQueryでさまざまな角丸っぽい効果を実現するプラグイン『jQuery Corner』 | IDEA*IDEA
試してみた。
<style > .adorned { background: #FFF; width: 30em; text-align: left; padding: 16px 16px; margin: 1em auto; color:#000; border:1px #999999 solid; } .testcorner{ background: #FFCCCC; width: 30em; text-align: left; padding: 16px 16px; margin: 1em auto; color:#000; border:1px #663300 solid; } .think{ background: #009933; width: 30em; text-align: left; padding: 16px 16px; margin: 1em auto; color:#000; border:1px #555 solid; } .note{ background: #AAA; width: 20em; text-align: left; padding: 16px 20px; margin: 1em auto; color:#000; border:1px #555 solid; } </style> <script type="text/javascript" src="../base/jquery.js"></script> <script type="text/javascript" src="../base/jquery.corner.js"></script> <script type="text/javascript"> $(document).ready(function(){ $(".adorned").corner("round 10px"); $(".testcorner").corner("bite 10px"); $(".think").corner("bevel 2px").corner("dog 16px tr"); $(".note").corner("notch 10px cc:#003300"); }); </script>