Oshi 2.3.2: Farawa Jagora

Otwallon takalmi ne Tsarin CSS abin ya zama sananne sosai a cikin hanyar sadarwa. Salonsu m ana ganin su a shafukan sada zumunta Tuenti y Twitter. Amfani da wannan yana adana mana lokaci mai tsawo lokacin haɓaka aikace-aikacen yanar gizo tunda yana ceton mu duka aiki da ƙoƙari da muke ciki don ƙirƙirar tsaran shafi mai tsabta wanda ya dace da duk na'urori. Duba hanyoyin da aka yi amfani da su a cikin wannan tsarin, za mu fahimci cewa sun saba da mu, tun da a yau shafukan yanar gizo da yawa sun aiwatar da shi.

Tsarin

Don rukunin yanar gizon mu ya kasance mai sauki daga wayoyin hannu da allunan zamuyi amfani da tsarin ruwa wanda Bootstrap yake bamu. Amfani da wannan tsarin mai sauqi ne, komai ya dogara ne akan abubuwa span hakan zai taimaka mana layout tsarin yanar gizon mu. Daga baya, idan muka sami damar wannan ƙirar daga smartphone o kwamfutar hannu, wannan zai daidaita kansa ta atomatik ga wannan na'urar, yana inganta ƙirar kewaya da yawa. Za mu yi amfani da span tare da azuzuwan rarrabuwar hankali cikin tsarin ruwa, watau:

<div class="row-fluid">
   <div class="span2">Contenido</div>
</div>

Inda lambar 2 take wakiltar girman tazara. Kowane layi yana dauke da isasshen sarari na faɗi 12 na girman 1, ko 2 na girman 6, ana iya rarraba wannan yadda kuke so. Da zarar sararin jere ya wuce, zai sauka zuwa na gaba ta atomatik, yana ba mu damar amfani da span Girman 12 don ƙirƙirar layin layi. Idan muna so mu tsallake wasu span lokacin ƙirƙirar ɗaya, ma'ana, fara daga 4 span, kuma amfani da girman 3, zamuyi amfani da wannan lambar:

<div class="span2 offset4">Contenido</div>

Wannan yana ba da damar rabuwar tayi tsalle hudu kara lokaci kafin nuna abun ciki. Zamu iya amfani da wannan da yardarmu, muyi tsallake abin da muke so tare da lambar mu.

Daban-daban zane don kowane na'ura

Don amfani da wani tsari daban-daban ga kowane nau'in na'uran, za mu gaya wa kowane bangare mai ma'ana game da wacce na'urar ta dace, ta amfani da azuzuwan da ke tafe:

Ta wannan hanyar, zamu iya nuna zane daban-daban ga kowane na'ura mai URL iri ɗaya.

Buttons

Bootstrap yana ba mu tsararren maɓallan maɓallan launi, amfani da shi mai sauqi ne:

<a class="btn btn-success" href="URL">
   Nombre del Botón
</a>

Ina btn btn-success yana nufin launi na maɓallin, don canza shi, kawai za mu maye gurbinsa da azuzuwan da aka nuna a cikin hoton da ya gabata.

Girka Bootstrap

Don shigar da wannan tsarin CSS, za mu zazzage zip daga hanyar haɗin da zan bar a ƙarshen post ɗin, kuma za mu rubuta lambar mai zuwa a cikin shugaban fayil ɗinmu na HTML.

<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="./css/bootstrap.css" rel="stylesheet" type="text/css" />
<link href="./css/bootstrap-responsive.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="./js/bootstrap.js"></script>
<script type="text/javascript" src="./js/bootstrap.min.js"></script>

Da zarar mun tabbatar da cewa fayilolin CSS da JS suna cikin babban fayil ɗinmu kamar fayil ɗinmu na HTML, zamu iya fara zayyana gidan yanar gizonmu mai amsawa.

Informationarin bayani - Sanarwar Form

Zazzage - Takalma: Tsarin CSS