bootstrap glyphicon-cog zeigt eigentlich glyphicon-hülle?

Das ist super seltsam, nach ihren Richtlinien here, fügte ich eine Spanne mit glyphicon glyphicon-cog .... Allerdings, wenn meine Seite geladen wird, zeigt es tatsächlich den Umschlag - was glyphicon glyphicon-envelope ist. Wie genau passiert das und was kann ich tun, um es zu beheben?bootstrap glyphicon-cog zeigt eigentlich glyphicon-hülle?

Ich habe versucht, den Umschlag hinzuzufügen ... Weil sie es vielleicht umgetauscht haben. Aber es sieht immer noch wie ein Umschlag aus.

Hier ist, was glyphicon glyphicon-cog endet zeigt:

es wie folgt hinzugefügt wird: wie es

<div className="dropdown"> 
     <button className="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown"> 
      <h6 style={{fontFamily: "'Open Sans', sans-serif", 
      fontSize: "12px", fontVariant: "small-caps"}}> 
      settings </h6> 
      <span className="glyphicon glyphicon-cog" /> 
     </button> 
     <ul className="dropdown-menu" style={{textAlign: "center"}}> 
      <li> 
       <h5 style={{fontFamily: "'Open Sans', sans-serif", fontSize: "12px", fontVariant: "small-caps"}}> 
        user: {this.state.data.username} </h5> 
      </li> 
      <li style={{display: "inline-block"}}> 
       <button onClick={this.resetLayout} className="btn btn-default" style={{fontFamily: "'Open Sans', sans-serif", 
        fontSize: "12px", fontVariant: "small-caps"}}> 
        reset layout </button> 
      </li> 
      <li style={{display: "inline-block"}}> 
       <button className="btn btn-default" style={{fontFamily: "'Open Sans', sans-serif", 
        fontSize: "12px", fontVariant: "small-caps"}}> 
        <a href="/logout" style={{color: "black"}}> logout</a></button> 
      </li> 
     </ul> 
    </div>

Quelle

2017-02-28 cbll

sicherstellen, dass Sie Einstellung nicht 'text-transform: uppercase' als wichtig, sich auf das Element, da die meisten Symbol Schriftarten Fall sind empfindlich – haxxxton

@haxxxton Ich habe das überhaupt nicht benutzt, also denke ich nicht, dass es ist! Es ist einfach super komisches Verhalten. Wäre sinnvoll gewesen, wenn keiner von ihnen funktioniert hätte. – cbll

Sie müssen den '' Tag mit **' '** und nicht' ' – JazZ

verwenden: -

<span class="glyphicon glyphicon-cog"></span>

Quelle

2017-02-28 10:15:54 shanu

Kommt dieser Umschlag wirklich vom Bootstrap?

Weil es anders aussieht.

Sie sollten in den Entwickler-Tools überprüfen, was die :before dieser span className="glyphicon glyphicon-cog" zwingende tatsächlich

Und es sollte etwas anderes, nicht Bootstrap sein.

Wenn es nicht funktioniert, können Sie die font-family als Glyphicon und content als Zeichencode des Zahnrads manuell verwenden.

Sie den Code finden Sie hier: https://github.com/twbs/bootstrap/blob/master/less/glyphicons.less

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
<ul class="list-group"> 
 
    <li class="list-group-item"> <span class="glyphicon glyphicon-envelope" aria-hidden="true"></span> <span class="glyphicon-class">glyphicon glyphicon-envelope</span> </li> 
 
    <li class="list-group-item"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span> <span class="glyphicon-class">glyphicon glyphicon-cog</span> </li> 
 
</ul>

Quelle

2017-02-28 10:29:43 Pankaj

bootstrap glyphicon-cog zeigt eigentlich glyphicon-hülle?

Antwort

Verwandte Themen