Bootstrap - Ändern Sie die Farbe der besuchten Links

Ich möchte, dass alle Links ihre Farbe ändern, wenn sie besucht werden. Ich arbeite mit Bootstrap und das ist, was ich bisher versucht haben (das nicht richtig funktioniert):Bootstrap - Ändern Sie die Farbe der besuchten Links

<html lang="en"> 
    <head> 
     <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
     <meta charset="unicode"> 
     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 
     <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet"> 

     <!--[if lt IE 9]> 
      <script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script> 
     <![endif]--> 
     <link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" type="text/css" rel="stylesheet"> 

     <style type="text/css"> 
       a{ 
       color:#d99a30 !important; 
       &:hover{ color:#37404e !important;} 
       &:visited{ color:#37404e !important;} 
       } 
     </style> 
    </head> 
    <body> 
     <div class="container"> 
      <div class="col-md-8 col-md-offset-2"> 
        <div class="row"> 
         <div class="col-sm-12"> 
          <h3><a href="some_link.html">Link</a></h3> 
         </div> 
        </div> 
      </div> 
     </div> 
    </body>

Danke für Ihre Hilfe

Quelle

2016-07-22 Marvin Lerousseau

Sie sind für LESS/SASS statt Ebene der Syntax CSS. Hier ist ein Beispiel für Ihren Code mit CSS.

a { color:#d99a30 !important; } 
a:hover { color:#37404e !important; } 
a:visited { color:#37404e !important; }

Wenn Sie :hover und :visited wollen gleich sein, können Sie auch zu dieser Regel vereinfachen:

a { color:#d99a30 !important; } 
a:hover, a:visited { color:#37404e !important; }

Quelle

2016-07-22 13:44:52 Marcelo

Dies wird! Arbeit. Es besteht die Möglichkeit, dass Sie das '! Wichtig;' auch entfernen können. –

Ich würde das auch zu @TedGoas empfehlen. – Marcelo

Sie können benutzerdefinierte CSS für Ihre alle Hyperlinks verwenden. Sie sollten !important mit Ihrem benutzerdefinierten css verwenden, sonst ist dies css nicht funktionieren.

a { 
 
    color: blue !important; 
 
    text-decoration: none !important; 
 
} 
 
a:link, a:visited { 
 
    color: blue !important; 
 
} 
 
a:hover { 
 
    color: red !important; 
 
}

<a href="http://www.w3schools.com">W3Sschools Home</a><br> 
 
<a href="http://www.w3schools.com/html/">W3Schools HTML Tutorial</a><br> 
 
<a href="http://www.w3schools.com/css/">W3Schools CSS Tutorial</a> 
 

 
<p><b>Note:</b> The :visited selector style links to pages you have already visited.</p>

Quelle

2016-07-22 13:47:09 Developer

Die 'CSS', die Sie tatsächlich schrieb 'Sass' und wird nur funktionieren, wenn Sie es kompilieren. Um die Farbe zu ändern, um die & mit a und bewegt alles mit & außerhalb der Klammern wie so ersetzen:

a{ 
    color:#d99a30 !important; 
} 

a:hover, a:visited{ 
    color:#37404e !important; 
}

Quelle

2016-07-22 13:51:45

diese keine Notwendigkeit, versuchen zu nutzen wichtige

body a { 
 
    color: #d99a30; 
 
} 
 
body a:hover{ 
 
    color:red; 
 
    } 
 

 
body a:visited{ 
 
    color:black; 
 
    }

<html lang="en"> 
 
    <head> 
 
     <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
 
     <meta charset="unicode"> 
 
     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 
 
     <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet"> 
 

 
     <!--[if lt IE 9]> 
 
      <script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script> 
 
     <![endif]--> 
 
     <link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" type="text/css" rel="stylesheet"> 
 

 
    
 
    </head> 
 
    <body> 
 
     <div class="container"> 
 
      <div class="col-md-8 col-md-offset-2"> 
 
        <div class="row"> 
 
         <div class="col-sm-12"> 
 
          <h3><a href="some_link.html">Link</a></h3> 
 
         </div> 
 
        </div> 
 
      </div> 
 
     </div> 
 
    </body>

Quelle

2016-07-22 13:54:22

Bootstrap - Ändern Sie die Farbe der besuchten Links

Antwort

Verwandte Themen