Vytváření mezer a fyzické oddělení prvků v HTML může být pro začátečníka webu obtížné pochopit. Důvodem je to, že kód HTML má vlastnost známou jako "sbalení mezery". ať už zadejte 1 nebo 100 znaků v kódu HTML, webový prohlížeč automaticky sbalí tyto mezery pouze na jediný prostor. To se liší od programu, jako je Microsoft Word, který umožňuje tvůrcům dokumentů přidávat více míst k odděleným slovům a dalším prvkům daného dokumentu. Tímto způsobem funguje rozložení návrhů webových stránek.
Takže, jak přidáte mezery ve formátu HTML, které se zobrazí na webové stránce? Tento článek zkoumá některé z různých způsobů.
Prostor ve formátu HTML s CSS
Upřednostňovaný způsob přidávání mezer ve vašem kódu HTML je s kaskádovými styly (CSS). CSS by mělo být použito k přidání jakýchkoli vizuálních aspektů webové stránky a vzhledem k tomu, že rozteč je součástí vizuálních designových vlastností stránky, CSS je místo, kde to chcete udělat.
V CSS můžete použít buď okrajové nebo polstrování vlastnosti přidat prostor kolem prvků. Navíc vlastnost text-odsazení přidává prostor do přední části textu, například pro odsazení odstavců.
Zde je příklad, jak pomocí CSS přidat prostor před všechny vaše odstavce. Přidejte následující CSS do vašeho externího nebo interního stylu:
p {textová odrážka: 3em;} Pokud chcete přidat pouze další prostor nebo dva text, můžete použít neporušený prostor. Tato postava funguje stejně jako standardní prostorová charakteristika, ale v prohlížeči se nezhromažďuje. Zde je příklad, jak přidat pět mezery uvnitř řádku textu: Tento text má pět dalších prostorů uvnitř Používá HTML: Tento text má pět dalších prostorů uvnitř Můžete také použít Tato věta má pět řádkových přestávek na konci Zatímco tyto možnosti fungují, element nerozbitných prostorů skutečně přidá odstup k textu a přerušení řádku přidá odstup pod výše uvedeným odstavcem - nejedná se o nejlepší způsob, jak vytvořit prostor na vaší webové stránce. Přidáním těchto prvků do kódu HTML se do kódu přidávají vizuální informace namísto oddělení struktury stránky (HTML) od vizuálních stylů (CSS). Nejlepší postupy diktují, že by měly být odděleny z mnoha důvodů, včetně snadné aktualizace v budoucnu a celkové velikosti a výkonnosti stránky. Používáte-li externí stylový štítek, abyste diktovali všechny styly a rozestupy, pak je snadné změnit tyto styly pro celý web, protože jednoduše musíte aktualizovat ten stylový list. Zvažte příklad výše věty s pěti Namísto přidání prvků odstupu do kódu použijte CSS. p {padding-bottom: 20px;} Ten řádek CSS by přidal odstup pod odstavce stránky. Pokud jste chtěli v budoucnu změnit toto rozložení, upravte tento jeden řádek (místo celého kódu vašeho webu) a vy byste měli jít! Nyní, pokud potřebujete přidat jednu oblast do jedné části vašeho webu, použijte a Prostory v HTML: uvnitř textu
tag pro přidání dalších oddělených řádků.
Proč je rozložení ve formátu HTML špatným nápadem
tagy na konci. Pokud byste chtěli, aby to bylo v dolní části každého odstavce, musíte přidat tento kód HTML do každého odstavce na vašem webu. To je spousta dalších značek, které vám naplní vaše stránky. Dále, pokud se rozhodnete, že tato vzdálenost je příliš nebo příliš málo a chcete ji trochu změnit, budete muset upravit celý odstavec na celé své webové stránce. Ne, děkuji!
značka nebo jediný nerozbitný prostor není konec světa, ale musíte být opatrní. Pomocí těchto vložených možností rozestupu HTML může být kluzká sklon. Zatímco jeden nebo dva nemusí škodit vašemu webu, pokud pokračujete touto cestou, představíte problémy na svých stránkách. Nakonec je lepší se obrátit na CSS pro rozestup HTML a všechny další vizuální potřeby webových stránek.