Tekst en afbeeldingen in HTML uitlijnen

Om iets in HTML uit te lijnen, vereisen de toepasselijke codes het gebruik van de "Cascading style sheets" (CSS, voor het acroniem in het Engels). Maar niet alle websites staan u toe de stijl van de bladen aan te passen, zodat u de delen van uw webpagina op de juiste manier kunt uitlijnen. Ontdek hoe u iets in HTML uitlijnt zodat het wordt weergegeven zoals u dat wilt, zelfs wanneer u geen stijlpagina aan de website kunt toevoegen om dit te doen. Deze techniek wordt CSS "uitgelijnd" genoemd.

Inhoud

Stappen
Methode 1
Methode 2
Tips

stappen

Methode 1

Lijn de tekst uit met HTML

Titel afbeelding Align Something in HTML Step 1

Omcirkel elke sectie die de uitlijning met de "div" -code heeft veranderd. Dit betekent dat u de "div" -code moet toevoegen in de symbolen "less than" en "greater than" (<>) vóór de eerste HTML-code waarvan de uitlijning is gewijzigd en voeg de "/ div" -code in deze symbolen toe na de laatste HTML-code waarvan de uitlijning is gewijzigd.

Titel afbeelding Align Something in HTML Step 2

Bepaal hoe u de uitlijning van de tekst in die "div" -code moet wijzigen.

Titel afbeelding Align Something in HTML Step 3

Als u de tekst links moet uitlijnen, wijzigt u de "div" -code zodat de volgende tekst zich binnen de symbolen bevindt "<> ": div style = `text-align: left`.

Als u de tekst rechts moet uitlijnen, wijzigt u de "div" -code in "div style = `text-align: right`" tussen de symbolen "<> "

Als u de tekst in het midden moet uitlijnen, wijzigt u de "div" -code in "div style = `text-align: center`" tussen de symbolen "<> "

Als u de tekst moet motiveren, wijzigt u de code "div" in "div style = `text-align: justify`" tussen de symbolen "<> "

Titel afbeelding Align Something in HTML Step 4

Sla uw wijzigingen op

Titel afbeelding Align Something in HTML Step 5

Controleer het uiterlijk van de inhoud om te controleren of alles in orde is.

Als het niet werkt, heeft de website een specifieke code in de stijlpagina die de "div" -code ongeldig maakt. Om de stylesheet website overschrijven moet u de juiste versie van "style = `text-align: right`" toe te voegen in de opening code van elk item om hun uitlijning veranderd. Een "p" -code zou bijvoorbeeld "p style = `text-align: right`" worden tussen de symbolen "<> "

Titel afbeelding Align Something in HTML Step 6

Geniet van het kijken naar de tekst precies zoals u het wilde.

Methode 2

Afbeeldingen uitlijnen met HTML

Titel afbeelding Align Something in HTML Step 7

Zoek de HTML-code voor de afbeelding die u wilt uitlijnen.

Titel afbeelding Align Something in HTML Step 8

Bewerk de "img" -code om de juiste "float" -eigenschap toe te voegen.

Als u het beeld nodig is gepositioneerd om links toe te voegen "style =" float: left ` "de code, zoals in" img style = "float: left` `tussen de symbolen"<> "

Als u de afbeelding is gepositioneerd om de juiste, voegt "style =" float: right ` "de code, zoals in" img style = "float: right` `tussen de symbolen"<> "

Als u de afbeelding in het midden moet plaatsen, is de code een beetje ingewikkelder. Er is geen "float: center" bezit, dan moet je toevoegen: "style =" align: center-text-align: center ` "de code, zoals in" img style =` align: center-text-align: center ` " , tussen de symbolen "<> "

Titel afbeelding Align Something in HTML Step 9

Bewaar uw code

Titel afbeelding Align Something in HTML Step 10

Geniet van de uitgelijnde afbeeldingen.

tips

Misschien heb je de code "p align = `center`" (tussen <>) om de uitlijning van de tekst te wijzigen. Vermijd dit omdat het verouderd is, en het is slechts een kwestie van tijd voordat het niet meer compatibel is in de meeste browsers.
De instructies voor het uitlijnen van afbeeldingen met HTML stellen u ook in staat om secties uit te lijnen met HTML. Omring de sectie met de "div" -codes, zoals in de instructies voor het uitlijnen van teksten met HTML. Voeg de "float" -eigenschap toe aan de "div" -code zoals u doet voor de "img" -code in de richtingen van de uitlijning van de afbeelding.
Als de code de wijziging niet correct weergeeft, is het mogelijk dat op de website een filter is geïnstalleerd om alle HTML-codes ongeldig te maken. Het is echter ook mogelijk dat de code een puntkomma, een hoofd- of klein symbool, een citaat of iets anders waardoor de code niet werkt, mist. Controleer dit, om met zekerheid te weten of u de codes correct toepast of niet.

Delen op sociale netwerken:

Verwant