Terkadang, saat meletakkan halaman web, perlu untuk menyembunyikan beberapa elemen yang ditempatkan di dalamnya. Misalnya, jika Anda ingin pengunjung tidak melihat tombol kirim formulir sampai semua bidang wajib diisi. Atau jika tombol tersebut tidak dimaksudkan untuk digunakan oleh pengunjung sama sekali, tetapi skrip yang ditempatkan pada halaman ini harus "mengklik" tombol tersebut.
instruksi
Langkah 1
Gunakan properti tampilan dari Cascading Style Sheets (CSS) untuk mematikan atau menampilkan elemen halaman yang diinginkan. Menurut standar internasional, properti ini dapat diberikan lebih dari satu setengah lusin nilai yang menentukan metode tampilan yang berbeda. Namun, hanya empat yang lintas-browser (yaitu, bekerja di semua browser utama). Di antara keempatnya, tidak ada nilai yang Anda butuhkan, yang memungkinkan Anda menyembunyikan elemen halaman yang diinginkan.
Langkah 2
Buat kumpulan pedoman CSS yang diperlukan. Dalam bentuknya yang paling sederhana, mungkin terlihat seperti ini: button {display: none;} Dalam hal ini, halaman tidak akan menampilkan semua tombol menggunakan tag….
Langkah 3
Tambahkan indikasi ke nama kelas dalam instruksi jika Anda ingin menyembunyikan hanya satu tombol atau sekelompok tombol tertentu. Misalnya, beri nama kelas HideBtns dan tambahkan nama ini ke pernyataan CSS: button. HideBtns {display: none;} Tambahkan atribut kelas ke tombol yang diinginkan dalam kode HTML halaman dan berikan nilai HideBtns: tombol tersembunyi
Langkah 4
Terapkan properti tampilan dengan nilai none ke elemen induk jika Anda ingin, misalnya, untuk menyembunyikan tidak hanya tombol, tetapi juga elemen lain dari formulir web. Formulir dianggap sebagai "induk" dari semua elemen yang ditempatkan di antara tag dan. Sebagai contoh:
Di sini, bidang teks dan tombol untuk mengirimkan nilai yang dimasukkan ditempatkan di dalam formulir. Formulir ditugaskan ke kelas bernama HideForm, jadi untuk menyembunyikan bidang input dan tombol, Anda perlu mengubah pernyataan CSS seperti ini: form. HideForm {display: none;}
Langkah 5
Tempatkan kode yang disiapkan pada contoh di atas di header dokumen web (antara dan tag). Untuk memberi tahu browser pengunjung bahwa ini adalah kode CSS, kode harus diapit di antara tag gaya HTML pembuka dan penutup:
button. HideBtns {tampilan: tidak ada;}
