Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Как указать правильный размер картинке img? (https://javascript.ru/forum/events/84692-kak-ukazat-pravilnyjj-razmer-kartinke-img.html)

mik888em 17.11.2022 18:01

Как указать правильный размер картинке img?
 
Вложений: 1
На моем WP сайте https://transscreen.ru/ при написании записей пишу текст записи так:

<br><br><br>
<img rel="preload" as="image"
 title="Для гугла тайтл"
 src="https://telegra.ph/file/43d6ef4f5cd14a161879c.jpg"
 alt="для яндекса"
 rel="nofollow"
 width="auto" height="auto"
 class="alignnone size-medium" />
 <br><br>
 <h4>текст статьи</h4>



Проблема в том что https://pagespeed.web.dev/ говорит что нужно указать размеры картинок:
Вложение 4855

Указал auto или ставлю 90%....что гугла видимо не устраивает.

Но проблема что если в width=" " height=" " я укажу конкретные размеры например 300px, то картинки будут деформироваться, т к все картинки имеют разные размеры и соотношения сторон.

Как указать размеры для img чтоб они были универсальны и считались определёнными для https://pagespeed.web.dev/ ?

voraa 17.11.2022 20:18

Для атрибутов нельзя задавать "auto". Это не CSS свойства.
В атрибутах только числа (без "px")
Если задать только один атрибут width или height, то другое будет подстраиваться под истинные пропорции рисунка.
Что бы выводить рисунки различных пропорций в жестко заданные размеры, надо использовать CSS свойства object-fit
https://developer.mozilla.org/ru/doc...CSS/object-fit
и object-position
https://developer.mozilla.org/ru/doc...bject-position


Часовой пояс GMT +3, время: 19:41.