CSS Sfondo Repeat

Question

C'è un modo per fare un tratto immagine di sfondo, piuttosto che ripetere?

Answer 1

Non utilizzando qualsiasi tipo di cross-browser CSS compatibile (c'è la proprietà background-size comunque.)

Se questo è diretto a qualsiasi browser, in particolare, potrebbe essere possibile. In caso contrario, sarà necessario utilizzare un <img> e allungare quella.

Ecco come si fa in questi browser:

body {
    background-image: url(bg.jpg);
    -moz-background-size: 100% 100%;     /* Gecko 1.9.2 (Firefox 3.6) */
    -o-background-size: 100% 100%;       /* Opera 9.5 */
    -webkit-background-size: 100% 100%;  /* Safari 3.0 */
    -khtml-background-size: 100% 100%;   /* Konqueror 3.5.4 */
}

In caso contrario, utilizzando un <img>:

img#background {
    /* height: 100%; Note: to keep ratio, don't use height */
    left: 0;
    position: fixed; /* or absolute, if you like */
    top: 0;
    z-index: -1;
    width: 100%;
}

Answer 2

Solo in CSS3

Si potrebbe usare un'immagine ed impostare la sua larghezza e altezza di 100%, z-index a posizione -1 a assoluta. Che potrebbe funzionare.

Answer 3

background-size è CSS3 e non ancora supportato. Si potrebbe dare un'occhiata a questo articolo: come si fa allungare un'immagine di sfondo in un Pagina Web

Spero che questo aiuti.

Answer 4

body
{ 
background-image:url('smiley.gif');
background-repeat:no-repeat;
background-attachment:fixed;
background-position:center; 
}

http://www.w3schools.com/css/css_background.asp

Questo non sarà streach vostra immagine, ma renderà l'immagine non ripetere.