如何链接按钮?

这个问题在这里已经有了答案:

  • 如何创建一个像链接一样的HTML按钮? 27个答案

  • 一个简单的CSS按钮,使用您的按钮CSS为<a>创建一个按钮外观链接。

    .buttonwrapper {
      margin-top: 100px;
    }
    .button-link {
      padding: 10px 15px;
      background: #4479BA;
      color: #FFF;
      -webkit-border-radius: 4px;
      -moz-border-radius: 4px;
      border-radius: 4px;
      border: solid 1px #20538D;
      text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
      -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
      -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
      -webkit-transition-duration: 0.2s;
      -moz-transition-duration: 0.2s;
      transition-duration: 0.2s;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      text-decoration: none;
    }
    
    .button-link:hover {
      background: #356094;
      border: solid 1px #2A4E77;
      text-decoration: none;
    }
    
    .button-link:active {
      -webkit-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6);
      -moz-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6);
      box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6);
      background: #2E5481;
      border: solid 1px #203E5F;
    }
    <div class="buttonwrapper">
      <a target="" class="button-link" href="https://twitter.com/CSGOFlair">Twitter</a>
    </div>

    你做错了,但不要担心。

    <div class="buttonwrapper">
     <a target="_blank" href="https://twitter.com/CSGOFlair">
     <button class="mdl-button mdl-js-button mdl-js-rippleeffect">Twitter Button</button>
    </a>
    
    </div>
    

    将按钮嵌套在a元素中,并为其指定更多关于锚元素的信息:htmldog

    链接地址: http://www.djcxy.com/p/36557.html

    上一篇: How to link button?

    下一篇: Trying to make a button clickable with HTML and CSS