Предотвращение изменения размера изображения в зависимости от разрешения экрана

0

Прежде всего, я хотел бы упомянуть о том, что CSS/HTML не связан с этим кодом, он идет прямо на <body>

Сам образ я размещаю на каждом фрагменте контента на странице с использованием z-index и pointer-effects: none, и то, что я пытался достичь, приводит к правильному масштабированию изображения с разрешениями экрана в зависимости от высоты и по-прежнему покрывают экран (для меня это не имеет значения, если некоторые из них обрезаются), но независимо от того, что я пробовал, изображение полностью меняет размер, чтобы быть меньше, чтобы соответствовать

код:

<div style="position:fixed;
float:left;
z-index:99999999;
bottom:0px;
left:0px;
pointer-events:none;">
<img src="http://www.millport.org/wp-content/uploads/2013/05/Flower-festival.jpg"  width="100%" height="100%"></div>
<div id ="over"></div>

http://jsfiddle.net/ZnraF/1/

Удаление width="100%" приводит только к возврату всего изображения к исходному размеру и к популярному background-size: cover; коды ничего не делают и влияют только на фоновое изображение.

http://i.stack.imgur.com/HLJBQ.png <- Я предполагаю, что это возможно, есть ли у кого-нибудь предложения? (заметьте, изображение, которое я фактически использую для этого, намного шире и крупнее, чем цветок.)

Теги:
image
resolution

1 ответ

0

если вы хотите сохранить размер изображения одинаково независимо от разрешения, попробуйте изменить код изображения так:

<img 
src="http://www.millport.org/wp-content/uploads/2013/05/Flower-festival.jpg"  style="width:100px; height:100px"/>

Просто измените значение px на нужные пиксели по ширине и высоте.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню