# 022: Joustavat kuvat (kuviot ja kuvatekstit) - CSS-temppuja

Anonim

Ennen kuin teemme typografista työtä, ajattelin korjaavan ärsyttävän asian, jossa kuvat romahtavat artikkelin alueen ja ruudukon ulkopuolella. Käyttämällä joitain yksinkertaisia ​​CSS-sääntöjä korvaamaan sisäiset kuvan määritteet ja tyyli, voimme pilkkoa kuvia, jotta ne sopivat viestiimme oikeassa koossa.

Tämän kaltaisten kuvien viilentäminen oli aiemmin melko viileää, koska selaimet tekivät huonoa kokoa, mutta tämä ei ole enää tapaus. Se on oikeastaan ​​eräänlainen hyvä idea, koska näyttöjen tarkkuus on parempi, koska kuvat ovat terävämpiä.

Koon muuttamista käsittelevät lähinnä:

figure img ( max-width: 100%; height: auto !important; )

Me tyylitämme hahmot ja kuvatekstit vain vähän, jotta ne näyttävät, kuten tiedät, oikealta kuvalta blogikirjoituksessa.