تاختاينىڭ ئۈستىگە ، ئاساسىي HTML ئېلېمېنتلىرى ئۇسلۇب ۋە كېڭەيتىلگەن دەرسلەر بىلەن كۈچەيتىلگەن بولۇپ ، يېڭى ، ئىزچىل كۆرۈنۈش ۋە تۇيغۇ بېرىدۇ.
پۈتكۈل مەتبەئە تورى بىزنىڭ ئۆزگەرگۈچى مىقدارلىرىمىزدىكى ئىككى ئاز ئۆزگەرگۈچى مىقدارنى ئاساس @baseFontSizeقىلىدۇ @baseLineHeight. بىرىنچىسى ، ئىشلىتىلگەن ئاساسىي خەت چوڭلۇقى ، ئىككىنچىسى ئاساسى سىزىق ئېگىزلىكى.
بىز بۇ ئۆزگەرگۈچى مىقدارلارنى ۋە بىر قىسىم ماتېماتىكىنى ئىشلىتىپ ، بارلىق تىپلىرىمىزنىڭ گىرۋەكلىرى ، تاختىلىرى ۋە سىزىق ئېگىزلىكىنى ھاسىل قىلىمىز.
Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur مەسخىرە مۇس. Nullam id dolor id nibh ئۇلترا ماشىنىلىرى ut id elit.
Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui.
| ئېلېمېنت | ئىشلىتىش | ئىختىيارىي |
|---|---|---|
<strong> |
مۇھىم بولغان بىر پارچە تېكىستنى تەكىتلەش ئۈچۈن | ياق |
<em> |
بىر پارچە تېكىستنى بېسىم بىلەن تەكىتلىگەنلىكى ئۈچۈن | ياق |
<abbr> |
كېڭەيتىلگەن نۇسخىسىنى كۆرسىتىش ئۈچۈن قىسقارتىلما ۋە قىسقارتىلمىلارنى ئوراپ |
.initialismچوڭ ھەرپ قىسقارتىلمىسى ئۈچۈن دەرس ئىشلىتىڭ . |
<address> |
ئۇنىڭ ئەڭ يېقىن ئەجدادى ياكى پۈتۈن خىزمەت ئورگىنى بىلەن ئالاقىلىشىش ئۇچۇرلىرى ئۈچۈن | بارلىق قۇرلارنى ئاخىرلاشتۇرۇش ئارقىلىق فورماتنى ساقلاڭ<br> |
Fusce dapibus , tellus ac cursus commodo , tortor mauris condimentum nibh , ut fermentum massa justo sit amet risus. Maecenas faucibus mollis interdum. Nulla vitae elit libero, a pharetra augue.
ئەسكەرتىش: HTML5 دا ئىشلىتىشنى ئەركىن ھېس قىلىڭ <b>، <i>ئەمما ئۇلارنىڭ ئىشلىتىلىشى ئازراق ئۆزگەردى. كۆپىنچە ئاۋاز ، تېخنىكىلىق ئاتالغۇ قاتارلىقلار ئۈچۈن <b>قوشۇمچە ئەھمىيەت بەرمەي تۇرۇپ سۆز ياكى ئىبارىلەرنى گەۋدىلەندۈرۈشنى مەقسەت قىلىدۇ .<i>
بۇ <address>خەتكۈچنى ئىشلىتىشنىڭ ئىككى مىسالى:
خاسلىقى بار قىسقارتىلمىلارنىڭ titleئاستى چېكىتلىك چېكىت ۋە يۆلىنىشتە ياردەمچى نۇر بەلگىسى بار. بۇ ئىشلەتكۈچىلەرگە hover دا بىر نەرسە كۆرسىتىلىدىغانلىقىنى قوشۇمچە كۆرسىتىپ بېرىدۇ.
دەرسنى قىسقارتىپ قوشۇپ ، initialismخەتنىڭ ماسلىشىشچانلىقىنى ئازراق كىچىكرەك قىلىپ يېزىڭ.
HTML بولكا كېسىلگەندىن بۇيانقى ئەڭ ياخشى نەرسە.
خاسلىق سۆزىنىڭ قىسقارتىلمىسى attr .
| ئېلېمېنت | ئىشلىتىش | ئىختىيارىي |
|---|---|---|
<blockquote> |
باشقا مەنبەدىن مەزمۇن نەقىل كەلتۈرۈش ئۈچۈن بۆلەك دەرىجىلىك ئېلېمېنت |
.pull-leftۋە دەرسلەر.pull-right |
<small> |
ئىشلەتكۈچىگە قارىتىلغان نەقىل قوشۇشنىڭ ئىختىيارى ئېلېمېنتى ، ئادەتتە ئەسەر ئىسمى بار ئاپتور | مەنبە ياكى ئىسىمنىڭ <cite>ئەتراپىغا قويۇڭ |
<blockquote>بىر بۆلەكنى ئۆز ئىچىگە ئېلىش ئۈچۈن ، ھەر قانداق HTML نى نەقىل قىلىپ ئوراپ قويۇڭ . تۈز نەقىل ئۈچۈن بىز a نى تەۋسىيە قىلىمىز <p>.
<small>مەنبەڭىزنى نەقىل كەلتۈرۈش ئۈچۈن ئىختىيارى ئېلېمېنتنى ئۆز ئىچىگە ئېلىڭ —، ئۇسلۇب ئۈچۈن ئۇنىڭ ئالدىدا بىر باش تاختا تاپشۇرۇۋالىسىز.
- <blockquote>
- <p> لورېم ئىپس دولور ئولتۇرۇش ئامېتى ، كونسېرۋاتىپلىق ماسلاشتۇرغۇچى سەرخىل. پۈتۈن سان پوستى ئانتېنا تومۇرنى يوقىتىدۇ. </p>
- <small> داڭلىق كىشى </small>
- </blockquote>
سۈكۈتتىكى بۆلەكلەر مۇنداق ئۇسلۇبتا يېزىلغان:
Lorem ipsum dolor amet ، كونسېرۋاتىپلىق ماسلاشتۇرغۇچى تالانت. پۈتۈن سان پوستى ئانتېنا تومۇرنى يوقىتىدۇ.
خىزمەت گەۋدىسىدە داڭق چىقارغان كىشى
توپىڭىزنى ئوڭ تەرەپكە لەيلىتىش ئۈچۈن ، قوشۇڭ class="pull-right":
Lorem ipsum dolor amet ، كونسېرۋاتىپلىق ماسلاشتۇرغۇچى تالانت. پۈتۈن سان پوستى ئانتېنا تومۇرنى يوقىتىدۇ.
خىزمەت گەۋدىسىدە داڭق چىقارغان كىشى
<ul>
<ul class="unstyled">
<ol>
<dl>
<dl class="dl-horizontal">
Heads up! گورىزونتال تەسۋىر تىزىملىكى سول ئىستون ئوڭشاشقا بەك ئۇزۇن بولغان ئاتالغۇلارنى قىسقارتىدۇ text-overflow. تار كۆرۈنۈشلەردە ، ئۇلار سۈكۈتتىكى رەتلەنگەن ئورۇنلاشتۇرۇشقا ئۆزگىرىدۇ.
كود پارچىلىرىنى ئۆز ئىچىگە <code>ئالىدۇ.
- مەسىلەن ، <code> بۆلىكى </ code > نى تور شەكلىدە ئوراپ قويۇش كېرەك .
<pre>بىر نەچچە قۇر كودنى ئىشلىتىڭ . مۇۋاپىق رەسىم ئۈچۈن كودتىكى ھەر قانداق بۇلۇڭ تىرناقتىن قېچىشقا كاپالەتلىك قىلىڭ.
<p> بۇ يەردىكى ئۈلگە تېكىست ... </p>
- <pre>
- & lt; p & gt; بۇ يەردىكى ئۈلگە تېكىست ... & lt; / p & gt;
- </pre>
ئەسكەرتىش: بەلگە ئىچىدىكى كودلارنى <pre>ئىمكانقەدەر سولغا يېقىنلاشتۇرۇڭ. ئۇ بارلىق بەتكۈچلەرنى بېرىدۇ.
سىز .pre-scrollableئەڭ يۇقىرى ئېگىزلىكى 350px قىلىپ بەلگىلەيدىغان ۋە y ئوقلۇق سىيرىلما بالداق بىلەن تەمىنلەيدىغان سىنىپنى تاللىسىڭىز بولىدۇ.
ئوخشاش <pre>ئېلېمېنتنى ئېلىپ ، كۈچەيتىلگەن رەسىم ئۈچۈن ئىككى ئىختىيارى دەرس قوشۇڭ.
- <p> بۇ يەردىكى ئۈلگە تېكىست ... </p>
- <pre class = "prettyprint
- linenums " >
- & lt; p & gt; بۇ يەردىكى ئۈلگە تېكىست ... & lt; / p & gt;
- </pre>
Google-code-prettify نى چۈشۈرۈپ ، ئىشلىتىش ئۇسۇلىنى ئوقۇڭ.
| خەتكۈچ | چۈشەندۈرۈش |
|---|---|
<table> |
جەدۋەل شەكلىدە سانلىق مەلۇمات كۆرسىتىش ئۈچۈن ئوراش ئېلېمېنتى |
<thead> |
<tr>جەدۋەلنىڭ ئىستونلىرىغا بەلگە بەتكۈچ قۇرلىرى |
<tbody> |
<tr>جەدۋەلنىڭ گەۋدىسىدىكى جەدۋەل قۇرلىرى ئۈچۈن قاچا ئېلېمېنتى |
<tr> |
بىر قۇردا كۆرۈنىدىغان جەدۋەل كاتەكچىسى ( <td>ياكى ) نىڭ كونتېينېر ئېلېمېنتى<th> |
<td> |
كۆڭۈلدىكى جەدۋەل كاتەكچىسى |
<th> |
ستون (ياكى دائىرە ۋە ئورۇنلاشتۇرۇشقا ئاساسەن) بەلگە ئۈچۈن ئالاھىدە جەدۋەل كاتەكچىسى چوقۇم a ئىچىدە ئىشلىتىلىشى كېرەك <thead> |
<caption> |
جەدۋەلدە ساقلانغان مەزمۇنلارنىڭ چۈشەندۈرۈشى ياكى خۇلاسىسى ، بولۇپمۇ ئېكران ئوقۇرمەنلىرى ئۈچۈن پايدىلىق |
- <table>
- <thead>
- <tr>
- <th> … </th>
- <th> … </th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td> … </td>
- <td> … </td>
- </tr>
- </tbody>
- </table>
| ئىسمى | سىنىپ | چۈشەندۈرۈش |
|---|---|---|
| سۈكۈتتىكى | ياق | ئۇسلۇب يوق ، پەقەت ستون ۋە قۇر |
| Basic | .table |
پەقەت قۇر ئارىلىقىدىكى سىزىقلار |
| چېگرا | .table-bordered |
بۇلۇڭ-پۇچقاقلارنى ئايلىنىپ ، سىرتقى چېگرانى قوشىدۇ |
| Zebra-stripe | .table-striped |
غەلىتە قۇرلارغا سۇس كۈلرەڭ تەگلىك رەڭ قوشىدۇ (1 ، 3 ، 5 قاتارلىقلار) |
| قويۇق | .table-condensed |
tdبارلىق ۋە thئېلېمېنتلارنىڭ ئىچىدە 8px دىن 4px غىچە بولغان تىك تاختاينى يېرىم قىلىپ كېسىدۇ |
جەدۋەلنىڭ ئوقۇشقا كاپالەتلىك قىلىش ۋە قۇرۇلمىنى ساقلاشقا كاپالەتلىك قىلىش ئۈچۈن جەدۋەل پەقەت بىر قانچە چېگرا بىلەن ئاپتوماتىك ئۇسلۇبتا ياسالغان. 2.0 بىلەن .tableدەرس تەلەپ قىلىنىدۇ.
- <table class = "table" >
- …
- </table>
| # | بىرىنچى ئىسمى | فامىلىسى | ئىشلەتكۈچى ئىسمى |
|---|---|---|---|
| 1 | Mark | Otto | @mdo |
| 2 | ياقۇپ | Thornton | @fat |
| 3 | Larry | قۇش |
جەدۋەللىرىڭىزگە ئازراق زىننەت بۇيۇمى قوشۇڭ ، .table-stripedدەرسنى قوشۇڭ.
ئەسكەرتىش: سىزىقلىق جەدۋەللەردە :nth-childCSS تاللىغۇچ ئىشلىتىلىدۇ ، IE7-IE8 دا ئىشلەتكىلى بولمايدۇ.
- <table class = "table table-striped" >
- …
- </table>
| # | بىرىنچى ئىسمى | فامىلىسى | ئىشلەتكۈچى ئىسمى |
|---|---|---|---|
| 1 | Mark | Otto | @mdo |
| 2 | ياقۇپ | Thornton | @fat |
| 3 | Larry | قۇش |
ئېستېتىك مەقسەت ئۈچۈن پۈتۈن ئۈستەل ۋە يۇمىلاق بۇلۇڭلارغا چېگرا قوشۇڭ.
- <table class = "جەدۋەل جەدۋەل بىلەن چېگرىلىنىدۇ" >
- …
- </table>
| # | بىرىنچى ئىسمى | فامىلىسى | ئىشلەتكۈچى ئىسمى |
|---|---|---|---|
| 1 | Mark | Otto | @mdo |
| Mark | Otto | @getbootstrap | |
| 2 | ياقۇپ | Thornton | @fat |
| 3 | Larry the Bird | ||
جەدۋەلنى قوشۇش ئارقىلىق جەدۋەلنى تېخىمۇ ئىخچام قىلىڭ .table-condensed(8px دىن 4px غىچە).
- <table class = "جەدۋەل جەدۋىلى قويۇق" >
- …
- </table>
| # | بىرىنچى ئىسمى | فامىلىسى | ئىشلەتكۈچى ئىسمى |
|---|---|---|---|
| 1 | Mark | Otto | @mdo |
| 2 | ياقۇپ | Thornton | @fat |
| 3 | Larry the Bird | ||
جەدۋەل دەرسلىرىنىڭ خالىغان بىرىنى بىرلەشتۈرۈپ ، بار بولغان دەرسلەردىن پايدىلىنىپ ئوخشىمىغان كۆرۈنۈشكە ئېرىشىڭ.
- <جەدۋەل سىنىپى = "جەدۋەل ئۈستەل سىزىقلىق جەدۋەل بىلەن ئۈستەل ئۈستەل قويۇق" >
- ...
- </table>
| تولۇق ئىسمى | |||
|---|---|---|---|
| # | بىرىنچى ئىسمى | فامىلىسى | ئىشلەتكۈچى ئىسمى |
| 1 | Mark | Otto | @mdo |
| 2 | ياقۇپ | Thornton | @fat |
| 3 | Larry the Bird | ||
Bootstrap دىكى جەدۋەللەرنىڭ ئەڭ ياخشى يېرى شۇكى ، بارلىق كىرگۈزۈش ۋە كونتروللىرىڭىز ماركىڭىزدا قانداق قۇرسىڭىزمۇ ناھايىتى ياخشى كۆرۈنىدۇ. ئارتۇقچە HTML تەلەپ قىلىنمايدۇ ، ئەمما بىز ئۇنى تەلەپ قىلغۇچىلار ئۈچۈن ئەندىزە بىلەن تەمىنلەيمىز.
تېخىمۇ مۇرەككەپ ئورۇنلاشتۇرۇشلار ئاسان ئۇسلۇب ۋە پائالىيەت باغلاش ئۈچۈن ئاددىي ۋە كېڭەيتىشچان دەرسلەر بىلەن كەلگەن ، شۇڭا سىز ھەر بىر باسقۇچتا قاپلىنىسىز.
Bootstrap تۆت خىل شەكىل ئورۇنلاشتۇرۇشنى قوللايدۇ:
ئوخشىمىغان تىپتىكى شەكىل ئورۇنلاشتۇرۇشى بەلگە سېلىش ئۈچۈن بەزى ئۆزگەرتىشلەرنى تەلەپ قىلىدۇ ، ئەمما كونتروللارنىڭ ئۆزى ساقلىنىپ قالىدۇ.
Bootstrap نىڭ شەكىللىرى كىرگۈزۈش ، تېكىست ۋە سىز ئويلىغاندەك بارلىق ئاساسىي شەكىل كونتروللىرىنىڭ ئۇسلۇبىنى ئۆز ئىچىگە ئالىدۇ. ئەمما ئۇ يەنە قوشۇمچە ۋە ئالدىن كىرگۈزۈلگەن كىرگۈزۈش ۋە تەكشۈرۈش ساندۇقىنىڭ تىزىملىكىنى قوللاش قاتارلىق بىر قاتار ئىختىيارى زاپچاسلار بىلەن تەمىنلەيدۇ.
خاتالىق ، ئاگاھلاندۇرۇش ۋە مۇۋەپپەقىيەتكە ئوخشاش دۆلەتلەر ھەر خىل شەكىل كونتروللىرىنى ئۆز ئىچىگە ئالىدۇ. چەكلەنگەن كونتروللارنىڭ ئۇسلۇبلىرىمۇ بار.
Bootstrap ئادەتتىكى تور شەكىللىرىنىڭ تۆت خىل ئۇسلۇبى ئۈچۈن ئاددىي بەلگە ۋە ئۇسلۇب بىلەن تەمىنلەيدۇ.
| ئىسمى | سىنىپ | چۈشەندۈرۈش |
|---|---|---|
| تىك (سۈكۈتتىكى) | .form-vertical (تەلەپ قىلىنمايدۇ) |
كونترول قىلىنغان ، سولغا بەلگە قويۇلغان |
| Inline | .form-inline |
ئىخچام ئۇسلۇب ئۈچۈن سولغا توغرىلانغان بەلگە ۋە سىزىقلىق كونترول كونتروللىرى |
| ئىزدەش | .form-search |
تىپىك ئىزدەش ئېستېتىكىسى ئۈچۈن قوشۇمچە يۇمىلاق تېكىست كىرگۈزۈش |
| توغرىسىغا | .form-horizontal |
لەيلىمە سول ، ئوڭ تەرەپتىكى بەلگە كونترول بىلەن ئوخشاش |
ئارتۇقچە بەلگە قويماي ئەقلىي ئىقتىدارلىق ۋە يېنىك سۈكۈتتىكى ھالەت.
- <form class = "well" >
- <label> بەلگە ئىسمى </label>
- <input type = "text" class = "span3" placeholder = "بىر نەرسە كىرگۈزۈڭ…" >
- <span class = "help-block" > ئۈلگە بۆلەك دەرىجىلىك ياردەم تېكىستى. </span>
- <label class = "تەكشۈرۈش رامكىسى" >
- <input type = "checkbox" > مېنى تەكشۈرۈپ بېقىڭ
- </label>
- <كۇنۇپكا تىپى = "يوللاش" class = "btn" > يوللاش </button>
- </form>
جەدۋەلگە .form-searchۋە . .search-query_input
- <form class = "well form-search" >
- <input type = "text" class = "input-medium search-query" >
- <كۇنۇپكا تىپى = "يوللاش" class = "btn" > ئىزدەش </button>
- </form>
.form-inlineشەكىل كونتروللۇقىنىڭ تىك توغرىلىنىشى ۋە ئارىلىقىنى ئىنچىكە قوشۇڭ .
- <form class = "well form-inline" >
- <input type = "text" class = "input-small" placeholder = "ئېلخەت" >
- <input type = "password" class = "input-small" placeholder = "پارول" >
- <label class = "تەكشۈرۈش رامكىسى" >
- <input type = "checkbox" > مېنى ئېسىڭىزدە تۇتۇڭ
- </label>
- <كۇنۇپكا تىپى = "يوللاش" class = "btn" > كىرىش </button>
- </form>
ئوڭ تەرەپتە كۆرسىتىلگەنلەرنىڭ ھەممىسى بىز قوللايدىغان سۈكۈتتىكى جەدۋەل كونتروللىرى. ئوققا تۇتۇلغان تىزىملىك:
يۇقارقى مىسال جەدۋەل ئورۇنلاشتۇرۇشىنى نەزەردە تۇتقاندا ، بۇ يەردە تۇنجى كىرگۈزۈش ۋە كونترول گۇرۇپپىسى بىلەن مۇناسىۋەتلىك بەلگە بار. ئۇسلۇب ئۈچۈن ، .control-group، .control-labelۋە .controlsدەرسلەرنىڭ ھەممىسى تەلەپ قىلىنىدۇ.
- <form class = "form-horizontal" >
- <fieldset>
- <legend> رىۋايەت تېكىستى </legend>
- <div class = "control-group" >
- <label class = "control-label" for = "input01" > تېكىست كىرگۈزۈش </label>
- <div class = "control" >
- <input type = "text" class = "input-xlarge" id = "input01" >
- <p class = "help-block" > ياردەم تېكىستىنى قوللاش </p>
- </div>
- </div>
- </fieldset>
- </form>
Bootstrap توركۆرگۈ قوللايدىغان فوكۇس ۋە disabledھالەتلەرنىڭ ئۇسلۇبىنى قوللايدۇ. سۈكۈتتىكى Webkit نى ئۆچۈرۈۋېتىمىز ھەمدە outlineئۇنىڭ box-shadowئورنىغا ئىشلىتىمىز :focus.
ئۇ خاتالىق ، ئاگاھلاندۇرۇش ۋە مۇۋەپپەقىيەتنىڭ دەلىللەش ئۇسلۇبىنىمۇ ئۆز ئىچىگە ئالىدۇ. ئىشلىتىش ئۈچۈن ، ئەتراپىغا خاتالىق سىنىپى قوشۇڭ .control-group.
- <fieldset
- class = "control-group error" >
- …
- </fieldset>
كىرگۈزۈش گۇرۇپپىلىرى - قوشۇمچە ياكى ئالدىن يېزىلغان تېكىستلەر ئارقىلىق ، كىرگۈزمىلىرىڭىزگە تېخىمۇ كۆپ مەزمۇن بېرىشنىڭ ئاسان ئۇسۇلى بىلەن تەمىنلەيدۇ. Twitter مىساللىرى ئۈچۈن @ بەلگىسى ياكى مالىيە ئۈچۈن $ بەلگىسى بار.
V1.4 غىچە ، Bootstrap تەكشۈرۈش ساندۇقى ۋە رادىئو ئەتراپىدا قوشۇمچە بەلگە تەلەپ قىلىدۇ. <label class="checkbox">ھازىر ، ئۇنى ئوراپ تۇرغاننى تەكرارلاش ئاددىي بىر ئىش <input type="checkbox">.
ئىچكى تەكشۈرۈش رامكىسى ۋە رادىئومۇ قوللايدۇ. .inlineھەر قانداق بىرسىگە قوشۇڭ .checkbox، .radioئىش تامام.
ئالدىن كىرىش ياكى كىرگۈزۈش كىرگۈزۈش شەكلىنى ئىشلىتىش ئۈچۈن ، بوشلۇق .add-onۋە inputئوخشاش بىر قۇرنى جەزملەشتۈرۈڭ.
جەدۋەل كىرگۈزۈشىڭىزگە ياردەم تېكىستى قوشۇش ئۈچۈن ، كىرگۈزۈش ئېلمىنتىدىن كېيىن <span class="help-inline">ياردەم تېكىستنى ياكى ياردەم تېكىستنى ئۆز ئىچىگە ئالىدۇ.<p class="help-block">
بىز ھەر بىر سىنبەلگىنى قوشۇمچە تەلەپ قىلىشنىڭ ئورنىغا ، بىز ئۇلارنى sprite غا توپلىدۇق - بىر ھۆججەتتىكى بىر تۈركۈم رەسىملەر CSS ئارقىلىق رەسىملەرنى ئورۇنلاشتۇرىدۇ background-position. بۇ بىز Twitter.com دا قوللانغان ئۇسۇل ، ئۇ بىز ئۈچۈن ياخشى ئۈنۈم بەردى.
بارلىق سىنبەلگىلەر دەرسلىرى .icon-بىزنىڭ باشقا زاپچاسلىرىمىزغا ئوخشاش مۇۋاپىق ئىسىم قويۇش ۋە تەكشۈرۈش ئۈچۈن ئالدىن ئورۇنلاشتۇرۇلغان. بۇ باشقا قوراللار بىلەن توقۇنۇشتىن ساقلىنىشقا ياردەم بېرىدۇ.
Glyphicons بىزگە ئوچۇق كودلۇق قوراللار ئامبىرىغا ئورنىتىلغان Halflings نى ئىشلىتىشكە ئىجازەت بەردى ، پەقەت بىز بۇ يەردە ھۆججەت ۋە ئۇلىنىشلارنى تەمىنلەيمىز. تۈرلىرىڭىزدىمۇ شۇنداق قىلىشنى ئويلىشىڭ.
Bootstrap <i>بارلىق سىنبەلگىلەرگە بەلگە ئىشلىتىدۇ ، ئەمما ئۇلارنىڭ ھېچقانداق ئەھۋال سىنىپى يوق - پەقەت ئورتاق ئىشلىتىلىدىغان ئالدى قوشۇلغۇچى. ئىشلىتىش ئۈچۈن تۆۋەندىكى كودنى خالىغان يەرگە قويۇڭ:
- <i class = "icon-search" > </i>
تەتۈر (ئاق) سىنبەلگىلەرنىڭ ئۇسلۇبلىرىمۇ بار ، بىر قوشۇمچە سىنىپ بىلەن تەييارلانغان:
- <i class = "icon-search icon-white" > </i>
سىنبەلگىڭىزدىن تاللايدىغان 120 سىنىپ بار. <i>مۇۋاپىق دەرسلەر بىلەن بەلگە قوشسىڭىزلا تەڭشەلدىڭىز. تولۇق تىزىملىكنى sprites.less ياكى بۇ يەردىن تاپالايسىز.
Heads up! كۇنۇپكا ياكى يول ئۇلىنىشىدىكىگە ئوخشاش تېكىست تىزمىلىرىنى ئىشلەتكەندە ، <i>بەلگە قويۇلغاندىن كېيىن مۇۋاپىق بوشلۇق قالدۇرۇڭ.
سىنبەلگىلەر ناھايىتى ياخشى ، ئەمما ئۇلارنى قەيەردە ئىشلىتىدۇ؟ بۇ يەردە بىر قانچە پىكىر بار:
ماھىيەتتە ، خالىغان يەرگە <i>بەلگە قويسىڭىز ، سىنبەلگە قويسىڭىز بولىدۇ.
قورالبالدىقى ، يول باشلاش ياكى ئالدىن تەييارلانغان جەدۋەل كىرگۈزۈش ئۈچۈن كۇنۇپكا ، كۇنۇپكا گۇرۇپپىسىدا ئىشلىتىڭ.