參考資料:W3C module Border
border-top-right-radius:10px;
border-top-left-radius:10px;
border-bottom-right-radius:10px;
border-bottom-left-radius:10px;
<style type="text/css">
.classBorderB
{
width:220px;
height:50px;
background-color:LemonChiffon;
border:1px solid LightSkyBlue;
margin-top:5px;
margin-left:10%;
margin-right:auto;
margin-bottom:20px;
}
#testDiv1
{
border:2px solid;
border-top-right-radius:10px;
-moz-border-top-right-radius:10 /* Firefox */
-webkit-border-top-right-radius:10 /* Safari and Chrome */
-o-border-top-right-radius:10 /* Opera */
}
#testDiv4
{
border:2px solid;
border-top-left-radius:10px;:10px;
-moz-border-top-left-radius:10px; /* Firefox */
-webkit-border-top-left-radius:10px; /* Safari and Chrome */
-o-border-top-left-radius:10px; /* Opera */
}
#testDiv2
{
border:2px solid;
border-bottom-right-radius:10px;
-moz-border-top-right-radius:10 /* Firefox */
-webkit-border-top-right-radius:10 /* Safari and Chrome */
-o-border-top-right-radius:10 /* Opera */
}
#testDiv3
{
border:2px solid;
border-bottom-left-radius:10px;
-moz-border-bottom-left-radius:10px; /* Firefox */
-webkit-border-bottom-left-radius:10px; /* Safari and Chrome */
-o-border-bottom-left-radius:10px; /* Opera */
}
</style>
<div class="classBorderB" id="testDiv1">border-top-right-radius:10px;</div>
<div class="classBorderB" id="testDiv4">border-top-left-radius:10px;</div>
<div class="classBorderB" id="testDiv2">border-bottom-right-radius:10px;</div>
<div class="classBorderB" id="testDiv3">border-bottom-left-radius:10px;</div>
沒有留言:
張貼留言