in English

Irra deebi'ii jalqabi

Reboot, walitti qabama jijjiirama CSS elementii addaa faayilii tokko keessatti, kickstart Bootstrap sarara bu'uuraa bareedaa, walfakkaatu, fi salphaa irratti ijaaruuf kennuudhaaf.

Akkaataa

Reboot Normalize irratti ijaara, elementoota HTML hedduu akkaataa hamma tokko yaada qaban filattoota elementii qofa fayyadamuun kenna. Istayiliin dabalataa kan hojjetamu daree qofa waliin. Fakkeenyaaf, <table>akkaataawwan tokko tokko sarara bu'uuraa salphaa ta'eef deebifnee jalqabna boodarra .table, .table-bordered, fi kanneen biroo kennina.

Qajeelfamni keenya fi sababoonni Reboot keessatti maal akka irra darbinu filachuuf kunooti:

Gatiiwwan durtii biraawzari tokko tokko akka addaan baafannaa qaama safaramuu danda'uuf rembakka s fayyadamuuf fooyyessa.em
irraa fagaadhaa margin-top. Margiin dhaabbataa kufuu danda’a, kunis bu’aa hin eegamne argamsiisa. Kan caalaa barbaachisaa ta’e garuu, kallattii tokko marginkan moodeela sammuu salphaa ta’eedha.
Hammangaa meeshaa hunda keessatti iskeelii salphaa ta'eef, elementoonni ugguraa rems'f s fayyadamuu qabu margin.
fontIbsa qabeentota -walqabatan xiqqaa eegi , inherityeroo danda'ametti fayyadami.

Fuula durtii

Qaamonni <html>fi <body>durtii fuula guutuu fooyya'aa ta'e kennuudhaaf fooyya'u. Caalaatti ibsuuf:

The box-sizingakka addunyaatti elementii hunda irratti saagama— *::beforefi dabalatee *::after, gara border-box. Kunis bal'inni elementii labsame sababa padding ykn border tiin gonkumaa akka hin caalle mirkaneessa.
Bu'uurri tokkollee , font-sizeirratti hin labsamu <html>, garuu 16pxfudhatama (durtii biraawzari). filannoo fayyadamaa kabajuu fi mala caalaatti dhaqqabamaa ta'e mirkaneessuudhaan karaa gaaffii miidiyaatiin deebii salphaa gosa-iskeelii kennuudhaaf font-size: 1remirratti hojiirra oola .<body>
The <body>akkasumas addunyaa font-family, line-height, fi text-align. Kunis booda elementoota unkaa tokko tokkoon dhaala wal hin simne qubee ittisuuf.
Nageenyaaf, <body>kan labse qaba background-color, defaulting to #fff.

Tuullaa qubee dhalootaa

Qubeewwan weeb durtii (Helvetica Neue, Helvetica, fi Arial) Bootstrap 4 keessatti gadhiifamanii meeshaa fi OS hunda irratti barruu gaarii agarsiisuuf “tuullaa qubee dhalootaan” bakka bu’aniiru. Waa'ee tuullaa qubee dhalootaa barruu Smashing Magazine kana keessatti bal'inaan dubbisi .

$font-family-sans-serif:
  // Safari for macOS and iOS (San Francisco)
  -apple-system,
  // Chrome < 56 for macOS (San Francisco)
  BlinkMacSystemFont,
  // Windows
  "Segoe UI",
  // Android
  Roboto,
  // Basic web fallback
  "Helvetica Neue", Arial,
  // Linux
  "Noto Sans",
  "Liberation Sans",
  // Sans serif fallback
  sans-serif,
  // Emoji fonts
  "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default;

Hubadhu, tuullaan qubee qubeewwan emoji waan of keessaa qabuuf, arfiileen Yuunikoodii mallattoo/dingbat waliigalaa hedduun akka fakkiiwwan halluu hedduu qabanitti ni agarsiifamu. Bifti isaanii garaagarummaa qabaata, akkaataa qubee emoji dhalootaa biraawzari/waltajjii keessatti fayyadamnu irratti hundaa'uun, akkasumas akkaataa CSS kamiinuu hin miidhaman color.

Kunis font-familykan hojiirra oolu <body>fi ofumaan akka addunyaatti guutummaa Bootstrap keessatti dhaala. Global jijjiiruuf , Bootstrap font-familyhaaromsi fi irra deebi'ii qindeessii.$font-family-base

Mata dureewwanii fi keewwata

Qaamonni mataduree hundi—fkn, <h1>—fi <p>akka isaan margin-tophaqamaniif deebisanii saagamu. Mata dureewwan margin-bottom: .5remitti dabalamanii fi keeyyata margin-bottom: 1remsalphaatti addaan baasuuf.

Mata duree	Fakkeenya
`<h1></h1>`	h1. Mata duree bootstrap jedhu
`<h2></h2>`	h2. Mata duree bootstrap jedhu
`<h3></h3>`	h3. Mata duree bootstrap jedhu
`<h4></h4>`	h4. Mata duree bootstrap jedhu
`<h5></h5>`	h5. Mata duree bootstrap jedhu
`<h6></h6>`	h6. Mata duree bootstrap jedhu

Tarreewwan

Tarreewwan hundi— <ul>, <ol>, fi <dl>—isaanii margin-topkan baafamanii fi a margin-bottom: 1rem. Tarreewwan man'ee qaban margin-bottom.

Tarreewwan hundinuu margina isaanii isa gubbaa irraa haqameera
Akkasumas margi isaanii inni gadii normalize ta'e
Tarreewwan man'ee margaa jalaa hin qaban
- Haala kanaan bifa wal qixa ta’e qabu
- Keessattuu yeroo wantoota tarree dabalataa hordofan
Padding bitaas reset ta'eera

Tarree tartiiba qabu kunooti
Wantoota tarree muraasa waliin
Ilaalcha waliigalaa wal fakkaatu qaba
Akkuma tarree hin tartiibamin duraanii

Akkaataa salphaa, sadarkaa ifa ta'e, fi addaan fageenya fooyya'aa ta'eef, tarreewwan ibsaa margins fooyya'aniiru. <dd>s gara tti deebisuu margin-leftfi 0itti dabaluu margin-bottom: .5rem. <dt>s jajjaboodhaan barreeffamaniiru .

Tarreewwan ibsa: Tarreen ibsa jechoota hiikuuf mijataa dha.
Jecha: Hiika jecha kanaaf kenname.; Jecha walfakkaataaf hiika lammaffaa.
Jecha biraa: Hiika jecha biraa kanaaf.

Barruu dursee foormaatii ta'e

Elementiin <pre>isaa balleessuuf fi yuunitii isaaf margin-topfayyadamuuf deebi'ee saaga .remmargin-bottom

.fakkeenya-qaama { .
  margin-gadi: 1rem;
} .

Gabateewwan

Gabateewwan xiqqoo akkaataa <caption>s tti sirreeffamu, daangaawwan kuffisuu, fi text-alignguutummaatti walsimachuu mirkaneessa. Jijjiiramni dabalataa daangaa, padding, fi kanneen biroo gita waliin.table dhufa .

Kun gabatee fakkeenyaati, kunis qabiyyee ibsuuf mata duree isaati.
Mata duree gabatee	Mata duree gabatee	Mata duree gabatee	Mata duree gabatee
Man'ee gabatee	Man'ee gabatee	Man'ee gabatee	Man'ee gabatee
Man'ee gabatee	Man'ee gabatee	Man'ee gabatee	Man'ee gabatee
Man'ee gabatee	Man'ee gabatee	Man'ee gabatee	Man'ee gabatee

Unkaalee

Qaamonni unkaa adda addaa akkaataa bu'uuraa salphaa ta'aniif irra deebi'anii jalqabamaniiru. Jijjiiramawwan baayʼee mulʼatan keessaa muraasni kunooti:

<fieldset>s daangaa, padding, ykn margin hin qaban kanaaf salphaatti akka marfata galtee dhuunfaa ykn garee galtee fayyadamuu ni danda'u.
<legend>s, akkuma tuuta man'ee, akkasumas akka mataduree saawwanii akka agarsiifamaniif irra deebi'amee akkaataa kaa'ameera.
<label>s akka hojiirra oolu display: inline-blockhayyamuuf qindaa'u.margin
<input>s, <select>s, <textarea>s, fi <button>s irra caalaa Normalize tiin ilaalama, garuu Reboot isaanii marginfi saaga line-height: inherit, akkasumas saaga.
<textarea>s akka safara jijjiirraa qajeelaa yeroo baay'ee qindaa'ina fuula “cabsa”tti vertikaaliin qofa akka safaramuu danda'uuf fooyya'u.
<button>s fi <input>elementoonni button cursor: pointeryeroo qaban :not(:disabled).

Jijjiiramni kun, fi kanneen biroo, armaan gaditti agarsiifamaniiru.

Agarsiistota qaree irratti

role="button"Reboot qaree durtii gara tti jijjiiruuf fooyya'iinsa of keessaa qaba pointer. Amalli kana elementoota irratti dabali elementoonni wal-qunnamsiisoo ta'uu isaanii agarsiisuuf gargaaruuf. Gaheen kun <button>elementootaaf barbaachisaa miti, kanneen cursorjijjiirama mataa isaanii argataniif.

Qabduu elementii qaree hin taane

<span role="button" tabindex="0">Non-button element button</span>

Qaamolee adda addaa

Teessoo

Qaamni <address>durtii biraawzari font-styleirraa italicgara tti deebisuudhaaf fooyya'a normal. line-heightakkasumas amma dhaalamee margin-bottom: 1remjira, dabalameera. <address>s odeeffannoo quunnamtii akaakayyuu dhiyoo jiruuf (ykn qaama hojii guutuuf) dhiyeessuuf kan qophaa’aniidha. Sararoota waliin xumuruun foormaatii eegi <br>.

Twitter, Inc.
1355 Market St, Suite 900
Saan Firaansiiskoo, CA 94103
P: (123) 456-7890. Afaan Oromoo fi Jechoota Dinqisiiso Afaan Oromoo

Maqaa Guutuu
[email protected]

Ugguraa jedhu

Durtiin marginblockquotes irratti 1em 40px, kanaaf sana gara 0 0 1remwaan elementoota biroo wajjin caalaatti walsimuuf deebisna.

Caqasa beekamaa, elementii caqasa ugguraa keessatti qabame.

Mata duree Madda keessatti nama beekamaa

Qaamolee sarara keessaa

Elementiin <abbr>barruu keewwataa keessaa adda akka bahu gochuuf akkaataa bu'uuraa fudhata.

Nulla attr vitae elit libero, afaan oromoo kan afaan oromoo fi hiika isaa pdf.

Cuunfaa

Durtii cursorgabaabduu irratti , kanaaf elementichi irratti cuqaasuun akka waliin walqunnamuu danda'u dabarsuudhaaf sana textgara deebisna .pointer

Bal'inaan tokko tokko

Odeeffannoo dabalataa waa'ee bal'inaan.

Dabalataanis bal'inaan

Waa'ee bal'ina isaa bal'inaan kunooti.

`[hidden]`Amala HTML5

HTML5 amaloota waliigalaa haaraa maqaa[hidden]display: none , kan akka durtiitti akkaataa itti dabalu. Yaada PureCSS irraa liqeessuun , durtii kana irratti fooyyessinee akka tasaa akka hin irra darbine [hidden] { display: none !important; }gargaaruuf gochuudhaan. displayOsoo [hidden]dhalootaan IE10n hin deeggaramne, labsiin ifa ta'e CSS keenya keessatti rakkoo sana irra darba.

<input type="text" hidden>

jQuery wal hin simne

[hidden]jQuery's $(...).hide()fi $(...).show()malawwan waliin wal hin simne. Kanaafuu, yeroo ammaa kana tooftaalee biroo elementoota [hidden]bulchuuf addatti hin raggaasifnu.display

Mul'achuu qaama tokkoo qofa jijjiiruuf, jechuun isaa displayhin fooyya'ee fi qaamni ammallee dhangala'aa galmee irratti dhiibbaa uumuu danda'a, bakka isaa .invisiblegita fayyadami .