immagine di sfondo di sfondo

Voglio il logo della mia pagina nell'angolo in alto a sinistra circondato da uno sfondo nero. Tuttavia, il colore di sfondo non copre l'area a destra dell'immagine. Sto usando HTML e CSS.immagine di sfondo di sfondo

Questo è il mio codice:

#title { 
 
    width: 100%; 
 
    height: 100%; 
 
    background-color: black; 
 
} 
 
#title img { 
 
    width: 50%; 
 
    height: 50%; 
 
}

<!DOCTYPE html> 
 
<html> 
 
<link rel="stylesheet" type="text/css" href="index.css" media="screen" /> 
 

 
<body> 
 
    <div id="title"> 
 
    <a href="index.html"> 
 
     <img src="http://i.stack.imgur.com/WE2r4.png" align="left" /> 
 
    </a> 
 
    </div> 
 
</body> 
 

 
</html>

fonte

2015-07-11 Pauline Borlongan

Rimuovere align="left" attributo. Esso agisce simile come se faceste immagine float: left, tuttavia è mai chiaro il galleggiante dopo così i crolli genitore e semplicemente non si può vedere di fondo:

#title { 
 
    width: 100%; 
 
    height: 100%; 
 
    background-color: black; 
 
} 
 
#title img { 
 
    width: 50%; 
 
    height: 50%; 
 
}

<!DOCTYPE html> 
 
<html> 
 
<link rel="stylesheet" type="text/css" href="index.css" media="screen" /> 
 

 
<body> 
 
    <div id="title"> 
 
    <a href="index.html"> 
 
     <img src="http://i.stack.imgur.com/WE2r4.png" /> 
 
    </a> 
 
    </div> 
 
</body> 
 

 
</html>

Se si vuole fare il marchio sinistra -allegato dovresti usare text-align: left del #title, funzionerà correttamente perché img è inline-block di default.

fonte

2015-07-11 07:46:27 dfsq

si deve aggiungere una regola di visualizzazione per il vostro elemento titolo in modo che in realtà ottiene un posizionamento nel flusso:

#title { 
 
    display: inline-block; 
 
    width: 100%; 
 
    height: 100%; 
 
    background-color: black; 
 
} 
 
#title img { 
 
    width: 50%; 
 
    height: 50%; 
 
}

<!DOCTYPE html> 
 
<html> 
 
<link rel="stylesheet" type="text/css" href="index.css" media="screen" /> 
 

 
<body> 
 
    <div id="title"> 
 
    <a href="index.html"> 
 
     <img src="http://i.stack.imgur.com/WE2r4.png" align="left" /> 
 
    </a> 
 
    </div> 
 
</body> 
 

 
</html>

fonte

2015-07-11 07:46:42 arkascha

immagine di sfondo di sfondo

risposta

Problemi correlati