फ़ॉन्ट-भयानक आइकन - सीएसएस, फ़ॉन्ट-कमाल को ढेर करने में सहायता चाहिए

मैंने हाल ही में अपग्रेड किया है font-awesome से संस्करण 3.2.1 सेवा मेरे 4

मैंने यह काम किया था 3.2.1

<li><span class="icon-stack stacked"><i class="icon-circle icon-stack-base"></i><i class="icon-phone icon-2x icon-light">
</i></span><span class="stacktext">Your Phone Number</span></li>

.stacked
{
float: left;
margin-right: 15px;
color: #3ECCFC;
}

.stacktext
{
text-align:left;
font-size: 14px;
color: #444444;
}

लेकिन यह अच्छी तरह से ढेर नहीं है version 4

<li><span class="fa fa-stack stacked"><i class="fa fa-circle fa fa-stack-base"></i><i class="fa fa-phone icon-2x fa fa-light">
</i></span><span class="stacktext">Your Phone Number</span></li>

उत्तर:

उत्तर № 1 के लिए 4

आपको केवल कक्षा का उपयोग करना होगा fa एक बार में class=""। मैंने आपके कोड में कई बिट्स अपडेट किए हैं।

मुख्य ढेर आकार को परिभाषित करें <span> के आसपास <i> तत्वों। stacked फ़ॉन्ट विस्मयकारी 4 में अप्रचलित है, के बाद से fa-stack एक ढेर भी परिभाषित करता है। भी fa-light में बदल गया है fa-inverse। अंत में fa-stack-1x तथा fa-stack-2x स्टैक में आइकन स्केल करने के लिए उपयोग किया जाता है। fa-stack-2x स्टैक में दूसरे आइकन की तुलना में आइकन को बड़ा बनाने के लिए उपयोग किया जाएगा।

सबकुछ एक साथ रखता है परिणाम:

<li>
<span class="fa-stack fa-2x">
<i class="fa fa-circle fa-stack-2x"></i>
<i class="fa fa-phone fa-stack-1x fa-inverse"></i>
</span>
<span class="stacktext">Your Phone Number</span>
</li>

फ़ॉन्ट विस्मयकारी वेबसाइट पर दिए गए ढेर के उदाहरणों की जांच करें: ढेर


जवाब के लिए 0 № 2

The icon- वर्ग उपसर्ग बन fa fa- :

चिह्न-*-> एफए एफए-*

स्रोत: https://github.com/FortAwesome/Font-Awesome/wiki/Upgrading-from-3.2.1-to-4


संबंधित सवाल
सबसे लोकप्रिय