Wat is CSS en waar word dit gebruik?

Wat is Cascading Style Sheets?

Webwerwe bestaan ​​uit 'n aantal individuele stukke, insluitende beelde, teks en verskeie dokumente. Hierdie dokumente bevat nie net dié wat van verskeie bladsye, soos PDF-lêers, gekoppel kan word nie, maar ook die dokumente wat gebruik word om die bladsye self te bou, soos HTML-dokumente om die struktuur van 'n bladsy en CSS (Cascading Style Sheet) dokumente te bepaal. om die voorkoms van 'n bladsy te dikteer. Hierdie artikel sal in CSS verduister, wat dit dek en waar dit vandag op webwerwe gebruik word.

'N CSS Geskiedenisles

CSS is in 1997 ontwikkel as 'n manier om webontwikkelaars die visuele voorkoms van die webbladsye wat hulle geskep het, te definieer. Dit was bedoel om webwerwe in staat te stel om die inhoud en struktuur van 'n webwerf se kode van die visuele ontwerp te skei , iets wat nog nie voorheen moontlik was nie.

Die skeiding van struktuur en styl laat HTML toe om meer van die funksie te verrig waarop dit oorspronklik gebaseer was - die opmaak van inhoud sonder om bekommerd te wees oor die ontwerp en uitleg van die bladsy self, iets wat algemeen bekend staan ​​as die "look and feel" van die bladsy.

CSS het nie gewild geword tot ongeveer 2000, toe weblesers meer as die basiese font- en kleuraspekte van hierdie opmaaktaal begin gebruik het nie. Vandag ondersteun alle moderne blaaiers alle CSS Vlak 1, die meeste van CSS Vlak 2, en selfs die meeste aspekte van CSS Vlak 3. Aangesien CSS voortgaan om te ontwikkel en nuwe style bekendgestel word, het webblaaiers begin om modules te implementeer wat nuwe CSS-ondersteuning in die blaaiers bring en webontwerpers kragtige nuwe stileringsgereedskap gee om mee te werk.

In (baie) jaar verby was daar webdesigners wat geweier het om CSS te gebruik vir die ontwerp en ontwikkeling van webwerwe, maar die praktyk is vandag nog net van die bedryf af. CSS is nou 'n algemeen gebruikte standaard in webontwerp en jy sal moeilik gedruk word om iemand wat vandag in die bedryf werk, te vind wat nie ten minste 'n basiese begrip van hierdie taal gehad het nie.

CSS is 'n afkorting

Soos reeds genoem, staan ​​die term CSS vir "Cascading Style Sheet." Kom ons breek hierdie frase 'n bietjie om meer duidelik te maak wat hierdie dokumente doen.

Die woord "stylblad" verwys na die dokument self (soos HTML, CSS-lêers is eintlik net teksdokumente wat met verskeidenheid programme gewysig kan word). Stylvelle is al jare lank vir dokumentontwerp gebruik. Hulle is die tegniese spesifikasies vir 'n uitleg, hetsy gedrukte of aanlyn. Drukontwerpers het lang styleplakkers gebruik om te verseker dat hul ontwerpe presies volgens hul spesifikasies gedruk word. 'N Stylblad vir 'n webblad dien dieselfde doel, maar met die bykomende funksionaliteit om die webblaaier ook te vertel hoe om die dokument te vertoon. Vandag kan CSS-style sheets ook media-navrae gebruik om die manier waarop 'n bladsy vir verskillende toestelle en skermgroottes lyk, te verander. Dit is ongelooflik belangrik aangesien dit toelaat dat 'n enkele HTML-dokument anders gelewer word, volgens die skerm wat gebruik word om dit te gebruik.

Cascade is die baie spesiale deel van die term "cascading style sheet". 'N Webstylvel is bedoel om deur 'n reeks style in die vel te kaskade, soos 'n rivier oor 'n waterval. Die water in die rivier tref al die rotse in die waterval, maar net die onderkant beïnvloed presies waar die water sal vloei. Dieselfde geld vir die kaskade in webblad style sheets.

Elke webblad word beïnvloed deur ten minste een stylvel, selfs al is die webontwerper nie van toepassing nie. Hierdie stylblad is die style-bladsy van die agent agent - ook bekend as die standaardstyle wat die webblaaier sal gebruik om 'n bladsy te vertoon indien geen ander instruksies verskaf word nie. Byvoorbeeld, hyperlinks word gewoonlik in blou gestileer en hulle word onderstreep. Die style kom van 'n standaard blaaier se standaardblad. As die webontwerper ander instruksies verskaf, sal die blaaier egter moet weet watter instruksies voorrang het. Alle blaaiers het hul eie verstekstyle, maar baie van die standaard (soos die blou onderstreepte teks skakels) word gedeel oor al die meeste of die meeste groot blaaiers en weergawes.

Vir 'n ander voorbeeld van 'n blaaier verstek, in my webblaaier, is die verstek lettertipe ' Times New Roman ' vertoon in grootte 16. Byna geen van die bladsye wat ek besoek vertoon in daardie font familie en grootte nie. Dit is omdat die cascade bepaal dat die tweede styl bladsye, wat deur die ontwerpers self gestel word, die lettergrootte en die familie herdefinieer, wat die standaard van my webblaaier oortree. Enige stylvelle wat jy vir 'n webblad skep, sal meer spesifisiteit hê as die standaardstyl van 'n blaaier. Hierdie standaardwaardes sal slegs van toepassing wees as jou stylblad dit nie ignoreer nie. As u wil hê dat skakels blou en onderstreep moet word, hoef u niks te doen nie, aangesien dit die verstek is, maar as u CSS-lêer in u werf sê dat skakels groen moet wees, sal die kleur die standaard blou ignoreer. Die onderstreep sal in hierdie voorbeeld bly, aangesien u nie anders aangedui het nie.

Waar word CSS gebruik?

CSS kan ook gebruik word om te definieer hoe webbladsye moet kyk wanneer dit in ander media as 'n webblaaier gesien word. Byvoorbeeld, jy kan 'n drukstyl maak wat sal definieer hoe die webblad moet druk. Aangesien webbladsy items soos navigasie knoppies of web vorms geen doel op die gedrukte bladsy het nie, kan 'n Print Style Sheet gebruik word om daardie gebiede af te skakel wanneer 'n bladsy gedruk word. Alhoewel dit nie regtig 'n algemene praktyk op baie webwerwe is nie, is die opsie om drukstylvelle te skep, kragtig en aantreklik. (In my ervaring - die meeste webpersoneel doen dit nie bloot omdat 'n webwerf se begroting nie vereis dat hierdie addisionele werk gedoen moet word nie ).

Hoekom is CSS belangrik?

CSS is een van die kragtigste gereedskap wat 'n webontwerper kan leer, want daarmee kan jy die hele visuele voorkoms van 'n webwerf beïnvloed. Goed geskrewe style sheets kan vinnig opgedateer word en laat webwerwe toe om te verander wat visueel op die skerm geprioritiseer word, wat op sy beurt waarde en fokus aan besoekers wys, sonder dat enige veranderinge aan die onderliggende HTML-opmaak aangebring moet word.

Die hoof uitdaging van CSS is dat daar nogal 'n bietjie te leer is. En met blaaiers wat elke dag verander, kan dit môre nie sin maak nie, aangesien nuwe style ondersteun word en ander mense om een ​​of ander rede val .

Omdat CSS kan cascade en kombineer, en oorweeg hoe verskillende blaaiers die riglyne anders kan interpreteer en implementeer, kan CSS moeiliker wees as gewone HTML om te bemeester. CSS verander ook in blaaiers op 'n manier wat HTML regtig nie doen nie. Sodra jy begin met die gebruik van CSS, sal jy egter sien dat die gebruik van die krag van style sheets jou ongelooflike buigsaamheid gee in hoe jy webbladsye ontwerp en hul voorkoms definieer. Langs die pad, sal jy 'n "sak truuks" versamel van style en benaderings wat in die verlede vir jou gewerk het, en waarmee jy weer kan draai wanneer jy nuwe webblaaie in die toekoms bou.

Oorspronklike artikel deur Jennifer Krynin. Geredigeer deur Jeremy Girard op 7/5/17,