Skip to main content

Bagaimana Mengaktifkan dan Menggunakan Mod Reka Bentuk Responsif di Safari 9

Web Development - Computer Science for Business Leaders 2016 (April 2025)

Web Development - Computer Science for Business Leaders 2016 (April 2025)
Anonim

Sebagai seorang pembangun laman web di dunia hari ini, bermakna menyokong peranti dan platform yang kadang-kadang dapat menjadi tugas yang menakutkan. Walaupun dengan kod yang paling direka dengan baik mematuhi piawaian web terkini, anda masih dapat mengetahui bahawa bahagian laman web anda mungkin tidak melihat atau bertindak seperti yang anda mahukan pada peranti atau resolusi tertentu. Apabila berhadapan dengan cabaran menyokong pelbagai senario sedemikian rupa, mempunyai alat simulasi yang betul pada pelupusan anda boleh menjadi tidak ternilai.

Jika anda adalah salah satu daripada banyak pengaturcara yang menggunakan Mac, alat pemaju Safari sentiasa berguna. Dengan melepaskan Safari 9 kelebihan fungsi ini telah berkembang dengan ketara, terutamanya disebabkan oleh Mod Design Responsif, yang membolehkan anda untuk melihat bagaimana laman web anda akan menghasilkan pada pelbagai resolusi skrin serta pada membina iPad, iPhone dan iPod yang berbeza.

Petunjuk tutorial ini bagaimana untuk mengaktifkan Mod Design Responsif serta cara menggunakannya untuk keperluan pembangunan anda.

01 dari 05

Pilihan Utama Safari

Pertama, buka penyemak imbas Safari anda.

Klik pada Safari dalam menu penyemak imbas, terletak di bahagian atas skrin. Apabila menu lungsur muncul, pilih Keutamaan pilihan yang dikelilingi dalam contoh yang ditunjukkan.

Catatan: Anda boleh menggunakan pintasan papan kekunci berikut sebagai ganti item menu yang disebutkan di atas: COMMAND + COMMA (,)

02 dari 05

Tunjukkan Membangun Menu

Dialog Keutamaan Safari kini akan dipaparkan, memaparkan tetingkap penyemak imbas anda. Pertama, klik pada Advanced ikon yang diwakili oleh gear dan terletak di sudut kanan atas tetingkap.

Keutamaan Lanjutan pelayar kini boleh dilihat. Di bahagian bawah adalah pilihan disertakan dengan kotak pilihan, berlabel Papar Kembangkan menu dalam bar menu dan dikelilingi dalam contoh di atas. Klik pada kotak semak sekali untuk mengaktifkan menu ini.

03 dari 05

Masukkan Mod Design Responsif

Pilihan baru kini boleh didapati di menu Safari anda, yang terletak di bahagian atas skrin, berlabel Membangunkan. Klik pada pilihan ini.

Apabila menu lungsur muncul, pilih Masukkan Mod Design Responsifdiperluaskan dalam contoh yang ditunjukkan.

Catatan: Anda boleh menggunakan pintasan papan kekunci berikut sebagai ganti item menu yang disebutkan di atas:OPTION + COMMAND + R

04 dari 05

Mod Design Responsif

Halaman web aktif kini akan dipaparkan dalam Mod Reka Bentuk Responsif, seperti ditunjukkan dalam contoh di atas. Dengan memilih salah satu peranti iOS yang disenaraikan seperti iPhone 6, atau salah satu daripada resolusi skrin yang ditetapkan seperti 800 x 600, anda boleh segera melihat bagaimana halaman akan dipaparkan pada peranti itu atau dalam resolusi paparan.

Selain daripada peranti dan resolusi yang ditunjukkan, anda juga boleh mengarahkan Safari mensimulasikan ejen pengguna yang berbeza - seperti satu dari penyemak imbas yang berbeza - dengan mengklik pada menu lungsur yang dipaparkan di atas ikon resolusi.

05 dari 05

Bina Menu: Pilihan Lain

Selain Mod Reka Bentuk Responsif, menu Develop Safari 9 menawarkan banyak pilihan berguna lain, beberapa di antaranya disenaraikan di bawah.

  • Halaman Terbuka Dengan: Membolehkan anda untuk membuka halaman web aktif dalam mana-mana pelayar lain yang sedang dipasang pada Mac anda.
  • Ejen Pengguna: Mengubah ejen pengguna menyebabkan pelayan Web mengenal pasti pelayar anda sebagai sesuatu selain Safari 9.
  • Sambungkan Inspektor Web: Inspektor Web Safari 9 memaparkan semua sumber halaman web, yang menyediakan keupayaan untuk membaca maklumat CSS, metrik DOM, dan struktur, serta kod sumber asalnya.
  • Tunjukkan Konsol Ralat: Salah satu pilihan yang paling banyak digunakan dalam Menu Membangun, konsol ini memaparkan kesilapan dan amaran JavaScript, HTML dan XML.
  • Tunjukkan Sumber Halaman: Membolehkan anda melihat dan mencari kod sumber laman web aktif.
  • Tunjukkan Sumber Halaman: Memilih pilihan ini memaparkan dokumen, skrip, CSS dan sumber lain dari halaman semasa.
  • Paparkan Editor Coretan: Menyediakan keupayaan untuk mengedit dan melaksanakan serpihan kod, yang bertentangan dengan halaman lengkap. Ciri ini sangat berguna dari perspektif ujian.
  • Tunjukkan Pembina Pelanjutan: Membolehkan anda membina sambungan Safari anda sendiri dengan membungkus kod anda dengan sewajarnya dan menambah metadata.
  • Mula Merakam Rangka Masa: Merakamkan beberapa item termasuk permintaan rangkaian, pelaksanaan JavaScript, penyediaan halaman dan acara lain untuk tempoh yang ditentukan pengguna yang boleh dilihat dalam Inspektor WebKit.
  • Kosong Kos: Mengklik pada pilihan ini memadam semua cache yang disimpan dalam Safari, bukan hanya fail cache laman web standard.
  • Lumpuhkan Cache: Dengan kekunci caching dilumpuhkan, sumber dimuat turun dari laman web setiap kali permintaan akses dilakukan bertentangan dengan menggunakan cache tempatan.
  • Benarkan JavaScript dari Medan Carian Pintar: Disabled secara lalai atas sebab keselamatan, ciri ini membolehkan anda memasukkan URL yang mengandungi JavaScript dalam bar alamat Safari.
  • Rawat Sijil SHA-1 sebagai Tidak Aman: Pendek untuk Algoritma Hash Secure, fungsi hash SHA-1 telah terbukti kurang selamat daripada yang asalnya berfikir, oleh itu penambahan pilihan ini dalam Safari 9.