መሰረት ሲኤስኤስ

ኣብ ልዕሊ እቲ ስካፎልድ፡ መሰረታዊ ባእታታት ኤችቲኤምኤል ቅዲ ተገይሩሉን ብዝተዘርግሑ ክፍልታት ተማዕቢሎምን ፍሩይን ቅኑዕን መልክዕን ስምዒትን ይህቡ።

ኣርእስታት & ኣካል ቅዳሕ

ናይ ታይፕግራፊክ ስኬል

ምሉእ ናይ ታይፕግራፊክ ሽቦ ኣብ ክልተ Less variables ኣብ variables.less ፋይልና ዝተመርኮሰ እዩ: @baseFontSizeand @baseLineHeight. እቲ ቀዳማይ ኣብ ምሉእ ዝጥቀመሉ መሰረታዊ ቅርጺ-ዓቐን ኮይኑ እቲ ካልኣይ ድማ መሰረታዊ መስመር-ቁመት እዩ።

ነቶም ተለዋዋጢ ረቛሒታት፡ ገለ ሒሳብ ድማ ንጥቀመሎም፡ ናይ ኩሉ ዓይነትናን ካልእን ወሰን፡ ፓዲንግን መስመር-ቁመትን ንፈጥር።

ኣብነት ኣካል ጽሑፍ

ኑላም ኪስ ሪሱስ ኤጌት ኡርና ሞሊስ ኦርናረ ቬል ኤው ልዮ። Cum sociis natoque ፔናቲቡስን ማግኒስ ዲስ ፓርቱየንት ሞንተስ፡ ናስቸቱር ሪዲኩለስ ሙስ. ኑላም ኢድ ዶሎር ኢድ ኒብህ ኡልትሪሲስ ቬሂኩላ ኡት ኢድ ኤሊት.

ቪቫሙስ ሳጂቲስ ላከስ ቬል ኣውጉ ላኦሪት ሩትሩም ፋውሲበስ ዶሎር ኦክተር። ዱይስ ሞሊስ፡ ኤስት ኖን ኮሞዶ ሉክቱስ፡ ኒሲ ኤራት ፖርቲቶር ሊጉላ፡ ኤጌት ላሲንያ ኦዲዮ ሴም ኔክ ኤሊት። ዶነክ ሰድ ኦዲዮ ዱይ።

h1. ርእሲ 1

h2. ርእሲ 2

h3. ርእሲ 3

h4. ርእሲ 4

h5. ርእሲ 5
h6. ርእሲ 6

ምጉላሕ፡ ኣድራሻን ምሕጻርን እዩ።

ባእታ ኣጠቓቕማ ዘይናይግድን
<strong> ንሓደ ቁንጣሮ ጽሑፍ ምስ ኣገዳሲ ንምጉላሕ ዋላ ሓደ
<em> ንሓደ ቁንጣሮ ጽሑፍ ብውጥረት ንምጉላሕ ዋላ ሓደ
<abbr> ነቲ ዝተሰፍሐ ስሪት ኣብ ሆቨር ንምርኣይ ኣሕጽሮተ ቃላትን ኣሕጽሮተ ቃላትን ይጠቕልል titleንዝተሰፍሐ ጽሑፍ ኣማራጺ ኣካትት ።
<address> ንዝቐረበ ኣቦሓጎኡ ወይ ንመላእ ኣካል ስራሕ ርክብ ሓበሬታ ንምርካብ ንኹሎም መስመራት ብ ብምውዳእ ቅርጺ ምዕቃብ<br>

ምጉላሕ ብምጥቃም

ፉስ ዳፒቡስ ፣ ቴሉስ ኣክ ከርሱስ ኮሞዶ ፣ ቶርቶር ማውሪስ ኮንዲመንቱም ኒብህ ፣ ኡት ፈርመንቱም ማሳ ጁስቶ ኮፍ ኣሜት ሪሱስ። ማሴናስ ፋውሲበስ ሞሊስ ኢንተርዱም ዝበሃል እዩ። ኑላ ቪታ ኤሊት ሊበሮ፡ ፋሬትራ ኣውጉ።

መተሓሳሰቢ<b> ፡ ክትጥቀሙን ብHTML5 ን ናጻ ትኾኑ <i>፡ ግን ኣጠቓቕምኦም ቁሩብ ተቐይሩ ኣሎ። <b>ተወሳኺ ኣገዳስነት ከየመሓላልፍ ቃላት ወይ ሓረጋት ንምጉላሕ ዝዓለመ ክኸውን ከሎ <i>መብዛሕትኡ ንድምጺ፡ ቴክኒካዊ ቃላት ወዘተ ዝኸውን እዩ።

ኣብነት ኣድራሻታት

<address>እቲ መለለዪ ብኸመይ ክጥቀመሉ ከም ዝኽእል ክልተ ኣብነታት ኣብዚ ኣለዉ ፤

ትዊተር፡ ኢንክ
795 ፎልሶም ኣቨ፡ ሱት 600
ሳን ፍራንሲስኮ፡ ሲኤ 94107
፡ (123) 456-7890
ምሉእ ስም
[email protected]

ኣብነት ኣሕጽሮተ ቃላት

ኣሕጽሮተ ቃላት ብዓቢ ጽሑፍን ፍኹስ ዝበለ ነጥቢ ዘለዎ ታሕተዋይ ዶብን ቅዲ ኣለዎም። ብተወሳኺ ኣብ ሆቨር ናይ ሓገዝ መመልከቲ ኣለዎም ስለዚ ተጠቀምቲ ተወሳኺ ምልክት ኣለዎም ኣብ ሆቨር ገለ ነገር ከም ዝረአ።

HTML ድሕሪ ዝተቖርጸ ባኒ እቲ ዝበለጸ ነገር እዩ።

ኣሕጽሮተ ቃል ናይቲ ባህሪ ዝብል ቃል attr .

ብሎክኮትስ

ባእታ ኣጠቓቕማ ዘይናይግድን
<blockquote> ካብ ካልእ ምንጪ ትሕዝቶ ንምጥቃስ ዝሕግዝ ብሎክ-ደረጃ ባእታ

citeንፍልፍል URL ባህሪ ምውሳኽ

ንዝተንሳፈፉ ኣማራጺታት .pull-leftምጥቃምን ክፍልታትን።.pull-right
<small> ንተጠቃሚ ገጹ ዝጥምት ምጥቃስ ንምውሳኽ ኣማራጺ ባእታ፣ ብተለምዶ ኣርእስቲ ስራሕ ዘለዎ ደራሲ <cite>ኣብ ዙርያ ኣርእስቲ ወይ ስም ምንጪ ኣቐምጦ

ብሎክኮት ንምሕዋስ <blockquote>፡ ዝኾነ ኤችቲኤምኤል ከም ጥቕሲ ጠቕልሎ። ትኽ ዝበለ ጥቕስታት ንሕና ንመክር <p>.

ምንጪኻ ንምጥቃስ ኣማራጺ ባእታ ኣካትት እሞ ንዕላማታት ቅዲ ቅድሚኡ <small>em dash ክትረክብ ኢኻ ።&mdash;

<ብሎክquote> ዝብል ጽሑፍ ኣሎ።
  <p>ሎረም ኢፕሱም ዶሎር ኮፍ ኣሜት፡ consectetur adipiscing elit. ምሉእ ቁጽሪ ፖሱረ ኤራት ኣ ኣንተ ቬነናቲስ.</p>
  <ንእሽቶ>ሓደ ፍሉጥ</small>
</blockquote> ዝብል ጽሑፍ ኣሎ።

ኣብነት ብሎክኮትስ

ነባሪ ብሎክኮትስ ከምዚ ዓይነት ቅዲ ኣለዎም፤

ሎረም ኢፕሱም ዶሎር ኮፍ ኣሜት፡ consectetur adipiscing elit. ምሉእ ቁጽሪ posuere erat a ante venenatis.

ኣብ ኣካል ስራሕ ፍሉጥ ሰብ

ብሎክኮትካ ናብ የማን ንምንሳፍ፡ ወስኸሉ class="pull-right":

ሎረም ኢፕሱም ዶሎር ኮፍ ኣሜት፡ consectetur adipiscing elit. ምሉእ ቁጽሪ posuere erat a ante venenatis.

ኣብ ኣካል ስራሕ ፍሉጥ ሰብ

ዝርዝራት

ዘይተኣዘዘ

<ul>

  • ሎረም ኢፕሱም ዶሎር ኮፍ ኣሜት።
  • ኮንሰክተተር ኣዲፒሲንግ ኤሊት
  • ምሉእ ቁጽሪ ሞለስቲ ሎረም ኣብ ማሳ
  • ፋሲሊሲስ ኣብ ፕሪቲየም ኒስል ኣሊኬት
  • ኑላ ቮሉትፓት ኣሊኳም ቬሊት።
    • ፋሰለስ ኢያኩሊስ ነከ ዝበሃል እዩ።
    • ፑሩስ ሶዳለስ ኡልትሪሲስ
    • ቬስቲቡሉም ላኦሪት ፖርቲቶር ሴም
    • ኣክ ትሪስቲክ ሊበሮ ቮሉትፓት ኣብ
  • ፋውሲቡስ ፖርታ ላከስ ፍሪንጊላ ቬል
  • ኤንየን ኮፍ ኣመት ኤራት ኑንክ
  • ኤጌት ፖርቲቶር ሎረም

ቅዲ ዘይብሉ

<ul class="unstyled">

  • ሎረም ኢፕሱም ዶሎር ኮፍ ኣሜት።
  • ኮንሰክተተር ኣዲፒሲንግ ኤሊት
  • ምሉእ ቁጽሪ ሞለስቲ ሎረም ኣብ ማሳ
  • ፋሲሊሲስ ኣብ ፕሪቲየም ኒስል ኣሊኬት
  • ኑላ ቮሉትፓት ኣሊኳም ቬሊት።
    • ፋሰለስ ኢያኩሊስ ነከ ዝበሃል እዩ።
    • ፑሩስ ሶዳለስ ኡልትሪሲስ
    • ቬስቲቡሉም ላኦሪት ፖርቲቶር ሴም
    • ኣክ ትሪስቲክ ሊበሮ ቮሉትፓት ኣብ
  • ፋውሲቡስ ፖርታ ላከስ ፍሪንጊላ ቬል
  • ኤንየን ኮፍ ኣመት ኤራት ኑንክ
  • ኤጌት ፖርቲቶር ሎረም

ተኣዚዙ

<ol>

  1. ሎረም ኢፕሱም ዶሎር ኮፍ ኣሜት።
  2. ኮንሰክተተር ኣዲፒሲንግ ኤሊት
  3. ምሉእ ቁጽሪ ሞለስቲ ሎረም ኣብ ማሳ
  4. ፋሲሊሲስ ኣብ ፕሪቲየም ኒስል ኣሊኬት
  5. ኑላ ቮሉትፓት ኣሊኳም ቬሊት።
  6. ፋውሲቡስ ፖርታ ላከስ ፍሪንጊላ ቬል
  7. ኤንየን ኮፍ ኣመት ኤራት ኑንክ
  8. ኤጌት ፖርቲቶር ሎረም

መግለፂ

<dl>

መግለጺ ዝርዝር
ዝርዝር መግለጺ ቃላት ንምግላጽ ፍጹም እዩ።
ዩይስሞድ
ቬስቲቡሉም ኢድ ሊጉላ ፖርታ ፌሊስ ዩስሞድ ሴምፐር ኤጌት ላሲንያ ኦዲዮ ሴም ኔክ ኤሊት.
Donec id elit ዘይ ሚ ፖርታ ግራቪዳ ኣብ eget metus.
ማሌሱዋዳ ፖርታ
ኢትያም ፖርታ ሰም ማሌሱዋዳ ማግና ሞሊስ ዩይስሞድ።

ኣብ መስመር

ኣብ ውሽጢ መስመር ዝርከቡ ቁንጣሮ ኮድ ብ <code>.

ንኣብነት <code>ክፍሊ</code> ከም ውሽጢ መስመር ክጥቕለል ኣለዎ።

መሰረታዊ ብሎክ

<pre>ንብዙሓት መስመራት ኮድ ተጠቐም ። ዝኾነ ካሬት ናብ ዩኒኮድ ፊደላቶም ብግቡእ ምቕራብ ምቕያርካ ኣረጋግጽ።

<p>ኣብዚ ናሙና ጽሑፍ...</p>
<ቅድሚ>
  <p>ኣብዚ ናሙና ጽሑፍ...</p>
</pre> ዝብል ጽሑፍ ኣሎ።

መተሓሳሰቢ<pre> ፡ ኣብ ውሽጢ መለለዪታት ኮድ ብዝተኻእለ መጠን ናብ ጸጋም ቀረባ ምቕማጥካ ኣረጋግጽ ፤ ንኹሎም ትቦታት ከቕርቦም እዩ።

ጉግል ፕሪቲፋይ

ተመሳሳሊ <pre>ባእታ ወሲድካ ንዝተማዕበለ ምቕራብ ክልተ ኣማራጺ ክፍልታት ወስኸሉ።

<p>ኣብዚ ናሙና ጽሑፍ...</p>
<pre class="ጽብቕቲ ሕትመት
     linenums"> ዝብል ጽሑፍ ኣሎ።
  <p>ኣብዚ ናሙና ጽሑፍ...</p>
</pre> ዝብል ጽሑፍ ኣሎ።

google-code-prettify ኣውርድ እሞ ከመይ ጌርካ ከም እትጥቀመሉ readme ርአ።

ሰንጠረዥ ምልክት ምግባር

ምልጣፍ መግለፂ
<table> ዳታ ብሰንጠረዥ ቅርጺ ንምርኣይ ዝሕግዝ መጠቕለሊ ባእታ
<thead> መትሓዚ ባእታ ንመስመራት ርእሲ ሰደቓ ( <tr>) ንዓምድታት ሰደቓ ስያመ ንምግባር
<tbody> መትሓዚ ባእታ ንመስመራት ሰደቓ ( <tr>) ኣብ ኣካል ናይቲ ሰደቓ
<tr> ንሓደ ስብስብ ናይ ሰደቓ ዋህዮታት ( <td>ወይ <th>) ኣብ ሓደ መስርዕ ዝረአ መትሓዚ ባእታ
<td> ነባሪ ዋህዮ ሰደቓ
<th> ፍሉይ ዋህዮ ሰደቓ ንዓምዲ (ወይ መስርዕ፡ ከከም ስፍሓትን ኣቀማምጣን) ስያመታት
ኣብ ውሽጢ ሀ ክጥቀም ኣለዎ።<thead>
<caption> መግለጺ ወይ ጽማቕ ናይቲ ሰደቓ እንታይ ይሕዝ፣ ብፍላይ ንኣንበብቲ ስክሪን ጠቓሚ
<ሰንጠረዥ>
  <ርእሲ> ዝብል እዩ።
    <tr> ዝብል ጽሑፍ ኣሎ።
      <th></th> ዝብል ምዃኑ ይፍለጥ
      <th></th> ዝብል ምዃኑ ይፍለጥ
    </tr> ዝብል ምዃኑ ይፍለጥ
  </thead> ዝብል ጽሑፍ ኣሎ።
  <tbody> ዝብል ምዃኑ ይፍለጥ
    <tr> ዝብል ጽሑፍ ኣሎ።
      <td></td> ዝብል ምዃኑ ይፍለጥ
      <td></td> ዝብል ምዃኑ ይፍለጥ
    </tr> ዝብል ምዃኑ ይፍለጥ
  </tbody> ዝብል ጽሑፍ ኣሎ።
</table> ዝብል ጽሑፍ ኣሎ።

ናይ ሰደቓ ኣማራጺታት

ሽም ክፍሊ መግለፂ
ትሑዝ ዋላ ሓደ ቅዲ የለን ዓምድታትን መስመራትን ጥራይ
መሰረታዊ .table ኣብ መንጎ መስመራት ዝርከቡ ኣግማድ መስመራት ጥራይ
ዶብ ዘለዎ .table-bordered ኩርናዓት የኽብብን ደጋዊ ዶብ ይውስኽን።
ዜብራ-ስትሪፕ .table-striped ኣብ ዘይተጻረዩ መስመራት (1, 3, 5, ወዘተ) ፍኹስ ዝበለ ግራጭ ድሕረ ባይታ ሕብሪ ይውስኽ
ዝተሓጽረ .table-condensed ንቐጥታዊ መሸፈኒ ብፍርቂ ይቖርጾ፣ ካብ 8px ክሳብ 4px፣ ኣብ ውሽጢ tdኩሉን thባእታታትን

ኣብነት ሰደቓታት

1. ነባሪ ቅዲታት ሰደቓ

ሰንጠረዥ ብኣውቶማቲክ ብውሑዳት ዶባት ጥራይ ቅዲ ተገይሩሉ ተነባብነት ንምርግጋጽን ኣቃውማ ንምዕቃብን እዩ። ምስ 2.0 እቲ .tableክፍሊ የድሊ።

<ሰንጠረዥ ክፍሊ="ሰንጠረዥ">
  ...
</table> ዝብል ጽሑፍ ኣሎ።
# ናይ መጀመርታ ሽም ናይ መወዳእታ ሽም ቋንቋ
1. ማርክ ኦቶ ሲኤስኤስ
2. ያእቆብ ቶርንቶን። ጃቫስክሪፕት።
3. ስቱ ደንት ዝብል ጽሑፍ ኣሎ። ኤችቲኤምኤል

2. ስሪት ዘለዎ ጠረጴዛ

ዜብራ-ስትሪፒንግ ብምውሳኽ ምስ ሰደቓታትካ ቁሩብ ፋንሲ ውሰድ- .table-stripedክላስ ጥራይ ወስኸሉ።

መተሓሳሰቢ ፡ ስፕሪትድ ሰንጠረዥ :nth-childCSS መምረጺ ዝጥቀሙ ኮይኖም ኣብ IE7-IE8 ኣይርከብን እዩ።

<table class="ሰንጠረዥ ሰንጠረዥ-ስሪት ዘለዎ">
  ...
</table> ዝብል ጽሑፍ ኣሎ።
# ናይ መጀመርታ ሽም ናይ መወዳእታ ሽም ቋንቋ
1. ማርክ ኦቶ ሲኤስኤስ
2. ያእቆብ ቶርንቶን። ጃቫስክሪፕት።
3. ስቱ ደንት ዝብል ጽሑፍ ኣሎ። ኤችቲኤምኤል

3. ዶብ ዘለዎ ሰደቓ

ኣብ ዙርያ ምሉእ ጠረጴዛ ዶባትን ንጽባቐ ዝኸውን ክቡብ ኩርናዓትን ምውሳኽ።

<table class="ሰንጠረዥ-ዝተወሰነ">
  ...
</table> ዝብል ጽሑፍ ኣሎ።
# ናይ መጀመርታ ሽም ናይ መወዳእታ ሽም ቋንቋ
1. ማርክ ኦቶ ሲኤስኤስ
2. ያእቆብ ቶርንቶን። ጃቫስክሪፕት።
3. ስቱ ደንት ዝብል ጽሑፍ ኣሎ።
3. ብሮሰፍ ስታሊን ኤችቲኤምኤል

4. ዝተሓጽረ ሰደቓ

.table-condensedንመሸፈኒ ዋህዮ ሰደቓ ኣብ ክልተ (ካብ 8px ክሳብ 4px) ንምቑራጽ ነቲ ክፍሊ ብምውሳኽ ሰደቓታትካ ዝያዳ ውህሉል ግበሮም።

<table class="ሰንጠረዥ ሰንጠረዥ-ተሓጺሩ">
  ...
</table> ዝብል ጽሑፍ ኣሎ።
# ናይ መጀመርታ ሽም ናይ መወዳእታ ሽም ቋንቋ
1. ማርክ ኦቶ ሲኤስኤስ
2. ያእቆብ ቶርንቶን። ጃቫስክሪፕት።
3. ስቱ ደንት ዝብል ጽሑፍ ኣሎ። ኤችቲኤምኤል

5. ንኹሎም ኣወሃሂድካ!

ዝኾነ ካብቶም ናይ ጠረጴዛ ክፍልታት ብምውህሃድ ዝኾነ ካብቶም ዘለዉ ክፍልታት ብምጥቃም ዝተፈላለየ መልክዕ ንምርካብ ናጻ ትኾኑ።

<table class="ሰንጠረዥ ሰንጠረዥ መስመር ዘለዎ ሰደቓ-ዝተወሰነ ሰደቓ-ተሓጺሩ">
  ...
</table> ዝብል ጽሑፍ ኣሎ።
# ናይ መጀመርታ ሽም ናይ መወዳእታ ሽም ቋንቋ
1. ማርክ ኦቶ ሲኤስኤስ
2. ያእቆብ ቶርንቶን። ጃቫስክሪፕት።
3. ስቱ ደንት ዝብል ጽሑፍ ኣሎ። ኤችቲኤምኤል
4. ብሮሰፍ ስታሊን ኤችቲኤምኤል

ተዓጻጻፊ ኤችቲኤምኤልን ሲኤስኤስን።

እቲ ዝበለጸ ክፋል ብዛዕባ ቅጥዕታት ኣብ ቡትስትራፕ ኩሎም እታዎታትካን ቁጽጽራትካን ኣብ ማርካፕካ ብኸመይ ትሃንጾም ብዘየገድስ ጽቡቕ ትርኢት ምህላዎም እዩ። ዝኾነ ትርፊ ኤችቲኤምኤል ኣየድልን እዩ፡ ግን ነቶም ዝጠልብዎ ቅዲታት ነቕርብ።

ዝያዳ ዝተሓላለኹ ኣቀማምጣታት ንቐሊል ቅዲን ምትእስሳር ክስተትን ብሕጽር ዝበለን ዝዓቢን ክፍልታት ይመጹ፣ ስለዚ ኣብ ነፍሲ ወከፍ ስጉምቲ ትሽፈን።

ኣርባዕተ ኣቀማምጣታት ሓዊሱ

ቡትስትራፕ ንኣርባዕተ ዓይነት ቅጥዒ ኣቀማምጣ ደገፍ ሒዙ ይመጽእ፤

  • ቀጥታዊ (ነባሪ) .
  • ምድላይ
  • ኣብ መስመር
  • ንጋድም

ዝተፈላለዩ ዓይነታት ቅጥዒ ኣቀማምጣ ንማርካፕ ገለ ለውጢ የድልዮም፣ እንተኾነ ግን እቶም ቁጽጽር ንባዕሎም ሓደ ዓይነት ኮይኖም ይቕጽሉን ይመላለሱን።

ቁጽጽር ግዝኣታትን ካልእን

ናይ Bootstrap ቅጥዕታት ንኹሎም መሰረታዊ ቅጥዕታት ቁጽጽር ከም input, textarea, ከምኡ ውን ትጽበዮ ምረጽ ቅዲታት የጠቓልል። ግን ብርክት ዝበሉ ብሕታዊ ባእታታት ከም ዝተወሰኹን ቅድሚኡ ዝተሰቕሉን እታዎታትን ንዝርዝር ሳጹናት ምልክት ዝድግፍን እውን ሒዙ ይመጽእ እዩ።

ከም ጌጋ፣ መጠንቀቕታን ዓወትን ዝኣመሰሉ ግዝኣታት ንነፍሲ ​​ወከፍ ዓይነት ምቁጽጻር ቅጥዒ ተኻቲቶም ኣለዉ። ብተወሳኺ ንስንኩላን ቁጽጽር ዝኸውን ቅዲታት ተኻቲቱ ኣሎ።

ኣርባዕተ ዓይነት ቅጥዕታት

ቡትስትራፕ ንኣርባዕተ ቅዲታት ናይ ልሙዳት መርበብ ቅጥዕታት ቀሊል ምልክትን ቅዲታትን ይህብ።

ሽም ክፍሊ መግለፂ
ቀጥታዊ (ነባሪ) . .form-vertical (ኣየድልን) ዝተደራረቡ፣ ብጸጋም ዝተሰለፉ ስያመታት ኣብ ልዕሊ ቁጽጽር
ኣብ መስመር .form-inline ንጸጋም ዝተሰለፈ ምልክትን ውሽጣዊ-ብሎክ መቆጻጸሪታትን ንውሱን ቅዲ
ምድላይ .form-search ተወሳኺ-ክቡብ ጽሑፍ ምእታው ንልሙድ ናይ ምድላይ ስነ-ጽባቐ
ንጋድም .form-horizontal ንጸጋም፣ ብየማን ዝተሰለፉ ስያመታት ኣብ ሓደ መስመር ምስ መቆጻጸሪታት ኣንሳፈፍ

ኣብነት ቅጥዕታት ቅጥዒ ቁጽጽር ጥራይ ዝጥቀሙ፣ ተወሳኺ ምልክት የለን

መሰረታዊ ቅርጺ

ምስ v2.0 ንቅዲ ቅጥዕታት ዝቐለሉን ዝበሃሉን ነባሪ ነገራት ኣለዉና። ተወሳኺ ምልክት የለን፣ ቁጽጽር ቅጥዒ ጥራይ።

ተዛማዲ ናይ ሓገዝ ጽሑፍ!

ቅጥዒ ምድላይ

ነባሪ ቅዲታት ዌብኪት ዘንጸባርቕ፣ .form-searchንተወሳኺ ክቡብ ናይ ምድላይ ዓውድታት ጥራይ ምውሳኽ።

ኣብ መስመር ዝርከብ ቅጥዒ

እታዎታት ንምጅማር ደረጃ ብሎክ እዮም። ንን .form-inline.form-horizontalinline-block ንጥቀም።


ልኡማት ቅርጽታት

ቡትስትራፕ ዝድግፍ ይቆጻጸር

ብዘይካ ነጻ ቅርጺ ጽሑፍ፡ ዝኾነ HTML5 ጽሑፍ መሰረት ዝገበረ ምእታው ከምኡ ይመስል።

እንታይ ተሓዊስዎ ኣሎ።

ኣብ ጸጋም ዝተርኣዩ ኩሎም እቶም እንድግፎም ነባሪ ናይ ቅጥዒ ቁጽጽር እዮም። ዝርዝር ጥይት ኣብዚ ኣሎ፤

  • ናይ ጽሑፍ ምእታው (ጽሑፍ፡ ምልክት ቃል፡ ኢመይል ወዘተ)
  • ሳጹን ምልክት ምግባር
  • ሬድዮ
  • ምረፅ
  • ብዙሕ ምምራጽ
  • ፋይል ምእታው
  • textarea ዝብል ጽሑፍ ኣሎ።

ሓደስቲ ነባሪ ምስ v2.0

ክሳብ v1.4፡ ናይ Bootstrap ነባሪ ቅዲ ቅጥዒ፡ ነቲ ኣግማድ ኣቀማምጣ ይጥቀሙ ነይሮም። ብ Bootstrap 2 ንዝኾነ ቅጥዒ ዝያዳ በሊሕን ዝያዳ ስኬላብልን ነባሪ ንኽህልወና ነቲ ደረት ኣወጊድናዮ።


ቅጥዒ ቁጽጽር ግዝኣታት
ገለ ኣብዚ ዋጋ ይህቡ
ገለ ነገር ተጋግዩ ክኸውን ይኽእል እዩ።
በጃኹም ነቲ ጌጋ ኣርምዎ።
ዉውሁው!
ዉውሁው!

ዳግማይ ዝተነድፈ ናይ መርበብ ሓበሬታ ኩነታት

ቡትስትራፕ ንብራውዘር ዝድገፉ ትኹረት ዝገበሩን disabledግዝኣታትን ቅዲታት ኣለዉዎ። ነቲ ነባሪ ዌብኪት ነወግዶ outlineእሞ box-shadowኣብ ቦታኡ ን :focus.


ቅጥዒ ምጽዳቕ

ብተወሳኺ ንጌጋታት፡ መጠንቀቕታታትን ዓወትን ዝኸውን ናይ ምጽዳቕ ቅዲታት የጠቓልል። ንምጥቃም፡ ነቲ ናይ ጌጋ ክፍሊ ኣብቲ ከባቢኡ ወስኸሉ .control-group

<ናይ ሜዳ ስብስብ
  class="ናይ ቁጽጽር-ጉጅለ ጌጋ">
  ...
</fieldset> ዝብል ጽሑፍ ኣሎ።

ምዝርጋሕ ቅጥዒ ቁጽጽር

.span*ንዓቐናት እታዎታት ካብ ስርዓት ሽቦ ተመሳሳሊ ክፍልታት ተጠቐም ።

@

ገለ ናይ ሓገዝ ጽሑፍ ኣብዚ ኣሎ።

.00 ዝብል እዩ።

ተወሳኺ ናይ ሓገዝ ጽሑፍ ኣብዚ ኣሎ።

መተሓሳሰቢ ፡ ስያመታት ንኹሎም ኣማራጺታት ንኣዝዩ ዝዓበየ ናይ ጠውቂ ቦታታትን ዝያዳ ኣብ ጥቕሚ ዝውዕል ቅጥዕን ይኸብብዎም።

እታዎታት ቅድመ-ምልክት & ምውሳኽ

ጉጅለታት እታዎታት-ምስ ዝተወሰኸ ወይ ቅድሚኡ ዝተሰቕለ ጽሑፍ-ንእታውታትካ ዝያዳ ዓውደ-ጽሑፍ ንምሃብ ቀሊል መገዲ ይህቡ። ዓበይቲ ኣብነታት ንኣስማት ተጠቀምቲ ትዊተር @ ምልክት ወይ ንፋይናንስ $ ይርከብዎም።


ሳጹናት ምልክትን ሬድዮታትን

ክሳብ v1.4፡ Bootstrap ንኽድምር ኣብ ዙርያ ሳጹናት ምልክትን ሬድዮታትን ተወሳኺ ምልክት ምግባር የድልዮ ነይሩ። ሕጂ <label class="checkbox">፡ ነቲ ን <input type="checkbox">.

ኣብ መስመር ዝርከቡ ሳጹናት ምልክትን ሬድዮታትን እውን ይድገፉ እዮም። በቃ .inlineኣብ ዝኾነ .checkboxወይ ወስኸሉ .radioእሞ ወዲእካዮ።


ኣብ መስመር ቅጥዕታት ምግባርን ምውሳኽ/ምቕዳም ምጽሓፍን።

ቅድመ-ምልክት ወይ ምውሳኽ እታዎታት ብውሽጢ መስመር ቅርጺ ንምጥቃም፡ ነቲን ኣብ ሓደ .add-onመስመር input፡ ብዘይ ነጥቢ ምቕማጥካ ኣረጋግጽ።


ናይ ሓገዝ ጽሑፍ ቅጥዒ

ንናይ ቅጥዒ እታዎታትካ ናይ ሓገዝ ጽሑፍ ንምውሳኽ ፡ ድሕሪ ናይ ምእታው ባእታ ኣብ መስመር ሓገዝ ጽሑፍ ምስ <span class="help-inline">ወይ ናይ ሓገዝ ጽሑፍ ብሎክ ምስ ኣካትት።<p class="help-block">

መጠወቒ ክፍሊ መግለፂ
ትሑዝ .btn ስታንዳርድ ግራጭ መጠወቒ ምስ ምዕባለ
ቀዳማይ .btn-primary ተወሳኺ ስእላዊ ክብደት ይህብን ኣብ ስብስብ መጠወቒታት ነቲ ቀዳማይ ተግባር የለልዮን
ሓበሬታ .btn-info ከም መተካእታ ናይቶም ነባሪ ቅዲታት ይጥቀም
ዓወት .btn-success ዕዉት ወይ ኣወንታዊ ስጉምቲ ከም ዝወሰደ የመልክት።
ምኸዳን .btn-warning ምስዚ ስጉምቲ ጥንቃቐ ክግበር ከምዘለዎ የመልክት።
ሓደጋ .btn-danger ሓደገኛ ወይ ኣሉታዊ ክኸውን ዝኽእል ስጉምቲ የመልክት።

ንተግባራት ዝኸውን መጠወቒታት

ከም ውዕል፡ መጠወቒታት ንተግባራት ጥራይ ክውዕሉ እንከለዉ፡ ሃይፐርሊንክታት ድማ ንነገራት ክውዕሉ እዮም። ንኣብነት "Download" ዝብል መጠወቒ ክኸውን ከሎ "ናይ ቀረባ እዋን ንጥፈታት" ድማ ሊንክ ክኸውን ኣለዎ።

ንመልህቕን ቅጥዕታትን

ቅዲታት መጠወቒ ምስ ዝተተግበረ ኣብ ዝኾነ ነገር ክትግበር ትኽእል ኢኻ .btn<a>ይኹን እምበር፡ ብተለምዶ ነዚኦም ኣብ only and <button>elements ክትትግብሮም ክትደሊ ኢኻ ።

መተሓሳሰቢ ፡ ኩሎም መጠወቒታት ነቲ .btnክፍሊ ከጠቓልሉ ኣለዎም። ቅዲታት መጠወቒታት ኣብን ንጽንዓት ዝኸውን ባእታታትን <button>ክተግበሩ ይግባእ ።<a>

ብዙሕ ዓቐን ዘለዎም

ዓበይቲ ወይ ዝነኣሱ መጠወቒታት ትፈትዉ? ኣብኡ ኣለካ!

ቀዳማይ ስጉምቲ ስጉምቲ

ቀዳማይ ስጉምቲ ስጉምቲ

ስንክልና ዘለዎ ኩነታት

ንዝተሰናኸሉ መጠወቒታት .btn-disabled፡ ንመላግቦታትን ንባእታታትን :disabledተጠቐም <button>

ቀዳማይ ስጉምቲ ስጉምቲ

መስቀላዊ ምትእስሳር መርበብ ሓበሬታ

ኣብ IE9፡ IE9 ድሕረ ባይታ ምዕባለታት ናብ ኩርናዓት ስለዘይቆርጽ፡ ኣብ ኩሎም መጠወቒታት ንዘሎ ​​ምዕባለ ንኽቡብ ኩርናዓት ንደግፎ።

ምስዚ ዝተኣሳሰር፡ IE9 ንዝተሰናኸሉ buttonባእታታት ጃንክፋይ ይገብሮም፡ ጽሑፍ ብጽዩፍ ጽሑፍ-ጽላሎት ግራጭ ይገብሮ-ሕማቕ ኣጋጣሚ ኮይኑ ነዚ ክንእርሞ ኣይንኽእልን ኢና።


ርእሲ ንላዕሊ! ናይ ምልክት ክፍልታት ብመንገዲ CSS ይቃላሑ :after። ኣብቲ docs ንዓቐን ናይቲ ምልክት ንምጉላሕ ኣብ hover ፍኹስ ዝበለ ቀይሕ ሕብሪ ድሕረ ባይታ ነርኢ።

ከም ስፕራይት ዝተሃንጸ

ንነፍሲ ወከፍ ምልክት ተወሳኺ ሕቶ ኣብ ክንዲ እንገብሮ፡ ናብ ስፕራይት ኣጠቓሊልናዮም ኣለና-ኣብ ሓደ ፋይል ዝርከቡ ዕስለ ምስልታት፡ ነቶም ምስልታት ብ background-position. እዚ ኣብ ትዊተር ዶት ኮም እንጥቀመሉ ኣገባብ እዩ ጽቡቕ ድማ ሰሪሑልና ኣሎ።

ኩሎም ናይ ምልክታት ክፍልታት .icon-ብግቡእ ናይ ኣስማት ርሕቀትን ስፍሓትን ቅድመ-ጥብቆ ይግበረሎም፣ ልክዕ ከምቶም ካልኦት ባእታታትና። እዚ ድማ ምስ ካልኦት መሳርሒታት ከይጋጮ ክሕግዝ እዩ።

ግሊፊኮንስ ኣብዚ ኣብ docs ሊንክን ክሬዲትን ክሳብ ዝሃብና ኣብ ክፉት ምንጪ መሳርሒታትና ዝተቐመጡ Halflings ክንጥቀም ፈቒዱልና ኣሎ። በጃኹም ኣብ ፕሮጀክትታትኩም እውን ከምኡ ምግባር ኣብ ግምት ኣእትውዎ።

ከመይ ጌርና ንጥቀመሉ

ምስ v2.0.0፡ ንኹሎም ምልክታትና መለለዪ ክንጥቀም መሪጽና ኣለና <i>፡ ግን ዝኾነ ናይ ጉዳይ ክፍሊ የብሎምን-ዝተኻፈለ ቅድመ-ጥብቆ ጥራይ። ንኽትጥቀመሉ፡ ነዚ ዝስዕብ ኮድ ዳርጋ ኣብ ዝኾነ ቦታ ኣቐምጦ፤

<i class="ምልክት-ምድላይ"</i>

ንዝተገልበጡ (ጻዕዳ) ምልክታት ዝኸውን ቅዲታት እውን ኣለዉ፣ ምስ ሓደ ተወሳኺ ክፍሊ ድሉዋት ዝኾኑ፤

<i class="ምልክት-ምድላይ ምልክት-ጻዕዳ"</i>

ንኣርማማትካ ክትመርጾም እትኽእል 120 ክፍልታት ኣለዉ። በቃ <i>ትኽክለኛ ክፍልታት ዘለዎ መለለዪ ወስኹ እሞ ተዳልዩ ኣለኻ። ምሉእ ዝርዝር ኣብ sprites.less ወይ ልክዕ ኣብዚ ኣብዚ ሰነድ ክትረኽብዎ ትኽእሉ ኢኹም።

ኬዝ ተጠቐም

ምልክታት ብሉጻት እዮም፡ ግን ሓደ ሰብ ኣበይ ምተጠቐመሎም? ገለ ሓሳባት እነሆ፤

  • ከም ስእላዊ ንጐድናዊ መስመር ምድህሳስካ
  • ንጽሩይ ምልክት ዝመርሖ ምድህሳስ
  • ትርጉም ናይ ሓደ ተግባር ንምትሕልላፍ ዝሕግዙ መጠወቒታት
  • ምስ መላግቦታት ኣብ መዕለቢ ሓደ ተጠቃሚ ዓውደ-ጽሑፍ ንምክፋል

ብመሰረቱ ኣብ ዝኾነ ቦታ <i>መለለዪ ከተቐምጥ እትኽእል ቦታ ምልክት ከተቐምጥ ትኽእል ኢኻ።

ኣብነታት

ኣብ መጠወቒታት፣ ንመሳርሒታት ዝኸውን ጉጅለታት መጠወቒታት፣ ምድህሳስ፣ ወይ ቅድሚኡ ዝተሰነየ ቅጥዒ ��እታው ተጠቐመሎም።