Bietet CSS3 eine Eigenschaft "Mindestgröße" für "Hintergrund"?

Ich bin mit

background-size: 100%;

Passt mein hintergrund Bild (im body-tag), um das browser-Fenster.

Aber es ist ein CSS3-background-Eigenschaft, um eine Mindest-Größe?

Oder muss ich in ein paar div-"trick" wie:

<div id="bg">
    <img src="images/bg.jpg" alt="">
</div>

#bg {
    position:fixed;
    top:-50%;
    left:-50%;
    width:200%;
    height:200%;
}
#bg img {
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    margin:auto;
    min-width:50%;
    min-height:50%;
}

InformationsquelleAutor der Frage francisMi | 2012-05-21

  1. 28

    Ich denke, Sie sind auf der Suche für 

    background-size: contain;

    ODER 

    background-size: cover;

    Dem Unterschied, dass cover gibt an, dass das Bild im hintergrund sollte so klein wie möglich, während das Seitenverhältnis beibehalten wird. contain auf der anderen Seite gibt an, dass das Bild im hintergrund sollte so groß wie möglich.

    Finden Sie in der MDN-Dokumentation hier.

    InformationsquelleAutor der Antwort Rab

  2. 3

    Wie über das hinzufügen dieser: 

    @media screen and (max-width:700px){
    #bg img { width: 500px; /* fixed width under 700px */}
}

    InformationsquelleAutor der Antwort mzvarik

Schreibe einen Kommentar