मुद्रण प्रमाण

पुराय मुद्रण जाळी आमच्या variables.less फायलीन दोन Less चडांत चड आदारीत आसा: @baseFontSizeआनी @baseLineHeight. पयलो पुराय वापरिल्लो बेस फॉन्ट-आकार आनी दुसरो बेस लायन-उंचाय.

आमी त्या व्हेरिएबल्स, आनी कांय गणित, आमच्या सगळ्या प्रकाराचे आनी हेर मार्जिन, पॅडिंग, आनी लायन-हायट्स तयार करपाक वापरतात.

उदाहरण शरीर मजकूर

नुल्लम क्विस रिसुस एगेट उर्ना मोलिस ऑर्नारे वेल इउ लियो. कम सोसायस नाटोक पेनाटिबस एट मॅग्निस डिस पार्ट्युरिएंट मोंटेस, नास्केटर रिडिकुलस मस. नुल्लम इड डोलोर इड निभ उल्ट्रिसीस वेहिकुला.

शिंशें बॉडी कॉपी

जोडून एक परिच्छेद वेगळो उबो करचो .lead.

विवामस सॅजिटिस लेकस वेल ऑग लाओरीट रुट्रम फॉसिबस डोलोर ऑक्टर. डुयस मोलिस, एस्ट नॉन कोमोडो लक्टस.

भर दिवपाचो उपेग करून

Fusce dapibus , tellus ac cursus commodo , टॉर्टोर मौरिस कॉन्डिमेंटम निभ , उत फर्मेन्टम मासा जुस्टो बस अमेट रिसुस. मेसेनास फॉसिबस मॉलिस इंटरडम. नुल्ला व्हिटॅ एलिट लिबेरो, एक फारेत्रा ऑग.

टिप: वापरपाक मेकळीक दिवची <b>आनी <i>HTML5 त, पूण तांचे वापर मात्सो बदलला. <b>अतिरिक्त म्हत्व दिवंक नासतना उतरां वा वाक्यां उजवाडावपाखातीर आसता जाल्यार <i>चड करून आवाज, तंत्रीक संज्ञा आदी खातीर आसता.

उदाहरण पत्ते

<address>टॅग कसो वापरूं येता हाचीं दोन उदाहरणां हांगा दिल्यांत :

ट्विटर, इंक
795 फोल्सम अॅव्हे, सुट 600
सॅन फ्रांसिस्को, सीए 94107
पी: (123) 456-7890

पुराय नांव
[email protected]

उदाहरण संक्षेप

गुणधर्म आशिल्ल्या संक्षेपांक titleहळदुवी बिंदू आशिल्ली तळाची शिमो आनी होवराचेर मदत कर्सर आसता. हाका लागून वापरप्यांक होवराचेर कितें तरी दाखयतले असो अतिरिक्त संकेत मेळटा.

initialismमात्सो ल्हान मजकूर आकार दिवन मुद्रण सुसंवाद वाडोवपाखातीर वर्ग संक्षेपांत जोडात .

कातरून काडिल्ली भाकरी उपरांत एचटीएमएल ही सगळ्यांत बरी गजाल.

गुणधर्म ह्या शब्दाचें संक्षिप्त रूप म्हळ्यार attr .

ब्लॉककोट समाविष्ट करपाक, <blockquote>खंयच्याय HTML भोंवतणी कोट म्हणून गुठलावचें. सरळ उतारे खातीर आमी एक शिफारस करतात <p>.

तुमचो स्रोत उल्लेख करपाक पर्यायी <small>घटक समाविष्ट करात आनी तुमकां —स्टायलिंग उद्देशां खातीर ताचे आदीं एम डॅश मेळटलो.

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

मुलभूत ब्लॉककोट अशे तरेन शैली केल्यात:

लोरेम इप्सम डोलोर बस आमेत, कॉन्सेक्टेटर एडिपिसिंग एलिट. पूर्णांक पोसुएरे एराट एक अँटी व्हेनेनाटीस.

Body of work हातूंत कोण तरी फामाद

तुमचो ब्लॉककोट उजवे वटेन फ्लोट करपाक, जोडात class="pull-right":

लोरेम इप्सम डोलोर बस आमेत, कॉन्सेक्टेटर एडिपिसिंग एलिट. पूर्णांक पोसुएरे एराट एक अँटी व्हेनेनाटीस.

Body of work हातूंत कोण तरी फामाद

अनऑर्डर केल्लें

<ul>

• लोरेम इप्सम डोलोर बस आमेत
• Consectetur adipiscing एलिट हें नांव
• मासा हांगा पूर्णांक मोलेस्टी लोरेम
• प्रीटियम निस्ल अॅलिकेटांत फॅसिलिसिस
• नुल्ला वोलुत्पात आलिक्वाम वेलिट
  • फासेलस इअकुलिस नेक हें नांव
  • पुरुस सोडलेस अल्ट्रिसीस
  • वेस्टिबुलम लाओरीत पोर्टिटोर सेम
  • एसी ट्रिस्टीक लिबेरो वोलुत्पात अॅट
• फॉसिबस पोर्टा लेकस फ्रिंगिला वेल
• एनियन बस अमेत एरात नुंक
• एगेट पोर्टिटोर लोरेम

अनस्टायल केल्लें

<ul class="unstyled">

• लोरेम इप्सम डोलोर बस आमेत
• Consectetur adipiscing एलिट हें नांव
• मासा हांगा पूर्णांक मोलेस्टी लोरेम
• प्रीटियम निस्ल अॅलिकेटांत फॅसिलिसिस
• नुल्ला वोलुत्पात आलिक्वाम वेलिट
  • फासेलस इअकुलिस नेक हें नांव
  • पुरुस सोडलेस अल्ट्रिसीस
  • वेस्टिबुलम लाओरीत पोर्टिटोर सेम
  • एसी ट्रिस्टीक लिबेरो वोलुत्पात अॅट
• फॉसिबस पोर्टा लेकस फ्रिंगिला वेल
• एनियन बस अमेत एरात नुंक
• एगेट पोर्टिटोर लोरेम

आदेश दिलो

<ol>

1. लोरेम इप्सम डोलोर बस आमेत
2. Consectetur adipiscing एलिट हें नांव
3. मासा हांगा पूर्णांक मोलेस्टी लोरेम
4. प्रीटियम निस्ल अॅलिकेटांत फॅसिलिसिस
5. नुल्ला वोलुत्पात आलिक्वाम वेलिट
6. फॉसिबस पोर्टा लेकस फ्रिंगिला वेल
7. एनियन बस अमेत एरात नुंक
8. एगेट पोर्टिटोर लोरेम

वर्णन

<dl>

वर्णन यादी

संज्ञा व्याख्या करपाखातीर वर्णन वळेरी परिपूर्ण आसा.

युइस्मोड हांणी केला

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

डोनेक आयडी एलिट नॉन मी पोर्टा ग्रेविडा अॅट एगेट मेटस.

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

एटियाम पोर्टा सेम मालेसुआडा मॅग्ना मोलिस युइसमोड.

आडवें वर्णन

<dl class="dl-horizontal">

वर्णन यादी

संज्ञा व्याख्या करपाखातीर वर्णन वळेरी परिपूर्ण आसा.

युइस्मोड हांणी केला

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

डोनेक आयडी एलिट नॉन मी पोर्टा ग्रेविडा अॅट एगेट मेटस.

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

एटियाम पोर्टा सेम मालेसुआडा मॅग्ना मोलिस युइसमोड.

फेलिस युइसमोड सेम्पर एगेट लॅसिनिया

फुसे दापिबस, टेलस एसी कर्सस कोमोडो, टॉर्टोर मौरिस कॉन्डिमेंटम निभ, उत फर्मेन्टम मासा जस्टो बस अमेट रिसुस.

---

तकली वयर काडटा! आडव्या वर्णन यादी डाव्या स्तंभ फिक्सांत बसपाक चड लांब आशिल्लीं संज्ञा कापून उडयतलीं text-overflow. अरुंद दृश्यपोर्टांत, ते मुलभूत स्टॅक केल्ली मांडावळ बदलतले.

इनलायन

कोडाचे इनलायन स्निपेट 1 च्या आदारान गुठलावचे <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 डावनलोड करात आनी कशें वापरचें हाचे खातीर readme पळयात.

टॅग	वर्णन
<table>	कोश्टकीय स्वरूपांत डेटा दाखोवपाखातीर रॅपिंग घटक
<thead>	कोश्टक शीर्षक ओळींखातीर कंटेनर घटक ( <tr>) कोश्टक स्तंभांक लेबल करपाक
<tbody>	<tr>कोश्टकाच्या आंगांतल्या कोश्टक ओळींखातीर ( ) कंटेनर घटक
<tr>	एकाच ओळीचेर दिसपी कोश्टक कक्षांच्या संचाखातीर ( <td>वा ) कंटेनर घटक<th>
<td>	मुलभूत कोश्टक कक्ष
<th>	स्तंभ (वा ओळी, व्याप्ती आनी प्लेसमेंटाचेर आदारून) लेबलांखातीर खाशेलो कोश्टक कक्ष वापरपाक जाय a<thead>
<caption>	कोश्टकांत कितें आसा हाचें वर्णन वा सारांश, खास करून स्क्रीन वाचप्यां खातीर उपेगी

<कोश्टक> हें नांव
  <शीर्ष> हें नांव
    <tr> हें नांव
      <th> ... </th> हें नांव
      <th> ... </th> हें नांव
    </tr> हें नांव
  </thead> हें नांव
  <tbody> हें नांव
    <tr> हें नांव
      <td> ... </td> हें नांव
      <td> ... </td> हें नांव
    </tr> हें नांव
  </tbody> हें नांव
</कोश्टक>

वाचपाची तांक सुनिश्चीत करपाक आनी रचणूक सांबाळपाक कोश्टकांक आपोआप फकत कांय शिमो आशिल्ली शैली केल्ली आसता. 2.0 आसल्यार .tableवर्ग जाय पडटा.

<कोष्टक वर्ग = "कोष्टक" > 
  ...
</कोश्टक>

# 1 .	पयलें नांव	निमाणें नांव	वापरप्याचें नांव
१	मार्क हें नांव	ओटो हांणी केला	@mdo हांणी केला
२	जाकोब	थॉर्नटन हांणी केला	@चरबी
३	लॅरी हांणी केला	सुकणें हें	@twitter हांणी केला

झेब्रा-स्ट्राइपिंग जोडून तुमच्या कोश्टकां कडेन मात्शी फॅन्सी मेळोवची-फक्त .table-stripedवर्ग जोडचो.

टिप: पट्टेदार कोश्टकां :nth-childCSS निवडक वापरतात आनी IE7-IE8 त उपलब्ध ना.

<table class = "कोश्टक कोश्टक-पट्टीदार" > 
  ...
</कोश्टक>

# 1 .	पयलें नांव	निमाणें नांव	वापरप्याचें नांव
१	मार्क हें नांव	ओटो हांणी केला	@mdo हांणी केला
२	जाकोब	थॉर्नटन हांणी केला	@चरबी
३	लॅरी हांणी केला	सुकणें हें	@twitter हांणी केला

सौंदर्यशास्त्रीय उद्देशान पुराय मेजा भोंवतणी शिमो आनी वाटकुळे कोनशे घालचे.

<table class = "कोश्टक कोश्टक-सीमा आशिल्लें" > 
  ...
</कोश्टक>

# 1 .	पयलें नांव	निमाणें नांव	वापरप्याचें नांव
१	मार्क हें नांव	ओटो हांणी केला	@mdo हांणी केला
	मार्क हें नांव	ओटो हांणी केला	@getbootstrap हांणी केला
२	जाकोब	थॉर्नटन हांणी केला	@चरबी
३	लॅरी द बर्ड हांणी केला		@twitter हांणी केला

.table-condensedकोश्टक कक्ष पॅडींग अर्दांत (8px ते 4px मेरेन) कापपाक वर्ग जोडून तुमचीं कोश्टकां चड संकुचीत करात .

<table class = "कोश्टक कोश्टक-घनीभूत" > 
  ...
</कोश्टक>

# 1 .	पयलें नांव	निमाणें नांव	वापरप्याचें नांव
१	मार्क हें नांव	ओटो हांणी केला	@mdo हांणी केला
२	जाकोब	थॉर्नटन हांणी केला	@चरबी
३	लॅरी द बर्ड हांणी केला		@twitter हांणी केला

उपलब्ध आशिल्ल्या खंयच्याय वर्गाचो वापर करून वेगवेगळे देखावे मेळोवपा खातीर खंयच्याय कोश्टक वर्ग एकठांय करपाक मेकळीक दिवची.

<table class = "कोश्टक कोश्टक-पट्टीदार कोश्टक-सीमा आशिल्लें कोश्टक-घनीभूत" > 
  ...
</कोश्टक>

	पुराय नांव
# 1 .	पयलें नांव	निमाणें नांव	वापरप्याचें नांव
१	मार्क हें नांव	ओटो हांणी केला	@mdo हांणी केला
२	जाकोब	थॉर्नटन हांणी केला	@चरबी
३	लॅरी द बर्ड हांणी केला		@twitter हांणी केला

लवचीक एचटीएमएल आनी सीएसएस

बूटस्ट्रॅपांतल्या फॉर्मां विशीं सगळ्यांत बरो भाग म्हणल्यार तुमचे सगळे इनपुट आनी नियंत्रण तुमी तुमच्या मार्कअपांत कशेय तयार केले तरी बरे दिसतात. कसलेंच फायद्याचें HTML ची गरज ना, पूण जाय आशिल्ल्यांक आमी नमुने दितात.

सोप्या स्टायलिंग आनी इव्हेंट बाइंडिंग खातीर चड गुंतागुंतीच्यो मांडावळी संक्षिप्त आनी मापनीय वर्गां वांगडा येतात, देखून तुमकां दर एका पांवड्यार कव्हर केल्ले आसात.

चार मांडावळ आस्पावता

बूटस्ट्रॅप चार प्रकारच्या फॉर्म मांडावळीं खातीर आदार दिता:

• उबें (मुळावें) .
• सोद
• इनलायन
• आडवें

वेगवेगळ्या प्रकारच्या फॉर्म मांडावळींनी मार्कअप करपाक कांय बदल करचे पडटात, पूण नियंत्रणां स्वता तशींच उरतात आनी वागतात.

नियंत्रण राज्यां आनी हेर

Bootstrap च्या फॉर्मांनी सगळ्या बेस फॉर्म नियंत्रणां खातीर शैली आसपावीत केल्या जशे की इनपुट, textarea, आनी तुमी अपेक्षा करतात ती निवड. पूण तशेंच संलग्न आनी पूर्वनिर्धारीत इनपुट आनी चेकबॉक्सांच्या यादीं खातीर आदार अशे जायते सानुकूल घटक येतात.

दरेक प्रकारच्या फॉर्म नियंत्रणा खातीर चुक, शिटकावणी, आनी यश सारकिल्ल्यो अवस्था आस्पावल्यांत. तशेंच अक्षम नियंत्रणांखातीर शैलींचो आस्पाव केला.

मुळावें रूप

अतिरिक्त मार्कअप नासतना स्मार्ट आनी हलके वजनाचे डिफॉल्ट.

लेबल नांव

उदाहरण ब्लॉक-स्तरीय मदत मजकूर हांगा.

म्हाका पळयात सुवादीन करप

<फॉर्म वर्ग = "बरें" > 
  <label> लेबलाचें नांव </label>
  <input type = "text" class = "span3" placeholder = "कितें तरी टाइप करात..." >   
  <span class = "help-block" > हांगा ब्लॉक-पातळेचो मदत मजकूर उदाहरण. </span> हें नांव 
  <लेबल वर्ग = "चेकबॉक्स" > 
    <input type = "checkbox" > म्हाका तपासात 
  </label> हें नांव
  <बटण प्रकार = "सबमिट" class = "btn" > सबमिट करचें </button>  
</form> हें नांव

सोद फॉर्म

.form-searchफॉर्मांत आनी .search-queryकडेन जोडचें input.

सोद

<form class = "बरें फॉर्म-सोद" > 
  <इनपुट प्रकार = "मजकूर" वर्ग = "इनपुट-माध्यम सोद-क्वेरी" >  
  <बटण प्रकार = "सबमिट" वर्ग = "btn" > सोद </बटण>  
</form> हें नांव

इनलायन फॉर्म

.form-inlineफॉर्म नियंत्रणांची उबी संरेखण आनी अंतर बारीकसाणी करपाक जोडात .

म्हाका याद कर सायन इन करचें

<form class = "बरें फॉर्म-इनलायन" > 
  <इनपुट प्रकार = "मजकूर" वर्ग = "इनपुट-ल्हान" प्लेसहोल्डर = "ईमेल" >   
  <इनपुट प्रकार = "पासवर्ड" वर्ग = "इनपुट-ल्हान" प्लेसहोल्डर = "पासवर्ड" >   
  <लेबल वर्ग = "चेकबॉक्स" > 
    <input type = "checkbox" > म्हाका याद दवरात 
  </label> हें नांव
  <बटण प्रकार = "सबमिट" वर्ग = "btn" > सायन इन करात </बटण>  
</form> हें नांव

आमी तेंको दितात ते सगळे मुलभूत फॉर्म नियंत्रण उजवे वटेन दाखयल्यात. हांगा बुलेट केल्ली वळेरी आसा:

• मजकूर इनपुट (मजकूर, पासवर्ड, ईमेल, आदी)
• चेकबॉक्स आसा
• रेडिओचेर मेळटा
• वेंचचें
• एका परस चड निवडात
• फायल इनपुट करप
• पाठक्षेत्रांतलें

मजकूर इनपुट करप

मुक्तरूप मजकूरा भायर, खंयचोय HTML5 मजकूर-आधारीत इनपुट अशें दिसता.

चेकबॉक्स आसा

पर्याय एक हो आनी तो-तो कित्याक म्हान आसा हाची खात्रीन आस्पाव करात

वळेरी निवडात

किदेंतरी २ ३ ४ ५

मल्टीकॉन-निवड करचें

१ २ ३ ४ ५

फायल इनपुट करप

पाठक्षेत्र

बदल जतनाय घेयात रद्द

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

वयली उदाहरण फॉर्म मांडावळ दिल्या, हांगा पयल्या इनपुट आनी नियंत्रण गटा कडेन संबंदीत मार्कअप आसा. स्टायलिंग खातीर .control-group, .control-label, आनी .controlsवर्ग सगळे जाय पडटात.

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

बूटस्ट्रॅप ब्राउझर-समर्थीत केंद्रीत आनी disabledराज्यां खातीर शैली वैशिश्ट्य करता. आमी मुलभूत वेबकिट काडून उडयतात आनी ताचे सुवातेर outlinea लागू करतात .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">

जाळी आकार तयार करात

१ २ ३ ४ ५ १ २ ३ ४ ५ १ २ ३ ४ ५

.span*इनपुट आकारांखातीर ग्रिड प्रणालींतल्यान तेच वर्ग वापरात .

पर्यायी आकार दिवप

तशेंच तुमी स्थिर वर्ग वापरूं येतात जे ग्रिडाक मॅप करिनात, प्रतिसाद दिवपी CSS शैलींक अनुकूल करिनात, वा वेगवेगळ्या प्रकारच्या नियंत्रणां खातीर खातें करतात (देखीक, inputविरुद्ध select).

पूर्वप्रलंबित मजकूर

@ हांणी केला.

हांगा कांय मदत मजकूर आसा

संलग्न केल्लो मजकूर

.०० हें

हांगा आनीक मदत मजकूर आसा

जोडप आनी प्रीपेंड करप

$ हें नांव .०० हें

बटणान जोडचें

वच!

दोन बटणांचो जोडप

सोद पर्याय आसात

इनलायन चेकबॉक्स

१ २ ३

चेकबॉक्स आसात

पर्याय एक हो आनी तो-तो कित्याक म्हान आसा हाची खात्रीन आस्पाव करात पर्याय दोनय तपासून फॉर्म रिजल्टांत आस्पाव करूं येता पर्याय तीन-होय, तुमी अदमास केला-तशेंच तपासूंक शकता आनी फॉर्म परिणामांत आस्पाव करूंक शकता

टिप: लेबलां खूब व्हडल्या क्लिक क्षेत्रां खातीर आनी चड वापरपाक येवपी फॉर्मा खातीर सगळ्या पर्यायांक भोंवतणीं आसतात.

रेडिओचे बटण

पर्याय एक हो आनी तो-तो कित्याक म्हान आसा हाची खात्रीन आस्पाव करात पर्याय दोन आनीक कितें तरी आसूं येता आनी तो निवडल्यार पर्याय एक निवड रद्द जातली

बदल जतनाय घेयात रद्द

कृतींखातीर बटण

एक रूढिवाद म्हूण, बटण फकत कृतींखातीर वापरपाक जाय जाल्यार हायपरलिंक वस्तूंखातीर वापरपाचे आसात. देखीक, "डावनलोड" हें बटण आसपाक जाय जाल्यार "हालीची क्रिया" दुवो आसपाक जाय.

.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>  
<बटण वर्ग = "btn" प्रकार = "सबमिट" >  
  बटन
</बटण> हें नांव
<इनपुट वर्ग = "btn" प्रकार = "बटण".  
         value = "इनपुट" >
<input class = "btn" प्रकार = "सबमिट करचें".  
         value = "सबमिट करचें" >

एक उत्तम पद्दत म्हणून, क्रॉस-ब्राउझर रेंडरींग जुळोवपाची खात्री करपाक तुमच्या संदर्भाखातीर घटक जुळोवपाचो यत्न करात. तुमचे कडेन एक आसल्यार , तुमच्या बटणा खातीर एक inputवापरात .<input type="submit">

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

• चिन्न-आयतन-बंद करप
• चिन्न-आयतन-सकयल करप
• चिन्न-खंड-अप करप
• चिन्न-qrcode हें नांव
• चिन्न-बारकोड
• चिन्न-टॅग
• चिन्न-टॅग
• चिन्ह-पुस्तक
• चिन्न-पुस्तिका चिन्ह
• चिन्न-मुद्रण करप
• चिन्न-कॅमेरा
• चिन्न-फॉन्ट
• चिन्न-बोल्ड
• चिन्न-इटालिक
• चिन्ह-मजकूर-उंचाय
• चिन्ह-मजकूर-रुंदी
• चिन्न-संरेखित-डावें
• चिन्न-संरेखित-केंद्र
• चिन्न-संरेखित-उजवें
• चिन्न-संरेखित-समर्थन करप
• चिन्न-सूची
• चिन्न-इंडेन्ट-डावें
• चिन्ह-इंडेन्ट-उजवें
• चिन्ह-मुखवेळ-व्हिडियो
• चिन्ह-चित्र
• चिन्ह-पेन्सिल
• चिन्ह-नकाशा-चिह्न
• चिन्ह-समायोजित करप
• चिन्ह-टिंट
• चिन्न-संपादन करचें
• आयकॉन-शेअर करप
• चिन्न-तपासप
• चिन्न-हालप
• चिन्न-पद-फाटीं
• चिन्ह-वेगवान-फाटीं

• चिन्न-फाटीं
• चिन्न-खेळणें
• चिन्न-विराम करप
• चिन्न-थांब
• चिन्न-फुडें
• चिन्न-फास्ट-फॉरवर्ड करचें
• चिन्न-पद-फुडें
• चिन्ह-बाहेर करप
• चिन्ह-शेवरॉन-डावें
• चिन्ह-शेवरॉन-उजवें
• चिन्ह-प्लस-चिन्ह
• चिन्ह-उणे-चिन्ह
• चिन्न-काडून-चिन्ह
• चिन्ह-ठीक आसा-चिन्ह
• चिन्ह-प्रस्न-चिन्ह
• चिन्न-माहिती-चिन्ह
• चिन्न-स्क्रीनशॉट
• चिन्ह-काडून-वर्तुळ
• चिन्ह-ठीक आसा-वर्तुळ
• चिन्ह-बॅन-सर्कल
• चिन्ह-बाण-डावें
• चिन्ह-बाण-उजवें
• चिन्ह-बाण-ऊपर
• चिन्ह-बाण-सकयल
• आयकॉन-शेअर-अल्ट
• चिन्न-आकार बदलप-पूर्ण
• चिन्न-आकार बदलप-ल्हान
• चिन्न-प्लस
• चिन्न-उणें करप
• चिन्ह-तारा चिन्ह
• चिन्ह-विस्मयादिबोधक-चिन्ह
• चिन्ह-उपहार
• चिन्ह-पान
• चिन्ह-उजो
• चिन्ह-दोळे उगडले

• चिन्ह-दोळो-बंद करप
• चिन्ह-शिटकावणी-चिन्ह
• चिन्ह-विमान
• चिन्न-पंचांग
• चिन्ह-यादृच्छिक
• चिन्न-टिप्पणी करप
• चिन्ह-चुंबक
• चिन्न-शेवरॉन-अप
• चिन्ह-शेवरॉन-सकयल
• चिन्न-रिट्विट करप
• चिन्ह-खरेदी-गाडी
• चिन्न-फोल्डर-बंद करचें
• चिन्न-फोल्डर-उगडप
• चिन्न-आकार-उबें
• चिन्न-आकार-आडवें
• चिन्न-एचडीडी
• चिन्ह-बुलहॉर्न
• चिन्ह-घंटी
• चिन्न-प्रमाणपत्र
• चिन्ह-आंगठो-अप
• चिन्न-आंगठो-सकयल
• चिन्ह-हात-उजवें
• चिन्ह-हात-डावें
• चिन्ह-हात-अप
• चिन्ह-हात-सकयल
• चिन्ह-वृत्त-बाण-उजवें
• चिन्ह-वृत्त-बाण-डावें
• चिन्ह-वर्तुळ-बाण-ऊपर
• चिन्ह-वृत्त-बाण-सकयल
• चिन्ह-ग्लोब
• चिन्न-पांच
• चिन्न-कार्य
• चिन्न-फिल्टर
• आयकॉन-ब्रिफकेस
• चिन्न-फुलस्क्रीन

स्प्राइट म्हणून बांदिल्लें

दरेक चिन्न एक अतिरिक्त विनंती करचे परस, आमी तांकां स्प्राइटांत संकलित केल्यात-एका फायलीन प्रतिमांचो एक गट जो CSS वापरता प्रतिमा कडेन स्थापन करपाक background-position. हीच पद्दत आमी ट्विटर डॉट कॉमचेर वापरतात आनी ती आमकां बरी काम केल्या.

सगळ्या चिन्न वर्गांक .icon-योग्य नांव अंतर आनी व्याप्ती खातीर उपसर्ग केला, आमच्या हेर घटकां प्रमाण. हाका लागून हेर साधनां कडेन संघर्श टाळपाक मदत जातली.

जो मेरेन आमी हांगा डॉक्सांत दुवो आनी श्रेय दितात तो मेरेन Glyphicons हांणी आमकां आमच्या मुक्त-स्त्रोत साधनपुस्तिकांत सेट केल्ल्या Halflings वापरपाक परवानगी दिल्या. उपकार करून तुमच्या प्रकल्पांतय तशें करपाचो विचार करात.

वापर कसो करचो

<i>बूटस्ट्रॅप सगळ्या चिन्नांखातीर टॅग वापरता , पूण तांकां केस वर्ग ना-फकत वांटणी केल्लो उपसर्ग. वापरपाक, सकयल दिल्लो कोड फकत खंयच्याय सुवातेर दवरात:

<i class = "चिन्न-सोद" </i> 

तशेंच उलट्या (धव्या) चिन्नांखातीर शैली उपलब्ध आसात, एक अतिरिक्त वर्ग घेवन तयार केल्यात:

<i class = "चिन्न-सोद चिन्ह-धवें" ></i> 

तुमच्या चिन्नां खातीर वेंचून काडपाक 140 वर्ग आसात. फकत योग्य वर्गां सयत टॅग जोडात <i>आनी तुमी सेट जाल्यात. तुमकां पुराय वळेरी sprites.less हातूंत वा हांगाच ह्या दस्तावेजांत मेळूं येता.

तकली वयर काडटा! मजकूराच्या बाजूक स्ट्रिंग वापरतना, बटणां वा nav दुव्यां प्रमाणें, <i>योग्य अंतराखातीर टॅगा उपरांत सुवात सोडपाची खात्री करात.

वापर केस

चिन्नां म्हान आसतात, पूण तांचो वापर खंय जातलो? हांगा थोडीं कल्पना दिल्यांत: १.

• तुमच्या सायडबार नेव्हिगेशनाक व्हिज्युअल म्हणून
• शुध्द चिन्न-आदारीत नेव्हिगेशन खातीर
• कृतीचो अर्थ सांगपाक मदत करपाक बटणां खातीर
• वापरप्याच्या गंतव्याचेर संदर्भ वांटपा खातीर दुवे सयत

मुळाव्यान खंयच्याय सुवातेर <i>टॅग घालूंक मेळटा थंय चिन्न घालूंक मेळटा.

ताजें करचें चेकआउट करचें वगळावचें

टिप्पणी मांडावळी चड म्हायती

ईमेल पत्तो