Bootstrapти орнотуунун жөнөкөй жолдору: 10 кадам (сүрөттөр менен)

Мазмуну:

Bootstrapти орнотуунун жөнөкөй жолдору: 10 кадам (сүрөттөр менен)
Bootstrapти орнотуунун жөнөкөй жолдору: 10 кадам (сүрөттөр менен)

Video: Bootstrapти орнотуунун жөнөкөй жолдору: 10 кадам (сүрөттөр менен)

Video: Bootstrapти орнотуунун жөнөкөй жолдору: 10 кадам (сүрөттөр менен)
Video: ВОСКРЕСИЛ Tik Tok в России за 30 сек.! | Как обойти блокировку тик ток и как выложить видео в 2023? 2024, Апрель
Anonim

Бул wikiHow сизге Bootstrap файлдарын компьютериңизге кантип жүктөөнү жана кодуңузда Bootstrap элементтерин колдонуу үчүн аларды HTML тексттериңизге байланыштырууну үйрөтөт. Bootstrap файлдарын жүктөп алып, шилтемелегенден кийин, сиз веб -дизайныңызда Bootstrapтын бардык стили жана JavaScript элементтерин колдоно баштасаңыз болот.

Кадамдар

Bootstrap орнотуу 1 -кадам
Bootstrap орнотуу 1 -кадам

Кадам 1. Интернет серепчиңизде Bootstrap веб -сайтын ачыңыз

Дарек тилкесине https://getbootstrap.com терип, ↵ Enter же ⏎ Return клавиатураңызды басыңыз.

Bootstrap орнотуу 2 -кадам
Bootstrap орнотуу 2 -кадам

Кадам 2. Жүктөө баскычын чыкылдатыңыз

Бул "Жүктөө" барагын ачат.

Bootstrap орнотуу 3 -кадам
Bootstrap орнотуу 3 -кадам

Кадам 3. Төмөндөгү Жүктөө баскычын чыкылдатыңыз "Compiled CSS and JS

" Бул толугу менен Bootstrap файлдарын ZIP архиви катары компьютериңизге жүктөйт.

Эгер сиз суралсаңыз, Bootstrap ZIP үчүн сактоочу жерди тандаңыз

Bootstrapти орнотуу 4 -кадам
Bootstrapти орнотуу 4 -кадам

Кадам 4. ZIP архивинен файлдарды чыгаруу

Жаңы эле жүктөлгөн ZIP файлын таап, аны эки жолу чыкылдатып, андагы бардык файлдарды ошол папкага чыгарыңыз.

  • Бул "деген эки папканы чыгарат css"жана" js."
  • Эгерде сиздин ачкыч колдонмоңуз файлдарды автоматтык түрдө чыгарбаса, ZIP архивин экспорттоонун бардык жолдорун көрүү үчүн бул макаланы карап көрүңүз.
Bootstrap орнотуу 5 -кадам
Bootstrap орнотуу 5 -кадам

Кадам 5. Чыгарылган папкаларды веб -сайтыңыздын HTML файлдары менен бир папкага жылдырыңыз

Веб -сайтыңыздын HTML файлдарын камтыган папканы ачыңыз жана " css"жана" js"Бул жердеги папкалар аларды веб -сайтыңыздын документтери менен бир папкага жылдыруу үчүн.

Эми сиз файлдарды HTML файлдарыңызга байланыштырып, Bootstrapты кодуңузда колдоно баштасаңыз болот

Bootstrap орнотуу 6 -кадам
Bootstrap орнотуу 6 -кадам

Кадам 6. Bootstrap менен колдонууну каалаган HTML файлын оң баскыч менен чыкылдатыңыз

Сиз Bootstrapты HTML файлдарыңыздын биринде же алардын баарында колдоно аласыз.

Bootstrap орнотуу 7 -кадам
Bootstrap орнотуу 7 -кадам

Кадам 7. Оңго чыкылдатуу менюсун ачуу менен үстүнө алып келиңиз

Ылайыктуу колдонмолор менен суб-меню калкып чыгат.

Bootstrapти орнотуу 8 -кадам
Bootstrapти орнотуу 8 -кадам

Кадам 8. Текст редакторуңуздун программасын тандаңыз

Бул текст редакторунда тандалган HTML файлын ачат.

Сыяктуу жөнөкөй текст редакторун колдонсоңуз болот Блокнот же TextEdit сыяктуу атайын код редактору Atom (https://atom.io) же Coda (https://panic.com/coda).

Bootstrapти орнотуу 9 -кадам
Bootstrapти орнотуу 9 -кадам

Step 9. Bootstrap шилтемелерин HTML файлыңыздын башына кошуңуз

HTMLде Bootstrap кодун колдонуудан мурун, төмөнкү саптарды кодуңуздун башына териңиз же чаптаңыз:

Эгерде сиз башка файлдарды CSS жана JS папкаларынан шилтеме кылгыңыз келсе, башына жаңы саптарды кошуңуз жана css/bootstrap.css жана js/bootstrap.js бөлүктөрүн сиз каалаган файлдардын аттары менен алмаштырыңыз. шилтеме берүү

Bootstrap орнотуу 10 -кадам
Bootstrap орнотуу 10 -кадам

Кадам 10. Bootstrap шилтемелериңиздин кодго жайгашуусун текшериңиз

HTMLдин баш сабында эки сызык тең саптар менен сызыктын ортосунда жайгашышы керек.

  • Бул саптарды башына кошкондон кийин, бул HTML файлында Bootstrap элементтерин колдонууну баштасаңыз болот.
  • Сиз бардык Bootstrap элементтеринин толук тизмесин таба аласыз https://getbootstrap.com/docs/4.3/getting-started/introduction. Жөн гана каалаган категорияны чыкылдатыңыз Макет же Компоненттер сол менюда.
  • Сиз Bootstrapти орноткондон кийин, бул жерден каалаган кодду өзүңүздүн кодуңузга киргизе же көчүрүп/чаптай аласыз.

Сунушталууда: