Ako je možné vidieť nižšie, hranica môže byť vytvorená okolo akéhokoľvek textu pomocou HTML a CSS na vašej webovej stránke. V nasledujúcom príklade sme obklopili odsek () s červeným okrajom.
Prvý príklad s textom obklopeným červeným okrajom.
Tento príklad má aj viac riadkov.
Na vytvorenie vyššie uvedeného príkladu bol použitý nasledujúci kód.
Prvý príklad s textom obklopeným červeným okrajom.
Tento príklad má aj viac riadkov.
Vo vyššie uvedenom kóde štýl definuje veľkosť ohraničenia (px short for pixel), typ štýlu a farbu ohraničenia. Štýl hraníc je spôsob, akým sa na obrazovke zobrazí okraj. Medzi ďalšie typy štýlov hraníc patria bodkované, čiarkované, dvojité, drážkové, hrebeňové, vložené a východiskové. Farba okraja definuje farbu, ktorú chcete použiť pre okraj. Vo vyššie uvedenom príklade bol použitý farebný kód # FF0000, čo je kód farby pre červenú.
Definovanie štýlu pomocou CSS
Vzhľad prvkov na webovej stránke môže byť tiež definovaný pomocou inline CSS. Inline CSS je definované v HTML dokumente, v elemente. Alebo môžete definovať CSS v externom súbore s príponou .css . Potom môžete odkazovať na tento súbor z akéhokoľvek dokumentu HTML a prvky v tomto dokumente budú mať prístup k štýlom CSS. Napríklad s nižšie uvedeným kódom CSS sa vytvára nová trieda s názvom „borderexample“, ktorú možno použiť na ľubovoľnú inú značku HTML.
.borderexample {border-style: pevná; border-color: # 287EC7; }
Ak by ste chceli použiť vyššie uvedený kód, ak by ste chceli použiť tento štýl ohraničenia v odseku HTML, môžete napísať niečo podobné tomuto príkladu.
Tu je príklad hranice vytvorenej pomocou CSS