Video: Cara Membuat Website dengan Dreamweaver dan Photoshop part 9 - Membuat Latar Belakang 2024
Membuat latar belakang untuk halaman web di Adobe Dreamweaver CS6 menyenangkan dan dapat dikejar dengan cara yang lebih banyak daripada yang kebanyakan orang bayangkan. Anda bisa membuat pola berulang dengan satu gambar kecil, membuat watermark, atau menggunakan gambar besar untuk mengisi seluruh latar belakang.
Sebagai default, latar belakang HTML mengulangi gambar yang dipilih sampai mengisi layar. Sehubungan dengan properti CSS, Anda dapat mengendalikan atau menghilangkan perilaku berulang dan bahkan menentukan posisi yang tepat untuk satu gambar latar belakang.
Jika Anda mengisi latar belakang dengan pola, pastikan untuk membuat gambar pola yang tidak memiliki tepi yang jelas.
Untuk menggunakan keuntungan bawaan Anda, mengulang ubin belakang untuk gambar latar belakang, ikuti langkah-langkah ini:
-
Di Photoshop, pilih File → New untuk membuat gambar baru.
-
Pada kotak dialog New yang muncul, buat gambar yang jauh lebih lebar dari pada tinggi, pilih RGB, pilih 72 dpi, lalu klik OK.
Misalnya, masukkan 1000 di kolom teks Lebar dan 20 di kolom teks Tinggi.
-
Pilih warna latar depan dan latar belakang untuk membuat campuran; lalu gunakan alat Gradient untuk Shift + drag dari atas ke bawah area gambar untuk membuat gradient fill.
-
Pilih File → Save for web, simpan gambar itu sebagai file JPEG di folder konten web situs Anda, lalu tutup gambarnya.
-
Dalam Dreamweaver, pilih Modify → Page Properties atau klik tombol Page Properties di Property inspector untuk menempatkan gambar sebagai gambar latar belakang pada halaman web Anda.
Jika tombol Page Properties tidak terlihat, klik halaman - pastikan untuk tidak memilih elemen lain, seperti gambar.
Kotak dialog Page Properties muncul.
-
Di kotak dialog Page Properties, klik tombol Browse di sebelah kanan gambar latar belakang. Di jendela yang muncul, arahkan ke lokasi gambar latar belakang tersimpan Anda, lalu klik OK.
-
Kembali ke kotak dialog Page Properties, klik OK.
Gambar muncul di latar belakang, mengulang dan menciptakan gradien latar belakang yang keren di seluruh halaman!
Bergantung pada ukuran dan resolusi monitor pengguna, gambar latar Anda mungkin terpaksa diulang. Mengulang gambar latar belakang bisa menghasilkan beberapa hasil kreatif.
Dalam kasus tertentu, Anda mungkin tidak melihat latar belakang Anda sampai Anda mengklik tombol Preview / Debug in Browser dan melihat pratinjau halaman di browser default Anda.
