באָאָצטראַפּ 2.3.2: געטינג סטאַרטעד גייד

Twitter Bootstrap לאָגאָ

באָאָצטראַפּ איז אַ CSS פריימווערק אַז האט ווערן זייער פאָלקס איבער די נעץ. זייער סטיילז אָפּרופיק זענען געזען אויף געזעלשאַפטלעך נעטוואָרקס טוענטי y טוויטטער. די נוצן פון דעם סאַוועס אונדז אַ פּלאַץ פון צייט ווען דעוועלאָפּינג אַ וועב אַפּלאַקיישאַן ווייַל עס סאַוועס אונדז אַלע די אַרבעט און מי ינוואַלווד אין די קריייטינג אַ ריין בלאַט סטיל פּאַסיק פֿאַר אַלע דעוויסעס. מיט די סטילז געניצט אין דעם פריימווערק, מיר וועלן פאַרשטיין אַז זיי זענען באַקאַנט פֿאַר אונדז, ווייַל הייַנט פילע וועבסיטעס האָבן ימפּלאַמענאַד עס.

די סטרוקטור

באָאָצטראַפּ סטרוקטור בילד

באָאָצטראַפּ פלויד סטראַקטשער

כּדי אונדזער וועבזייטל זאָל זיין בארעכטיגט פֿון רירעוודיק פאָנעס און טאַבלאַץ, מיר דאַרפֿן צו נוצן די פליסיק סטרוקטור וואָס באָאָצטראַפּ אָפפערס. די נוצן פון דעם סטרוקטור איז זייער פּשוט, אַלץ איז באזירט אויף עלעמענטן שפּאַן וואָס וועט העלפֿן אונדז אויסלייג אונדזער וועב פּלאַן. שפּעטער, ווען מיר אַקסעס דעם פּלאַן פֿון אַ סמאַרטפאָנע o טאַבלעט, דעם וועט אויטאָמאַטיש אַדאַפּט צו די מיטל באטייטיק פֿאַרבעסערן די קוואַליטעט פון נאַוויגאַציע. מיר וועלן נוצן די שפּאַן מיט קלאסן אין לאַדזשיקאַל דיוויזשאַנז אין די פליסיק סטרוקטור, ד"ה:

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

וווּ די נומער 2 רעפּראַזענץ די גרייס פון דעם שפּאַן. יעדער רודערן כּולל גענוג פּלאַץ פֿאַר 12 ספּאַנס פון גרייס 1 אָדער 2 פון גרייס 6, דאָס קען זיין פונאנדערגעטיילט ווי איר ווילט. אַמאָל די פּלאַץ פון אַ רודערן איז יקסידיד, דאָס וועט אויטאָמאַטיש אַראָפּגיין צו די ווייַטער, אַזוי אַז מיר קענען נוצן אַ שפּאַן גרייס 12 צו מאַכן אַ שורה ברעכן. אויב מיר געוואלט צו האָפּקען עטלעכע שפּאַן ווען איר שאַפֿן איין, דאָס הייסט, אָנהייב פֿון 4 שפּאַן, און צולייגן אַ גרייס פון 3, מיר נוצן דעם קאָד:

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

דאָס אַלאַוז די אָפּטייל צו שפּרינגען פיר ספּאַנס איידער ווייַזנדיק די אינהאַלט. מיר קענען נוצן דאָס אין אונדזער פריי וועט סקיפּינג וואָס מיר וועלן מיט אונדזער קאָד.

סקיפּינג ספּאַנס מיט די פאָטאָ קלאַס

סקיפּינג ספּאַנס מיט די פאָטאָ קלאַס

אַנדערש פּלאַן פֿאַר יעדער מיטל

בילד מיט עקסקלוסיוואַטי קלאסן פֿאַר באָאָצטראַפּ דעוויסעס

CSS קלאסן צו דיפערענטשיייט יעדער מיטל

צו צולייגן אַ אַנדערש פּלאַן פֿאַר יעדער טיפּ פון מיטל מיר זאָגן יעדער לאַדזשיקאַל אָפּטייל פֿאַר וואָס מיטל עס איז אָריענטיד מיט די ווייַטערדיקע קלאסן:

אין דעם וועג, מיר קענען ווייַזן אַ גאַנץ אַנדערש פּלאַן פֿאַר יעדער מיטל מיט דער זעלביקער URL.

קנעפּלעך

קאָליר בוטטאָנס

רשימה פון קנעפּלעך געפֿינט דורך באָאָצטראַפּ

באָאָצטראַפּ אָפפערס אונדז אַ ריין רעפּערטואַר פון בונט קנעפּלעך, די נוצן איז זייער פּשוט:

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

וואו btn btn-success רעפערס צו די קאָליר פון די קנעפּל, צו טוישן עס, מיר נאָר האָבן צו פאַרבייַטן עס מיט די קלאסן געוויזן אין די פריערדיקע בילד.

ינסטאָלינג באָאָצטראַפּ

פֿאַר די ינסטאַלירונג פון דעם CSS פריימווערק, מיר וועלן אראפקאפיע די פאַרשלעסלען פון די לינק וואָס איך וועל לאָזן אין די סוף פון די פּאָסטן, און מיר וועלן שרייַבן די ווייַטערדיק קאָד אין די קאָפּ פון אונדזער 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>

אַמאָל מיר האָבן זיכער אַז די CSS און JS טעקעס זענען אין דער זעלביקער טעקע ווי אונדזער HTML טעקע, מיר קענען אָנהייבן דיזיינינג אונדזער אָפּרופיק וועבזייטל.

מער אינפֿאָרמאַציע - פאָרעם וואַלאַדיישאַן

אראפקאפיע - באָאָצטראַפּ: קסס פראַמעוואָרק


דער אינהאַלט פון דעם אַרטיקל אַדכיר צו אונדזער פּרינציפּן פון לייט עטיקס. צו מעלדונג אַ טעות גיט דאָ.

א באַמערקונג, לאָזן דיין

לאָזן דיין באַמערקונג

אייער בליצפּאָסט אַדרעס וועט נישט זייַן ארויס. Required fields זענען אנגעצייכנט מיט *

*

*

  1. פאַראַנטוואָרטלעך פֿאַר די דאַטן: Miguel Ángel Gatón
  2. ציל פון די דאַטן: קאָנטראָל ספּאַם, קאָמענטאַר פאַרוואַלטונג.
  3. לעגיטימאַטיאָן: דיין צושטימען
  4. קאָמוניקאַציע פון ​​די דאַטן: די דאַטן וועט נישט זיין קאַמיונאַקייטיד צו דריט פּאַרטיעס אַחוץ דורך לעגאַל פליכט.
  5. דאַטן סטאָרידזש: דאַטאַבייס כאָוסטיד דורך Occentus Networks (EU)
  6. רעכט: צו קיין צייט איר קענט באַגרענעצן, צוריקקריגן און ויסמעקן דיין אינפֿאָרמאַציע.

  1.   Alejandra דאָס

    איר טאָן ניט האָבן מער טוטאָריאַלז אויף דעם פריימווערק ???