HDTutorial
ID

Pemutaran memuat pemutar YouTube tersemat (mode privasi yang ditingkatkan).

Cara Membuat Website dengan HTML dan CSS - Tutorial Langkah demi Langkah

4.271.531 kali ditonton 26 Oktober 2018 17:39

Tonton di YouTube
SaluranWeb dev

Ringkasnya

Anda akan membangun header situs web sederhana dari awal menggunakan hanya HTML dan CSS di editor teks sederhana. Tutorial ini yang ramah pemula mencakup pengaturan file, penataan gaya dengan gambar, menu, dan efek interaktif seperti keadaan hover—tanpa pengalaman pemrograman sebelumnya yang dibutuhkan.

Langkah utama

  1. Buat sebuah file HTML dan file CSS yang terhubung di folder baru
  2. Tambahkan gambar latar belakang dengan menyimpannya di folder dan merujuk ke jalurnya di CSS
  3. Atur ketelusan gambar dan tambahkan efek hover dengan CSS
  4. Tambahkan logo, teks selamat datang, dan tombol yang dapat diklik ke header

Deskripsi dari pembuat

Pada video ini, Anda akan belajar membuat sebuah website menggunakan HTML dan CSS di Notepad atau editor teks lainnya. Saya akan menunjukkan cara membuat bagian header website, bagaimana menambahkan gambar latar belakang di website HTML, serta membuat menu navigasi menggunakan HTML. Ini adalah tutorial lengkap untuk pemula yang ingin belajar pengembangan website dengan HTML dan CSS.

Berikut adalah langkah-langkah dalam tutorial pembuatan website HTML ini:

1. Buat file HTML dan CSS di dalam satu folder

2. Hubungkan file CSS dengan HTML

3. Tambahkan gambar latar belakang di website HTML

Anda harus menyimpan gambar di folder yang sama dan menuliskan path lengkap gambar di file CSS untuk menambahkan gambar ke website

4. Buat menu navigasi di website HTML

5. Ubah ketebalan (opacity) gambar di website HTML

6. Tambahkan efek hover menggunakan HTML dan CSS

7. Tambahkan logo di website menggunakan HTML dan CSS

8. Tambahkan teks judul (teks selamat datang) di website

9. Buat tombol menggunakan HTML dan CSS

Sekarang bagian header website sudah selesai dibuat menggunakan HTML dan CSS.

Cek beberapa video populer di saluran saya:

Efek hover gambar menarik dengan HTML dan CSS - zoom in dan out || web dev:
Penjelasan positioning CSS dengan contoh (static, relative, absolute, fixed):
Efek hover gambar dengan CSS - Tutorial CSS - Efek hover CSS3:
Bagaimana mengubah warna teks yang dipilih di HTML dan CSS:
Bagaimana membuat animasi loading sederhana dengan CSS3:
Bagaimana membuat formulir kontak menggunakan HTML dan CSS:
Bagaimana membuat latar belakang video fullscreen menggunakan HTML dan CSS:
Pengembangan...

Tentang tutorial ini

Web dev memublikasikan tutorial video berdurasi 17:39 ini pada 26 Oktober 2018. Video ini telah ditonton 4.271.531 kali di YouTube.

Saluran
Web dev
Kategori
Pendidikan
Durasi
17:39
Dipublikasikan
26 Oktober 2018
Penayangan
4.271.531
Suka
71.574

Bagikan

Tutorial ini dalam bahasa lain