0

Css Background-size プロパティ、カバーが機能しない1 つの画像要素 (.info-image) と 1 つのコンテンツ要素 (.info-content)、基本的に 2 つの div をラップするために #home-info コンテナーを使用し、両方に 50% の幅を与えましたそして、それは親コンテナです。つまり、#home-info の高さは 450px です。背景画像を最初の要素、つまり .info-image に指定しようとすると、画像が引き伸ばされます。css cover または contains プロパティを使用すると、背景画像がまったく表示されません。

 #home-info{
    height: 400px;
}

#home-info .info-img{
    float: left;
    width: 50%;
    background: url('../image/lc.jpg') no-repeat;
    min-height: 100%;
}

#home-info .info-content{
    float: right;
    width: 50%;
    height: 100%;
    text-align: center;
    padding: 50px 30px;
    overflow: hidden;
}

#home-info .info-content p {
    padding-bottom: 30px;
}
4

0 に答える 0