Inhoud

• routebeschrijving
• Hoe de tekst uit te lijnen
• links {
• juiste {
• centrum {
• Hoe divisies, contouren en lichaamsdelen te centraliseren
• tips
• Wat je nodig hebt

In plaats van de HTML-uitlijnattributen in de HTML-tags die de tekst markeren te gebruiken, is het beter voor webontwerpers om presentatie-informatie (uitlijningsopties) over te brengen naar de stijlpagina. Dit artikel legt uit hoe tekst moet worden uitgelijnd en hoe grotere pagina-elementen, zoals divisies, moeten worden gecentreerd.

routebeschrijving

Met stijlbladen kunt u meer uitlijnen en centreren dan de tekst (website layout afbeelding door 6922Designer van Fotolia.com)

Hoe de tekst uit te lijnen

1. Als u tekst in een normaal tekstblok wilt uitlijnen, zoals een alinea of ​​citaat, gebruikt u de eigenschap text-align.

2. De waarde-opties voor de eigenschap text-align zijn links, rechts, midden en uitvullen. Omdat verantwoorde tekst niet erg leesbaar is op het web, toont de illustratie alleen de linker-, rechter- en middelste uitlijning. In deze illustratie heeft elke alinea een zwarte rand om de grootte van het blokelement op de pagina aan te tonen als er geen breedteaanpassing op het element wordt toegepast.

3. Meestal wordt een element toegewezen aan een ID of klasse. Tekstuitlijning voor items in deze ID of klasse wordt gedefinieerd met een regel, zoals de volgende:

   
   

   links {

   text-align: left; }

   juiste {

   text-align: right; }

   centrum {

   text-align: center; }

Hoe divisies, contouren en lichaamsdelen te centraliseren

1. Misschien wilt u een hele lay-out of een grote lay-out centreren. In deze gevallen wordt een andere CSS-techniek gebruikt.

2. U past de CSS-regel toe op de selector van het grootste element dat u wilt centreren. Het kan het lichaamselement, een grensdivisie of een containerdeling zijn.

3. Centrering volgens deze methode heeft geen invloed op de uitlijning van tekst. Het gecentreerde element behoudt de standaarduitlijning links van de tekst binnen het gecentreerde element.

4. Het volgende is een illustratie van een geheel lichaamselement (met een zwarte rand voor de duidelijkheid) gecentreerd op een pagina. Er moet een breedte worden ingesteld voor het element en de linker- en rechtermarges worden ingesteld op automatisch. Dit gebeurt als volgt:

   
   

   lichaam {breedte: 80%; margin-right: auto; marge links: auto; rand: 1px effen zwart; }

tips

• Normaal gesproken hoeft u align-left niet te gebruiken, omdat left alignment de standaardinstelling is.U moet er echter rekening mee houden dat het bestaat, als u eerder gecentraliseerde of rechts uitgelijnde tekst later opnieuw moet instellen op de standaardinstelling. De breedte van het te centreren element kan worden gedefinieerd in pixels, percentages of ems.

Wat je nodig hebt

• Teksteditor
• HTML-editor
• Basic HTML-kennis