Meskipun ukuran file halaman web yang diukur dalam K sangat kecil untuk bandwidth saat ini, cara menyederhanakan file halaman web yang diukur dalam K ke minimum masih menjadi salah satu masalah yang harus dipertimbangkan oleh desainer web.
Seperti yang kita ketahui bersama, tanpa mempengaruhi struktur dan fungsi keseluruhan halaman web, semakin kecil file halaman web, semakin baik, karena file halaman web yang lebih kecil membantu browser mempersingkat waktu interpretasi halaman web, dan pengunjung alami tidak perlu melakukannya. menghadapi Kejengkelan menunggu halaman web muncul dengan lambat bahkan lebih jelas terlihat bagi pengguna dengan bandwidth rendah dan kecepatan Internet lambat. Bayangkan saja, apakah Anda ingin seluruh situs langsung muncul di hadapan Anda saat Anda membuka sebuah website? Atau apakah Anda lebih suka menghabiskan lebih dari sepuluh detik atau bahkan beberapa menit menonton keseluruhan situs ditafsirkan oleh browser sedikit demi sedikit?
Di era tata letak tabel, kode diulang berkali-kali bersama dengan tabel di halaman, menyebabkan seluruh file halaman web menjadi sangat membengkak, keterbacaan kode juga dikurangi seminimal mungkin, dan waktu interpretasi browser menjadi alami. meningkat banyak. Sejak tata letak DIV+CSS menggantikan tata letak Tabel, semuanya telah ditingkatkan secara signifikan, memungkinkan Tabel kembali ke posisi semula untuk menampilkan data, dan tata letak diserahkan kepada DIV+CSS, sehingga keterbacaan dan penggunaan kembali kode telah ditingkatkan , dan yang lebih penting dari DIV+CSS adalah membedakan performa dan struktur file halaman web, sehingga tidak perlu mengubah struktur keseluruhan file halaman web untuk performa.
Meskipun metode tata letak DIV+CSS telah meminimalkan kode yang membengkak pada tata letak Tabel sebelumnya, bagi desainer web, bagaimana cara mengontrol ukuran file halaman web seminimal mungkin adalah pertanyaan yang selalu patut ditelusuri dan ditelusuri.
Lihatlah potongan kode berikut:
#tajuk { |
Potongan kode CSS tersebut sangat jelas strukturnya, strukturnya jelas, dan sangat mudah dibaca. Namun, potongan kode tersebut belum disederhanakan, artinya ini adalah kode CSS yang paling orisinal. Mari kita lihat kode yang disederhanakan di bawah ini .
| #tajuk { margin:10px 15px; latar belakang:#333 url(Gambar/header.jpg); } |
Ada istilah atribut komposit dalam CSS, artinya banyak parameter atribut dapat diintegrasikan bersama. Misalnya, "margin-top; margin-right; margin-bottom; margin-left;" di atas dapat diintegrasikan menjadi satu " margin " properti, lalu berikan parameternya.
Melalui ini, kita dapat lebih menyederhanakan kode berdasarkan kode CSS asli. Selain itu, struktur yang ditulis dengan cara ini juga masuk akal dan keterbacaannya juga sama kuatnya. Namun hal ini tidak cukup untuk melakukan perampingan secara ekstrim. Untuk memperjelas struktur kode CSS ini, kita menggunakan spasi, jeda baris, dan hal-hal lain yang memakan ruang. Bagaimana jika kita menghilangkan hal-hal yang memakan ruang tersebut?
| #header{margin:10px 15px;background:#333 url(Gambar/header.jpg);} |