En webside coder bruger Hypertext Markup Language at kunne fortælle web browser funktionelle formål af hvert element på en side, såsom et afsnit , overskrift eller en liste . Siden HTML 4 , har Cascading Style Sheets forudsat koderen med en måde at fortælle browseren, hvordan hver af disse elementer bør se , adskilt fra at definere, hvad de er. En side kan have forskellige CSS stilarter til forskellige typer af enheder, såsom mobiltelefoner og stationære computere , så sidens udseende kan ændres uden koderen behøver at ændre HTML. Brug CSS egenskaber at centrere et billede. Instruktioner
1
Place de " img " tag i HTML-filen , hvor du ønsker dit billede at vise på websiden . Det skal være mellem " krop " tags og efter " H1" tags. For eksempel , Dette
er din tekst.
< img src = " photo.jpg " alt = " En beskrivelse af billedet " width = " 270 " height = " 50" />
< /body >
definerer et billede, opkaldt photo.jpg der er 170 pixels bred og 50 pixels høj . Det er den første ting på siden efter den øverste overskrift.
2
Brug " margin " CSS attribut til at definere rummet omkring sideelementer såsom billeder. "Auto " value for margenen attribut fortæller webbrowseren til automatisk at bestemme den mængde plads . Så
definerer, at rummet omkring billedet er bestemt af browseren.
3
Brug " display " ejendom for at definere, hvordan en side element vises. Den " block " value for display egenskaben fortæller webbrowseren for at vise element på sin egen linje , med plads over og under det. Så < img src = " photo.jpg " alt = " En beskrivelse af billedet " width = " 170 " height = "50" style = " margin : auto ; display : block; " /> definerer det samme billede , men tilføjelsen af ". display : block; " nu placerer den på sin egen linje
4
Se websiden i flere forskellige browsere til at kontrollere, at billedet er centreret korrekt.