Tayangan Skrin Video 2025, Mungkin

# 030: Menghilangkan Halaman untuk Navigasi - Trik CSS

# 030: Menghilangkan Halaman untuk Navigasi - Trik CSS

Kami mempunyai lapan tab navigasi tingkat atas ini, tetapi Home adalah satu-satunya tab yang "berfungsi." Agar kami mempunyai beberapa halaman untuk dikerjakan, kami mencubit beberapa halaman untuk

# 027: Penyorotan Sintaksis Kod, Bahagian 1 - Trik CSS

# 027: Penyorotan Sintaksis Kod, Bahagian 1 - Trik CSS

Seingat saya, saya menggunakan Google Code Prettify untuk menerapkan sorotan sintaks pada blok kod pada CSS-Tricks. Anda tahu, di mana dalam barisan seperti "

# 028: Penyorotan Sintaksis Kod, Bahagian 2 - Trik CSS

# 028: Penyorotan Sintaksis Kod, Bahagian 2 - Trik CSS

Kami baru sahaja memasang Prism.js dan berjaya. Dalam screencast ini, kami menjumpai tema yang disebut Tema Esok dan menyatukan warnanya ke dalam sintaks "

# 026: Post Tipografi, Bahagian 2 - Trik CSS

# 026: Post Tipografi, Bahagian 2 - Trik CSS

Kami telah melakukan sedikit kerja pada tajuk, tetapi kami akan menggali lebih banyak perkara dalam tajuk ini. Tajuk adalah aspek penting dari mana-mana laman web. Dilakukan dengan baik,"

# 025: Tipografi Pasca, Bahagian 1 - Trik CSS

# 025: Tipografi Pasca, Bahagian 1 - Trik CSS

Sekarang kita mempunyai bidang catatan blog untuk dikerjakan, kita benar-benar dapat memasuki tipografi catatan blog. Boleh dikatakan tipografi terpenting di laman web kerana "

# 023: Mengalihkan Tipografi daripada Normalisasi - Trik CSS

# 023: Mengalihkan Tipografi daripada Normalisasi - Trik CSS

Saya rasa sangat senang memiliki fail individu (.scss) yang merupakan sebilangan besar tipografi di laman web ini. Normalisasi mempunyai sedikit tipografi "

# 024: Bermain dengan Tipografi di Typecast - Trik CSS

# 024: Bermain dengan Tipografi di Typecast - Trik CSS

Typecast (dalam versi beta pada saat penggambaran ini) adalah aplikasi web yang sangat kemas untuk bermain dengan tipografi web. Ini memberi anda antara muka yang bagus untuk bermain-main "

# 020: Menyelesaikan Grid dan Menyiapkan Modul - Trik CSS

# 020: Menyelesaikan Grid dan Menyiapkan Modul - Trik CSS

Meneruskan konsep "Don't Overthink It Grids", kita mendapatkan selokan di grid dengan hanya menggunakan beberapa padding sederhana. Kami menyimpan nombor padding "

# 022: Flexy Images (Gambar dan Gambar) - Trik CSS

# 022: Flexy Images (Gambar dan Gambar) - Trik CSS

Sebelum kita membuat beberapa kerja tipografi, saya fikir kita akan memperbaiki perkara yang menjengkelkan di mana gambar-gambar itu meletus di luar kawasan artikel dan grid. Menggunakan "

# 021: Memecahkan Bahagian yang Boleh Dilampirkan - Trik CSS

# 021: Memecahkan Bahagian yang Boleh Dilampirkan - Trik CSS

Sekarang kita menjalankan domain tempatan khusus, kita dapat menggunakan PHP. "P" dalam MAMP adalah untuk "PHP" =). Menggunakan PHP bermaksud bahawa kita boleh menggunakan termasuk. Contohnya: "Kami"

# 018: Membuat Projek kami menggunakan Kompas - Trik CSS

# 018: Membuat Projek kami menggunakan Kompas - Trik CSS

Kami boleh menulis Sass @mixins kami sendiri untuk membantu perkara CSS3 (seperti gradien), tetapi ada kerangka Sass yang sudah ada yang disebut Compass yang "

# 019: Membina Grid Mudah - Trik CSS

# 019: Membina Grid Mudah - Trik CSS

Reka bentuk laman web ini berbentuk seperti grid. Modul kami akan tersusun dengan bersih ke dalam grid. Tetapi bukankah grid itu rumit dan pelik? Dan mungkin kita "

# 017: Menyiapkan URL Tempatan dengan MAMP - Trik CSS

# 017: Menyiapkan URL Tempatan dengan MAMP - Trik CSS

Dalam screencast super cepat ini, kami menggunakan MAMP untuk menyiapkan URL yang dapat kami gunakan untuk pembangunan tempatan. Ini berguna kerana banyak sebab: Kami boleh menghubungkan ke "

# 016: Menggunakan Pertanyaan Media di Sass - Trik CSS

# 016: Menggunakan Pertanyaan Media di Sass - Trik CSS

Kami memperkenalkan konsep pertanyaan @media di CSS. Banyak yang menggunakan Sass pada projek ini yang membolehkan kita lakukan adalah tetap KERING (jangan mengulanginya sendiri). Kami telah lakukan"

# 015: Menambah Ikon ke Navigasi dengan Font Ikon - Trik CSS

# 015: Menambah Ikon ke Navigasi dengan Font Ikon - Trik CSS

Kita mulakan dengan mengubah sedikit jenis logo, tetapi kemudian menambah ikon ke dalam navigasi utama. Semasa kami merancang navigasi di Photoshop (Video "

# 014: Fon Tersuai dengan Typekit - Trik CSS

# 014: Fon Tersuai dengan Typekit - Trik CSS

Kami menyediakan Kit baru di Typekit untuk v10. Untuk penjenamaan, kami akan menggunakan Proxima Nova Soft buat masa ini dan beberapa fon lain yang kelihatan hampir dengan fon HF&J di "

# 012: CSS Menulis Tajuk / Logo - Trik CSS

# 012: CSS Menulis Tajuk / Logo - Trik CSS

Setakat ini laman web sebenarnya tidak kelihatan sama seperti reka bentuk Photoshop kami. Dalam screencast ini, kita terus melakukan perkara itu, bermula di bahagian atas dengan "

# 013: CSS Melayari Struktur Navigasi - Trik CSS

# 013: CSS Melayari Struktur Navigasi - Trik CSS

Kami menggunakan beberapa trik penentuan kedudukan untuk menyusun tepi kiri logo dan kawasan kandungan utama, sementara header masih menyentuh tepi kiri "

# 011: Menormalkan CSS Foundation kami - Trik CSS

# 011: Menormalkan CSS Foundation kami - Trik CSS

Mengeluarkan CSS ejen pengguna (lalai) dari kebanyakan elemen biasanya merupakan idea yang baik. Ini telah lama dilakukan oleh "universal" reset atau perkara seperti Eric "

# 010: Mula Menulis HTML - Trik CSS

# 010: Mula Menulis HTML - Trik CSS

Semasa melihat mockup Photoshop kami, kami menulis mula menulis HTML untuk menerangkan apa yang kami lihat. Kami tentu saja menggunakan HTML5 setiap kali ia dibuat "

# 007: Ikon Photoshop dan Teks Ke Navigasi - Trik CSS

# 007: Ikon Photoshop dan Teks Ke Navigasi - Trik CSS

Kami mula menjatuhkan teks ke navigasi utama, hanya untuk melihat bagaimana ia sesuai, berfungsi pada ukuran, warna, dan lain-lain. Sebilangan teks sangat sesuai "

# 009: Menyiapkan Persekitaran Dev Setempat - Trik CSS

# 009: Menyiapkan Persekitaran Dev Setempat - Trik CSS

Sudah tentu kita tidak "selesai" di Photoshop selamanya untuk reka bentuk ini, tetapi kita masih perlu berusaha untuk mula membuat reka bentuk ini di penyemak imbas. Selepas "

# 006: Photoshop Membeli Navigasi Utama - Trik CSS

# 006: Photoshop Membeli Navigasi Utama - Trik CSS

Kami mula merancang navigasi laman web tingkat atas (utama). Kami bermula dengan layar ukuran desktop (dengan lebar yang diakui sewenang-wenang) tetapi kami "

# 005: Menambah Dimensi Sedikit - Trik CSS

# 005: Menambah Dimensi Sedikit - Trik CSS

Kami menambahkan beberapa lapisan tambahan di bawah tajuk utama / kotak penjenamaan untuk memberikan rupa "timbunan kertas". Tidak ada kiasan besar atau apa-apa, ia hanya menambah sedikit visual

# 008: Photoshopping Corak Modul - Trik CSS

# 008: Photoshopping Corak Modul - Trik CSS

Seluruh laman web akan berdasarkan "modul". Setiap perkara kecil akan berada dalam kotak (akhirnya secara visual dan kodnya). Kami "

# 003: Sesi Strategi Kandungan - Trik CSS

# 003: Sesi Strategi Kandungan - Trik CSS

Ini adalah rakaman audio panggilan Skype antara Erin Kissane dan saya. Erin menulis buku mengenai strategi kandungan jadi saya bernasib baik kerana mendapat pertolongan dan "

# 004: Bermula di Photoshop, Tekstur Latar Belakang, dan Penjenamaan Utama - Trik CSS

# 004: Bermula di Photoshop, Tekstur Latar Belakang, dan Penjenamaan Utama - Trik CSS

Reka bentuk dalam penyemak imbas memang menarik dan semuanya, tetapi bermula di Photoshop menjadikan saya paling kreatif ketika saya sangat memerlukannya: ketika menghadap kanvas kosong. "

# 001: Mengambil Inventori Kandungan - Trik CSS

# 001: Mengambil Inventori Kandungan - Trik CSS

Selamat datang! Ini akan menjadi perjalanan yang cukup, dan seperti semua perjalanan, ini bermula dengan satu langkah. Langkah pertama kami adalah membuat inventori sedikit "

# 002: Menetapkan Matlamat Merangka Semula - Trik CSS

# 002: Menetapkan Matlamat Merangka Semula - Trik CSS

Reka bentuk semula ini bukan reka bentuk semula hanya untuk reka bentuk semula. Saya ingin memperbaiki laman web ini dengan cara yang mungkin anda boleh memperbaiki laman web ini. Salah satu daripada"

35: Mengoptimumkan SVG dengan Alat - Trik CSS

35: Mengoptimumkan SVG dengan Alat - Trik CSS

Kami sudah bercakap mengenai mengoptimumkan SVG dengan tangan. Membuat pilihan secara manual mengenai perincian dan jenis perkara yang boleh digabungkan atau dikeluarkan. Di dalam ini"