Wie kann man die Links auf der aktuellen Seite nur mit CSS deaktivieren

Source Code: (back to article)

<!DOCTYPE html>
<html>
  <head>
    <title>Der Titel des Dokuments</title>
    <style> 
      a.button,button {
      display: inline-block;
      padding: 20px 55px;
      margin: 20px 10px;
      line-height: 18px;
      text-align: center;
      white-space: nowrap;
      vertical-align: middle;
      -ms-touch-action: manipulation;
      touch-action: manipulation;
      cursor: pointer;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      border: 0;
      -webkit-border-radius: 8px; 
      -moz-border-radius: 8px; 
      border-radius: 8px;
      background-color:#8ebf42;
      text-decoration:none;
      color:#ffffff;
      }
      a[disabled].button,button[disabled] {
      cursor: not-allowed;
      opacity: 0.4;
      pointer-events: none;
      -webkit-touch-callout: none;
      }
      a.button:active:not([disabled]),button:active:not([disabled]) {
      background-color: #cccccc;
      color: #2a2a2a;
      outline: 0;
      }
    </style>
  </head>
  <body>
    <h2>Link auf der aktuellen Seite deaktivieren</h2>
    <a href="https://www.w3docs.com/" disabled="disabled" class="button">Disabled</a>
    <a href="https://www.w3docs.com/" class="button">Hier Klicken</a>
  </body>
</html>