Dalam latihan ini Anda akan menambahkan sumber daya proyek ke proyek dan mengedit file Show
Arsip ZIP berisi dua folder dengan file yang perlu Anda tambahkan ke proyek.
Catatan. Jika Anda melihat struktur direktori proyek, Anda perlu menyalin folder ke folder  Gambar 27. menu NetBeans di tab browser Chrome
Anda dapat menggunakan penyelesaian kode di editor untuk membantu Anda Gambar 28. Penyelesaian kode di editor
Ketika Anda menyimpan perubahan Anda, halaman secara otomatis dimuat ulang di browser dan halaman akan terlihat seperti gambar berikut Gambar 29. Halaman yang dimuat ulang di tab browser Chrome
Tekan Ctrl-Spasi untuk menggunakan penyelesaian kode di editor saat Anda menambahkan aturan CSS Gambar 30. Penyelesaian kode aturan CSS di editor Jika Anda membuka jendela Browser DOM, Anda dapat melihat struktur halaman saat ini Gambar 31. Jendela DOM browser menampilkan pohon DOM
Lembar gaya Anda dapat membuka
jQuery bekerja dengan menghubungkan atribut dan perilaku JavaScript yang diterapkan secara dinamis ke elemen DOM (Document Object Model). Instruksi jQuery yang digunakan dalam contoh ini harus dijalankan hanya setelah semua elemen DOM dimuat oleh browser. Ini penting karena perilaku jQuery terhubung ke elemen DOM, dan elemen ini harus tersedia untuk jQuery agar mendapatkan hasil yang kita harapkan. jQuery menangani ini untuk kita melalui fungsi Anda juga dapat menggunakan versi singkatan berikut dari fungsi ini Instruksi untuk jQuery berbentuk metode JavaScript, dengan literal objek opsional yang mewakili array parameter, dan harus ditempatkan di antara kurung kurawal
Kode ini akan memanggil skrip widget akordeon jQuery yang disertakan dalam pustaka jQuery UI. Skrip akordeon akan mengubah elemen di dalam objek DOM yang diidentifikasi sebagai Pada langkah berikutnya Anda akan mengidentifikasi elemen di halaman sebagai Anda juga menentukan 'autoHeight. false’ di cuplikan di atas. Ini mencegah widget akordeon menyetel ketinggian setiap panel berdasarkan bagian konten tertinggi yang terkandung dalam markup. Untuk informasi selengkapnya, lihat dokumentasi API akordeon Bagian dari file Anda dapat merapikan kode Anda dengan mengklik kanan di editor dan memilih Format
Ini elemen membungkus konten halaman (empat set tag dantag yang Anda tambahkan sebelumnya di tutorial)Anda dapat menambahkan pemilih ke elemen di kotak dialog Edit Aturan CSS. Untuk membuka kotak dialog Edit Aturan CSS, klik kanan ditag di editor dan pilih Edit Aturan CSS di menu popup. Atau, jika kursor sisipkan ada di di editor Anda dapat mengklik tombol Edit Aturan CSS () di jendela CSS Styles (Window > Web > CSS Styles). Gambar 32. Jendela Gaya CSSDi kotak dialog CSS Rules, pilih 6 sebagai Selector Type dan ketik infolist sebagai Selector. Konfirmasikan bahwa Terapkan Perubahan pada Elemen telah dipilihGambar 33. Edit kotak dialog Aturan CSSSaat Anda mengklik OK di kotak dialog, aturan CSS untuk pemilih 4 secara otomatis ditambahkan ke lembar gaya Mary Adams
John Matthews
Sam Jackson
Jennifer Brooks
6
Saat Anda menyimpan perubahan Anda, halaman di browser web dimuat ulang secara otomatis. Anda dapat melihat bahwa tata letak halaman telah berubah dan halaman tersebut sekarang menggunakan aturan gaya CSS yang ditentukan dalam lembar gaya terbuka tetapi yang lain sekarang runtuh. Anda dapat mengklik sebuahelemen untuk memperluas daftarGambar 34. Proyek akhir dimuat di browser Fungsi akordeon jQuery sekarang memodifikasi semua elemen halaman yang terkandung dalam objek Gambar 35. Jendela DOM peramban Anda dapat mengeklik kanan elemen di jendela Navigator dan memilih Buka Sumber untuk menavigasi dengan cepat ke lokasi elemen tersebut di file sumber Di jendela Browser DOM Anda dapat melihat elemen DOM di halaman yang dirender di browser dan gaya JQuery yang diterapkan ke elemen Gambar 36. Jendela DOM peramban Saat Inspect in NetBeans Mode diaktifkan di browser, saat Anda memilih elemen di jendela browser, elemen tersebut disorot di jendela Browser DOM Menyimpan Proyek sebagai Templat SitusAnda dapat menyimpan proyek Anda sebagai templat situs yang dapat Anda gunakan sebagai templat untuk membuat situs HTML5 lain yang didasarkan pada proyek tersebut. Templat situs dapat menyertakan pustaka JavaScript, file CSS, gambar, dan templat untuk file HTML. IDE menyediakan wizard untuk membantu Anda memilih file yang ingin disertakan dalam template situs
Jika Anda memperluas simpul di pohon di kotak dialog, Anda dapat melihat file yang akan disertakan dalam templat situs Gambar 37. Buat kotak dialog Template Situs Anda dapat melihat bahwa templat situs akan menyertakan file Saat Anda mengeklik Selesai, IDE akan menghasilkan templat situs sebagai arsip Saat Anda ingin membuat proyek yang didasarkan pada templat situs, tentukan lokasi arsip Bagaimana cara mengaktifkan HTML5?Aktifkan Penerima untuk HTML5 di StoreFront . Buka pengaturan Receiver Deployment di konsol StoreFront. XenApp/XenDesktop 7. 6 LTSR (StoreFront 3. 0). Pilih Penerima untuk Web di panel kiri. . Pilih salah satu opsi berikut untuk mengaktifkan Penerima untuk HTML5. · Gunakan Penerima untuk HTML5 jika instalasi lokal gagal Apakah chrome saya memiliki HTML5?HTML5 sekarang kompatibel dengan semua browser populer (Chrome, Firefox, Safari, IE9, dan Opera) dan dengan diperkenalkannya DOCTYPE, bahkan dimungkinkan untuk memiliki beberapa HTML .
Bagaimana saya tahu jika browser saya kompatibel dengan HTML5?Hal ini dilakukan dengan menggunakan navigator. geolokasi yang mengembalikan objek Geolokasi . Jika objeknya ada, berarti HTML5 didukung oleh browser.
Bagaimana cara menginstal HTML5 di komputer saya?Anda tidak dapat menginstal HTML5, karena merupakan bagian dari browser secara default. HTML adalah bahasa, di mana situs web ditulis, dan HTML5 hanyalah versi lain darinya. Semua yang harus Anda lakukan adalah memperbarui browser Anda . |
Apakah saya memiliki html5 di komputer saya?
Pos Terkait
Copyright © 2024 ketajaman Inc.
