CSS-tyylilehdet

CSS
CSS -tyyliarkit Ominaisuudet
Laajennus .css
MIME-tyyppi text/css
Kehittäjä CSS-työryhmä ( in )
Alkuperäinen versio 17. joulukuuta 1996
Web-sivustot www.w3.org/Style/CSS
drafts.csswg.org

CSS , jota yleisesti kutsutaan CSS on Englanti CSS , muodostavat tietokoneen kieli , joka kuvaa asiakirjojen esittämistä HTML ja XML . Standardit määrittävät CSS julkaisee World Wide Web Consortium (W3C). Käyttöön puolivälissä -1990s , CSS tuli laajalti käytetty web-suunnitteluun ja hyvin tuettu selaimet on 2000-luvulla .

CSS: n historia

Yksi käsite muun muassa, läsnä verkon alusta

Käsite tyylisivu on ollut läsnä alusta World Wide Web  : ensimmäinen WorldWideWeb verkkoselain mahdollistaa asiakirjojen formatoitu mitä tänään pitää ”käyttäjä tyylisivu”. Samoin Viola vuonna 1992 ja Harmony vuonna 1993 selaimet käyttävät samaa mekanismia määrittää renderöinti fontteja , värejä tai tekstin tasausta.

Nämä eivät kuitenkaan ole asiakirjan kirjoittajan määrittämiä tyylejä . HTML myös puuttuu esityksen elementtejä alkuvuosina, joten ei ollut kasvavaa painetta selaimet mahdollistavat kirjoittajat määritellä ulkoasun verkkosivuja itse , vuonna lähestymistapa johdettu sähköisen tulostaa julkaisu. .

Se oli tässä yhteydessä vuonna 1994 - 1995 , että uusi Netscape Navigator esitteli ensimmäisen HTML-esityksen elementtejä aloitteesta Marc Andreessen , kun ensimmäiset ehdotukset ulkoisen tyylejä ilmestyi samanaikaisesti:

CSS: n ulkonäkö vastaa haluun "tarjota vaihtoehto HTML: n evoluutiolle jäsentävästä kielestä esityskieleksi".

Kolmas kehityspolku oli myös avoin samanaikaisesti: James Clarkin kehittämä SGML- asiakirjojen DSSSL-muunnoskieli ehdottaa tyylikielen mahdollisuutta, joka ei ole vain kuvaileva, vaan lähestyy todellista ohjelmointikieliä . Tätä polkua seuraa Netscape, joka ehdotti W3C: lle vuonna 1996 Netscape Navigator 4: n vuonna 1997 toteuttamaa "JavaScript-Based Style Sheets" (JSSS) .

CSS: n alkuperä on sen vuoksi yhdistetty kolmeen päämahdollisuuteen:

Ensimmäinen kehitys

Ensimmäiset Håkon Wium Lie: n tekemät ehdotetut CSS- tyylitaulukot kiinnittävät Dave Raggettin huomion , joka oli sitten ehdotetun HTML 3.0 -spesifikaation päätoimittaja. Puhtaasti rakenteellisen HTML: n kannattaja hän kannusti julkaisemaan CHSS-työasiakirjan, jotta se voitaisiin esitellä ja keskustella toisessa kansainvälisessä WWW-konferenssissa ( Mosaic and the Web , Chicago, 1994). Hän muutti myös Håkon Lie Arena -selaimella testatakseen tätä kieltä ja esitteli sen kolmannessa WWW-konferenssissa vuonna 1995.

Samaan aikaan Bert Bos , joka työskenteli tuolloin Argo- selaimella ja oli toimittanut oman Stream-based Style Sheet Ehdotuksen  (SSP) W3C: lle  , päätti yhdistää ponnistelunsa Håkon Lieen. SSP on kehitetty ajatuksella, että sitä ei voida käyttää vain HTML: n lisäksi myös muihin merkintäkieliin. Bert Bos ja Håkon Lie ottavat tämän tavoitteen ja tekevät siitä yhden tärkeimmistä ominaisuuksista sille, mistä sitten tulee CSS oikein.

Toinen CSS: n näkökohta on siis ratkaiseva nykyisten vaihtoehtojen edessä: CSS on ensimmäinen kieli, joka sisältää ajatuksen "kaskadista" ( CSS- tyylisivun ), toisin sanoen mahdollisuudesta, että asiakirjan tyyli voidaan peritty useista "tyylitaulukoista". Tämä tekee mahdolliseksi sovittaa useita kilpailevia elementin muotoilulähteitä ja vastaa siten säveltämisen tarpeeseen kirjoittajien ja käyttäjien tyyliasetusten välillä.

World Wide Web Consortium (W3C) aloitti toimintansa vuonna 1995, ja www-style listaa luotiin. Samana vuonna Pariisissa järjestettiin CSS: n tulevaisuuden kannalta ratkaiseva "W3C-tyylisivutyöpaja". Erityisesti se vahvistaa halun pitää tyylitaulukot yksinkertaisessa muodossa, mikä sulkee pois Netscapen JSSS-hypoteesin. Lisäksi Thomas Reardon (Microsoft) ilmoittaa CSS: n tulevasta tuesta Internet Explorerin tulevissa versioissa  : Siksi, kun W3C luo vuoden lopussa "  HTML Editorial Review Board  " (HTML ERB) tulevan HTML: n vahvistamiseksi, DOM- ja CSS-määritykset, Netscape, edustaja Lou Montulli , liittyy lopulta Bert Bosin ja Håkon Leen johtamaan CSS-projektiin.

Kohti vaikeaa kypsymistä

Toisin kuin ohjelmisto , CSS-spesifikaatioita ei kehitetä peräkkäisissä versioissa, mikä antaisi selaimelle mahdollisuuden viitata tiettyyn versioon. CSS: n ovat kehittäneet "tasot", jotka pakottavat jokaisen uuden tason integroimaan edellisen tason ja jokaisen toteutuksen yhteensopivaksi edellisen kanssa: CSS1 on siis kehitetty CSS2: n osajoukoksi, joka itse on kehitetty osajoukoksi. CSS3. Tämä selittää osittain CSS: n normatiivisen kehityksen hitauden.

CSS1, vaikea toteutus selainsotien aikana

Lopullinen CSS1-eritelmä julkaistiin 17. joulukuuta 1996, ja siinä määriteltiin noin viisikymmentä ominaisuutta. CSS1 määritellään "yksinkertaiseksi tyylitaulukomekanismiksi, jonka avulla kirjoittajat ja lukijat voivat liittää tyylit (…) HTML-asiakirjaan". Tämä yksinkertaisuus tarkoittaa sellaisen kielen valintaa, jonka sen käyttäjät voivat helposti lukea ja kirjoittaa suoraan, ja terminologiaksi, joka on yleinen käyttö tietokonejulkaisuissa. Mahdollinen valinta ilmaista CSS XML- tai SGML-syntaksissa, joka mainitaan säännöllisesti uuden syntaktisen analyysimenetelmän toteuttamisen välttämiseksi, on siten ehdottomasti suljettu pois.

CSS1 ei kuvaa vain omaa kielioppiaan  : tämä ensimmäinen taso kuvaa tosiasiallisesti kielioppia, jonka tarkoituksena on antaa myöhemmille tasoille lisätä uusia toimintoja, samalla kun alkuperäiset toteutukset sallivat lukea nämä tulevat tyylitaulukot. Alkuperäiset toteutukset eivät ymmärrä näitä uusia ominaisuuksia, mutta ne voidaan tunnistaa sellaisiksi ja jättää huomiotta. CSS takaa siten taaksepäin yhteensopivuuden .

CSS1 määrittelee olennaisesti tekstin typografiset renderointiominaisuudet : fontit (fontit), värin, kirjasinkoon, painon , välit, reunukset ja luettelomerkkien hallinnan.

Siksi "asettelusta" ei vielä ole kysymystä: ominaisuus float, jota myöhemmin käytetään laajasti verkkosuunnittelun kokonaiss CSS-asettelussa, suunnitellaan tällöin vain keinoksi sijoittaa paikallisesti, vierekkäin, pieni osa sisältö, kuten kuva, ja muu teksti. Ottaen huomioon ongelmalliset CSS1-toteutukset, HTML-elementin kaappaaminen tableyleisen asettelun käsittelemiseksi on toistaiseksi yleisin ratkaisu verkkosisällön tekijöille.

Vuonna 1996 Internet Explorer 3.0 oli ensimmäinen kaupallinen selain, joka otti osittain käyttöön CSS: n, kun sitä vielä muotoillaan. Tämä Chris Wilsonin johtama varhainen toteutus ei vastaa lopullista eritelmää. Vuonna 1997 Internet Explorer 4.0 näki uuden renderointimoottorin , Tridentin , syntyvän kasvavasta mutta ongelmallisesta CSS-tuesta tämän selaimen eri versioissa Windows-käyttöjärjestelmässä, aina Internet Explorer 7: een saakka .

Netscape Navigator 4.0 seurasi mallia vuonna 1997 huolimatta sen historiallisesta haluttomuudesta CSS: ää kohtaan: selainsotien yhteydessä tärkeintä oli välttää Microsoftin kykyä väittää olevansa selaimena eniten yhteensopiva. Tämä kiireinen toteutus, joka perustuu sisäisiin JavaScript- menetelmiin , osoittautuu lopulta rajoitetuksi ja erittäin epäluotettavaksi. Netscape Navigator 4.0 tuo myös JSSS-toteutuksen, jota ei oteta huomioon. Meidän täytyy odottaa uutta Gecko renderointi moottori alkaen Mozilla-projektin saavuttaa todellista toteuttamista CSS1.

Vuonna 1998, kun selainsodat Netscapen ja Microsoftin välillä päättyivät, Opera 3.5, josta Håkon Lie oli tällä välin tullut tekninen johtaja, saavutti CSS1: n täydellisemmän toteutuksen, jonka helpottamiseksi julkaistiin ensimmäinen "Test Suite" CSS-tason CSS-tasoille 1 ”, luonut ensisijaisesti Eric Meyer W3C: lle. Näiden testipakettien läsnäolo on osoittautumassa suureksi eduksi sekä selaimissa toteutettaville sovelluksille että CSS-tekniikoiden omaksumiselle kirjoittajien toimesta (tarjoamalla yksityiskohtaisia ​​esimerkkejä ominaisuuksista ja niiden arvoista).

Lopuksi johdolla Tantek Çelik , Internet Explorer 5.0 Macintosh käynnistettiin maaliskuussa 2000 , joka perustuu Tasman , tiettyyn renderoija liity Trident, on ensimmäinen selain kokonaan (yli 99%) tuen CSS1. Varmistaakseen yhteensopivuuden aikaisempien kullekin toteutukselle tarkoitettujen koodauskäytäntöjen ("tag-keitto") kanssa ja salliakseen verkkodokumenttien oikean esityksen riippumatta siitä, noudattavatko ne CSS- ja HTML-standardeja vai ei, hän on myös ensimmäinen, joka toteuttaa tiedostotyyppien vaihtotekniikan . Myöhemmin kaikki selaimet hyväksyivät tämän myöhemmin yhdeksi avaimista CSS: n asteittaiselle käyttöönotolle: se antaa selaimen todellakin mahdollisuuden säilyttää vanhat omat toteutukset yhteensopivuussyistä samalla, kun sillä on mahdollisuus valita, asiakirjatyyppi-ilmoituksen syntaksin mukaan sivun uudelle vakiototeutukselle sopivaa renderöintitilaa varten.

Tänä 1990-luvun lopun aikana verkkosivujen suunnittelu riippui ensisijaisesti HTML: n käytöstä esitysmuodona. Netscapen tappio selainsotien lopussa, Mozilla-projektin seurauksena tapahtunut uusiminen, IE5 Macin ulkonäkö ja vähemmässä määrin Internet Explorer Windows 5.x: n kehitys, kuitenkin 2000-luvun alussa , uusi vaihe kirjoittajien verkkosivujen suunnittelukäytäntöjen kehityksessä alkoi: näiden selainten avulla voidaan todellakin osoittaa, että historialliset käytännöt, jotka ovat peräisin selainsodista, sekoittamalla rakennetta ja esitystä, voidaan tosiasiallisesti hylätä lähestymistavan hyväksi. perustuvat tyylitauluihin ja verkkostandardien (HTML- ja CSS-merkityksessä) yleisempään kunnioittamiseen. Jeffrey Zeldman , Web-standardiprojektin perustaja ja A List Apart  (in) -yrityksen perustaja vuonna 1998, esiintyy sitten tämän liikkeen tunnusmerkkinä edistääkseen standardeja . Hän on myös inspiraationa "hybridi" -suunnitteluun, jossa hyödynnetään CSS-tekniikoita ja pysytään väliaikaisesti esitystaulukoihin perustuvien asiakirjojen muotoilussa.

CSS2, kiireisiä tavoitteita

Niiden tarpeiden tyydyttämiseksi, joita ensimmäinen CSS1-määritys ei vielä kattanut, CSS nimitettiin vuonna 1997 uudelle W3C: n työryhmälle, jonka puheenjohtajana toimi Chris Lilley . Vuonna 2007 tähän ryhmään kuului edustajia Apple , Google , IBM , Microsoft , Adobe , Mozilla Foundation ja Opera .

Toukokuussa 1998 julkaistu suositteluna CSS: n toinen taso laajentaa huomattavasti CSS-tyylisivujen teoreettisia mahdollisuuksia etenkin noin 70 lisäominaisuudella. CSS1: llä aloitetun tekstin typografisen muotoilun lisäksi:

  • tyylien vaihtelu eri medioille, joissa web-sivu voidaan renderoida (tulostus, renderoitu äänisynteesillä, pistekirjoituslaitteella, projektiolaitteella, matkapuhelimella jne.);
  • uudet paikannusominaisuudet näytöllä, jotka mahdollistavat kehittyneiden asettelujen luomisen Microsoftin ja Netscapen yhdessä kehittämän asiakirjan perusteella;
  • joukko ominaisuuksia, jotka mahdollistavat tiettyjen fonttien lataamisen;
  • uudet ominaisuudet, joiden avulla käyttäjän asetuksia voidaan käyttää sivuston ulkoasussa.

Tämä toiminnallinen rikkaus kuitenkin saavuttaa vain rajoitetun kaiku sen toteutuksissa:

  • Median vaihtelu on osittain epäonnistuminen: äänentoiston tyylit pysyvät teoreettisina, koska ääniselaimet ja näytönlukijat eivät ota huomioon niitä . Ne eivät myöskään ole yhteensopivia SSML- puhetoimintastandardin kanssa . Sama koskee näyttö- ja pistekirjoitustulostusta . Graafiset selaimet omaksuivat tulostustyylit vain hyvin osittain, kun taas 2000-luvun alussa osa mobiiliselaimista jätti silti huomioimatta niille omistetun CSS-median tyypin.
  • Kaikki graafiset selaimet tunnistavat vain muutaman edistyneen paikannusominaisuuden, mikä vahvistaa sivun asettelukäytäntöjä, jotka perustuvat CSS: n (kelluva tai sijoitettu lohkojärjestelmä) ja HTML: n (sivuasettelutaulukot) toimintojen väärinkäyttöön;
  • Fonttien lataaminen aiheuttaa epäjohdonmukaisia ​​ja erimielisiä toteutuksia Netscapen ja Internet Explorerin välillä, ja kirjasintoimittajat vastustavat sitä , että he haluavat säilyttää kaupalliset edut.

Näiden vaikeuksien ja CSS2-toteutusten hitauden selittämiseksi mainitaan useita syitä:

  • ”tiettyjen osien alitiedot tai lähes täydentämättömyys”. Håkon Lie itse korostaa Cascading Style Sheets -tutkielmassaan vuonna 2005 riskejä, jotka aiheutuvat "liiallisesta toiminnallisuudesta", kuten listamerkinnöistä, leikkausmerkeistä, fonttien tulostamiseen tai lataamiseen liittyvistä yhteentoimivuuden laiminlyönnistä tai menetyksestä. Samoin edistyneiden valitsimien monimutkaisuutta on vaikea sovittaa yhteen kaskadin hallinnan kanssa;
  • selaimen valmistajien kiinnostuksen puute ominaisuuksista, jotka eivät välttämättä saavuttaneet heidän strategisia tai liiketoiminnallisia tavoitteitaan;
  • markkinoiden hallitsevan selaimen Internet Explorerin kehityksen keskeytyminen vuosina 2001–2006. Håkon Lie kirjoitti vuonna 2005: ”2001 on käännekohta CSS: lle. Tänä vuonna Microsoft tuotti Internet Explorer 6.0: n, joka tarjosi CSS: lle toimivan, vaikkakin puutteellisen ja viallisen tuen […] Mikään muu selain ei ole pystynyt kilpailemaan WinIE: n kanssa käyttäjien lukumäärän suhteen. Siksi WinIE määritti CSS: n osajoukon, jota kirjoittajat voivat käyttää. WinIE: n rajoitettu tuki CSS: lle yhdistettynä tosiasialliseen selainmonopoliin on tällä hetkellä CSS: n käyttöönoton suurin ongelma. "
CSS 2.1, takaisin toteutuksiin

CSS2: n käyttöönoton palaute sai W3C: n CSS-työryhmän kirjoittamaan vuodesta 2001 päivitetyn version CSS 2.1 ("  CSS Level 2, Revision 1  ") sen perusteella, mitä eri selaimet todella hyväksyivät. Tämän tarkastelun tavoitteet ovat:

  • ylläpitää yhteensopivuutta CSS2: n niiden osien kanssa, jotka ovat laajalti hyväksyttyjä ja toteutettuja;
  • sisällyttää standardiin kaikki jo julkaistut CSS2-virheet;
  • Kun toteutukset eroavat merkittävästi CSS2-spesifikaatiosta, muokkaa spesifikaatiota siten, että se on yleisesti hyväksytyn käytännön mukainen;
  • poista CSS2-ominaisuudet, jotka CSS-yhteisö on hylännyt niiden puutteen vuoksi. CSS 2.1 on tarkoitettu heijastamaan CSS-mekanismeja, jotka on kohtuudella ja laajasti otettu käyttöön HTML- ja XML-kielille yleensä (tietyn XML-kielen tai pelkästään HTML: n sijaan);
  • poistaa CSS2-mekanismit, jotka CSS3 poistaa vanhentuneina, ja kannustaa siten CSS3-mekanismien käyttöönottoa niiden sijasta;
  • lisää (hyvin) pieni määrä uusia ominaisuusarvoja, kun käyttöönottokokemus on osoittanut, että ne täyttävät CSS2-toteutuksen tarpeen.

CSS 2.1 korjaa CSS2: n monissa yksityiskohdissa, poistaa tietyt osiot kokonaan tai osittain (" äänimaailman  " mediatyypissä määritellyt laulutyylit  , tulostustyylit, ladattavat fontit, joista vakuuttavammat määritelmät hylätään tulevaisuudessa. CSS3), ja selittää sen toteutusten aikana päivitettyjen havaintojen perusteella (kelluvien lohkojen edistynyt hallinta "muotoilukontekstien" kautta).

Kokenut 8 peräkkäistä versiota CSS 2.1 on heinäkuussa 2007 ehdokassuositus, toisin sanoen standardi, jota toteutusten on noudatettava.

Vuonna 2007 yksikään selain ei ollut tosiasiallisesti saattanut CSS 2.1: n integrointia loppuun: Internet Explorer 7: ssä tämä toteutettiin 56 prosentilla, Firefox 2: lla 91 prosentilla ja Opera 9: llä. Lisäksi vain osa graafisista selaimista on onnistuneesti läpäissyt tai säilyttänyt tavoitteenaan Acid2- testin , jonka Web Standards Project aloitti vuonna 2005 Håkon Lie -aloitteesta, erityisesti edistääkseen CSS 2.1 -toimintojen valinnan toteuttamista, jota pidetään tärkeimpänä tarvittavana edistysaskeleena: elementit näytön aikana, taulukon renderointimallin yleistäminen kaikille elementeille, CSS: n kautta luotu sisältö. CSS: n ammattimainen käyttö rajoittuu sen vuoksi mielivaltaiseen osajoukkoon, joka määritetään yhteisillä toteutuksilla.

CSS3

CSS 2.1: n rinnalla aloitettiin kolmannen tason CSS-tyylisivujen kehitys.

CSS3: sta on tulossa "modulaarinen", jotta voidaan helpottaa sen päivityksiä, mutta myös sen, että käyttäjäagentit, joiden kapasiteetti ja tarpeet vaihtelevat, vaihtelevat (graafiset selaimet, mobiiliselaimet, ääniselaimet). Selaimet voivat siten toteuttaa CSS3: n alajoukkoja.

Siksi CSS3: n edistymisaste vaihtelee moduulien ja CSS-työryhmän heille antaman prioriteetin mukaan. Vuonna 2007 edistyneimmät moduulit (ehdokassuositukset) koskevat:

  • muotoilu rubiini merkinnät
  • tyylineuvottelut palvelinten ja käyttäjäagenttien välillä ("  Media Queries  ")
  • verkko-TV-renderointi
  • värien hallinta
  • ottaen huomioon käyttöliittymän kokoonpano.

Muissa tapauksissa moduulit voivat saavuttaa ehdokkaiden suositteluvaiheen, mutta ne voidaan myöhemmin palauttaa työasiakirjavaiheeseen täytäntöönpanokehotuksen jälkeen päivitettyjen vaikeuksien vuoksi. Näin on esimerkiksi ”CSS Text” -tyyppimoduulissa.

Samoin toteutukset vaihtelevat eri selainten strategioiden ja tarpeiden mukaan:

  • Esimerkiksi Opera toteuttaa "  Media Queries  " -sovelluksen , joka täyttää sen erityistarpeet monitasoisena selaimena, joka on upotettu asiakkaille, joilla on laaja valikoima näyttökapasiteettia.
  • Firefox, joka on enemmän suuntautunut alustaksi käytetylle selaimelle , puolestaan ​​suosii tähän käyttöön soveltuvia moduuleja, kuten edistyneitä valitsimia.

Hollantilainen ohjelmoija Jori Koolstra ehdotti vuonna 2002 ajatusta dynaamisista CSS-tyylisivuista .

Jotkut CSS-työryhmän jäsenet ja web-kehittäjät ottivat esiin CSS3: n hitaan edistymisen:

  • Ian Hicksonin mukaan "CSS-työryhmä kärsii nykyään kroonisista toimintahäiriöistä"  : sen liian suljettu luonne riistää sen tarvittavilta avustajilta eritelmien julkaisemiseen, niiden oikolukemiseen tai jopa testipakettien kirjoittamiseen;
  • Daniel Glazmanille tämä hitaus voidaan selittää kolmella alkuperäisellä virheellä: valinta kehittää CSS tasoittain eikä peräkkäisillä versioilla, CSS 2.1 -versiolle annettu prioriteetti CSS3: n vahingoksi, CSS3-moduulien liian suuri määrä ja monimutkaisuus siellä kehitettyjä ominaisuuksia.

Vuonna 2008 W3C ei pitänyt moduulia valmiina, ja sen vuoksi selainten toteutus on marginaali, usein testinä, kuten Gecko-moottorin -moz-xxx-toiminnot , joiden etuliite rajoittaa käytön vain Gecko-pohjaisiin selaimiin.

CSS4

CSS 3 -moduulien rinnalla aloitetaan neljännen tason CSS-tyylitaulukoiden kirjoittaminen.

Jotkut moduulit ovat jäädytettyjä tai parhaillaan niin, luonnoksia käynnistetään jatkamaan jälkimmäisten mahdollisuuksien laajentamista. Siksi työ tehdään edellisen kerroksen lisäksi tai jopa ottamalla alempi kerros valitsimille.

Asiat ja periaatteet

Panokset

Rakenteen ja esityksen ero

Yksi CSS: n tärkeimmistä tavoitteista on sallia muotoilu asiakirjojen ulkopuolella. On esimerkiksi mahdollista kuvata vain asiakirjan rakenne HTML-muodossa ja kuvata koko esitys erillisenä CSS-tyylisivuna. Tyylit otetaan käyttöön viime hetkellä asiakirjaa katselevien kävijöiden verkkoselaimessa. Tämä erottaminen tarjoaa useita etuja, mikä parantaa saatavuutta , muuttaa esitystä helpommin ja vähentää asiakirjan arkkitehtuurin monimutkaisuutta.

Tyyli-arkkien etuja on siis useita:

  • Asiakirjan rakennetta ja esitystä voidaan hallita erillisinä tiedostoina;
  • Asiakirjan suunnittelu tehdään aluksi huolehtimatta esityksestä, mikä tekee siitä tehokkaamman;
  • Kun kyseessä on verkkosivusto , esitys on standardoitu: asiakirjat (HTML-sivuja) viittaavat samaan tyylisivut. Tämä ominaisuus sallii myös visuaalisen aspektin nopean muokkaamisen;
  • Yksittäinen asiakirja voi antaa valinnan useiden tyylisivujen välillä, esimerkiksi yksi tulostettavaksi ja toinen lukea näytöllä. Joidenkin selainten avulla kävijä voi valita yhden tyylin useiden joukosta;
  • HTML-koodin koko ja monimutkaisuus ovat huomattavasti pienemmät, koska se ei enää sisällä tunnisteita tai esitysmääritteitä.
Mediaesitys

CSS: n avulla voit määrittää asiakirjan renderoinnin renderointivälineen ja sen ominaisuuksien ( näytön tai äänilaitteen tyyppi ), selaimen ( teksti tai grafiikka) ja käyttäjän asetusten mukaan.

Tyylitaulukot voidaan erottaa seuraaville materiaaleille CSS2.1: n mukaisesti:

  • all : riippumatta välineestä;
  • screen : pöytätietokoneen näytöt;
  • print : paperin painamiseen;
  • handheld : hyvin pienet näytöt ja rajoitetun kapasiteetin asiakkaat;
  • projection : kun asiakirja heijastetaan;
  • tv : kun asiakirja näytetään televisiotyyppisessä laitteessa  ;
  • speech : renderöimiseksi tekstistä puheeksi (korvaaminen aural, alun perin suunnitellut CSS2.0, sitten poistanut CSS2.1).

Muut medioita ovat teoreettisesti ennakoida, että CSS2.1 selityksessä, mutta ne eivät ole toteutettu käyttäjän aineet: brailleja embossedpistekirjoitusnäyttöjen tablettien ja kohokuviointikalanterit, sekä ttyvarten kaukokirjoittimet .

Kussakin välineessä asiakirjan tekijän määrittelemät esitystyylit yhdistetään käyttäjäagentin oletusasetuksiin sekä käyttäjän mieltymyksistä ja henkilökohtaisista määrityksistä johdettuihin tyyliin.

Valmiuksia vastaanotin voidaan ottaa huomioon tekijät, jotka on tarkoitettu selaimet toteuttamiseksi CSS3 " mediakyselyissä  " moduuli  : Tämä mahdollistaa vaatimassa huomioon ottaminen tyylisivun rajoitteista koskee erityisesti tarkkuutta tai kyky palauttaa värit.

Tyylien kaskadi

"Kaskadi" on yhdistelmä eri tyylilähteitä, joita sovelletaan samaan asiakirjaan niiden prioriteettitason mukaan. Eri kaskaditiloja voidaan yhdistää:

  • tyylien alkuperän mukaan, käyttäjän edustajalta, tekijältä ja käyttäjältä. Käyttäjätyyleille asetettu korkeampi prioriteetti on tärkeä tekijä CSS: ää käyttäen esitettyjen asiakirjojen saatavuudessa.
  • tietovälineiden avulla: yleinen tyylilehti voidaan soveltaa useisiin renderointivälineisiin (näytön näyttö, tulostus, projektio) ja yhdistää kullekin materiaalille ominaiset arkit;
  • verkkodokumenttijoukon arkkitehtuurin mukaan: yleinen tyylitaulukko voidaan soveltaa verkkosivuston kaikille sivuille , yhdistää sen kullekin osalle ominaisiin taulukoihin sekä tietylle sivulle ominaisiin tyyleihin;
  • arkkien itsearkkitehtuurista riippuen: asiakirjan ulkopuolinen tyylitaulukko voidaan yhdistää sisäiseen tyylitaulukkoon ja tyyleihin, joita sovelletaan suoraan kuhunkin sen muodostavaan elementtiin ("inline" -tyylit). Tyylitaulukko voi myös tuoda yhden tai useamman muun ulkoisen taulukon.

CSS: n tekniset periaatteet ja syntakse

Peruskäsitteet: CSS-laatikot ja syötteet

Tyylikkään asiakirjan renderointi määräytyy laatikon ja virtauksen käsitteiden avulla. CSS-renderointimoottori muodostaa "muotoilurakenteen", joka heijastaa asiakirjan loogista puuta . Tämän rakenteen kukin elementti luo yhden tai useamman vyöhykkeen, jolla on konfiguroitavat näytön tai puheen renderointiominaisuudet. Näyttö tai lukeminen tapahtuu kullekin elementille peräkkäin muodostetusta laatikkovirrasta, kun se näkyy muotoilurakenteen lineaarisessa järjestyksessä.

Tapauskohtaisesti nämä erityyppiset laatikot:

  • voi olla marginaalien, reunuksen, taustan, leveyden tai korkeuden jne. ominaisuuksia Lokaalisessa esityksessä vastaavien ominaisuuksien avulla voidaan määrittää taukoja lukemisessa ennen sisältöä tai sen jälkeen, valita ääni, säätää sen nopeutta tai äänenvoimakkuutta;
  • voidaan siirtää oletusasennosta virrassa tai niillä voi olla tiettyä käyttäytymistä (sallia renderointi viereisissä sarakkeissa, olla päällekkäisiä naapuriruutujen kanssa tai piilottaa esimerkiksi).
Ominaisuudet ja arvot

CSS-laatikoihin sovellettavat ominaisuudet ilmaistaan ​​pareittain propriété: valeur.

Ominaisuudet on merkitty englanninkielisillä työkalusanoilla, kuten "  leveys  ", "  fontin koko  " tai "  äänenvoimakkuus  ".

Arvot voidaan tapauksesta riippuen ilmaista käyttämällä muualla standardoituja yksiköitä tai CSS-spesifisiä avainsanoja. Esimerkiksi taustan tai tekstin väri voidaan ilmaista käyttämällä RGB- mallia tai avainsanoja musta, sininen, fuksia jne.

CSS-ominaisuudet on luotu kahden vastakkaisen rajoitteen välisen kompromissin perusteella: helpottamalla käyttäjäagenttien lukemista tyylitaulukoita kertomalla yksittäisiä ominaisuuksia tai helpottamalla kirjoittajien kirjoittamista käyttämällä pienempää määrää yhdistettyjä ominaisuuksia. Esimerkiksi taustakuvan sijainti määritetään yhdellä ominaisuudella ( background-position), joka yhdistää sekä abscissa- että ordinaattiarvot, eikä kahdella erillisellä ominaisuudella. Samoin on olemassa lyhennettyjä ominaisuuksia, joiden avulla kirjoittajat voivat yksinkertaistaa ominaisuuksien sarjan kirjoittamista: pikakuvake fontantaa esimerkiksi yhteenvedon yhdestä säännöstä kaikista kirjasimen, koon, viivan korkeuden, kirjaimen, painon ja kursivoidun ominaisuuksista. "/" - merkin käyttö kuitenkin tekee tyylitaulukoiden jäsentämisen käyttäjäagenttien avulla paljon monimutkaisemmaksi.

Valitsimet ja sääntölohkot

Ominaisuudet on ryhmitelty sääntölohkojen mukaan, jotka on erotettu aaltosulkeilla {}. Kutakin lohkoa edeltää valitsin, joka nimeää rakenneosat, joihin kyseisiä ominaisuuksia on sovellettava:

/*Je suis un commentaire qui commente le code et qui ne fait rien*/ body { /*Couleur de fond : */ background-color: green; } p { /*Couleur du texte : */ color: red; /*Taille du texte en px (pixel) : */ font-size: 20px; } button { /*Contour : */ outline: none; /*Bordure*/ border: none; /*Couleur de fond : */ background-color: black; /*Couleur de texte : */ color: white; } /*Hover veut dire au survol d'un bouton*/ button:hover { /*Couleur de fond : */ background-color: green; } /*Selection veut dire à la selection du texte*/ *::selection { /*Couleur de fond : */ background-color: black; /*Couleur du texte : */ color: white; } CSSOO

Kohdekeskeinen CSS (englanniksi OOCSS ) on menetelmä, joka luotiin vuonna 2009 olio-ohjelmoinnin mallilla , ja sen tyylejä voidaan käyttää uudelleen useissa yhteyksissä.

BEM

BEM (Block, element, modifier) ​​on vuonna 2010 keksitty CSS-kirjoitustekniikka, joka koostuu tyylien ilmoittamisesta puurakenteena suorituskyvyn parantamiseksi. Esimerkki:

.product { &-productLabel { ... } &-productPicture { ... } }

Huom: ampersand (&) edustaa pääobjektia Sass- ja LESS-tiedostoissa .

Esimerkki HTML: n ja CSS: n kanssa

Index.html- tiedoston sisältö  :

<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <link rel="stylesheet" href="style.css"/> <title>Exemple html et css</title> </head> <body> <button class="btn" id="btn1">Premier bouton</button><br/><br/> <button class="btn" id="btn2">Deuxième bouton</button><br/><br/> <button class="btn" id="btn3">Troisième bouton</button> </body> </html>

Style.css- tiedoston sisältö  :

.btn { height: 50px; color: white; font-size: 20px; cursor: pointer; transition: background-color 2s; outline: none; border: none; } *::selection { background-color: lightgreen; color: darkblue; } .btn:hover { transition: background-color 2s; } #btn1 { background-color: lightgreen; } #btn1:hover { background-color: darkgreen; } #btn2 { background-color: lightblue; } #btn2:hover { background-color: darkblue; } #btn3 { background-color: red; } #btn3:hover { background-color: orange; }

HTML-tiedoston avaaminen selaimessa näyttää CSS-tiedostoon määritetyt tyylit.

CSS-rajoitukset

Esityksen ja rakenteen välinen riippumattomuus

CSS pyrki alun perin olemaan riippumaton asiakirjan rakenteen ja esityksen välillä.

Siten CSS Zen Garden sivusto , perustettiin vuonna 2003 , jonka Dave Shea  (fi) , tarkoituksena on osoittaa mahdollisuus vapaasti muuttamalla näytetyn tekee saman sivun, vain kiitos CSS ja ilman muutoksia sen koodin. HTML: joulukuussa 2006 se esitteli kotisivulleen 986 erilaista mallia. Suurin osa näistä malleista perustuu kuitenkin kokonaan tai osittain sivun tekstisisällön korvaamiseen CSS-kuvilla, jotka toistavat sen rikastuttamalla sen ulkonäköä: graafinen vapaus perustuu aina osittain tekstin muuttamiseen kuviksi. Toisaalta CSS Zen Garden on edelleen tyyliharjoitus, joka on rajoitettu yhteen asiakirjaan, ja sen rakenne on yhdistetty semanttisesti neutraaleihin elementteihin ja määritteisiin, jotka palvelevat vain CSS-valitsimia.

Vaikka on olemassa monia esimerkkejä HTML-asiakirjoista, joille on kehitetty useita tyylitaulukoita, on vain muutama esimerkki yleisistä tyylitaulukoista, jotka ovat riippumattomia asiakirjan rakenteesta. Oletus käyttäjäagenttityylit ovat esimerkki tästä, mutta ne rajoittuvat yksinkertaisiin typografisiin tehosteisiin ilman asettelumääritelmää. Tyylitaulukot ovat yleensä riippuvaisia ​​muotoiltavan asiakirjan rakenteesta, ja niitä on vaikea käyttää uudelleen eri strukturoiduissa asiakirjoissa. Tätä tyylien mahdollista riippumattomuutta asiakirjojen tiettyyn rakenteeseen hyödynnetään pikemminkin HTML CSS -mallien luomisen avulla.

Yleisemmin :

  • vaikeudet ja CSS-ominaisuuksien osan puuttuva käyttöönotto rajoittavat asettelun vapautta ja johtavat rajoittavien ominaisuuksien käyttöön HTML-rakenteen suhteen (esimerkiksi ominaisuus floatmäärää sisällön tarkan järjestyksen myös sarakkeeseen; monet renderöintivaikutukset perustuvat myös semanttisesti neutraaliin merkintöjen ylikuormitukseen, kuten divja span);
  • Yksittäisen rakenteen uudelleenkäyttöä eri medioissa tai materiaaleissa tyylitaulukoiden ansiosta rajoittaa itse sisältöön ja käyttäjäagenttien kykyyn renderoida liittyvät rajoitukset sekä tarve neuvotella asiakkaan ja palvelimen välillä. Erityiset sisällön, rakenteen ja renderöinnin mukauttamisprosessit käyttäjäagentin puolella ovat osoittautuneet tarpeellisiksi, kuten esimerkiksi Operan kehittämä ERA ( Extensible Rendering Architecture ) -teknologia . Internet Explorer seuraa samanlaista polkua versiolla 7, joka uudistaa verkkosivun tulostetun renderoinnin optimoidakseen sen.

Esteettömyys

CSS edistää verkkosivun esteettömyyttä antamalla käyttäjälle viime kädessä hallinnan asiakirjan renderoinnista selaimessaan: se on siten mahdollista mukauttaa rajoituksiin tai mieltymyksiin, jotka koskevat esimerkiksi merkkien tai värien näyttökokoa. Erottamalla rakenteen ja esityksen CSS edistää myös semanttisten jäsenneltyjen asiakirjojen kirjoittamista, joita tekniset apuvälineet voivat käyttää paremmin: otsikkoelementtien esittämisvapaus antaa mahdollisuuden esimerkiksi noudattaa tarkasti näiden muodollista hierarkkista järjestystä. puolestaan ​​antaa teknisten apuvälineiden luoda navigoitavan sisällysluettelon. Lopuksi, antamalla tekijöille keinot rikastuttaa tekstin muotoilua, CSS mahdollistaa kuviin asetettujen tekstien käytön rajoittamisen.

Jotkin CSS: n käyttötavat voivat kuitenkin vaarantaa sisällön saatavuuden:

  • korvaamalla sille pseudosisältö, joka on vain käyttäjien saatavilla, jotka voivat havaita visuaalisen CSS-renderöinnin: näin on esimerkiksi taustakuvilla välitettävällä informaatiolla;
  • häiritsemällä tarvittavaa johdonmukaisuutta jäsennellyn sisällön lineaarisen järjestyksen ja näytetyn CSS-renderöinnin visuaalisen järjestyksen välillä. Teknisillä apuvälineillä, kuten näytönlukuohjelmilla, on pääsy vain tähän lineaariseen järjestykseen: tiedot, jotka saisivat vain sen merkityksen CSS-sijaintinsa mukaan, eivät ole ymmärrettäviä heidän käyttäjilleen;
  • HTML- rakenteen merkityksellisyyteen perustuvassa lähestymistavassa helppokäyttöisyyteen sisällön muotoilun mahdollisuudet CSS: n avulla voivat unohtaa sisällön merkitsemisen merkityksellisillä elementeillä. Esimerkiksi lainaus on mahdollista rajata visuaalisesti laittamalla se kursiivilla tai ympäröimällä se lainausmerkeillä, mutta tiedot tämän tekstin alkuperästä ovat havaittavissa vain esteettömyysstandardien mukaisesti käyttämällä elementtejä q tai blockquote, jotka ovat ainoat, jotka sallivat määritellä HTML-viittauksen ja osoittaa sen lähteen asianmukaisen määritteen ( cite) kautta.

Menetelmien soveltamista Web-sisällön saavutettavuutta direktiivejä ( RGAA , Uwem esimerkiksi) siis määritellä säännöt käyttöä CSS-tyylejä.

Yksinkertaisuus

CSS reagoi haluun saada yksinkertainen esitysmuoto sekä toiminnallisuudeltaan että syntaksiltaan suoran manipuloinnin edistämiseksi kirjoittajien ja käyttäjien toimesta. Tätä yksinkertaisuutta kyseenalaistavat kuitenkin useat tekijät:

  • kaskadin tuloksen määrittämisen ja hallinnan vaikeus tyylien lähteiden lisääntyessä. Tietyn sisällön lopullinen renderointi riippuu useiden arkkien yhdistelmästä, ja sen muuttaminen voi sitten olla vaikeaa. Tyylitaulukoiden keskinäinen riippuvuus voi vaikeuttaa ennakoida toiselle tehdyn muokkauksen tulosta. Kirjoittajat joutuvat sitten valitsemaan tämän keskinäisen riippuvuuden välillä, joka optimoi koodin määrän, ja tyylien redundanssista, joka helpottaa sen ylläpitoa.
  • Käyttäjätyyppien kirjoittamisen vaikeus ilman edistyneitä taitoja. Teoriassa käyttäjät ovat CSS: n ensimmäisiä edunsaajia, mikä antaa heille mahdollisuuden mukauttaa verkkosivujen esitystä. Tyylimekanismi soveltuu kuitenkin tuskin graafisten ympäristöjen kehittämiseen, mikä helpottaisi CSS-ominaisuuksien manipulointia. Käytännössä käyttäjätyylien käyttö on siten marginaalista.

Standardointi

Kehykset

CSS-kehykset ovat valmiiksi valmisteltuja kirjastoja, joiden tarkoituksena on mahdollistaa verkkosivujen helpompi, standardien mukaisempi muotoilu CSS-tyylisivujen kieltä käyttäen. Niihin kuuluvat Blueprint , Bootstrap , Cascade Framework ja Foundation . Kuten ohjelmointikieli ja komentosarjakirjastot, CSS-kehykset sisällytetään yleensä ulkoisina .css-arkeina, joihin viitataan HTML: ssä "<head>". Ne tarjoavat useita valmiita vaihtoehtoja web-suunnitteluun ja ulkoasuun. Vaikka monet näistä kehyksistä on julkaistu, jotkut kirjoittajat käyttävät niitä ensisijaisesti nopeaan prototyyppien muodostamiseen tai oppimiseen ja suosivat "käsityönä" CSS: ää, joka sopii jokaiselle julkaistulle sivustolle ilman siihen liittyviä suunnittelu-, ylläpito- ja latauskustannuksia. . sivuston tyyliin.

Suunnittelumenetelmät

Projektissa käytettyjen CSS-resurssien koon kasvaessa kehitystiimin on usein päätettävä yhteisestä suunnittelumenetelmästä niiden järjestämiseksi. Tavoitteena on kehityksen helppous, yhteistyön helppous kehityksen aikana ja selaimessa olevien tyylitaulukoiden suorituskyky. Suosittuja menetelmiä ovat OOCSS (Object Oriented CSS), ACSS (Atomic CSS), oCSS (Organic Cascading Style Sheet), SMACSS (Scalable and Modular Architecture for CSS) ja BEM (Block, Element, Modifier).

Huomautuksia ja viitteitä

Huomautuksia

  1. alkuvuosina tehtiin suuri määrä tyylitekniikkaehdotuksia. Ainoastaan ​​kolme parasta mainitaan artikkelissa, mutta ne kaikki ovat vaihtelevassa määrin vaikuttaneet CSS: ään. Katso http://www.w3.org/Style/History/ .
  2. Yleisemmin: ”Monet web-talk-postituslistalle, ensimmäisen verkkoyhteisön sähköiseen kohtaamispaikkaan, osallistujat olivat yhtä mieltä siitä, että verkko hyötyisi tyylitaulukoista. Oli kuitenkin erimielisyyttä siitä, tarvitsiko hän uuden tyylitaulukielen vai riittääkö joku jo olemassa olevista, alun perin painotuotteita varten luotuista kielistä hänen tarpeisiinsa ”. Håkon Wium Lie, CSS- tyylilehdet , Väitöskirja toimitettu tohtorin filosofian tutkinnoksi, matematiikan ja luonnontieteiden tiedekunta, Oslon yliopisto, Norja , 2005, http://people.opera.com/howcome/2006/phd/#h -34 .
  3. Amayan edeltäjä , Arena, oli ensimmäinen W3C: n kehittämä selain alun perin HTML 3.0: n testaamiseen. Håkon Lie teki yhteistyötä sen kehittämisessä vuodesta 1994 lähtien, ja tämä selain ennakoi CSS2: n monia jatkokehityksiä. W3C hylkäsi testausalustan vuonna 1996, ja sitten Yggdrasil Computing ylläpiti Arenaa väliaikaisesti vuoteen 1998 asti. Katso http://www.w3.org/Arena/ .
  4. "Loppujen lopuksi ihmisten luku- ja kirjoituskyvyllä oli korkeampi lisäarvo kuin kyvyllä käyttää uudelleen olemassa olevia jäsentimiä", Håkon Wium Lie, Cascading Style Sheets, Matematiikan tiedekunnan tohtorinfilosofian tutkintoon lähetetty opinnäytetyö Luonnontieteet, Oslon yliopisto, Norja , 2005, http://people.opera.com/howcome/2006/phd/#ch-problems .
  5. Trident-renderointimoottori yhdistää itse asiassa kaksi grafiikan renderointitekniikkaa: CSS kilpailee "haslayout" -mekanismin kanssa, jonka käänteinen suunnittelu paljasti vuonna 2005 joukon riippumattomia kehittäjiä, jotka tutkivat renderöintivirheitä. Internet Explorer CSS Katso Ingo Chaon asettama ulkoasu , ja "HasLayout" -esittely (Markus Mielke, Microsoft).
  6. “Netscape viivästyttää huomattavasti tyylitaulukoiden kehittämistä verkossa julkaisemalla sen omat HTML-laajennukset vuonna 1996; ne tarjoavat värien, kirjasimen tai jopa vilkkuvan hallinnan (…) Netscape kannattaa yksinkertaisuutta: HTML-dokumenttien kirjoittajat hallitsevat tämän muodon, koska se on yksinkertainen; Siksi riittää, että integroit uusia yksinkertaisia ​​HTML-elementtejä asiakirjoihin esityksen hallitsemiseksi. », Daniel Glazman, CSS2, tyylisivut verkkoon , joulukuu 1998, Éditions Eyrolles.
  7. "Alusta lähtien Netscape oli ollut skeptinen tyylitaulukoita kohtaan, ja yrityksen ensimmäinen toteutus osoittautui puolimieliseksi yritykseksi estää Microsoftia väittämästä enemmän standardien mukaisia ​​kuin he itse. Netscape-toteutus tukee laajaa valikoimaa ominaisuuksia - esimerkiksi kelluvia elementtejä - mutta Netscape-kehittäjillä ei ollut aikaa testata kaikkia oletettavasti tuettuja ominaisuuksia. Tuloksena on, että monia CSS-ominaisuuksia ei voida käyttää Navigator 4: ssä. Bert Bos ja Håkon Lie, CSS-tyylilehdet , http://www.w3.org/Style/LieBos2e/history/ .
  8. "Vaikea toteutus on todellakin mahdollista, koska selainten maisema on alkanut muuttua: vaikka Microsoft näyttää käyttävän virtuaalista monopoliasemaa Internet Explorerin kanssa, elvytys on käynnissä. Todellakin, vaihtoehtoisia selaimia on tulossa (…) Mozilla 0.6: n, Opera 4: n ja jopa Internet Explorer 5: n kanssa aloitettu ajoissa, standardien HTML4, XHTML1, CSS, ECMASCRIPT (…) asteittainen käyttöönotto selaimissa on osoittautunut välttämättömäksi ylijäämien jälkeen edellisen kauden ajalta ”, Tristan Nitot ja Laurent Denis, esipuhe Zeldmanille 2006 .
  9. CSS2 tarjoaa mekanismin kirjasinten kuvaamiseen ja valitsemiseen verkosta. Ominaisuutta ei kuitenkaan käytetä paljon. Kaksi suurta syytä tähän voi olla: Ensinnäkin ei ole universaalia fontin muotoa, jota kaikki myyjät tukevat; ja toiseksi kirjasinsuunnittelija haluaa saada korvausta työstään eikä sopivaa maksumekanismia ole käytettävissä ” , Håkon Wium Lie, Cascading Style Sheets , Väitöskirja toimitettu tohtorin filosofian tutkinnoksi, matematiikan ja luonnontieteiden tiedekunta, Oslon yliopisto, Norja , 2005, http://people.opera.com/howcome/2006/phd/#ch-problems .
  10. “CSS Zen Gardenin julkaisun jälkeen tekniikat ovat näyttäneet korvaavan kuvat turvautumatta alueeseen. Tämän seurauksena suurinta osaa jännite-elementeistä ei enää tarvita. Ja koska ylimääräisiä luokkia ei käytetä 98 prosentissa toimitetuista malleista, ne ovat myös tarpeettomia. Luettelo tyhjistä div- ja span-elementeistä asiakirjan lopussa on myös tarpeeton, lukuun ottamatta suunnittelijalle tarjottuja avautumismahdollisuuksia. », Shea ja Holzschlag 2005 .
  11. CSS1 tarjoaa esimerkin erityisesti selaimille tarkoitetuista tyyleistä: HTML 2.0 -tyylitaulukko . CSS2 määrittelee tyypillisen mutta ohjeellisen tyylitaulukon tälle käytölle: HTML 4 : n oletustyylitaulukko . XHTML2.0: n avulla näistä tyypillisistä tyyleistä tulee todennäköisesti normatiivisia: XHTML 2 : n tyylitaulukko .
  12. “  Kuvat olivat kuitenkin myös uhka verkolle. Suunnittelijat alkoivat koodata tekstiä kuviin saavuttaakseen tietyt fontit tai muut erikoistehosteet. Jotta HTML pysyisi loogisena merkintäkielenä (toisin kuin esityskieli), tarvittiin tyylitaulukieli. Joten motivaatio tyylisivujen kehittämiseen oli kaksinkertainen: halusimme antaa kirjoittajille heidän haluamansa esitysvaikutukset ja samalla estää HTML: n liukumasta abstraktin tikkailta esityskieleksi  ", Håkon Wium Lie: n haastattelu, 31. maaliskuuta 2005, http: //www.webstandards.org/2005/03/31/interview-with-hkon-wium-lie/ .

Viitteet

  1. "  CSS-tyylisivut  " , Le Grand Dictionnaire terminologique , Office québécois de la langue française .
  2. Tim Berners-Lee, WorldWideWeb-selain .
  3. Cascading Style Sheets, suunnittelu verkkoon , Håkon Wium Lie ja Bert Bos ( ISBN  978-0-201-59625-0 ) .
  4. Sähköpostiviesti <[email protected]> .
  5. Sähköpostiviesti <[email protected]> .
  6. CSS-tyylitaulukot - ehdotus .
  7. Håkon Wium Lie, Cascading Style Sheets, Opinnäytetyö toimitettu tohtorin filosofian tutkinnolle, matematiikan ja luonnontieteiden tiedekunta, Oslon yliopisto, Norja , 2005, http://people.opera.com/howcome/2006/phd/# h-28 .
  8. JavaScript-pohjaiset tyylitaulukot .
  9. "  HyperText Markup Language Specification 3.0  " osoitteessa www.w3.org (käytetty 15. marraskuuta 2020 )
  10. Argo, jonka loi Bert Bos elokuussa 1994, oli osa Groningenin yliopiston verkkoprojektia . Katso http://www.w3.org/People/all#bert .
  11. Tämän luettelon CSS-kehitykseen tarkoitetut arkistot ovat saatavilla osoitteessa http://lists.w3.org/Archives/Public/www-style/ .
  12. Raportti W3C-tyylisivutyöpajasta, Pariisi '95 .
  13. Voit lähettää vain vikoja sisältävän ohjelmiston uuden vakaan version julkaisemiseksi, koska se on versioitu. Seuraava versio korvaa vanhan. Voit aina korjata jäljellä olevat virheet seuraavassa versiossa. CSS: llä ei ole versioita. CSS2.1: n määrittelyssä on ongelmia, joita ei voida korjata CSS3: ssa, paitsi ehkä lisäämällä todella sekavia kytkinsarjoja. CSS3 ei voi muuttaa mitään CSS2.1: ssä, se voi rakentaa vain sen päälle. , Mitä CSS-työryhmä tekee? , CSS-tyylitaulukoiden työryhmäblogi  ”, 2. heinäkuuta 2007.
  14. "  Cascading Style Sheets, level 1  " , osoitteessa www.w3.org (käytetty 15. marraskuuta 2020 )
  15. CSS-tyylitaulukot, taso 1, tiivistelmä, http://www.w3.org/TR/REC-CSS1 .
  16. Kellukkeita oli tarkoitus käyttää pienten sisältöpalojen poistamiseen virtauksesta ja lopun tekstin antamisen niiden ympärille. Niitä ei ollut tarkoitettu käytettäväksi sivun pääsisältöön, eikä niitä ollut suunniteltu sitä varten. Siitä huolimatta kelluvien käyttö sivun pääsisältöön on nykyään melko yleistä  ”. David Baron, W3C CSS -työryhmän jäsen, Kellukkeiden liikakäyttöä pidetään haitallisena .
  17. "Program Manager" ja sitten "  Platform Architect Internet Explorerin Platform joukkue  ", Chris Wilson on vuodesta 1996 yksi tärkeimmistä pelaajista CSS kehittämiseen. Katso http://blogs.msdn.com/cwilso/ .
  18. vrt. CSS1 Test Suite, versiohistoria, http://www.w3.org/Style/CSS/Test/CSS1/current/vhistory .
  19. Henri Sivonen, Oikean asettelutilan aktivointi Doctype-ilmoituksen avulla .
  20. Positioning HTML Elements CSS, W3C Working Draft, 1997 .
  21. Daniel Glazman, "HTML- ja CSS-standardit alkuperästä viime keskiviikkoon", http://disruptive-innovations.com/zoo/slides/20060922/ .
  22. Håkon Wium Lie, Cascading Style Sheets, Opinnäytetyö toimitettu tohtorin filosofian tutkinnolle , matematiikan ja luonnontieteiden tiedekunta, Oslon yliopisto, Norja , 2005, http://people.opera.com/howcome/2006/phd/# h-339 .
  23. Tietoja CSS 2.1 -määrityksestä, CSS 2.1 vs CSS 2, http://www.w3.org/TR/CSS21/about.html#css2.1-v-css2 .
  24. Kelluva, selkeä ja muotoileva konteksti, Blog & Blues, kesäkuu 2006 "Arkistoitu kopio" (versio päivätty 23. heinäkuuta 2018 Internet-arkistossa ) .
  25. Ei ole epäilystäkään siitä, että löydämme silti (pieniä) virheitä erittelystä, mutta kun otetaan huomioon äskettäin korjattujen virheiden tyyppi, meillä on syytä uskoa, että tekniset tiedot ovat riittävän hyvät toteuttajille ja käyttäjille. Haluamme ihmisten aloittavan CSS 2.1: n toteuttamisen ja käytön todellisuudessa (ja tietysti kertoa meille kaikista jäljellä olevista ongelmista, tietysti)  ", Bert Bos, CSS 2.1 -editori, http://www.w3.org/blog/CSS/2007/ 07 / 20 / cssan2_1_is_a_candidate_recommendation .
  26. David Hammondin toteuttamiskatsaukset, verkkoselaimen standardien tuki .
  27. Tällaisissa tapauksissa käyttäjäagentti voi toteuttaa CSS: n osajoukon. CSS: n alaryhmät rajoittuvat valittujen CSS-moduulien yhdistämiseen, ja kun moduuli on valittu, kaikkia sen ominaisuuksia on tuettava . ”, CSS3: n esittely , http://www.w3.org/TR/css3-roadmap/#whymods .
  28. Cascading Style Sheets Current Work , http://www.w3.org/Style/CSS/current-work .
  29. “  Avoin ryhmä voi toistaa paljon nopeammin kuin suljettu ryhmä. Kun avoin ryhmä saamme toteutuksia, palaute, testejä ja keskustelua heti, eikä odottaa kuukausia ja sitten vedetään takaisin verhon ja esittää tosiasiana, jossa pisteitä kommentteja käsitetään pikemminkin tuskaa kuin hyötyä.  » , Ian Hickson, http://ln.hixie.ch/?start=1181118077&count=1 .
  30. Daniel Glazman, vaatii uutta CSS-vallankumousta .
  31. CSS-taustat ja reunukset -moduuli, taso 4 (toimittajan luonnos 1. huhtikuuta 2010) .
  32. Valitsimet, taso 4 .
  33. (en) Tunnustetut mediatyypit CSS-tyylitaulukot, taso 2, versio 1, eritelmä .
  34. Mediakyselyt .
  35. (in) väitöskirja: CSS-tyylilehdet .
  36. Andy Budd ja Emil Björklund, CSS Mastery , Apress,26. heinäkuuta 2016( lue verkossa )
  37. http://www.design-fluide.com/21-09-2011/le-css-oriente-objet-explain-avec-mrante-patate/
  38. "  Hyviä käytäntöjä CSS: ssä: BEM ja OOCSS  " , aiheesta Alsacréations ( käyty 9. marraskuuta 2020 ) .
  39. CSS Zen -puutarha .
  40. CSS Zen Gardenin kattava suunnitteluluettelo .
  41. Shea ja Holzschlag 2005 , s.  14.
  42. Esimerkiksi RGAA-testi Elementtien kokoelmana näytettävien tietojen saavutettavuus CSS-tyylien kautta .
  43. Dave Shea, (sisään) irtisanominen vs. Riippuvuus .
  44. (in) Håkon Wium Lie, CSS- tyylilehdet , opinnäytetyö toimitettu tohtorin filosofian tutkinnolle, matematiikan ja luonnontieteiden tiedekunta, Oslon yliopisto, Norja, vuonna 2005 , http://people.opera.com/howcome/2006 / phd / # h-337 .
  45. (in) Dan Cederholm Etan Marcotte , käsityönä CSS: Lisää Bulletproof Web Design , New Riders,9. huhtikuuta 2010( ISBN  978-0-13-210481-4 , lue verkossa )
  46. "  OOCSS, ACSS, BEM, SMACSS: mitä ne ovat? Mitä minun pitäisi käyttää? - clubmate.fi  ” , web.archive.org ,2. kesäkuuta 2015(käytetty 29. maaliskuuta 2021 )

Katso myös

Bibliografia

  • Jeffrey Zeldman ( trans.  , Englanti) Web design: käyttö vakio , Pariisi, Eyrolles ,Marraskuu 2006, 381  Sivumäärä ( ISBN  978-2-212-12026-4 )
  • Dave Shea ja Molly Holzschlag , Le Zen des CSS , Eyrolles ,17. marraskuuta 2005( ISBN  978-2-212-11699-1 )
  • Andy Budd , Cameron Mall ja Simon Collison ( trans.  Vuodesta Englanti), Master CSS , Pariisi, Pearson ai.  "Kampus",2010, 2 nd  ed. , 290  Sivumäärä ( ISBN  978-2-7440-2400-9 )
  • (en) Håkon Wium Lie , CSS , Oslon yliopisto ,2005, Väitöskirja ( lukea verkossa [ arkisto4. lokakuuta 2014] )
  • (en) Håkon Wium Lie ja Bert Bos , CSS- tyylilehdet : Suunnittelu verkkoon ,1999, 396  Sivumäärä ( ISBN  978-0-201-59625-0 )
  • Raphaël Goetter , Memento CSS3 , Eyrolles ( ISBN  978-2-212-13281-6 )
  • (en) Cascading Style Sheetsin , Pierre Genevesin , Nabil Layaidan ja Vincent Quintin analyysistä, Proceedings of the 21st International Conference on World Wide Web (WWW'12), s.  809-818 , 2012.

Aiheeseen liittyvät artikkelit

Ulkoiset linkit

  • (en) W3Schoolsin CSS-viite , viitteet, käyttö, testit ja selainten tuki.
  • (en) CSS-kehys - valmiiksi valmistellut kirjastot, joiden tarkoituksena on mahdollistaa verkkosivujen helpompi ja standardien mukainen muotoilu CSS-tyylisivujen kielellä

W3C- suositukset