# 106: Kawasan Coretan Bangunan, Bahagian 3 (HTML & CSS) - Trik CSS

Anonim

Kami hampir selesai untuk membina laman utama kawasan Snippets di laman web ini. Segera, kami mula mengubah suai dan mendapatkan lebih banyak bentuk.

Kami mempunyai pengalaman yang pelik di mana elemen semu yang benar-benar diposisikan tidak bertindak balas terhadap margin kiri negatif tetapi baik dengan margin kanan positif. Siapa tahu.

Kemudian kita beralih ke kelas "aktif" untuk menu kiri kategori coretan. Anda hanya melihat salah satu daripadanya pada satu masa (melihat senarai coretan yang berkaitan di sebelah kanan). Katakan "HTML" aktif dan anda mengklik "CSS", senarai baru hanya coretan yang berkaitan dengan CSS muncul di sebelah kanan. Perlu ada beberapa gaya untuk menunjukkan yang aktif. Mengubah z-index pada kelas aktif sudah cukup untuk kita (menjadikannya duduk di atas bayangan).

Untuk senarai di sebelah kanan, adalah pantas untuk memaparkan pautan: blok - tetapi kawasan itu hampir boleh diklik. Rasanya pelik memikirkannya, tapi saya rasa itu benar. Anda tidak mahu klik tidak sengaja jauh dari teks pautan itu sendiri untuk mengaktifkan pautan itu. Ia akan mengejutkan dan pelik. Oleh itu, pautan itu sendiri boleh menjadi blok sebaris sehingga mereka boleh mempunyai beberapa padding, tetapi jangan mengisi lebar penuh seperti item senarai tempat mereka berada.

Untuk pautan itu sendiri, kami memutuskan bahawa mewarnai tajuk coretan dengan warna kategori yang mereka anggap terlalu kuat. Sebaliknya, pautan akan berwarna kelabu tetapi warna rollover dapat menggunakan warna khas itu.

Kami juga memutuskan bahawa senarai satu lajur lurus ke bawah berfungsi buat masa ini, tetapi jika menatal terlalu konyol mungkin suatu hari nanti kita dapat membahagi dua lajur dan memendekkannya.