Sette inn en vertikal linje med KompoZer
HTML, språket webområdeeiere bruke til å lage websider, ikke har tegneverktøy. Hvis Webdesignere ønsker å lage grafikk som sirkler eller linjer, må bruke skriptspråk til å utføre denne oppgaven. Hvis siden din trenger en vertikal linje, kan du bruke en enkel CSS triks for å konvertere en horisontal linje element i en linje som beveger seg fra topp til bunn på websiden.
Bruksanvisning
1 Start KompoZer og trykk "Ctrl" og "N." "Opprett et nytt dokument" åpnes. Klikk "Opprett et XHTML-dokument," og deretter "Opprett".
2 Klikk på "Source" -knappen nederst KompoZer. Koden for en tom HTML-dokument vises. Lim inn følgende HTML-kode i dokumentet "<body>" -delen:
<Hr class = "line" />
Dette skaper en horisontal linje element som refererer til en CSS-klasse som heter "linje." Horisontale regler lage linjer som går fra venstre til høyre over en webside.
3 Kopier følgende tekst, og lim den inn i dokumentet "<head>" -delen:
<Style type = "text / css">
.line {position: absolute; top: 100px; venstre: 200px; height: 300px; bredde: 2 piksler;
</ Style>
Denne CSS-klasse som heter "line" definerer den horisontale regelvisningsegenskaper. Ved å sette breddeverdien til 2 piksler, tvinger du nettlesere for å lage en vertikal linje. Verdiene for topp og bredde avgjør hvor den vertikale linje vises på websiden. Høyden attributtet angir linjens høyde.
4 Trykk "Ctrl" og "S" for å åpne "Lagre side som" -vinduet. Skriv inn et navn for HTML-filen i "File Name" tekstboksen, og klikk deretter på "Lagre" for å lagre dokumentet på din harddisk.
5 Åpne dokumentet i nettleseren din. Du vil se en vertikal linje plassert på stedet definert av verdiene av de beste og venstre som er definert i CSS-klasse.
Hint
- Prøv ulike verdier for de beste og venstre verdier i CSS "linje" klassedefinisjon. Endre disse verdiene kan du plassere linjen hvor som helst på websiden. For å gjøre lengre linjer, øke verdien av høyde. Reduser verdien for å skape kortere linjer.