# 022: Зображення Flexy (малюнки та підписи) - CSS-хитрощі

Anonim

Перш ніж виконати певну типографічну роботу, я думав, що ми виправимо настирливу ситуацію, коли зображення потрапляють поза область статті та сітки. Використовуючи кілька простих правил CSS, щоб замінити вбудовані атрибути та стиль зображення, ми можемо стискати зображення, щоб вони вмістилися в нашій публікації правильного розміру.

Видалення подібних зображень раніше було досить непрохолодним, оскільки браузери погано виконували зміни розміру, але це вже не так. Насправді це гарна ідея, оскільки дисплеї отримують вищу роздільну здатність, оскільки зображення будуть чіткішими.

Зміном розміру, по суті, займаються:

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

Ми трохи стилюємо малюнки та вигадки, щоб вони виглядали, як ви розумієте, як належна фігура у дописі в блозі.