Ho un'immagine vettoriale in scala e voglio riempire un contenitore. Ci sono un paio di queste domande su SO, anche se sono un po 'vecchie. Per esempio. Stretch and scale CSS backgroundCome ottenere l'immagine di sfondo/l'immagine da allungare per riempire il contenitore tramite CSS?
Tuttavia, quando ho tentato di implementare tali soluzioni i risultati sono stati deludenti.
Per esempio:
body {
margin: 0;
padding: 0;
text-align: center;
color: #000;
background-color: #000
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 100%;
}
...
.twoColLiqLtHdr #container {
width: 80%;
margin: 0 auto;
border: 2px solid #000000;
text-align: left;
background-color: #003;
background-image: url('background_image.svg');
/*background-position: 80% 80%; */
background-repeat: no-repeat;
color: #000;
font-family: "Times", cursive;
background-attachment:fixed;
min-height:100%;
/*top: 0;
left: 0; */
}
Ho provato diversi regimi, ma non riesco a farlo allungare senza lasciare aree vuote (ripetendo è un successo di sorta, ma sembra orribile).
Tuttavia, dal momento che sto lavorando con un svg sto mi avvicino a questo in modo forse errato, dovrei usare un tag svg xmlns nell'html, invece? (P.S. Sono consapevole di assoluta incapacità di IE8 per gestire SVG)
Grazie. copertura copre con successo il contenitore. Tuttavia, e stranamente, l'immagine è troppo "ingrandita", in modo tale che solo la metà superiore dell'immagine sia visibile. o.O Come ho fissato l'immagine non è possibile vedere il resto dell'immagine ... – user137263
Non è necessario 'background-attachment: fixed;' più, poiché coprirà l'intera altezza! – Giona
Mi sconcerta un po ', ma l'immagine di sfondo sembra scomparire del tutto quando non è più fissata! : p – user137263