Sukurkite spalvotą rėmelį aplink tekstą su HTML ir CSS

HTML puslapių siena gali padėti atkreipti dėmesį į teksto dalį arba supa kitą HTML elementą.

Kaip matyti žemiau, bet kuriam tekstui galite sukurti sieną, naudodami HTML ir CSS jūsų tinklalapyje. Toliau pateiktame pavyzdyje mes apsupome paragrafą () su raudona riba.

Pirmasis pavyzdys su tekstu, apsuptu raudonu kraštu.

Šis pavyzdys taip pat turi kelias eilutes.

Norėdami sukurti aukščiau pateiktą pavyzdį, naudojamas toliau nurodytas kodas.

Pirmasis pavyzdys su tekstu, apsuptu raudonu kraštu.

Šis pavyzdys taip pat turi kelias eilutes.

Pirmiau pateiktame kode stilius apibrėžia sienos dydį (pikselių ilgį), stiliaus tipą ir sienos spalvą. Sienos stilius yra tai, kaip ekrane atsiranda siena. Kiti sienos stilių tipai yra punktyrinė, punktyrinė, dviguba, griovelė, kraigo, įdėklas ir pradžia. Pasienio spalva apibrėžia spalvą, kurią norite naudoti pasienyje. Pirmiau pateiktame pavyzdyje buvo naudojamas spalvos kodas # FF0000, kuris yra raudonas spalvos kodas.

Stiliaus apibrėžimas naudojant CSS

Tinklalapio elementų išvaizda taip pat gali būti apibrėžta su inline CSS. Inline CSS yra apibrėžtas jūsų HTML dokumente elemente. Arba galite apibrėžti CSS išoriniame faile su plėtiniu .css . Tada galite susieti šį failą iš bet kurio HTML dokumento, o to dokumento elementai turės prieigą prie CSS stilių. Pavyzdžiui, naudojant žemiau esantį CSS kodą, sukuriama nauja klasė, vadinama „borderexample“, kuri gali būti taikoma bet kuriam kitam HTML žymeniui.

.borderexample {sienos stilius: kietas; sienų spalva: # 287EC7; }

Naudodami aukščiau pateiktą kodą, jei norėjote taikyti šį sienos stilių HTML pastraipoje, galite įvesti kažką panašaus į žemiau pateiktą pavyzdį.

Čia yra sienos, sukurtos naudojant CSS, pavyzdys