https://ibb.co/4VqLgcS - ссылка на картинку.
Нужно сделать так, чтобы на сайте она размещалась, так же как на макете, представленном выше.
С помощью position
не получается, т.к. вся картинка смещается вправо и появляется скролл по ширине.
Что сделать чтобы при выходе за экран она обрезалась?
А это зависит от того, что вам нужно. Ваш вопрос не совсем понятен.
Это варианты с картинкой:
.block_one {
width: 200px;
overflow: hidden;
}
.block_two {
width: 200px;
height: auto;
}
.block_two img {
width: 100%;
height: auto;
}
<div class="block"><img src="https://i.stack.imgur.com/qQoD4.jpg" alt="Дорогие друзья, с Рождеством, с Новым 2020 Годом!"></div>
<div class="block_one"><img src="https://i.stack.imgur.com/qQoD4.jpg" alt="Дорогие друзья, с Рождеством, с Новым 2020 Годом!"></div>
<div class="block_two"><img src="https://i.stack.imgur.com/qQoD4.jpg" alt="Дорогие друзья, с Рождеством, с Новым 2020 Годом!"></div>
А это варианты с фоном:
.block {
margin: 5px;
width: 500px;
height: 200px;
border: 2px solid gray;
background: url(https://i.stack.imgur.com/qQoD4.jpg) no-repeat;
}
.block_one {
background-size: auto;
}
.block_two {
background-size: cover;
}
.block_three {
background-size: contain;
}
<div class="block block_one"></div>
<div class="block block_two"></div>
<div class="block block_three"></div>
Айфон мало держит заряд, разбираемся с проблемой вместе с AppLab
Перевод документов на английский язык: Важность и ключевые аспекты
При вставке в форму кода от видео ссылки, необходимо что бы данное видео проигрывалось в плеере ниженапример youtube