Responsives Hintergrundbild ohne Medienabfragen

Question

Ich brauche eine Anleitung, um ein Responsive-Hintergrundbild für eine Admin-Seite zu erstellen, ohne Medienabfragen zu verwenden. Das Hintergrundbild muss ohne Dehnung auf das Browserfenster reagieren.

ähnlich diesen example page

I Bootstrap 3.3.6 mit dieser Seite zu bauen. Die Admin-Anmeldeseite ist als geteilter Bildschirm unterteilt.

• linken Seite Bereich anmelden
• der rechten Seite ein Hintergrundbild mit Textinhalt oben ist.

http://www.r1.jxt.com.au/Admin/login.aspx?ReturnURL=~%2fadmin%2fdefault.aspx

Ich brauche die Führung alles, was ich werde über die dies möglich gemacht zu bekommen. Vielen Dank!

Answer 1

Sie sollten Ihre .bg-image Klasse ändern mit folgenden:

.bg-image { 
    background: url(../img/bg-image-md.jpg) no-repeat center center; 
    background-size: cover; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
} 

Answer 2

etwas hier zum Einstieg: http://codepen.io/panchroma/pen/BKdgKP

.bg-image{ 
background-image: url(http://images.jxt.net.au/jxt-admin/img/bg-image-lg.jpg); 
background-size:cover; 
background-position:50% 0 ; 
} 

Verwenden Sie die Hintergrund-size-Eigenschaft mit dem Wert von entweder Abdeckung oder enthalten, und positionieren Sie das Hintergrundbild wie gewünscht.

More info on the background-size property