Hoewel HyperText Markup Language( HTML) een tag biedt die een horizontale deler maakt, is er geen equivalent element dat een verticale lijn maakt. Er ontstaat vaak een behoefte aan een verticale vorm, dus dit creëert een dilemma. Gelukkig hebt u de mogelijkheid om een ​​tijdelijke oplossing te gebruiken die een HTML-tabel bevat en Cascading Style Sheets( CSS) -code op een rand toepast. Begrijp hoe u de HTML-code maakt en pas de CSS-regel toe die met succes een verticale, ononderbroken lijn maakt.

-instructies

  1. Start de teksteditor-software voor het Kladblok die bij uw Windows-computer wordt geleverd en open een websitedocument.

  2. Plaats uw cursor in het gewenste gebied waar u de ononderbroken lijn wilt weergeven. Voer de HTML-code in die een eenvoudige tabel maakt:

    & lt; table & gt;

    & lt; tr & gt;

    & lt; td & gt; & lt; / td & gt;

    & lt; / tr & gt;

    & lt; / table & gt;

  3. Typ de volgende code vóór het sluiten van

    de "& lt; / head & gt;"element om uw CSS-stijlregel voor uw tabel te maken:

    & lt; style type = "text / css" & gt;

    & lt;! -

    -tabel{ }

    - & gt;

    & lt; / style & gt;

  4. Voer "border-left:;" inof "border-right:;"tussen de accolades om te bepalen of uw lijn links of rechts wordt weergegeven en voer 'solid' achter de dubbele punt in om op te geven hoe uw lijn eruit zou moeten zien. Typ een getal in pixels( px) om te bepalen hoe breed de verticale lijn is en voer een kleur in, bijvoorbeeld zwart, om de schaduw van de lijn op te geven. Ter illustratie:

    -tabel{ border-left: 1px solid black;}

  5. Type "height:;"en typ een getalswaarde in pixels( px) of percentage( %) om te bepalen hoe lang de regel is. Bijvoorbeeld:

    -tabel{ border-left: 1px solid black;hoogte: 300 px;}

  6. Sla uw bestand op. Open het in een browservenster door te klikken op de "Openen" of "Bestand openen" optie onder het menu "Bestand" van de browser. Als u tevreden bent met de verticale lijn, uploadt u het bestand naar uw webhost om het te publiceren. Anders kunt u de waarden in uw stijlregel aanpassen voordat u deze opslaat en uploadt naar uw host.

Bronnen

  • Tizag: CSS-zelfstudie - rand
  • World Wide Web Consortium( W3C): doosmodel
  • World Wide Web Consortium( W3C): te beginnen met HTML + CSS