Tayangan Skrin Video 2025, Mungkin
Reka bentuk untuk komen mungkin kelihatan sangat sederhana. Dan ia! Tetapi saya rasa sederhana berkesan dalam kes ini. Komen merupakan bahagian penting dalam CSS-Tricks "
Kami mula menggali Photoshop di sini dan merancang kawasan komen. Kami bermula di bahagian atas, yang bermaksud setiap individu memberi komen sendiri (berbanding dengan "
Kita mulakan dengan melihat beberapa kerja menggerutu yang saya lakukan di belakang tabir menyusun beberapa perkara yang perlu dilakukan. Seperti menambah dalam "
Kami hampir selesai untuk membina laman utama kawasan Snippets di laman web ini. Segera, kami mula mengubah suai dan memasukkan lebih banyak barang ke dalam "
Dengan reka bentuk untuk kawasan potongan "selesai" - kita sekarang boleh beralih ke beberapa interaktiviti (baca: JavaScript). Kami menambah rollover super lumpuh untuk pautan di "
Kami kini mempunyai reka bentuk Photoshop untuk bekerja dari halaman utama kawasan Snippets. Ini jauh lebih mudah dilayari daripada sebelumnya, tetapi mengekalkan pelangi "
Masa untuk menyelam ke kawasan Coretan! Iaitu, kawasan kandungan sebenarnya. Kami sudah mempunyai pengepala. Kawasan coretan cukup popular. "
Dalam screencast ini kami membungkus bahagian Almanak. Terdapat hierarki yang cukup jelas di Almanac. Begini: Rumah> Rumah Almanak> Harta atau Pemilih> "
Kami melompat ke depan hanya sedikit remaja di sini. Ini adalah siri screencast yang cukup komprehensif, tetapi hanya 40 jam lebih dan sudah tentu projek ini sebenarnya "
Kami sudah bekerja secara tempatan di domain tempatan (v10.whatup). Kini tiba masanya untuk mula beralih ke WordPress. Kami akan terus bekerja secara tempatan "
Kami mempunyai semua kandungan yang kami perlukan pada keluaran halaman ini dan tajuknya ada. Sekarang kita dapat memulakan CSSin ke dalam reka bentuk yang telah kita jalankan "
Ketika kita mula bekerja di WordPress, akan lebih baik jika kita mendapatkan salinan pangkalan data langsung untuk bekerja dengan tempatan. Beberapa laman web mempunyai perkara seperti "
Sekarang setelah kita berusaha mendapatkan konten yang tepat di beranda Almanac, kita dapat menggali beberapa gaya yang sebenarnya dengan CSS. Kami memutuskan untuk pergi "
Dalam screencast ini, kita sebahagian besarnya menggunakan "Photostar" berwarna oren yang menguasai footer. Kami menjadikan bintang dalam fail berasingan di Photoshop, sehingga kami dapat membuat "
Tandukan untuk Alamanc masuk, kali ini dari Giovanni Difeterici. Kami menggunakan banyak teknik yang telah kami buat untuk memulakannya "
Ilustrasi tajuk khas untuk bahagian video telah masuk, kali ini dari Alyssa Nassner. Kami meluangkan sedikit masa untuk mengatur fail Photoshop dan "
Dalam screencast akhir membina footer ini, kami mengusahakan footer bawah di mana kawasan CodePen dan ShopTalk berada. Kita mesti menukar HTML "
Dalam screencast ini, kita memfokuskan pada garis di bawah pautan di bahagian atas footer. Kami agak tersandung memikirkan perkara mana yang harus "
Kepala potongan telah masuk, kali ini oleh Reagan Ray. Kami meluangkan sedikit masa di Photoshop kali ini untuk mengubah beberapa perkara untuk memastikan kami "
Dengan struktur HTML untuk footer yang ada, kita mempunyai apa yang kita perlukan untuk mula menggayakan dan menjadikan footer ini kelihatan seperti yang kita reka di Photoshop. "
Ini adalah kerja terakhir Photoshop yang akan kami buat secara khusus mengenai footer sebelum kami benar-benar membinanya. Dalam screencast ini kita "
Kami sedang berusaha untuk membuat reka bentuk untuk footer di Photoshop. Peringatan pantas: Saya bekerja di Photoshop kerana saya merasa lebih kreatif di sana sebelum saya melompat "
Kami mendapat lebih banyak perniagaan Photoshoppin dalam screencast ini, meletakkan footer paling bawah dengan pautan ke dua projek terbesar saya yang lain, CodePen "
Kami memulakan perjalanan hebat yang menjadi tumpuan! CSS-Tricks selalu mempunyai footer mewah dan reka bentuk ini tidak akan terkecuali. Ia bukan semata-mata "
Dengan reka bentuk footer kami yang siap digunakan di Photoshop, kami boleh mula membuatnya menjadi mockup HTML dan CSS statik kami. Langkah pertama ialah memberi "
Kami mempunyai zon BSA lain untuk disatukan ke dalam laman web ini. Yang ini semestinya sedikit lebih mudah kerana kita sudah mempunyai JavaScript dan hanya "
Kami mempunyai tiruan bagaimana kami mahu zon BuySellAds kami kelihatan, jadi mari kita terus membuatnya. Laman web BuySellAds memberikan kod yang kita perlukan "
Satu-satunya perkara yang hilang sekarang dari tajuk Forum kebiasaan kami adalah bahagian yang sebenarnya mengatakan "Forum"! Nick menggambarkan tangan memegang tanda yang dimaksudkan "
Sekarang kita tahu dengan tepat zon apa yang kita bekerjasama, kita kembali ke Photoshop dan mengejek bagaimana kita mahu zon iklan ini kelihatan. Kami mempunyai preseden untuk "
Seperti yang anda ketahui, beberapa iklan di CSS-Tricks semacam "diuruskan sendiri", seperti penaja Treehouse utama. Saya mengambilnya kerana ia hanya satu "