@html_css_tips profile picture
Zelfstudiehandboek @html_css_tips

Stap in bij de carrousel met iedere dag een tip bij het Zelfstudiehandboek Websites Ontwikkelen met HTML, CSS en Dreamweaver.

Joined May 2009
  • Tweets 913
  • Following 42
  • Followers 134
Photos and videos
Een block element centreer je horizontaal met margin:auto. Met text-align:center centreer je de inhoud van een element (en deze overerft!).
1
Een block-level-parent rekt standaard niet mee met zijn ingesloten floated block. Een parent met float of overflow:hidden rekt wel mee.
Floated blocks staan niet meer in de flow van de pagina, ze zweven erboven. De block-level elementen in de pagina negeren de floated blocks
Terminologie uit mijn boek: containing block is de (grand)parent ten opzichte waarvan een element absoluut gepositioneerd staat.
Meer weten over inline en block elementen? jt.ws/cn
Een inline element kan slechts inline elementen insluiten. Inline heet ook wel text-level. Tekst is ook inline: alle letters naast elkaar.
In CSS kan je met de eigenschap display een block-level element veranderen in inline of inline-block en andersom.
Inline elementen zijn zo breed als hun inhoud en staan naast elkaar. Width of height geven heeft geen zin. Bijv a, br, em, strong, span.
Je kunt elementen verdelen in 2 groepen: inline en block. Inline elementen staan naast elkaar, block elementen beginnen op een nieuwe regel.
Beter om een element met een width geen padding en borders te geven maar aan de inhoud ervan. Let er dan wel op dat deze geen width krijgt.
Top en bottom marges van aangrenzende blocks overlappen elkaar, je ziet dus geen verschil als je een van beide marges op 0 zet.
Gebruik altijd procenten voor de lettergrootte zodat ook lezers met oudere browsers een grotere letter kunnen instellen.
Structureer je tekst met alinea's. Browsers geven deze standaard witruimte met margin-top en -bottom.
Het element em benadrukt tekst en is dus betekenisvol voor Google en screenreaders. Deze zien het element i als vormgeving en betekenisloos.
Het gekozen font en color van de body gelden in beginsel voor de hele inhoud. Geef dit daarom pas in voor andere elementen als het afwijkt.
Kies in de voorkeuren van Dreamweaver om CSS te schrijven in steno. Bijv. margin: 0 10px 0 20px ipv voor iedere kant een aparte declaratie.
Geef een webpagina bij voorkeur geen vaste hoogte maar laat de inhoud de hoogte bepalen. Een min-height kan wel.
Als je geen tooltip wilt zien in IE, plaats dan een leeg attribuut title. Dat ziet er zo uit: title="".
Voorkom onnodige informatie die de screenreader moet voorlezen: laat het attribuut alt liever leeg als de afbeelding slechts illustratief is
De lettergrootte van de lezer bepaalt hoeveel letters er op een regel passen. Een regeleinde (break) kan daardoor net verkeerd uitkomen.
Load more