Als u geïnteresseerd bent om te leren hoe u een afbeelding rechts van de tekst kunt laten zweven, zult u blij zijn te weten dat dit een vrij eenvoudige taak is. Er zijn veel situaties waarin programmeurs willen dat een afbeelding op een webpagina binnen in de tekst verschijnt met de tekst eromheen of eromheen gewikkeld. Gelukkig is het manipuleren van afbeeldingen vergelijkbaar met het manipuleren van tekst, dus als je ervaring hebt met de laatste, zou dit proces helemaal niet moeilijk moeten zijn.
In feite, met de CSS float-eigenschap, is het eenvoudig om je afbeelding rechts van de tekst te laten zweven en de tekst eromheen aan de linkerkant te laten stromen. Gebruik deze zelfstudie van vijf minuten om te leren hoe.
Ermee beginnen
Begin met het schrijven van een alinea met tekst en voeg een afbeelding aan het begin van de alinea toe. Dit moet vóór de tekst worden gedaan, maar na de
label):
Voeg vervolgens een stijlkenmerk toe aan de afbeelding en pas de eigenschap float toe:
Uw tekst wordt tegen de afbeelding in geramd, dus voeg wat marges toe aan de afbeelding om het lezen te vergemakkelijken:
De marge-verkorte eigenschap past marges toe in de volgorde boven, rechts, onder en links (TRBL). En dat doet het. Nu zie je dat een afbeelding naar rechts duwen helemaal niet moeilijk is. Mogelijk bent u ook geïnteresseerd in een afbeelding naar links zwevend en zwevend naar het midden. Hoewel de eerste zet mogelijk is, kunt u helaas geen afbeelding zwevend maken naar het midden, omdat daarvoor meestal een lay-out met twee kolommen nodig is.
Afsluiten
