# 141: Mendapatkan Imej dan Nombor untuk Imej Responsif - Trik CSS

Anonim

Anda tahu mengenai gambar responsif. Ini mengenai sintaks gambar dalam HTML. Sekiranya anda memberikannya maklumat yang betul dalam sintaks yang betul, anda boleh mendapatkan penyemak imbas untuk memuat turun gambar yang tepat tepat yang diperlukannya, tanpa memberikan data gambar yang terlalu banyak atau terlalu sedikit. Ia hebat untuk persembahan.

Anda tahu bahawa untuk memaksimumkan imej responsif, anda harus mengisi dengan Picturefill. Anda memuat turunnya, anda memasukkannya ke halaman anda.

Anda mempunyai rancangan. Anda tahu apa yang anda mahukan halaman anda di titik putus pertanyaan media tertentu. Anda semua itu diejek di Sketch atau Photoshop.

Anda tahu bagaimana sintaks untuk gambar responsif. Anda memerlukan sesuatu seperti sintaks srcset / saiz untuk menerangkan keadaan anda.

Sunset

Screencast ini adalah mengenai semua perkara itu. Ini mengenai mengikat semuanya bersama. Ini mengenai menyatukan aliran kerja reka bentuk dan perisian yang digunakan di sana dengan aliran kerja bahagian depan dan sintaks yang digunakan di sana. Anda perlu tahu bagaimana mengeluarkan gambar dalam format dan saiz yang anda perlukan. Anda perlu tahu bila anda akan mendapat output berkualiti dan kapan anda tidak akan mendapat. Anda perlu mengetahui cara mengukur gambar tersebut dan menggunakan nombor yang betul di mana. Anda perlu mengetahui cara menghubungkan pilihan susun atur dan pertanyaan media anda dengan nombor tersebut. Semuanya ada di sini.

Lihat Demo Pen untuk Screencast mengenai Mendapatkan Nombor untuk Imej Responsif oleh Chris Coyier (@chriscoyier) di CodePen.