Ako a kedy používať značku zdôraznenia v HTML

click fraud protection

Jedna zo značiek, ktorú sa naučíte na začiatku svojho pôsobenia vzhľad stránky vzdelávanie je pár značiek označovaných ako „značky zvýraznenia“. Poďme sa pozrieť na to, čo sú tieto značky a ako sa dnes používajú vo webdizajne.

Späť na XHTML

Ak ste sa naučili HTML pred rokmi, ďaleko pred vznikom HTML5, pravdepodobne ste použili značky tučné aj kurzíva. Ako by ste čakali, tieto značky zmenili prvky na tučný alebo kurzívou. Problém s týmito značkami a to, prečo boli odsunuté nabok v prospech nových prvkov (na ktoré sa pozrieme čoskoro), je ten, že nejde o sémantické prvky. Je to tak preto, lebo definujú skôr to, ako má text vyzerať, ako informácie o ňom. Pamätajte, že HTML (to je miesto, kde by sa tieto značky mohli písať) je predovšetkým o štruktúre, nie o vizuálnom štýle! Vizuál spracováva CSS a podľa osvedčených postupov v oblasti webdizajnu by ste mali mať na svojich webových stránkach zreteľné oddelenie štýlu a štruktúry. To znamená nepoužívať prvky, ktoré nie sú sémantické a ktoré skôr vyzerajú ako štruktúrujú. To je dôvod, prečo odvážne a

instagram viewer
kurzíva značky boli zvyčajne nahradené výrazom strong (tučné písmo) a dôrazom (kurzíva).

a

Silné a dôrazové prvky pridávajú do vášho textu informácie, ktoré podrobne popisujú obsah, s ktorým by sa malo zaobchádzať odlišne, a zdôrazniť ich pri vyslovení. Tieto prvky používate takmer rovnako, ako by ste v minulosti používali tučné a kurzíva. Jednoducho obklopte svoj text otváracou a záverečnou značkou ( a pre dôraz a a pre silné zvýraznenie) a priložený text bude zvýraznený.

Tieto značky môžete vnoriť a nezáleží na tom, ktorá je externá značka. Tu je niekoľko príkladov.

Tento text je zdôraznený a väčšina prehliadačov by to zobrazila kurzívou. 
Tento text je dôrazne zdôraznený a väčšina prehliadačov by ho zobrazila tučným písmom. 

V obidvoch týchto príkladoch nediktujeme vizuálny vzhľad s HTML. Áno, predvolený vzhľad súboru značka by bola kurzíva a by bolo odvážne, ale tieto vzhľady by sa dali ľahko zmeniť v CSS. Toto je to najlepšie z oboch svetov. Môžete použiť predvolené štýly prehľadávača a získať tak v dokumente kurzíva alebo tučný text bez toho, aby ste skutočne prekročili hranicu a zmiešali štruktúru a štýl. Povedz, že si to chcel text, ktorý má byť nielen tučný, ale aj červený, môžete pridať do SCS.

silný {
farba: červená;
}

V tomto príklade nemusíte pridávať vlastnosť pre tučnú veľkosť písma, pretože to je predvolené. Ak to však nechcete nechať na náhodu, môžete ich kedykoľvek pridať do:

silný {
váha písma: tučné;
farba: červená;
}

Teraz by ste zaručene mali stránku s tučným (a červeným) textom všade, kde je to zaručené značka sa používa.

Zdvojnásobte dôraz

Počas roka sme si všimli jednu vec, čo sa stane, ak sa pokúsite zdvojnásobiť dôraz. Napríklad:

Tento text by mal obsahovať oboje tučným písmom a kurzívou text v ňom.

Mysleli by ste si, že tento riadok vytvorí oblasť s textom, ktorý je označený tučným písmom A kurzívou. Niekedy sa to skutočne stane, ale videli sme, že niektoré prehliadače ctia iba druhý z dvoch štýlov zvýraznenia, ten, ktorý je najbližšie k príslušnému aktuálnemu textu, a zobrazuje ho iba ako kurzíva. To je jeden z dôvodov, prečo nezvyšujeme počet značiek zvýraznenia.

Ďalším dôvodom, ako sa vyhnúť tomuto „zdvojnásobeniu“, je štylistické účely. Na vyjadrenie tónu, ktorý chcete nastaviť, zvyčajne stačí jedna forma zvýraznenia. Na to, aby vynikol, nemusíte text tučným písmom, kurzívou, farbou, zväčšením a podčiarknutím. Tento text, ktorý bude mať všetky tieto rôzne druhy dôrazu, by sa stal krikľavým. Buďte opatrní pri používaní zvýrazňovacích značiek alebo štýlov CSS, aby ste zdôraznili, a nepreháňajte to.

Poznámka k tučným písmom a kurzíve

Jedna posledná myšlienka - zatiaľ čo odvážne () a kurzíva () značky sa už viac neodporúčajú používať ako prvky zvýraznenia, existujú niektorí weboví dizajnéri, ktorí používajú tieto značky na úpravu vložených oblastí textu. V zásade ho používajú ako a element. To je pekné, pretože značky sú veľmi krátke, ale použitie týchto prvkov týmto spôsobom sa všeobecne neodporúča. Spomíname to v prípade, že to na niektorých stránkach vidíte, že sa nepoužívajú na vytváranie tučného alebo kurzívového textu, ale na vytvorenie háku CSS pre iný vizuálny štýl.

instagram story viewer