Wie auf link hinzufügen Stil für <a> in der Bootstrap-4 Alpha 3?

Den code ist sehr einfach:

<a>This is a link</a>

In der Bootstrap-4 Alpha 2 demo, der link erscheint blau. Wenn du mit der Maus drauf, zeigt es dunkelblau.

Aber in der Bootstrap-4 Alpha 3 demo, zeigt es schwarz.

Gibt es da eine spezielle Bootstrap-Klasse Hinzugefügt werden können, lassen <a> link-Stil in der Bootstrap-4 Alpha 3?

Sowas?

<a class="bootstrap-link">This is a link</a>

Ist es sauber/smart Weg?

Dank

InformationsquelleAutor Hongbo Miao | 2016-07-27

  1. 5

    Wohl etwas geändert zwischen den beiden Versionen hinsichtlich der Existenz der href Attribut; durch das hinzufügen des Attributs href um den Anker <a>, es beginnt richtig zu arbeiten;

    Code aus dem Beispiel mit href:

    <a href>This is a link</a>

    Aktualisiert JSFiddle: https://jsfiddle.net/s1mvqok0/

    dies wird aktualisieren Sie die Seite, aber trotzdem danke
    Wenn Sie möchten, eine Verknüpfung nichts zu tun, Sie könnte verwenden javascript:void() als href Inhalt. Theoretisch ist jeder Anker sollte auf irgendwo obwohl, sonst, einige andere tag sollte verwendet werden.
    Danke! Dies funktioniert sehr gut. Ich lasse diese öffnen, hoffe, es ist eine saubere Art und Weise in alpha 3
    markieren Sie diese Antwort als angenommen, da es Ihre Frage beantwortet. Ein Anker ist ein link sollte ein href.
    Wenn Sie <a class="btn">...</a> dieser bootstrap-Verhalten kann lästig sein. Denken Sie daran, Sie können auch <button class="btn">...</button> github.com/twbs/bootstrap/issues/19402#issuecomment-247377640

    InformationsquelleAutor Pedro Moreira

  2. 2

    Wenn Sie sehen, bootstrap 4 css -

    a:not([href]):not([tabindex]) {
    color: inherit;
    text-decoration: none;
}

    So Anker-tag erhält die Farbe des übergeordneten Elements, wenn Sie nicht entweder ein href oder ein tabindex-Attribut. Ein Ansatz wäre, um eine tabindex-Eigenschaft für ein element.

    Gibt es eine Klasse, wenn Sie verwenden möchten .text-primary gilt, dass primäre Farben zu den Anker-tag.

    .text-primary{
   color:#0275d8!important
}
a.text-primary:focus,a.text-primary:hover{
   color:#025aa5
}

    jsfiddle

    Hallo, dies ist eine sehr nette Möglichkeit! Aber jetzt heißt es nicht den richtigen Stil, wenn Sie den Mauszeiger auf den link.
    Das könnte sein, was wird empfohlen, für die standards, aber bis Sie kommen mit einem href-Attribut für button Elemente, die Leute werden mit Anker-Schaltflächen. Diese Regel könnte erheblich verbessert werden, durch hinzufügen :not([role="button"]) oder so ähnlich. Die Lösung, die Sie stellen, ist okay, aber es stellt ein ärgernis für die beschriebenen Tasten - es gibt keine einfache Lösung gibt

    InformationsquelleAutor tmg

Schreibe einen Kommentar