Перавагі і недахопы убудаваных стыляў у CSS

CSS або каскадныя табліцы стыляў, гэта тое, што выкарыстоўваецца ў сучасным дызайне сайта, каб прымяніць візуальны від на старонку. У той час як HTML стварае структуру старонкі і Javascript можа апрацоўваць паводзіны, знешні выгляд і адчуванне вэб-сайта з'яўляецца даменам CSS. Калі справа даходзіць да гэтых стыляў, яны часцей за ўсё ўжываюцца з дапамогай знешніх табліц стыляў, але вы таксама можаце ўжыць стылі CSS для аднаго канкрэтнага элемента, выкарыстоўваючы тое, што вядома як «убудаваныя стылі.»

Убудаваныя стылі стылі CSS, якія прымяняюцца непасрэдна ў HTML старонкі. Ёсць перавагі і недахопы такога падыходу. Па-першае, давайце паглядзім на як менавіта гэтыя стылі напісаныя.

Як напісаць Стыль Инлайн

Каб стварыць стыль CSS рядный, вы пачынаеце, напісаўшы ўласцівасць стылю падобна таму, як калі б у табліцы стыляў, але гэта павінна быць усё адна лінія. Падзяляйце ўласцівасці кропкай з коскі гэтак жа, як вы б у табліцы стыляў.

фон: #ccc; колер: #fff; мяжы: цвёрды чорны 1px;

Змесціце гэты радок стыляў ўнутры атрыбуту стылю элемента, які вы хочаце быць у стылі. Напрыклад, калі вы хочаце ўжыць гэты стыль да абзаца ў вашым HTML, то гэты элемент будзе выглядаць наступным чынам:

<Р стыль = "фон: #ccc; колер: # 000; мяжы: цвёрды чорны 1px;">

У гэтым прыкладзе, дадзены пункт будзе адлюстроўвацца з светла-шэрым фонам (гэта тое, што #ccc зробіць), чорны тэкст (ад колеру # 000), і з 1-піксельнай суцэльнай чорнай рамкай вакол усіх чатырох бакоў пункта ,

Перавагі ўбудаваных стыляў

Дзякуючы каскадзе з каскадных табліц стыляў ўбудаваных стыляў маюць найвышэйшы прыярытэт або спецыфічнасцю ў дакуменце. Гэта азначае, што яны збіраюцца не павінен прымяняцца незалежна ад таго, што яшчэ дыктуюцца ў знешняй табліцы стыляў (з адным выключэннем з'яўляецца усімі стылямі, якія даюцца ў! Важнае заяве пра тое, ліставым, але гэта не тое, што павінна быць зроблена ў вытворчых аб'ектах, калі яму можна пазбегнуць).

Адзіныя стылі , якія маюць больш высокі прыярытэт , чым убудаваныя стылі прыстасаваныя стылі , якія прымяняюцца самі чытачы. Калі ў вас узніклі праблемы з атрыманнем змены ва ўжыванні, вы можаце паспрабаваць ўсталяваць убудаваны стыль для элемента. Калі вы стылі яшчэ не адлюстроўваюцца, выкарыстоўваючы ўбудаваны стыль, вы ведаеце, што ёсць нешта яшчэ.

Убудаваныя стылі лёгка і хутка дадаваць і вам не трэба турбавацца аб напісанні правільнага выбару CSS, так як вы дадаеце стылі непасрэдна да элемента, які Вы хочаце змяніць (гэты элемент па сутнасці замяняе селектар вы пішаце ў знешніх стылях ). Вам не трэба, каб стварыць зусім новы дакумент (як з вонкавымі табліцамі стыляў) або адрэдагаваць новы элемент у галаве дакумента (як унутраныя табліцы стыляў). Вы проста дадаць атрыбут стылю, які сапраўдны на амаль кожны HTML элеменце. Усе гэтыя прычыны, чаму вы можаце захацець выкарыстоўваць убудаваныя стылі, але вы таксама павінны быць дасведчаныя аб некаторых вельмі істотных недахопах дадзенага падыходу.

Недахопы убудаваных стыляў

Паколькі убудаваныя стылі яны з'яўляюцца найбольш спецыфічнымі у каскадзе, яны могуць празмерна ездзіць рэчы, якія вы не збіраецеся іх у. Яны таксама адмаўляюць адзін з самых магутных аспектаў CSS - здольнасць да стылю шмат і шмат вэб-старонак з аднаго цэнтральнага файла CSS, каб зрабіць будучыя абнаўлення і змены стылю значна прасцей кіраваць.

Калі вы павінны былі выкарыстоўваць толькі убудаваныя стылі, вашы дакументы будуць хутка стаць разадзьмутымі і вельмі цяжка падтрымліваць. Гэта адбываецца таму, што убудаваныя стылі павінны быць ужытыя да кожнага элементу вы хочаце іх. Так што калі вы хочаце , каб усе вашы пункты , каб мець сямейства шрыфтоў «Arial», вы павінны дадаць убудаваны стыль для кожнага тэга

ў дакуменце. Гэта дадае і працу па тэхнічным абслугоўванні для дызайнера і часу загрузкі для чытача, так як вы павінны змяніць гэта праз кожную старонку сайта, каб змяніць гэта сямейства шрыфтоў. З іншага боку, калі вы карыстаецеся асобную табліцу стыляў, вы можаце змяніць яго ў адным месцы і мець кожную старонку атрымаць гэта абнаўленне.

Праўдзіва, гэта крок назад у вэб-дызайне - назад дні тэга !

Яшчэ адным недахопам ўбудаваных стыляў з'яўляецца тое, што гэта немагчыма ў стылі псеўда-элементаў і -клас з імі. Напрыклад, з дапамогай знешніх табліц стыляў, вы можаце стыль наведвальным, парыць, актыўныя і спасылку колеру з тэга прывязкі, але з убудаваным стылем, усё , што вы можаце стыль сама спасылка, таму што гэта тое , што атрыбут стылю прымацаваны да ,

У рэшце рэшт, мы не рэкамендуемы выкарыстаць убудаваныя стылі для вашых вэб - старонак , таму што яны выклікаюць праблемы і зрабіць старонкі нашмат больш працы , каб падтрымаць. Адзіны раз, калі мы выкарыстоўваем іх, калі мы хочам праверыць стыль хутка падчас развіцця. Пасля таго, як мы атрымалі яго глядзець прама на што адзін элемент, мы перамяшчаны яго да нашага вонкавым стыляў.

Orginal артыкул Джэніфер Krynin. Пад рэдакцыяй Джэрэмі Girard.