Как мне показать все изображение в контейнере? - PullRequest
0 голосов
/ 21 апреля 2020

Само изображение 6024x4024. Я могу скрыть переполнение, но, кажется, я не могу заставить его показать полное изображение в контейнере. я вижу, что изображение увеличено на картинке.

.section1{
    background-image: url(section1.jpg);
    height: 600px;
    width: 100%;
    overflow: hidden;
    object-fit: cover;
}
<section>
    <div class="section1">

    </div>
</section>

Ответы [ 2 ]

0 голосов
/ 21 апреля 2020

Попробуйте это. background-size:contain;

<html>

<head>
    <title>Javascript</title>
    <style>
        .section1{
    background-image: url('../Downloads/1.jpg');
    height: 600px;
    width: 100%;
background-size:contain;
}
    </style>
</head>

<body>
    <section>
        <div class="section1">

        </div>
    </section>

</body>

</html>
0 голосов
/ 21 апреля 2020
.section1{
    background-image: url(section1.jpg);
    height: 600px;
    width: 100%;
    overflow: hidden;
    object-fit: contain;
}

Измените подгонку объекта, чтобы он содержал, покажет все изображение.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...