Wie haben Sie ein Bild in der einen Hälfte und einen Textbehälter in der anderen Hälfte?

Question

Ich mache gerade eine einfache Website, aber ich muss ein Bild haben, das eine Hälfte eines Abschnitts und einen Text auf der anderen Seite abdeckt. Wie mache ich das? Jede Hilfe wäre willkommen. Danke

Answer 1

Sie können das IMG in einen Abschnitt oder Div einfügen, und dann einfach einige CSS anwenden, um das Bild auf der linken Seite zu schweben.

Hinzufügen width: 50%; macht die img Breite die Hälfte davon übergeordneten div (in diesem Fall <section>)

Hier ist eine hervorragende aufzuschreiben darauf: clicky.

Hier ist mein Arbeits jsfiddle: clicky

HTML:

<section> 
    <div> 
    <img class="floatLeft" src="https://pbs.twimg.com/profile_images/457164810052857856/cXNMHcHF.jpeg"> 
    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do... 
    </div> 
</section> 

CSS:

.floatLeft { 
    float:left; 
    width: 50%; 
}