Schriftart ändern Awesome Fonts mit Schriftgröße

Ich habe versucht, zwei Font-Images eines Schlosses zu nehmen und sie übereinander zu stapeln. Dann wollte ich eine von ihnen ein wenig verkleinern, so dass es aussieht, als ob eine Grenze um die untere gewickelt wäre. Jedoch habe ich eine schwierige Zeit herauszufinden, wie man es richtig dimensioniert und ich verstehe nicht, warum die Schriftgröße nicht wie erwartet funktioniert. Kann mir jemand erklären, was ich falsch mache? HierSchriftart ändern Awesome Fonts mit Schriftgröße

ist die Geige: http://fiddle.jshell.net/4LqeN/1694/

i 
 
{ 
 
    text-align: center; 
 
    padding: 1px 1px; 
 
    display: inline-block; 
 
    -moz-border-radius: 100px; 
 
    -webkit-border-radius: 100px; 
 
    border-radius: 100px; 
 
    -moz-box-shadow: 0px 0px 2px #888; 
 
    -webkit-box-shadow: 0px 0px 2px #888; 
 
    box-shadow: 0px 0px 2px #888; 
 
} 
 

 
#lock-black{ 
 
    font-size: 200% 
 
}

<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css"/> 
 
<span class="fa-stack"> 
 
    <i id="lock-black" class="fa fa-lock fa-stack-2x "></i> 
 
    <i id="lock=blue" class="fa fa-lock fa-stack-1x" style="color:blue" ></i> 
 
</span>

Quelle

2016-05-20 Jibril Burleigh

Ich bin nicht ganz sicher, was Sie versuchen zu tun ... es wie Ihr blaues Schloss sieht in der schwarz ist. Der blaue scheint ungefähr halb so groß zu sein wie der blaue, was bei 'font-size: 200%' auf '# lock-black' sinnvoll ist. Beachten Sie, dass in der ID für die blaue Sperre ein Syntaxfehler vorliegt. es sollte ein Strich sein, nicht gleich. –

es heraus!

i 
 
{ 
 
    text-align: center; 
 
    padding: 1px 1px; 
 
    display: inline-block; 
 
    -moz-border-radius: 100px; 
 
    -webkit-border-radius: 100px; 
 
    border-radius: 100px; 
 
    -moz-box-shadow: 0px 0px 2px #888; 
 
    -webkit-box-shadow: 0px 0px 2px #888; 
 
    box-shadow: 0px 0px 2px #888; 
 
} 
 

 
#lock-black{ 
 
    font-size: 200%; 
 
} 
 

 
#lock-blue{ 
 
    font-size: 150%; 
 
}

<link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet"/> 
 
<span class="fa-stack"> 
 
    <i id="lock-black" class="fa fa-lock fa-stack-2x "></i> 
 
    <i id="lock-blue" class="fa fa-lock fa-stack-1x" style="color:blue" ></i> 
 
</span>

Quelle

2016-05-20 19:04:13

Schriftart ändern Awesome Fonts mit Schriftgröße

Antwort

Verwandte Themen