CSS, of Cascading Style Sheets, word gebruik in die moderne webwerf ontwerp om die visuele blik op 'n bladsy toe te pas. Terwyl HTML die struktuur van die bladsy skep en Javascript die gedrag kan hanteer, is die voorkoms en die gevoel van 'n webwerf die domein van CSS. As dit by hierdie style kom, word hulle meestal toegepas met behulp van eksterne style sheets, maar jy kan ook CSS-style aan 'n enkele spesifieke element toepas deur gebruik te maak van wat bekend staan as "inline style."
Inline-style is CSS-style wat direk in die HTML-bladsy van die bladsy toegepas word. Daar is beide voordele en nadele vir hierdie benadering. Laat ons eers kyk hoe hierdie style geskryf word.
Hoe om 'n inlyn styl te skryf
Om 'n inline-CSS-styl te skep, begin jy met die skryf van jou styl-eienskap soortgelyk aan hoe jy dit in 'n stylvel sou wou hê, maar dit moet almal een reël wees. Skei meervoudige eienskappe met 'n semikolon, net soos jy sou in 'n stylblad.
agtergrond: #ccc; kleur: #fff; grens: soliede swart 1px;
Plaas die styl van style binne die styl kenmerk van die element wat jy wil styl. As jy byvoorbeeld hierdie styl wil toepas op 'n paragraaf in jou HTML, lyk dit soos volg:
In hierdie voorbeeld sal hierdie spesifieke paragraaf met 'n liggrys agtergrond (dit is wat #ccc sou lewer), swart teks (van die # 000 kleur) en met 'n 1-pixel soliede swart grens rondom al vier sye van die paragraaf .
Voordele van Inline Styles
Danksy die kaskade van Cascading Style Sheet inline style het die hoogste voorrang of spesifisiteit in 'n dokument. Dit beteken dat hulle toegepas sal word, ongeag wat anders in jou eksterne styleblad gedikteer word (met die een uitsondering is enige style wat die! Belangrike verklaring gegee word, maar dit is nie iets wat in produksieterreine gedoen moet word as dit kan vermy word).
Die enigste style wat hoër prioriteit as inlynstyle het, is gebruikerstyle wat deur die lesers self toegepas word. As jy probleme ondervind om jou veranderinge te doen, kan jy probeer om 'n inlynstyl op die element te stel. As jou style nog nie vertoon word met 'n inlynstyl nie, weet jy daar is nog iets aan die gang.
Inline-style is maklik en vinnig om by te voeg en jy hoef nie bekommerd te wees oor die skryf van die korrekte CSS selector nie, aangesien jy die style direk by die element voeg wat jy wil verander (die element vervang die selector wat jy in 'n eksterne stylvel sal skryf ). Jy hoef nie 'n hele nuwe dokument (soos met eksterne style sheets) te skep of 'n nuwe element in die kop van jou dokument te redigeer nie (soos met interne stylvelle). Jy voeg net die kenmerk by wat byna elke HTML-element geldig is. Dit is al die redes waarom jy versoek word om inline style te gebruik, maar jy moet ook bewus wees van enkele baie belangrike nadele vir hierdie benadering.
Nadele van Inline Styles
Omdat inlynstyle hulle die mees spesifieke in die kaskade is, kan hulle dinge oorskry wat jy nie van plan was nie. Hulle ontken ook een van die kragtigste aspekte van CSS - die vermoë om baie webbladsye van 'n sentrale CSS-lêer te styl om toekomstige opdaterings en stylwysigings baie makliker te maak.
As jy net inline style gebruik, sal jou dokumente vinnig opgeblaas word en baie moeilik om te onderhou. Dit is omdat inline style toegepas moet word op elke element waarvan jy dit wil hê. So as jy wil hê dat al jou paragrawe die font familie "Arial" het, moet jy 'n inline-styl by elke
-tag in jou dokument voeg. Dit voeg beide onderhoudswerk vir die ontwerper en aflaaistyd vir die leser toe aangesien u dit oor elke bladsy in u werf moet verander om daardie font-familie te verander. As u ook 'n aparte style heet gebruik, kan u dit op een plek verander en elke bladsy die opdatering ontvang.
Waarheid, dit is 'n stap agteruit in webontwerp - terug die dae van die tag!
Nog 'n nadeel aan inline style is dat dit onmoontlik is om pseudo-elemente en -klas saam te stel. Byvoorbeeld, met eksterne stylvelle kan jy die besoeker-, hover-, aktiewe- en skakelkleur van 'n ankermerktekening styl, maar met 'n inlynstyl kan jy net die skakel self styl, want dit is waaraan die style-kenmerk gekoppel is. .
Uiteindelik beveel ons aan dat u nie inline-style vir u webblaaie gebruik nie omdat dit probleme veroorsaak en die bladsye baie meer werk maak om te onderhou. Die enigste keer wat ons dit gebruik, is wanneer ons 'n styl vinnig wil ontwikkel tydens ontwikkeling. Sodra ons dit regkry vir die een element, beweeg ons dit na ons eksterne stylblad.
Oorspronklike artikel deur Jennifer Krynin. Geredigeer deur Jeremy Girard.