Anda di halaman 1dari 4

Mapel : Pemograman Web dan Perangkat Bergerak

Kelas : XI RPL
Materi : Membuat WebSite dengan Bootstrap Part 2

1. Membuat Portofolio
 Membuat sebuah kolom dan baris, tambahkan codingan di bawah jumbotron

Kalian ketik Lorem20


(20 artinya untuk 20
kata), lalu tab.

Hasil

 Tambahkan css di style

 Biar kolom nya tidak terlalu lebar di masing-masing class colnya tambahkan 4
 Biar tampilan kolom nya di tengah, kalian Masuk ke Link https://getbootstrap.com/. Masuk
ke bagian Layout lalu Columns

 Panggil class row nya..

2. Membuat tentang dengan card


 Lanjutkan dibawah portofolio,
 Pada gambar sebelumnya yang dikasih lingkaran, kalian Kembali ke bootstrap nya, masuk ke
bagian components lalu card, cari yang simple hanya gambar dan tulisan.

 Paste ke Visual Studio Code didalam ini

 Maka kalian harus cari gambar yang akan disisipkan, bisa masuk ke link unsplash.com tinggal
download aja, cari yang gratis. Nanti gambarnya rename (1,2,3…) biar mudah memanggilnya.
Downloadnya 5 gambar aja

 Setelah itu gambarnya panggil di tag src

 Untuk menampilkan gambar selanjutnya kalian copy-paste, jangan sampe salah copy-
pastenya. Lalu panggil img dengan gambar lain..
 Agar tampilannya menjadi responsive, kalian Kembali ke bootstrap nya, masuk ke bagian
Layout lalu Breakpoints.

 Disetiap class col kalian tambah md

HASIL

Anda mungkin juga menyukai