Gaurko web-arakatzaileak bide luzea egin du, cross-browser koherentzia edozein motatako ilusio pentsamenduak gogotsu egun ero batetik. Gaurko web arakatzaile guztiak oso estandarrak betetzen dira. Elkarrekin jolastea oso ondo eta nabigatzaile desberdinetan orrien konbinazio koherentea eskaintzen dute. Honek Google Chrome, Microsoft Edge, Mozilla Firefox, Opera, Safari bertsioak eta gaur egun sartzeko erabiltzen diren gailu mugikorretan aurkitutako nabigatzaile ugari biltzen ditu .
Nabigatzaileei eta CSS-k nola erakusten duten aurrerapenari esker, software-aukeren artean desberdintasunak daude oraindik. Konstruktibotasun arruntetako bat nabigatzaile horiek nola kalkulatzen diren marjinak, estalkiak eta mugak modu lehenetsian daude.
Kaxa-eredu horren alderdi guztiek HTML elementu guztiak eragiten dituzte, eta ezinbestekoak dira orrien diseinuak sortzeko, pantaila desegokiak esan nahi du orriek arakatzaile batean handia izan dezaketela, baina apur bat beste batean begiratu. Arazo horri aurre egiteko, web diseinatzaile askok kutxa ereduaren alderdi hauek normalizatzen dituzte. Praktika hau "marruskadurak, marruskadurak eta mugak" balioak "zeroatzeaz" ere deitzen zaie.
Arakatzailearen lehenetsitako ohar bat
Web arakatzaile guztiek dute ezarpen lehenetsiak orri baten pantailako alderdi jakin batzuei. Adibidez, hiperestekak urdina eta azpimarratuta daude lehenespenez. Nabigatzaile desberdinetan koherentea da, eta diseinatzaile gehienek beren proiektu espezifikoen diseinuaren beharrei aldatzen duten arren, lehenespen berdinekin hasten direnak aldaketa horiek errazago egitea eragiten du. Zoritxarrez, marjinen, betegarrien eta mugen balio lehenetsiak ez du gurutzagunetako koherentzia maila bera.
Marjinen eta betegarrien balioak normalizatzea
Kurben eredu inkontzientearen arazoa konpontzeko modurik onena HTML elementuen marjinak eta betegarrien balioak zero ezartzea da. Horrelako modu batzuk daude zure CSS arau hau zure estilo-orriari gehitzeko:
* {marjina: 0; betegarria: 0; }CSS arau honek * edo komodin karakterea erabiltzen du. Karaktere honek "elementu guztiak" esan nahi du eta funtsean HTML elementu bakoitza hautatuko luke eta marjinak eta betegarria 0. Arrazoia oso zehatza ez bada ere, zure kanpoko estilo-orrian badago, arakatzaile lehenetsia baino zehaztasun handiagoa izango du balioak. Lehenespenez gain, gainidazten ari zarenaz geroztik, estilo honek zer egiten ari zaren ezartzen du.
Beste aukera bat HTML eta gorputzeko elementuetan balio horiek aplikatzea da. Zure orriko beste elementu guztiek bi elementu hauetakoren bat izango delarik, CSS kaskadak balore hauek beste elementu guztietara aplikatu beharko lituzke.
html, body {marjina: 0; betegarria: 0; }Honek zure diseinua hasiko du leku berean nabigatzaile guztietan, baina gogoan izan behar da marjinak eta estalkiak behin pizten direnean behin eta berriz berriro aktibatzea zure webguneko atal zehatzetara begirada lortzeko eta sentitzen zure diseinua deiak.
Mugarik
Baliteke pentsatzea "baina nabigatzaileek ez dute mugikorraren gorputz-elementua lehenespenez". Hau ez da zorrotz egia. Internet Explorerren bertsio zaharragoek elementuen inguruko mugako gardena edo ikusezina dute. Mugak 0 ezarri ezean, ertzak zure orriaren diseinuak nahastu ditzake. IEko antzinako bertsio hauek onartzen jarraitzen baduzu, hau zuzendu beharko duzu zure gorputzarekin eta HTML estiloekin:
HTML, gorputza {
marjina: 0px;
betegarria: 0px;
mugan: 0 px;
}
Marjinak eta estalkiak nola desaktibatuta dauden bezala, estilo berri honek mugak lehenetsiko ditu. Era berean, gauza bera egin dezakezu artikuluaren hasieran agertzen den komodin-selektorea erabiliz.
Jennifer Krynin-en jatorrizko artikulua. Jeremy Girard-ek argitaratua 7/27/16.