#html #css #image #css-position
#HTML #css #изображение #css-position
Вопрос:
введите описание изображения здесь У меня возникла проблема, когда мое изображение на моем веб-сайте перемещается вправо от экрана, когда я уменьшаю и увеличиваю масштаб. Как я могу заставить изображение оставаться неподвижным на экране?
Вот код CSS для изображения…
.logo {
height: 150px;
width: 150px;
position: absolute; TOP: 60px; RIGHT: 230px;
position: auto;
display: block;
}
Комментарии:
1. Можете ли вы опубликовать примеры изображений того, чего вы хотели бы достичь?
2. Я боюсь, что это позволит мне, потому что я только что создал учетную запись.
Ответ №1:
Вы указываете количество пикселей, которое должно быть удалено от правой границы вашего изображения. Замените его относительным размером, например Right: 50%; , чтобы при изменении размера или увеличении или уменьшении масштаба расстояние от правой границы автоматически пересчитывалось.
Комментарии:
1. Это помогло частично решить мою проблему, но когда я увеличиваю или уменьшаю масштаб, определенное изображение перемещается влево или вправо при увеличении или уменьшении масштаба. Как я могу зафиксировать его на месте, чтобы он этого не делал?
2. Боюсь, я не понимаю проблему. Может быть, вы можете показать нам изображение, где проблема становится более ясной, или, что еще лучше, полный пример минимального кода?
3. Это не позволит мне вставить изображение, потому что я только что создал учетную запись для StackOverflow извините
Ответ №2:
Используйте единицы измерения длины видового экрана в процентах вместо пикселей.
Видовой экран -процентные длины определяют
<length>значение относительно размера видимой части документа.
Что-то вроде этого:
.logo {
height: 150px;
width: 150px;
position: absolute;
top: 5vh;
right: 15vw;
display: block;
}
Ответ №3:
это сработало для меня :
background-position: top; /* or center */