標籤:
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta name="viewport" content="width=device-width, initial-scale=1.0"/> 5 <meta charset="utf-8" /> 6 <title></title> 7 <link href="http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet"> 8 </head> 9 <body>10 <style>11 .kch_wx_btn_left{12 background-color: orange;13 border-top-left-radius:1em;14 border-bottom-left-radius:1em;15 }16 .kch_wx_btn_left a{17 color: #fff;18 text-decoration: none;19 line-height: 2em;20 padding: 1em;21 }22 .kch_wx_btn_right{23 background-color: #c1e2b3;24 border-top-right-radius:1em;25 border-bottom-right-radius:1em;26 }27 28 .kch_wx_btn_right a{29 color: black;30 text-decoration: none;31 line-height: 2em;32 padding: 1em;33 }34 </style>35 36 <div class="container">37 <div class="row text-center">38 <div class="col-sm-5 col-xs-5 col-xs-offset-1 col-sm-offset-1 kch_wx_btn_left">39 <a href="#" id="kch_wx_left_btnId">我的左邊</a>40 </div>41 <div class="col-sm-5 col-xs-5 kch_wx_btn_right">42 <a href="#" id="kch_wx_right_btnId">我的右邊</a>43 </div>44 </div>45 </div>46 47 </body>48 </html>
bootstrap左右圓角按鈕-適配手機頁面