टाइपोग्राफिक पैमाने पर

पूरा टाइपोग्राफिक ग्रिड साढ़ी variables.less फाइल च दो Less चर उप्पर आधारत ऐ: @baseFontSizeते @baseLineHeight. पैह् ला आधार फॉन्ट-आकार ऐ जेह् ड़ा पूरे च बरतेआ गेदा ऐ ते दूआ आधार रेखा-ऊँचाई ऐ ।

अस उनें चर, ते किश गणित दा इस्तेमाल करदे आं, अपने सारे किस्म दे मार्जिन, पैडिंग, ते लाइन-हाईट बनाने आस्तै ते होर मते।

उदाहरण देह पाठ

नुल्लम क्विस रिसुस एगेट उर्ना मोलिस ओरनारे वेल ईउ लियो। सह सोसियस नटोक पेनाटिबस एट मैग्निस डिस प्रसव मोंटेस, नास्सेटर रिडिकुलस मस। नुल्लम आईडी डोलोर आईडी निभ उल्ट्रिसीस वेहिकुला उत आईडी एलिट।

विवामस सैजिटिस लैकस वेल औग लाओरीत रुट्रम फौसिबस डोलोर नीलामी। डुइस मोलिस, एस्ट गैर कोमोडो लक्टस, निसी एराट पोर्टिटोर लिगुला, एगेट लैसिनिया ओडियो सेम नेसी एलिट। डोनेक सेद ओडियो दुई।

जोर देने दा प्रयोग करदे होई

फुस्से दापिबस , टेलस एसी कर्सस कोमोडो , टॉर्टोर मौरिस कंडिमेंटम निभ , उत फर्मेंटम मासा जस्टो बैठो अमेट रिसुस। मेसेनास फौसिबस मोलिस इंटरडम। नुल्ला विटाए एलिट लिबेरो, इक फारेत्रा औग।

नोट: इस्तेमाल करने च बेझिझक <b>ते <i>HTML5 च, पर उंदा इस्तेमाल थोड़ा बदली गेदा ऐ। <b>दा मतलब ऐ शब्दें जां वाक्यांशें गी बिना कुसै अतिरिक्त महत्व दे उजागर करना जदके <i>एह् मते सारें शा मता आवाज़ , तकनीकी शब्दें बगैरा आस्तै ऐ ।

उदाहरण दे पते

<address>टैग दा इस्तेमाल किस चाल्ली कीता जाई सकदा ऐ इसदे दो उदाहरण दित्ते गेदे न :

उदाहरण संक्षिप्त नाम

संक्षेपें गी बड्डे अक्षर ते हल्के बिंदीदार निचले सीमा कन्नै शैली कीती गेदी ऐ। उंदे कोल होवर पर इक मदद कर्सर बी ऐ तां जे बरतूनी गी अतिरिक्त संकेत होंदा ऐ जे होवर पर किश दस्सेआ जाग।

एचटीएमएल कटा हुआ रोटी दे बाद दी सबतूं अच्छी चीज ऐ।

विशेषता शब्द दा इक संक्षिप्त रूप ऐ attr .

ब्लॉककोट गी शामल करने आस्तै, उद्धरण दे रूप च कुसै बी एचटीएमएल<blockquote> दे चारों-पार लपेटो। सीधे उद्धरणें लेई अस इक .<p>

अपने स्रोत दा हवाला देने लेई इक वैकल्पिक तत्व शामल करो ते तुसेंगी स्टाइलिंग मकसदें लेई इसदे शा पैह् ले <small>इक एम डैश मिलग ।—

<ब्लॉककोट> दा
  <p> लोरेम इप्सम डोलोर बैठो अमेट, कन्सेक्टेतुर एडिपिसिंग एलिट। पूर्णांक पोसुएरे एराट ए एंटी वेनेनेटिस। </p> दा
  <small> कोई मशहूर </small>
</blockquote> दा

डिफ़ॉल्ट ब्लॉककोट्स इस चाल्ली शैली कीते गेदे न:

लोरेम इप्सम डोलोर बैठो अमेट, कन्सेक्टेतुर एडिपिसिंग एलिट। पूर्णांक पोसुएरे एराट ए एंटी वेनेनेटिस।

बॉडी ऑफ वर्क च कोई मशहूर

अपने ब्लॉककोट गी दाएं पास्से फ्लोट करने लेई, जोड़ो class="pull-right":

लोरेम इप्सम डोलोर बैठो अमेट, कन्सेक्टेतुर एडिपिसिंग एलिट। पूर्णांक पोसुएरे एराट ए एंटी वेनेनेटिस।

बॉडी ऑफ वर्क च कोई मशहूर

अनऑर्डर

<ul>

• लोरेम इप्सम डोलोर बैठो अमेत
• कन्सेक्टेतुर एडिपिसिंग एलिट
• पूर्णांक मोलेस्टी लोरेम एट मासा
• प्रीटियम निस्ल एलिकेट च फैसिलिसिस
• नुल्ला वोलुतपत अलिक्वाम वेलित
  • फेसेलस इअकुलिस नेके
  • पुरुष सोडलेस अल्ट्रिसीस
  • वेस्टिबुलम लाओरीत पोर्टिटोर सेम
  • एसी ट्रिस्टिक लिबेरो वोलुतपत एट
• फौसिबस पोर्टा लैकस फ्रिंगिला वेल
• ऐन बैठा अमेत एरात नुंक
• एगेट पोर्टिटोर लोरेम

अनस्टाइल

<ul class="unstyled">

• लोरेम इप्सम डोलोर बैठो अमेत
• कन्सेक्टेतुर एडिपिसिंग एलिट
• पूर्णांक मोलेस्टी लोरेम एट मासा
• प्रीटियम निस्ल एलिकेट च फैसिलिसिस
• नुल्ला वोलुतपत अलिक्वाम वेलित
  • फेसेलस इअकुलिस नेके
  • पुरुष सोडलेस अल्ट्रिसीस
  • वेस्टिबुलम लाओरीत पोर्टिटोर सेम
  • एसी ट्रिस्टिक लिबेरो वोलुतपत एट
• फौसिबस पोर्टा लैकस फ्रिंगिला वेल
• ऐन बैठा अमेत एरात नुंक
• एगेट पोर्टिटोर लोरेम

आर्डर दे दी

<ol>

1. लोरेम इप्सम डोलोर बैठो अमेत
2. कन्सेक्टेतुर एडिपिसिंग एलिट
3. पूर्णांक मोलेस्टी लोरेम एट मासा
4. प्रीटियम निस्ल एलिकेट च फैसिलिसिस
5. नुल्ला वोलुतपत अलिक्वाम वेलित
6. फौसिबस पोर्टा लैकस फ्रिंगिला वेल
7. ऐन बैठा अमेत एरात नुंक
8. एगेट पोर्टिटोर लोरेम

ब्यौरा

<dl>

विवरण सूची दी

शब्दें गी परिभाशित करने आस्तै इक विवरण सूची बिल्कुल सही ऐ ।

यूइसमोद ने दी

वेस्टिबुलम आईडी लिगुला पोर्टा फेलिस यूइसमोड सेम्पर एगेट लैसिनिया ओडियो सेम नेसी एलिट।

डोनेक आईडी एलिट नॉन मी पोर्टा ग्रेविडा एट एगेट मेटस।

मलेसुआदा पोर्टा

एटियाम पोर्टा सेम मलेसुआदा मैग्ना मोलिस यूइसमोड।

इनलाइन

कोड दे इनलाइन स्निपेटें गी <code>.

मसाल आस्तै , <code> खंड </ code > गी इनलाइन दे रूप च लपेटेआ जाना चाहिदा .  

बेसिक ब्लॉक

<pre>कोड दी कई लाइनें लेई इस्तेमाल करो । उचित रेंडरिंग आस्तै कोड च कुसै बी कोण कोष्ठक थमां बचना सुनिश्चत करो.

<p>इत्थें नमूना पाठ...</p>

<प्री> दा
  <p>इत्थें नमूना पाठ...</p>
</pre> दा

नोट:<pre> टैग दे अंदर कोड गी जितना होई सकै बाएं दे नेड़े जरूर रक्खो ; एह् सारे टैब रेंडर करग।

तुस वैकल्पिक रूप कन्नै उस .pre-scrollableवर्ग गी जोड़ सकदे ओ जेह् ड़ी 350px दी इक मैक्स-ऊँचाई सेट करग ते इक y-अक्ष स्क्रॉलबार उपलब्ध करोआग.

गूगल प्रीटिफाई करना

इक गै तत्व गी लैओ <pre>ते बधाए गेदे रेंडरिंग आस्तै दो वैकल्पिक वर्गें गी जोड़ो.

<p> नमूना पाठ इत्थें... </p>

<pre class = "सुन्दर छाप।" 
     लिनम" > ऐ
  <p>इत्थें नमूना पाठ...</p>
</pre> दा

google-code-prettify डाउनलोड करो ते इसदा इस्तेमाल करने आस्तै रीडमी दिक्खो।

<टेबल> दा
  <सिर> दा
    <tr> दा
      <th> ... </th> दा
      <th> ... </th> दा
    </tr> दा
  </thead> दा
  <टीबॉडी> दा
    <tr> दा
      <td> ... </td> दा
      <td> ... </td> दा
    </tr> दा
  </tbody> दा
</table> दा

पठनीयता गी सुनिश्चत करने ते संरचना गी बनाए रखने लेई तालिकाएं गी स्वतः शैल कीता जंदा ऐ सिर्फ किश सीमाएं कन्नै। 2.0 कन्नै, .tableक्लास दी लोड़ ऐ।

<तालिका वर्ग = "तालिका" > 
  ...
</table> दा

ज़ेबरा-स्ट्राइपिंग जोड़ के अपनी टेबल के साथ थोड़ा फैंसी हो जाओ-बस .table-stripedक्लास जोड़ो।

नोट: धारीदार तालिकाएं च :nth-childCSS चयनकर्ता दा उपयोग होंदा ऐ ते IE7-IE8 च उपलब्ध नेईं ऐ।

<table class = "तालिका तालिका-धारीदार" > 
  ...
</table> दा

सौंदर्य प्रयोजनें लेई पूरी मेज दे चारों ओर सीमाएं ते गोल कोने जोड़ो।

<table class = "तालिका तालिका-सीमाबद्ध" > 
  ...
</table> दा

.table-condensedटेबल सेल पैडिंग गी आधे च (8px थमां 4px तगर) कटौती करने आस्तै क्लास गी जोड़ियै अपनी तालिकाएं गी होर कॉम्पैक्ट बनाओ ।

<table class = "तालिका तालिका-संक्षिप्त" > 
  ...
</table> दा

उपलब्ध वर्गें च कुसै बी दा उपयोग करियै बक्ख-बक्ख रूप हासल करने आस्तै कुसै बी तालिका वर्ग गी इकट्ठा करने च बेझिझक होओ।

<table class = "तालिका तालिका-धारी तालिका-सीमा तालिका-संक्षिप्त" > 
  ...
</table> दा

लचीला एचटीएमएल ते सीएसएस

बूटस्ट्रैप च फार्म दे बारे च सबनें शा बेहतर हिस्सा एह् ऐ जे तुंदे सारे इनपुट ते नियंत्रण शानदार लगदे न चाहे तुस उनेंगी अपने मार्कअप च किस चाल्ली बनाओ। कोई फालतू एचटीएमएल दी लोड़ नेईं ऐ, पर अस उनें लोकें लेई पैटर्न उपलब्ध करोआने आं जिनेंगी इसदी लोड़ ऐ।

होर जटिल लेआउट आसान स्टाइलिंग ते इवेंट बाइंडिंग आस्तै संक्षिप्त ते स्केल करने योग्य वर्गें कन्नै औंदे न, तां जे तुस हर कदम पर कवर कीते गेदे ओ।

चार लेआउट शामल कीते गे

बूटस्ट्रैप चार किस्म दे फार्म लेआउट आस्तै समर्थन कन्नै आवै करदा ऐ:

• ऊर्ध्वाधर (डिफ़ॉल्ट) ऐ।
• तपाश
• इनलाइन
• आढा

बक्ख-बक्ख किस्म दे फार्म लेआउटें गी मार्कअप करने आस्तै किश बदलावें दी लोड़ होंदी ऐ , पर नियंत्रण अपने आपै च इक गै रौंह्दे न ते बर्ताव करदे न ।

नियंत्रण राज्यें ते होर मते

बूटस्ट्रैप दे फार्म च सारे आधार फार्म नियंत्रणें आस्तै शैलियां शामल न जिऱयां इनपुट, टेक्स्टएरिया, ते चयन जेह् ड़ी तुस उम्मीद करदे ओ. पर एह् इक नंबर दे कस्टम घटकें कन्नै बी औंदा ऐ जि’यां संलग्न ते प्रीपेंड इनपुट ते चेकबॉक्सें दी सूची आस्तै समर्थन।

हर इक किस्म दे फार्म नियंत्रण लेई त्रुटि, चेतावनी, ते सफलता जनेह् राज्यें गी शामल कीता गेआ ऐ। अक्षम नियंत्रणें लेई शैलियां बी शामल न।

मूल रूप

v2.0 कन्नै, साढ़े कोल फार्म शैलियें आस्तै हल्के ते स्मार्ट डिफ़ॉल्ट न। कोई अतिरिक्त मार्कअप नेईं, बस नियंत्रण फार्म।

<फॉर्म क्लास = "अच्छा" > ऐ 
  <label> लेबल दा नांऽ </label>
  <input type = "text" class = "span3" प्लेसहोल्डर = "कुछ टाइप करो ..." >   
  <span class = "help-inline" > संबद्ध मदद पाठ! </span> दा 
  <लेबल वर्ग = "चेकबॉक्स" > ऐ 
    <input type = "checkbox" > मिगी चेक आउट करो 
  </label> दा
  <button type = "submit" class = "btn" > सबमिट करो </बटन>  
</form> दा

सर्च फार्म

डिफ़ॉल्ट वेबकिट शैलियें गी दर्शांदे होई, बस .form-searchअतिरिक्त गोल सर्च फील्डें आस्तै जोड़ो.

<form class = "अच्छा रूप-खोज" > 
  <इनपुट प्रकार = "पाठ" वर्ग = "इनपुट-माध्यम खोज-क्वेरी" >  
  <बटन प्रकार = "सबमिट" वर्ग = "बीटीएन" > खोज </बटन>  
</form> दा

इनलाइन फार्म

इनपुट शुरू करने लेई ब्लॉक स्तर होंदे न। .form-inlineते , आस्तै .form-horizontalअस इनलाइन-ब्लॉक दा इस्तेमाल करदे आं।

<form class = "अच्छा रूप-इनलाइन" > 
  <इनपुट प्रकार = "पाठ" वर्ग = "इनपुट-छोटा" प्लेसहोल्डर = "ईमेल" >   
  <इनपुट प्रकार = "पासवर्ड" वर्ग = "इनपुट-छोटा" प्लेसहोल्डर = "पासवर्ड" >   
  <बटन प्रकार = "सबमिट" वर्ग = "बीटीएन" > जाओ </बटन>  
</form> दा

उदाहरण मार्कअप करना

उपर्युक्त उदाहरन फार्म लेआउट गी दित्ता गेआ ऐ, इत्थै पैह् ले इनपुट ते नियंत्रण समूह कन्नै जुड़े दा मार्कअप ऐ। स्टाइलिंग लेई .control-group, .control-label, ते .controlsक्लास सारें दी लोड़ ऐ।

<रूप वर्ग = "रूप-क्षैतिज" > 
  <फील्डसेट> ऐ
    <legend> किंवदंती पाठ </legend>
    <div वर्ग = "नियंत्रण-समूह" > 
      <label class = "control-label" for = "input01" > पाठ इनपुट </label>  
      <div वर्ग = "नियंत्रण करदा ऐ" > 
        <इनपुट प्रकार = "पाठ" वर्ग = "इनपुट-xlarge" आईडी = "इनपुट 01" >   
        <p class = "help-block" > मदद पाठ दा समर्थन करदा ऐ </p> 
      </div> दा
    </div> दा
  </फील्डसेट> दा
</form> दा

क्या शामिल ऐ

बाएं पास्से दित्ते गेदे सारे डिफाल्ट फार्म नियंत्रण न जिंदा अस समर्थन करदे आं। इत्थें एह् बुलेट कीती गेदी सूची ऐ:

• पाठ इनपुट (पाठ, पासवर्ड, ईमेल, बगैरा)
• चेकबॉक्स ऐ
• रेडियो दा
• चुनो
• कई चयन करो
• फाइल इनपुट करना
• पाठ क्षेत्र

v2.0 कन्नै नमें डिफ़ॉल्ट

v1.4 तगर, बूटस्ट्रैप दी डिफाल्ट फार्म शैलियां क्षैतिज लेआउट दा इस्तेमाल करदे न. बूटस्ट्रैप 2 कन्नै, अस उस बाधा गी हटाई दित्ता ऐ तां जे कुसै बी फार्म आस्तै स्मार्ट, मता स्केलेबल डिफाल्ट होऐ.

ब्राउज़र राज्यें गी नमें सिरेआ डिजाइन कीता गेआ ऐ

बूटस्ट्रैप ब्राउज़र-समर्थित फोकस ते disabledराज्यें आस्तै शैलियें दी सुविधा दिंदा ऐ। अस डिफ़ॉल्ट वेबकिट गी हटांदे न outlineते .box-shadow:focus

फार्म सत्यापन करना

एह्दे च त्रुट्टी, चेतावनी, ते सफलता आस्तै सत्यापन शैलियां बी शामल न। इस्तेमाल करने आस्तै, त्रुटि वर्ग गी आसपास दे च जोड़ो .control-group.

<फील्डसेट दा
  class = "नियंत्रण-समूह त्रुटि" >
  ...
</फील्डसेट> दा

इनपुटें गी प्रीपेंड & एपेंड करो

इनपुट समूह-संलग्न जां प्रीपेंड पाठ कन्नै-अपने इनपुटें लेई होर संदर्भ देने दा इक आसान तरीका उपलब्ध करोआंदे न। शानदार उदाहरणें च ट्विटर यूजरनेम आस्तै @ चिह् न जां वित्त आस्तै $ शामल ऐ।

चेकबॉक्स ते रेडियो

v1.4 तगर, बूटस्ट्रैप गी चेकबॉक्स ते रेडियो दे आसपास अतिरिक्त मार्कअप दी लोड़ ही उनेंगी ढेर करने लेई। हुण, एह् दोहराने दी इक साधारण गल्ल ऐ <label class="checkbox">जेह्ड़ी लपेटदी ऐ <input type="checkbox">.

इनलाइन चेकबॉक्स ते रेडियो बी समर्थत न। बस .inlineकिसी भी .checkboxया च जोड़ो .radioते तुस खत्म होई गेदे ओ।

इनलाइन फार्म ते संलग्न/प्रीपेंड

इनलाइन फार्म च प्रीपेंड जां एपेंड इनपुटें दा इस्तेमाल करने आस्तै, .add-onते inputगी इक गै लाइन पर, बिना स्पेस दे, सुनिश्चत करो.

मदद पाठ बनाओ

अपने फार्म इनपुटें आस्तै मदद पाठ जोड़ने आस्तै, इनपुट तत्व दे बाद कन्नै इनलाइन मदद पाठ <span class="help-inline">जां इक मदद पाठ ब्लॉक गी शामल करो.<p class="help-block">

कार्रवाईयें लेई बटन

कन्वेंशन दे तौर पर, बटनें दा इस्तेमाल सिर्फ कम्में आस्तै कीता जाना चाहिदा जिसलै के हाइपरलिंक दा इस्तेमाल वस्तुएं आस्तै कीता जाना ऐ। मसाल आस्तै, "डाउनलोड" इक बटन होना चाहिदा ऐ जिसलै के "हाल दी गतिविधि" इक लिंक होना चाहिदा ऐ.

बटन शैलियां गी कुसै बी चीज़ पर लागू कीता जाई सकदा ऐ जिस च .btnक्लास लागू कीती गेई ऐ। <a>हालांकि, आमतौर पर तुस इन्हें गी सिर्फ ते <button>तत्वें पर लागू करना चांह्गे ।

पार ब्राउज़र संगतता

IE9 गोल कोने पर बैकग्राउंड ढाल फसल नेईं करदा ऐ, इसलेई अस इसगी हटांदे आं। संबंधित, IE9 अक्षम buttonतत्वें गी janifies करदा ऐ, पाठ गी इक गंदा पाठ-छाया कन्नै ग्रे रेंडर करदा ऐ जेह् ड़ा अस ठीक नेईं करी सकदे.

कई साइज दा

फैंसी बड़े या छोटे बटन? दो अतिरिक्त आकारें लेई .btn-large, .btn-small, जां जोड़ो ।.btn-mini

प्राथमिक कार्रवाई करना हरकत

प्राथमिक कार्रवाई करना हरकत

प्राथमिक कार्रवाई करना हरकत

अक्षम राज्य

अक्षम बटनें आस्तै, .disabledलिंक च वर्ग ते तत्वें disabledआस्तै विशेषता जोड़ो.<button>

प्राथमिक कड़ी तार

प्राथमिक बटन दा बटन

सिर ऊपर ! अस .disabledइत्थें इक उपयोगिता वर्ग दे रूप च इस्तेमाल करदे आं , आम .activeवर्ग दे समान , इसलेई कोई उपसर्ग दी लोड़ नेईं ऐ ।

इक क्लास, कई टैग

इक , , जां तत्व .btnपर क्लास दा इस्तेमाल करो ।<a><button><input>

<a class = "btn" href = "" > लिंक </a> ऐ  
<बटन वर्ग = "बीटीएन" प्रकार = "सबमिट" >  
  बटन
</बटन> दा
<इनपुट वर्ग = "बीटीएन" प्रकार = "बटन"।  
         मान = "इनपुट" > ऐ
<इनपुट क्लास = "बीटीएन" प्रकार = "सबमिट"।  
         value = "सबमिट करो" >

इक बेहतरीन अभ्यास दे तौर पर, क्रॉस-ब्राउज़र रेंडरिंग गी मिलान सुनिश्चत करने आस्तै तुंदे संदर्भ आस्तै तत्व गी मिलान करने दी कोशश करो. जेकर तुंदे कोल इक ऐ तां अपने बटन आस्तै inputइक दा इस्तेमाल करो।<input type="submit">

• आइकन-ग्लास दा
• आइकन-संगीत
• आइकन-खोज करना
• आइकन-लिफाफा ऐ
• आइकन-दिल
• आइकन-स्टार
• आइकन-स्टार-खाली
• आइकन-उपयोगकर्ता
• आइकन-फिल्म ऐ
• आइकन-थ-बड़े
• आइकन-थ
• आइकन-वीं-सूची
• आइकन-ठीक ऐ
• आइकन-हटाओ
• आइकन-ज़ूम-इन करना
• आइकन-ज़ूम-आउट करना
• आइकन-बंद करना
• आइकन-संकेत दा
• आइकन-कोग
• आइकन-कचरा
• आइकन-घर
• आइकन-फाइल ऐ
• आइकन-समय
• आइकन-रोड
• आइकन-डाउनलोड-अल्ट
• आइकन-डाउनलोड करो
• आइकन-अपलोड करना
• आइकन-इनबॉक्स ऐ
• आइकन-खेल-सर्कल
• आइकन-दोहराओ

• आइकन-ताज़ा करना
• आइकन-सूची-अल्ट
• आइकन-लॉक करना
• आइकन-झंडा
• आइकन-हेडफोन ऐ
• आइकन-वॉल्यूम-बंद करना
• आइकन-वॉल्यूम-डाउन करना
• आइकन-वॉल्यूम-अप करना
• आइकन-qrcode ऐ
• आइकन-बारकोड ऐ
• आइकन-टैग ऐ
• आइकन-टैग ऐ
• आइकन-पुस्तक
• आइकन-बुकमार्क ऐ
• आइकन-प्रिंट करना
• आइकन-कैमरा ऐ
• आइकन-फॉन्ट दा
• आइकन-बोल्ड ऐ
• आइकन-इटालिक ऐ
• आइकन-पाठ-ऊँचाई
• आइकन-पाठ-चौड़ाई
• आइकन-संरेखित-बाएं
• आइकन-संरेखित-केंद्र
• आइकन-संरेखित-दाएं
• आइकन-संरेखित-जस्टिफाई करना
• आइकन-सूची ऐ
• आइकन-इंडेंट-बाएं
• आइकन-इंडेंट-दाएं
• आइकन-फेसटाइम-वीडियो
• आइकन-चित्र

• आइकन-पेंसिल दा
• आइकन-नक्शा-मार्कर
• आइकन-समायोजित करना
• आइकन-टिंट
• आइकन-संपादन करना
• आइकन-शेयर करो
• आइकन-जाँच करो
• आइकन-चलना
• आइकन-कदम-पिछड़े
• आइकन-तेज-पिछड़े
• आइकन-पिछड़े दा
• आइकन-खेलना
• आइकन-विराम दे
• आइकन-स्टॉप करना
• आइकन-आगे दा
• आइकन-फास्ट-फॉरवर्ड करना
• आइकन-कदम-अग्गें
• आइकन-इजेक्ट करना
• आइकन-शेवरॉन-बाएं
• आइकन-शेवरॉन-दाएं
• आइकन-प्लस-चिन्ह
• आइकन-माइनस-चिन्ह
• आइकन-हटाओ-चिन्ह
• आइकन-ठीक ऐ-साइन
• आइकन-प्रश्न-चिन्ह
• आइकन-जानकारी-चिन्ह
• आइकन-स्क्रीनशॉट ऐ
• आइकन-हटाओ-वृत्त
• आइकन-ठीक ऐ-सर्कल
• आइकन-बैन-सर्कल

• आइकन-तीर-बाएं
• आइकन-तीर-दाएं
• आइकन-तीर-ऊपर
• आइकन-तीर-नीचे
• आइकन-शेयर-अल्ट
• आइकन-आकार-पूरा
• आइकन-आकार-छोटा
• आइकन-प्लस ऐ
• आइकन-माइनस दा
• आइकन-तारा चिह्न
• आइकन-विस्मयादिबोधक-चिन्ह
• आइकन-उपहार
• आइकन-पत्ता
• आइकन-आग
• आइकन-आँख खुली
• आइकन-आँख-बंद करना
• आइकन-चेतावनी-चिन्ह
• आइकन-प्लेन
• आइकन-कैलेंडर दा
• आइकन-रैंडम ऐ
• आइकन-टिप्पणी करो
• आइकन-चुंबक
• आइकन-शेवरॉन-अप करना
• आइकन-शेवरॉन-नीचे
• आइकन-रीट्वीट करो
• आइकन-खरीदारी-गाड़ी
• आइकन-फोल्डर-बंद करो
• आइकन-फोल्डर-ओपन करना
• आइकन-आकार बदलें-ऊर्ध्वाधर
• आइकन-आकार-क्षैतिज

स्प्राइट दे रूप च बनाया गेआ

हर इक आइकन गी इक अतिरिक्त अनुरोध बनाने दे बजाय, असें उनेंगी इक स्प्राइट च संकलित कीता ऐ- इक फाइल च छवियें दा इक गुच्छा जेह् ड़ा छवियें गी background-position. एह् उसी तरीका ऐ जिसगी अस ट्विटर डॉट कॉम पर इस्तेमाल करदे आं ते एह् साढ़े आस्तै बी खरा कम्म कीता ऐ।

सारे आइकन वर्गें गी .icon-उचित नेमस्पेसिंग ते स्कोपिंग आस्तै कन्नै उपसर्ग कीता गेदा ऐ, जेह् ड़ा साढ़े होर घटकें दी तर्ज पर ऐ। इस कन्नै होर उपकरणें कन्नै टकराव थमां बचने च मदद मिलग।

ग्लिफिकॉन्स ने असेंगी साढ़ी ओपन-सोर्स टूलकिट च सेट कीते गेदे हाफलिंग्स दा इस्तेमाल करने दी इजाजत दित्ती ऐ जदूं तगर अस इत्थें डॉक्स च इक लिंक ते क्रेडिट उपलब्ध करोआने आं। कृपया अपने प्रोजेक्टें च बी इ'यै करने पर विचार करो।

इस्तेमाल किवें करना

v2.0.1 कन्नै, असें <i>अपने सारे आइकनें आस्तै इक टैग दा इस्तेमाल करने दा विकल्प चुनेआ ऐ, पर उंदे कोल कोई केस वर्ग नेईं ऐ-केवल इक साझा उपसर्ग ऐ. इस्तेमाल करने आस्तै, निम्नलिखित कोड गी लगभग कुतै बी रक्खो:

<i class = "चिह्न-खोज" </i> 

उल्टे (सफेद) आइकनें लेई शैलियां बी उपलब्ध न, जेह् ड़ियां इक अतिरिक्त वर्ग कन्नै तैयार कीतियां गेदियां न:

<i class = "चिह्न-खोज आइकन-सफेद" ></i> 

अपने आइकनें लेई चुनने आस्तै 120 क्लासां न। बस <i>सही क्लासें कन्नै इक टैग जोड़ो ते तुस सेट होई गेदे ओ। तुस पूरी सूची sprites.less च जां ठीक इत्थै इस दस्तावेज़ च पाई सकदे ओ.

केस दा इस्तेमाल करो

आइकन महान होंदे न, पर उंदा इस्तेमाल कुत्थें करग? इत्थें किश विचार दित्ते गेदे न:

• अपने साइडबार नेविगेशन आस्तै विजुअल दे रूप च
• विशुद्ध रूप कन्नै आइकन-चालित नेविगेशन आस्तै
• बटनें लेई इक क्रिया दे अर्थ गी संप्रेषित करने च मदद करने आस्तै
• इक बरतूनी दी गंतव्य पर संदर्भ साझा करने आस्तै लिंक कन्नै

अनिवार्य रूप कन्नै, जित्थें बी तुस <i>टैग ला सकदे ओ, तुस इक आइकन बी पाई सकदे ओ।

ताज़ा करो चेकआउट करो म्हेसना

टिप्पनी सेटिंग्स होर जानकारी