Video: CSS3 Full Screen Background Image - Dreamweaver CS6 Tutorial 2025
Membuat latar belakang untuk halaman web di Adobe Creative Suite 5 (Adobe CS5) Dreamweaver 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.
-
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 bidang teks Lebar dan 20 di kolom teks Tinggi.
-
Pilih warna latar depan dan latar belakang untuk membuat campuran.
Gunakan alat Gradient untuk Shift + tarik dari atas ke bawah area gambar untuk membuat pengisian gradien.
-
Pilih File → Save for web.
Simpan gambar sebagai file JPEG di folder konten web situs Anda, lalu tutup gambarnya.
-
Buka halaman Dreamweaver Anda.
Di Dreamweaver, pilih Modify → Page Properties atau klik tombol Page Properties di Property inspector untuk menempatkan gambar sebagai gambar latar belakang di halaman web Anda.
Jika tombol Page Properties tidak terlihat, klik halaman - pastikan untuk tidak memilih elemen lain, seperti gambar.
-
Kotak dialog Page Properties muncul.
Klik tombol Browse di sebelah kanan gambar latar belakang, navigasikan ke lokasi gambar latar belakang yang Anda simpan, lalu klik Choose / OK; klik OK di kotak dialog Page Properties.
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.
