Mga Simpleng Paraan upang mai-install ang Bootstrap: 10 Hakbang (na may Mga Larawan)

Talaan ng mga Nilalaman:

Mga Simpleng Paraan upang mai-install ang Bootstrap: 10 Hakbang (na may Mga Larawan)
Mga Simpleng Paraan upang mai-install ang Bootstrap: 10 Hakbang (na may Mga Larawan)

Video: Mga Simpleng Paraan upang mai-install ang Bootstrap: 10 Hakbang (na may Mga Larawan)

Video: Mga Simpleng Paraan upang mai-install ang Bootstrap: 10 Hakbang (na may Mga Larawan)
Video: How to Save Tiktok Videos without watermark Tagalog Tutorial 2024, Mayo
Anonim

Itinuturo sa iyo ng wikiHow na ito kung paano i-download ang mga Bootstrap file sa iyong computer, at i-link ang mga ito sa iyong mga teksto sa HTML upang magamit ang mga elemento ng Bootstrap sa iyong code. Kapag na-download at na-link mo ang mga file ng Bootstrap, maaari mong simulang gamitin ang lahat ng mga istilo ng styleheet at JavaScript ng Bootstrap sa iyong disenyo ng web.

Mga hakbang

I-install ang Bootstrap Hakbang 1
I-install ang Bootstrap Hakbang 1

Hakbang 1. Buksan ang website ng Bootstrap sa iyong internet browser

I-type ang https://getbootstrap.com sa address bar, at pindutin ang ↵ Enter o ⏎ Bumalik sa iyong keyboard.

I-install ang Bootstrap Hakbang 2
I-install ang Bootstrap Hakbang 2

Hakbang 2. I-click ang pindutang Mag-download

Bubuksan nito ang pahina na "I-download".

I-install ang Bootstrap Hakbang 3
I-install ang Bootstrap Hakbang 3

Hakbang 3. I-click ang pindutang Mag-download sa ibaba "Compiled CSS at JS

" I-download nito ang kumpletong mga file ng Bootstrap sa iyong computer bilang isang archive ng ZIP.

Kung na-prompt ka, pumili ng isang lokasyon ng pag-save para sa Bootstrap ZIP

I-install ang Bootstrap Hakbang 4
I-install ang Bootstrap Hakbang 4

Hakbang 4. I-extract ang mga file mula sa archive ng ZIP

Hanapin ang ZIP file na na-download mo lamang, at mag-double click dito upang makuha ang lahat ng mga file dito sa parehong folder.

  • Aalisin nito ang dalawang folder na pinangalanang " css"at" js."
  • Kung ang iyong unzipper app ay hindi awtomatikong kumuha ng mga file, tingnan ang artikulong ito upang makita ang lahat ng mga paraan na maaari mong i-export ang isang ZIP archive.
I-install ang Bootstrap Hakbang 5
I-install ang Bootstrap Hakbang 5

Hakbang 5. Ilipat ang mga nakuha na folder sa parehong folder tulad ng mga file ng iyong website na HTML

Buksan ang folder na naglalaman ng lahat ng mga HTML file ng iyong website, at i-drag ang " css"at" js"Mga folder dito upang ilipat ang mga ito sa parehong folder tulad ng iyong mga dokumento sa website.

Maaari mo na ngayong mai-link ang mga file sa iyong mga HTML file, at simulang gamitin ang Bootstrap sa iyong code

I-install ang Bootstrap Hakbang 6
I-install ang Bootstrap Hakbang 6

Hakbang 6. Mag-right click sa HTML file na nais mong gamitin sa Bootstrap

Maaari mong gamitin ang Bootstrap sa isa lamang sa iyong mga HTML file, o lahat ng mga ito.

I-install ang Bootstrap Hakbang 7
I-install ang Bootstrap Hakbang 7

Hakbang 7. Mag-hover sa Buksan gamit ang menu ng pag-right click

Ang isang sub-menu ay mag-pop up kasama ang mga katugmang app.

I-install ang Bootstrap Hakbang 8
I-install ang Bootstrap Hakbang 8

Hakbang 8. Piliin ang iyong programa sa text editor

Bubuksan nito ang napiling HTML file sa iyong text editor.

Maaari kang gumamit ng isang simpleng text editor tulad ng Notepad o TextEdit pati na rin ang isang nakatuong code editor tulad Atom (https://atom.io) o Coda (https://panic.com/coda).

I-install ang Bootstrap Hakbang 9
I-install ang Bootstrap Hakbang 9

Hakbang 9. Idagdag ang mga link ng Bootstrap sa header ng iyong HTML file

Bago gamitin ang Bootstrap code sa iyong HTML, kakailanganin mong i-type o i-paste ang mga linya sa ibaba sa header ng iyong code:

Kung nais mong i-link at gamitin ang ilan sa iba pang mga file mula sa mga folder ng css at js, magdagdag lamang ng mga bagong linya sa header, at palitan ang mga bahagi ng css / bootstrap.css at js / bootstrap.js ng mga pangalan ng mga file na gusto mo upang mag-link

I-install ang Bootstrap Hakbang 10
I-install ang Bootstrap Hakbang 10

Hakbang 10. Suriin ang paglalagay ng iyong mga link sa Bootstrap sa code

Sa header ng HTML, ang parehong mga linya ay dapat na matatagpuan sa pagitan ng mga linya at linya.

  • Kapag naidagdag mo ang mga linyang ito sa header, maaari mong simulang gamitin ang mga elemento ng Bootstrap sa HTML file na ito.
  • Maaari kang makahanap ng isang buong listahan ng lahat ng mga elemento ng Bootstrap sa https://getbootstrap.com/doc/4.3/getting-started/introduction. I-click lamang ang anumang kategorya tulad ng Layout o Mga Bahagi sa kaliwang menu.
  • Kapag na-install mo ang Bootstrap, maaari mong ipasok o kopyahin / i-paste ang anumang piraso ng code mula dito sa iyong sariling code.

Inirerekumendang: