Pertama-tama, saya ingin menyatakan bahwa saya tidak menentang gridding dalam desain, saya menentang gridding dalam rekonstruksi. Ini harus secara khusus merujuk pada metode YUI dari gridding pengikatan nama kelas. Anda dapat melihat potongan kode berikut:
Contoh Kode Sumber
[www.downcodes.com] <div id="yui-main">
<div kelas="yui-b">
<div kelas="yui-g">
<div class="yui-u dulu"></div>
<div kelas="yui-u"></div>
</div>
</div>
</div>
Anda dapat melihat dengan jelas bahwa nama yui-u atau yui-g di sini tidak ada artinya. Ada juga hal pertama yang terkait dengan kinerja. Saya tidak tahu bahwa ada kalimat dalam PPT yang menyertai buku "Rekonstruksi Situs Web" yang telah dibaca semua orang - "Setelah menghapus tag tampilan dari halaman, mendesain ulang situs dan konten yang ada akan menjadi sangat menghemat tenaga ( Di pada saat yang sama, jauh lebih murah). Jika Anda ingin mengubah keluaran situs, Anda hanya perlu mengubah style sheet tanpa mengubah halaman itu sendiri. dan perilaku. Perubahan akan menyebabkan masalah berikut:
Saat mengubah kinerja, HTML harus dipindahkan. Modifikasi yang indah memerlukan pemindahan tiga baris kerja, yang menghabiskan banyak sumber daya manusia.
Kotak kelima bernama "pertama" akan muncul.
Sebuah kotak bernama "lebar 180" yang sebenarnya lebarnya 240 akan muncul.
Akan ada tata letak yang disebut "empat kolom" yang sebenarnya terdiri dari tiga kolom.
Akan ada kata bernama "biru" yang sebenarnya berwarna merah.
Ini setara dengan "kotak_kiri" dan "kotak_kanan" yang sekarang populer di kalangan banyak orang. Setelah direvisi dengan cepat, keduanya menjadi "kotak_kanan" di sebelah kiri. Bukankah ini sama dengan memutarbalikkan kebenaran? Namun sebenarnya yang terpenting adalah poin pertama, apakah cara kerja ini berbeda dengan cara kerja kita sebelumnya dalam tata letak tabel? Jika Anda meminta perubahan gaya, seluruh perusahaan (desain, halaman, pengembangan, pengujian fungsional, pemantauan data CE) akan mengikuti Anda.
Setelah menulis ini, saya menoleh ke belakang dan mengubah judul menjadi artikel kedua tentang CSS dalam seri "Ini Akan Menjadi Revolusi". Jika cara di atas salah, izinkan saya menunjukkan cuplikan kode dari versi baru proyek yang baru saja saya ambil alih:
Contoh Kode Sumber
[www.downcodes.com] <div id="index_news" class="mode">
<h3 class="title">Berita kesejahteraan masyarakat</h3>
<div kelas="konten">
<ul>
<li><a href="#">Judul berita, judul berita, judul berita, judul berita</a></li>
<li><a href="#">Judul berita, judul berita, judul berita, judul berita</a></li>
<li><a href="#">Judul berita, judul berita, judul berita, judul berita</a></li>
<li><a href="#">Judul berita, judul berita, judul berita, judul berita</a></li>
<li><a href="#">Judul berita, judul berita, judul berita, judul berita</a></li>
<li><a href="#">Judul berita, judul berita, judul berita, judul berita</a></li>
<li><a href="#">Judul berita, judul berita, judul berita, judul berita</a></li>
<li><a href="#">Judul berita, judul berita, judul berita, judul berita</a></li>
</ul>
</div>
<a class="more" href="#">Lainnya</a> </div>
Contoh Kode Sumber
[www.downcodes.com] .mode{
posisi:relatif;
mengapung:kiri;
ukuran font:12px;
}
.mode h3.judul,
.mode h4.judul{
warna:#234C00;
bantalan:5px 10px;
ukuran font:14px;
}
.mode .lebih lanjut{
atas:5 piksel;
kanan:10 piksel;
ukuran font:12px;
warna:#4282ab;
posisi:mutlak;
}
.mode .konten{
jelas: keduanya;
}
.mode .content:setelah {
isi:"";
tampilan:blok;
tinggi:0;
tinggi garis:0;
jelas: keduanya;
visibilitas: tersembunyi;
}
#index_news.mode,
#index_bbs.mode,
#index_area.mode{
latar belakang:url(small_gray_grid.png) ulangi-y -400px bawah;
lebar:200 piksel;
margin:5 piksel 0 5 piksel 5 piksel;
}
#index_news.mode h3.judul,
#index_bbs.mode h3.judul{
latar belakang:url(small_gray_grid.png) tanpa pengulangan -200px atas;
}
#index_news.mode .konten,
#index_bbs.mode .konten,
#index_area.mode .konten{
latar belakang:url(small_gray_grid.png) tanpa pengulangan -600px bawah;
tampilan:meja;
}
Anda dapat melihat keuntungan dari pemikiran modular:
Modul yang ada dapat digunakan secara semi-otomatis untuk menghemat waktu dan tenaga pengembangan kode.
Ini dapat dengan bebas disesuaikan dengan kebutuhan abnormal yang berbeda dari manajer produk dan atasan mana pun.
Perubahan apa pun pada kinerja di atas tidak memerlukan keterlibatan pengembang, dan tidak diperlukan pengujian fungsional.
Pemantauan data CE terikat pada ID, dan tidak perlu menyesuaikan ulang antarmuka.
Setiap orang bertanggung jawab atas pengembangan berulang yang cepat dari satu modul.
Juga sejauh menyangkut kode. Judul adalah judulnya, dan isinya adalah isinya; Anda tidak akan pernah memutarbalikkan fakta dan menampar mulut Anda sendiri.
Saya punya kekhasan. Saya suka bahwa selama wawancara saya selalu menguji XHTML pewawancara terlebih dahulu. Sama seperti ketika seorang master merekrut murid magang di masa lalu, kemampuan dan kecerdasan adalah nomor dua, dan karakter adalah prioritas pertama.
Saya percaya bahwa XHTML seperti esensi seseorang, CSS seperti cara dan sikap seseorang dalam melakukan sesuatu, dan JS seperti perilaku dan gaya seseorang dalam melakukan sesuatu. Pemisahan ketiganya ditambah beberapa seputar SEO dan interaksi manusia-komputer inilah yang kami sebut rekonstruksi situs web, yang merupakan orang yang sangat baik. Dulu, sebagian orang selalu mengira bahwa CSS adalah elemen terpenting dari sebuah website. Faktanya, CSS secara alami mewakili pandangan hidup. Memang sulit bagi seseorang untuk bertahan hidup dalam masyarakat saat ini tanpa cara dan sikap yang baik dalam melakukan sesuatu, namun jika cara dan sikap dalam melakukan sesuatu terlalu fokus, ia akan menjadi orang yang pandai menipu dan melakukan sesuatu dengan tidak bermoral; .
Inilah yang selalu ingin saya katakan. Dengan CSS, Anda dapat mengubah urutan kiri-kanan menjadi urutan kanan-kiri. Ini adalah keajaiban di halaman web. Anda tidak bisa menyalahgunakannya untuk menjadi orang yang pandai menipu dan melakukan sesuatu dengan tidak bermoral.
