关于自适应宽度圆角的最简单的解决办法

这是用CSS的方式来完美解决的。

 body {
      background:#fff;
      padding:20px;
      color:#000;
      font-family:Arial,sans-serif;
      font-size:12px;
      line-height:1.3;
      }
    /* Start custom button CSS here
    ---------------------------------------- */
    .btn {
      display:inline-block;
      background:none;
      margin:0;
      padding:3px 0;
      border-width:0;
      overflow:visible;
      font:100%/1.2 Arial,Sans-serif;
      text-decoration:none;
      color:#333;
      }
    .btn span {
      background:#ddd;
      margin:0;
      padding:3px 0;
      border-left:1px solid #bbb;
      border-right:1px solid #aaa;
      }
    * html .btn span {
      padding-top:0;
      }
    .btn span span {
      position:relative;
      padding:3px .4em;
      border-width:0;
      border-top:1px solid #bbb;
      border-bottom:1px solid #aaa;
      

<p><a href="#" class="btn"><span><span>四川攀枝花</span></span></a> &nbsp;中国</p>

不多说了直接上代码