Ederede

Akwụkwọ na ihe atụ maka ụdị edemede Bootstrap, gụnyere ntọala zuru ụwa ọnụ, isiokwu, ederede ahụ, ndepụta, na ndị ọzọ.

Ntọala zuru ụwa ọnụ

Bootstrap na-esetịpụ ihe ngosi zuru ụwa ọnụ, akwụkwọ edemede na ụdị njikọ. Mgbe achọrọ njikwa ọzọ, lelee klas ịba uru ederede .

Jiri nchịkọta font nke na-ahọrọ nke kacha mma font-familymaka OS na ngwaọrụ ọ bụla.
Maka ụdị ngụkọ yana ịnweta, anyị na-eji mgbọrọgwụ ndabere nke ihe nchọgharị font-size(nke 16px) ka ndị ọbịa nwee ike hazie ndabara ihe nchọgharị ha ka ọ dị mkpa.
Jiri $font-family-base, $font-size-base, na $line-height-basenjiri mara dị ka ntọala ederede anyị etinyere na <body>.
Tọọ ụcha njikọ zuru ụwa ọnụ site $link-colorna ma tinye akara njikọ naanị na :hover.
Jiri $body-bgka ịtọọ background-colorna <body>( #fffna ndabara).

Enwere ike ịchọta ụdị ndị a n'ime _reboot.scss, a na-akọwakwa mgbanwe mgbanwe ụwa na _variables.scss. Gbaa mbọ hụ na ịbanye $font-size-basena rem.

Isi okwu

Isi HTML niile, <h1>site na <h6>, dị.

Isi	Ọmụmaatụ
`<h1></h1>`	h1. Isiokwu bootstrap
`<h2></h2>`	h2. Isiokwu bootstrap
`<h3></h3>`	h3. Isiokwu bootstrap
`<h4></h4>`	h4. Isiokwu bootstrap
`<h5></h5>`	h5. Isiokwu bootstrap
`<h6></h6>`	h6. Isiokwu bootstrap

<h1>h1. Bootstrap heading</h1>
<h2>h2. Bootstrap heading</h2>
<h3>h3. Bootstrap heading</h3>
<h4>h4. Bootstrap heading</h4>
<h5>h5. Bootstrap heading</h5>
<h6>h6. Bootstrap heading</h6>

.h1A na-enwetakwa site na .h6klaasị, n'ihi na mgbe ịchọrọ ka ị dakọtara n'ụdị font nke isiokwu mana enweghị ike iji ihe HTML jikọtara ya.

h1. Isiokwu bootstrap

h2. Isiokwu bootstrap

h3. Isiokwu bootstrap

h4. Isiokwu bootstrap

h5. Isiokwu bootstrap

h6. Isiokwu bootstrap

<p class="h1">h1. Bootstrap heading</p>
<p class="h2">h2. Bootstrap heading</p>
<p class="h3">h3. Bootstrap heading</p>
<p class="h4">h4. Bootstrap heading</p>
<p class="h5">h5. Bootstrap heading</p>
<p class="h6">h6. Bootstrap heading</p>

Na-ahazi isiokwu

Jiri klaasị ịba uru agbakwunyere iji megharịa obere ederede isiokwu abụọ sitere na Bootstrap 3.

Isi ihe ngosi mara mma Site na ederede sekọndrị dara ada

<h3>
  Fancy display heading
  <small class="text-muted">With faded secondary text</small>
</h3>

Gosipụta isiokwu

Emebere ihe isi okwu ọdịnala ka ọ rụọ ọrụ kacha mma na anụ nke ọdịnaya ibe gị. Mgbe ịchọrọ isi okwu iji pụta ìhè, tụlee iji isiokwu ngosi - ụdị isiokwu buru ibu, nke nwere echiche karịa. Buru n'uche na isiokwu ndị a anaghị anabata na ndabara, mana ọ ga-ekwe omume ịme ka nha font na-anabata ya .

Ngosipụta 1

Ngosipụta 2

Ngosipụta 3

Ngosipụta 4

<h1 class="display-1">Display 1</h1>
<h1 class="display-2">Display 2</h1>
<h1 class="display-3">Display 3</h1>
<h1 class="display-4">Display 4</h1>

Ndu

Mee ka paragraf pụta ìhè site n'ịgbakwunye .lead.

Nke a bụ paragraf ndu. Ọ pụtara na paragraf mgbe niile.

<p class="lead">
  This is a lead paragraph. It stands out from regular paragraphs.
</p>

Ihe ederede inline

Ịke maka ihe HTML5 inline nkịtị.

Ị nwere ike iji mkpado akara napụta ìhèederede.

~~Ezubere ahịrị ederede a ka ewere ya dị ka ederede ehichapụ.~~

~~Ezubere ahịrị ederede a ka a na-emeso ya ka ọ bụghịzi eziokwu.~~

Ezubere ahịrị ederede a ka ewere ya dị ka mgbakwunye na akwụkwọ ahụ.

Ahịrị ederede a ga-atụgharị dị ka etinyere n'okpuru

Ezubere ahịrị ederede a ka ewere ya dị ka ezigbo mbipụta.

Asụgharịkwara ahịrị a ka ọ bụrụ ederede siri ike.

A sụgharịrị ahịrị a ka ọ bụrụ ederede italicized.

<p>You can use the mark tag to <mark>highlight</mark> text.</p>
<p><del>This line of text is meant to be treated as deleted text.</del></p>
<p><s>This line of text is meant to be treated as no longer accurate.</s></p>
<p><ins>This line of text is meant to be treated as an addition to the document.</ins></p>
<p><u>This line of text will render as underlined</u></p>
<p><small>This line of text is meant to be treated as fine print.</small></p>
<p><strong>This line rendered as bold text.</strong></p>
<p><em>This line rendered as italicized text.</em></p>

.markna .smallklaasị dịkwa maka itinye otu ụdị dị ka <mark>yana <small>mgbe ị na-ezere mmetụta semantic ọ bụla na-achọghị nke mkpado ahụ ga-eweta.

Mgbe egosiri n'elu, nweere onwe gị iji <b>na <i>HTML5. <b>bu n'obi ime ka okwu ma ọ bụ nkebiokwu pụta ìhè na-ebupụtaghị mkpa ọzọ ebe ọ <i>na-abụkarị maka olu, okwu teknụzụ, wdg.

Ngwa ederede

Gbanwee nhazi ederede, mgbanwe, ụdị, ịdị arọ na agba site na iji ngwa ederede na ngwa agba anyị .

Ndebiri

Mmejuputa HTML nke ahaziri <abbr>ahazi maka ndebiri na mkpọ okwu iji gosi ụdị gbasaara na hover. Mbibiri nwere akara ndabara wee nweta cursor enyemaka iji nyekwuo ọnọdụ na hover yana ndị ọrụ teknụzụ enyemaka.

Tinye .initialismna ndebiri maka obere mkpụrụedemede pere mpe.

atr

HTML

<p><abbr title="attribute">attr</abbr></p>
<p><abbr title="HyperText Markup Language" class="initialism">HTML</abbr></p>

Ihe mgbochi

Maka ịhota ngọngọ nke ọdịnaya sitere na isi mmalite ọzọ n'ime akwụkwọ gị. Kechie <blockquote class="blockquote">gburugburu HTML ọ bụla dị ka ntinye akwụkwọ.

Ngụ ama ama nke ọma, dị n'ime ihe mgbochi okwute.

<blockquote class="blockquote">
  <p class="mb-0">A well-known quote, contained in a blockquote element.</p>
</blockquote>

Ịkpọ aha isi iyi

Tinye ihe <footer class="blockquote-footer">maka ịchọpụta isi mmalite. Kechie aha ọrụ isi mmalite na <cite>.

Ngụ ama ama nke ọma, dị n'ime ihe mgbochi okwute.

Onye ama ama na Isi mmalite

<blockquote class="blockquote">
  <p class="mb-0">A well-known quote, contained in a blockquote element.</p>
  <footer class="blockquote-footer">Someone famous in <cite title="Source Title">Source Title</cite></footer>
</blockquote>

Nhazi

Jiri ngwa ederede dị ka achọrọ iji gbanwee nhazi nke blockquote gị.

Ngụ ama ama nke ọma, dị n'ime ihe mgbochi okwute.

Onye ama ama na Isi mmalite

<blockquote class="blockquote text-center">
  <p class="mb-0">A well-known quote, contained in a blockquote element.</p>
  <footer class="blockquote-footer">Someone famous in <cite title="Source Title">Source Title</cite></footer>
</blockquote>

Ngụ ama ama nke ọma, dị n'ime ihe mgbochi okwute.

Onye ama ama na Isi mmalite

<blockquote class="blockquote text-right">
  <p class="mb-0">A well-known quote, contained in a blockquote element.</p>
  <footer class="blockquote-footer">Someone famous in <cite title="Source Title">Source Title</cite></footer>
</blockquote>

Ndepụta

Ekebeghị ụdị

Wepu ndabara list-stylena oke aka ekpe na ihe ndetu (naanị ụmụaka ozugbo). This only applys to instant children list things , meaning you will need to add the class for any ested lists as well.

Nke a bụ ndepụta.
Ọ na-egosi na enweghị ụdị.
N'usoro, ọ ka bụ ndepụta.
Otú ọ dị, ụdị a na-emetụta naanị ihe ụmụaka dị ozugbo.
Ndepụta ndị akwadoro:
- ụdịdị a adịghị emetụta ya
- ka ga-egosi mgbọ
- ma nwee oke aka ekpe dabara adaba
Nke a ka nwere ike ịba uru n'ọnọdụ ụfọdụ.

<ul class="list-unstyled">
  <li>This is a list.</li>
  <li>It appears completely unstyled.</li>
  <li>Structurally, it's still a list.</li>
  <li>However, this style only applies to immediate child elements.</li>
  <li>Nested lists:
    <ul>
      <li>are unaffected by this style</li>
      <li>will still show a bullet</li>
      <li>and have appropriate left margin</li>
    </ul>
  </li>
  <li>This may still come in handy in some situations.</li>
</ul>

N'ahịrị

Wepu mgbọ ndetu wee tinye ọkụ marginna ngwakọta nke klaasị abụọ, .list-inlinena .list-inline-item.

Nke a bụ ihe ndepụta.
Na nke ọzọ.
Mana egosiri ha n'ahịrị.

<ul class="list-inline">
  <li class="list-inline-item">This is a list item.</li>
  <li class="list-inline-item">And another one.</li>
  <li class="list-inline-item">But they're displayed inline.</li>
</ul>

Nhazi ndepụta nkọwa

Hazie usoro na nkọwa n'usoro site na iji klaasị eburu ụzọ kọwaa (ma ọ bụ ngwakọta semantic). Maka ogologo okwu, ị nwere ike itinye .text-truncateklas na nhọrọ iji ellipsis mechie ederede.

Ndepụta nkọwa

Ndepụta nkọwa zuru oke maka ịkọwa okwu.

Oge

Nkọwa maka okwu ahụ.

Na ụfọdụ ederede nkọwa ndị ọzọ.

Okwu ọzọ

Nkọwa a dị mkpụmkpụ, yabụ enweghị mgbakwunye paragraf ma ọ bụ ihe ọ bụla.

A na-agbajisị okwu ndị gbajiri agbaji

Nke a nwere ike ịba uru mgbe oghere siri ike. Na-agbakwụnye ellipsis na njedebe.

Akwu

Ndepụta nkọwa akwụrụ: Anụrụ m ndepụta nkọwapụta na-amasị gị. Ka m tinye ndepụta nkọwa n'ime ndepụta nkọwa gị.

<dl class="row">
  <dt class="col-sm-3">Description lists</dt>
  <dd class="col-sm-9">A description list is perfect for defining terms.</dd>

  <dt class="col-sm-3">Term</dt>
  <dd class="col-sm-9">
    <p>Definition for the term.</p>
    <p>And some more placeholder definition text.</p>
  </dd>

  <dt class="col-sm-3">Another term</dt>
  <dd class="col-sm-9">This definition is short, so no extra paragraphs or anything.</dd>

  <dt class="col-sm-3 text-truncate">Truncated term is truncated</dt>
  <dd class="col-sm-9">This can be useful when space is tight. Adds an ellipsis at the end.</dd>

  <dt class="col-sm-3">Nesting</dt>
  <dd class="col-sm-9">
    <dl class="row">
      <dt class="col-sm-4">Nested definition list</dt>
      <dd class="col-sm-8">I heard you like definition lists. Let me put a definition list inside your definition list.</dd>
    </dl>
  </dd>
</dl>

Ogo mkpụrụedemede na-anabata

Dị ka nke v4.3.0, ụgbọ mmiri Bootstrap nwere nhọrọ iji mee ka nha font na-anabata ya, na-enye ohere ka ederede na-abawanye n'ụzọ nkịtị n'ofe ngwaọrụ na nha nlele. Enwere ike ịgbanye RFS$enable-responsive-font-sizes site n'ịgbanwe mgbanwe Sass ka ọ bụrụ truena ịchịkọta Bootstrap.

Iji kwado RFS , anyị na-eji mixin Sass dochie ihe font-sizeonwunwe anyị. A ga-achịkọta nha mkpụrụedemede na-anabata n'ime calc()ọrụ yana ngwakọta remna nkeji nlele iji mee ka omume nchacha na-anabata. Enwere ike ịchọta ihe gbasara RFS na nhazi ya na ebe nchekwa GitHub ya .