Bagaimana cara mendapatkan bootstrap di visual studio?

Hai, di video ini kita akan menginstal Bootstrap4 di situs web kita, menggunakan kode VS, sangat sederhana, mari mulai sekarang, dan selesaikan

Pertama mari kita buat folder lokal baru kita sendiri. Jadi kita sudah selesai dengan Project3, terima kasih banyak, sekarang waktunya Bootstrap. Jadi kita akan pergi ke 'File', kita akan pergi ke 'Buka', dan kita akan, di Desktop kita membuat folder lokal baru. Dalam hal ini kita akan menyebutnya Project4, tidak mengherankan. Mari klik buka, dan mari tutup tab Selamat Datang yang terbuka. Mari bereskan ini, singkirkan baris itu, dan mari buat file pertama kita

Jadi kita akan membuat Indeks, kita akan menggunakan 'File', 'Baru', itu berfungsi dengan baik. Saya akan menunjukkan kepada Anda, cukup klik kanan di area ini di sini, Anda dapat membuka 'File Baru', dan ini cara yang berbeda, saya menyukainya, lebih bagus. Jadi buat Indeks saya, terbuka di sini, saya akan memutarnya terbuka. Saya tidak suka itu terbuka setiap kali hal ini terbuka, setidaknya saat kita sedang belajar. File HTML membutuhkan semua hal dasar. Jadi kita perlu tanda seru, '. ', tekan 'Kembali'

Ini akan memberi kita sebagian besar tipe doc dan semua bit yang kita butuhkan. Sekarang saya akan memperkenalkan Anda ke situs web Bootstrap. Ini disebut getbootstrap. com, ini adalah jenis halaman dan dokumentasi resmi. Segala macam kebaikan yang akan membantu kita dengan Bootstrap. Sekarang kami menggunakan Bootstrap4 saat ini. Jika Anda menonton ini dari jauh di masa depan, dan ini tergantung pada Bootstrap5, ini akan terlihat sangat berbeda, tetapi esensinya mungkin akan sama. Jadi yang kita inginkan adalah kita ingin memulai. Anda dapat mengunduhnya secara lokal di mesin Anda

Kami akan melakukannya dengan cara yang berbeda. Kita akan pergi ke 'Memulai', dan pada dasarnya itu akan mengatakan, Anda perlu, baik, semacam dua kelompok hal. Anda membutuhkan CSS dan JavaScript. Jika Anda hanya berencana menggunakan kerangka kerja, seperti kisi, ingat, kita berbicara tentang kisi, strukturnya? . Jika Anda tidak berencana untuk melakukan salah satu menu tarik-turun yang keren atau penggeser Gambar, Anda tidak memerlukan hal-hal ini di bagian bawah, tetapi mari instal semuanya bersama-sama kalau-kalau kita akan menggunakannya nanti.

Jika Anda tidak berencana menggunakannya jangan dimasukkan, karena itu hanya akan menambah Waktu Muat. Jadi kita akan menyalin CSS, dan memberi tahu Anda di mana harus meletakkannya. Taruh di tautan di Kepala Anda. Mereka telah memberi Anda kode, siap digunakan. Jadi saya menyalinnya, di sini tertulis, taruh di Kepala, dan itu dia. Jadi kami telah melakukan ini beberapa kali dengan CSS yang berbeda'. Kami telah melakukannya dengan Google Fonts, terakhir yang kami lakukan adalah, hanya itu yang dapat saya ingat. Hal lain yang perlu diingat adalah jika Anda membuat Style sheet Anda sendiri, yang akan kita lakukan sebentar lagi, itu harus di atas itu, jadi ini di atas. Bootstrap, selalu di atas, dan gaya Anda, tepat di bawahnya. Kami belum memilikinya

Potongan selanjutnya adalah JavaScript ini di sini, ada tiga bagian di dalamnya. Mari salin ketiganya dan tempelkan. Jika Anda membaca dokumentasi yang tertulis, atau ada yang bagus, seperti memulai contoh template, Anda bisa menyalin semua ini dan menempelkannya ke dalam kode VS juga, tetapi dikatakan, pastikan itu ada di bagian bawah, seperti JavaScript . Jadi saya hanya akan menempelkannya di bagian bawah, tepat sebelum menutup badannya. Saya akan meletakkan milik saya di sini, di sana kita pergi

Di sini saya akan memasukkan beberapa komentar. Jadi ingat, 'Command /', atau 'Control /' di PC, dan tambahkan saja beberapa catatan. Hanya untuk mengecek apakah CSS benar-benar berfungsi, mari kita pratinjau halamannya. Ingat bahwa berhenti bekerja di sana, jadi klik kanan saja dan katakan, 'Buka dengan Server Langsung'. Ini akan terbuka di layar kanan hari ini. Tidak ada apa-apa di sana, jadi tidak berfungsi, tetapi, mari kita lihat-- cara untuk memeriksa apakah berfungsi adalah dengan memasukkan H1, dan ketik 'Hello World'. Dan periksa saja, Anda akan tahu CSS berfungsi, karena tidak terlihat seperti H1 biasa kami yang lama. H1 lama kita, sepertinya-- beri komentar, hal-hal itu. Jadi dengan itu, terlihat seperti itu;

Sekarang satu hal yang tidak dimasukkan oleh kode VS, dalam jenis kami-- ingat, kami menggunakan tanda seru, untuk memasukkan sebagian besar informasi untuk halaman, ada satu hal yang disarankan di sini, itu bukan bagian dari . Ingat, ini berbeda, kami melihat editor kode yang berbeda, dan bagaimana mereka menerapkan semua jenis tag Head ini. Ini satu di sini, 'shrink-to-fit=no' tidak ada, jadi kita punya semua itu, tapi kita butuh koma, dan 'shrink-to-fit=no'. Apa fungsinya? . Saya pikir itu menonaktifkan sesuatu, ada pengaturan aneh di Safari, yang mengacaukan Bootstrap, sehingga Anda dapat mematikannya. Itu hanya berarti Anda akan memiliki konsistensi di berbagai browser. Dan itu sudah terpasang

Sekarang hal yang gila adalah, jika kami melihat di Desktop Anda, apakah di Proyek 4 kami hanya memiliki halaman Indeks. Jadi ingat, ini dimuat dari Jaringan Pengiriman Konten kami. Jadi Bootstrap mengendalikan ini, mereka memilikinya di server mereka. Sama dengan semua ini, dan mereka baru saja dimuat saat halaman dimuat. Anda dapat mengunduhnya dari 'Dapatkan Bootstrap'. Satu-satunya masalah adalah browser harus memuatnya dari situs Anda, ketika mungkin orang yang mengunjungi situs Anda mungkin telah mengunduh versi CDN dari situs web lain, jadi tidak perlu melakukannya lagi, dan itu akan membuat halaman dimuat dengan baik.

Jadi apa yang ini? . Jadi ini memuatnya dari jQuery, kami telah melakukan ini sebelumnya. Ini adalah versi ramping yang diminimalkan sedikit berbeda, hal yang sama. Yang ini di sini, benar. Ini adalah sedikit JavaScript yang sangat berguna yang digunakan untuk pemosisian, hal-hal seperti Kiat alat dan Modal pop-up, dan semacamnya, pemberitahuan yang muncul di dalam situs web. Yang ini di sini adalah JavaScript khusus Bootstrap. Ada sedikit membiasakan diri. Dan Anda teman-teman saya, telah menginstal Bootstrap

Sekarang kita akan melanjutkan kursus. Beberapa catatan, adalah, pastikan CSS untuk Bootstrap berada di atas milik Anda, jadi Anda akan memasukkannya sekarang, tautkan CSS. Jadi Anda meletakkan milik Anda di bawahnya, dan jika Anda mulai membuatnya, kami belum memilikinya, jadi saya akan membuangnya. Anda akan membuat JavaScript sendiri. Anda perlu memastikan bahwa tag Script berakhir di bawahnya. Jadi milik mereka masuk lebih dulu, lalu milik Anda, setelah itu, jika tidak, milik Anda dapat mulai bertentangan dengan milik mereka, dan bisnis kita. Mari kita simpan dan lanjutkan ke video berikutnya

Apakah Visual Studio memiliki Bootstrap?

Bagaimana cara mengunduh Bootstrap di Visual Studio 2022?

Bagaimana cara menginstal Bootstrap di proyek saya?