Ačkoli HyperText Markup Language( HTML) poskytuje značku, která vytváří horizontální dělič, neexistuje ekvivalentní prvek, který vytváří svislou čáru. Vyvstává potřeba vertikálního tvaru, což vytváří dilema. Naštěstí máte možnost použít řešení, které obsahuje tabulku HTML a použije k okraji kód kaskádových stylů( CSS).Pochopte, jak vytvořit kód HTML a použít pravidlo CSS, které úspěšně vytváří vertikální, pevnou linku.

Instrukce

  1. Spusťte software textového editoru Poznámkový blok, který je dodáván s počítačem se systémem Windows a otevřete dokument webových stránek.

  2. Umístěte kurzor na požadovanou oblast, kde chcete, aby se zobrazila plná čára. Zadejte kód HTML, který vytvoří jednoduchou tabulku:

    & lt; table & gt;

    & lt;

    & lt; / RTI & gt;

    & lt; / tr & gt;

    & lt; / table & gt;

  3. Před uzavřením "& lt; / head & gt;" zadejte následující kód:element pro vytvoření pravidla stylu CSS pro vaši tabulku:

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

    & lt;! - tabulka

    { }

    - & gt;

    & lt; / style & gt;

  4. Zadejte "border-left:;"nebo "okraj-doprava:;"mezi zkroucenými hranatými závorkami zjistěte, zda se vaše řádek zobrazuje vlevo nebo vpravo, a za dvojtečkou zadejte "solidní", abyste určili, jak se má vaše řádek zobrazovat. Zadejte číslo v pixelech( px), abyste zjistili, jak široká je svislá čára, a zadejte barvu, například černé, abyste určili odstín linky. Pro ilustraci: tabulka

    { border-left: 1px solid black;}

  5. Typ "výška:;"a zadejte číselnou hodnotu v pixelech( px) nebo procentuální( %), abyste zjistili, jak dlouho je čára. Příklad: tabulka

    { border-left: 1px solid black;výška: 300px;}

  6. Uložte soubor. Otevřete jej v okně prohlížeče kliknutím na volbu "Otevřít" nebo "Otevřít soubor" v nabídce "Soubor" prohlížeče. Pokud jste spokojeni se svislou čárou, nahrát soubor na webový hostitel a publikovat ho. V opačném případě proveďte úpravy hodnot v pravidle vašeho stylu před uložením a nahráním do vašeho hostitele. Zdroje

  • Tizag: CSS výuka - hranice
  • Konzervaci World Wide Web( W3C): Box Model
  • Konzervaci World Wide Web( W3C): Počínaje HTML + CSS