Izmantojiet CSS, lai noliegtu robežas un robežas

Kas jāzina

  • Pievienojiet savai CSS stila lapai kārtulu, ar kuru visas HTML elementu piemales un pildījuma vērtības tiek iestatītas uz nulli.

Šajā rakstā ir paskaidrots, kā to izmantot CSS līdz nullei piemales un apmales, lai jūsu tīmekļa lapas vienmērīgi tiktu attēlotas katrā pārlūkprogrammā.

Marginu un polsterējuma vērtību normalizēšana

Labākais veids, kā atrisināt nekonsekventa lodziņa modeļa problēmu, ir iestatīt nulles visas HTML elementu piemales un pildījuma vērtības. Ir daži veidi, kā to izdarīt, ir pievienot šo CSS kārtulu savai stila lapai:


Lai gan šī kārtula nav konkrēta, jo tā ir jūsu ārējā stila lapā, tai būs augstāka specifika nekā pārlūkprogrammas noklusējuma vērtībām. Tā kā šie noklusējumi ir tas, ko jūs pārrakstāt, šis viens stils izpildīs to, ko jūs plānojat darīt.

Kad esat izslēdzis visas piemales un polsterējumu, jums tās selektīvi atkal jāieslēdz noteiktām jūsu tīmekļa lapas daļām, lai iegūtu izskatu un sajūtu, ka jūsu dizains to prasa.

Izmantojiet CSS, lai normalizētu robežas

instagram viewer

Vecāki Internet Explorer versijas bija caurspīdīga vai neredzama robeža ap elementiem. Ja apmale nav iestatīta uz 0, šī apmale var sajaukt jūsu lapu izkārtojumus. Ja esat nolēmis turpināt atbalstīt šīs novecojušās IE versijas, jums tas būs jārisina, ķermenim un HTML stiliem pievienojot sekojošo:

HTML, body {
piemale: 0px;
polsterējums: 0px;
apmale: 0px;
}

Līdzīgi tam, kā izslēdzāt piemales un polsterējumu, arī šis jaunais stils izslēgs noklusējuma apmales. Jūs varētu darīt arī to pašu, izmantojot aizstājējzīmju atlasītāju, kas parādīts rakstā iepriekš.

Kāpēc tīmekļa dizainā ir konsekventas robežas un robežas?

Mūsdienu tīmekļa pārlūks ir aizgājis tālu no trakajām dienām, kad vēlēšanās bija jebkura veida pārlūkprogrammu konsekvence. Mūsdienu tīmekļa pārlūkprogrammas pilnībā atbilst standartiem. Viņi lieliski spēlē kopā un nodrošina diezgan konsekventu lapas attēlojumu dažādās pārlūkprogrammās. Tas ietver jaunākās Google Chrome, Microsoft Edge, Mozilla Firefox, Opera, Safari un dažādu pārlūkprogrammu versijasneskaitāmas mobilās ierīces šodien piekļūstot vietnēm.

Kaut arī pārlūkprogrammas CSS attēlošanā noteikti ir panākts progress, starp šīm dažādajām programmatūras opcijām joprojām ir pretrunas. Viena no izplatītākajām neatbilstībām ir tas, kā šīs pārlūkprogrammas pēc noklusējuma aprēķina piemales, pildījumu un apmales.

Tā kā šie lodziņa modeļa aspekti ietekmē visus HTML elementus un tāpēc, ka tie ir būtiski lapas veidošanā izkārtojumi, nekonsekvents displejs nozīmē, ka lapa vienā pārlūkprogrammā var izskatīties lieliski, bet iekšā - nedaudz izslēgta cits. Lai cīnītos ar šo problēmu, daudzi tīmekļa dizaineri normalizē šos kastes modeļa aspektus. Šī prakse ir pazīstama arī kā nulle piemales vērtības, polsterējums, un robežas.

Piezīme par pārlūkprogrammas noklusējumiem

Katrā tīmekļa pārlūkprogrammā tiek iestatīti noklusējuma iestatījumi noteiktiem lapas attēlojuma aspektiem. Piemēram, hipersaites pēc noklusējuma ir zilas un pasvītrotas. Šī uzvedība ir konsekventa dažādās pārlūkprogrammās, un, lai arī to lielākā daļa dizaineru maina, lai atbilstu dizainam konkrētā projekta vajadzībām, tas, ka viņi visi sāk ar vieniem un tiem pašiem noklusējuma gadījumiem, atvieglo šo darbību veikšanu izmaiņas. Diemžēl noklusējuma vērtībai piemales, polsterējums un apmales nav vienāda līmeņa pārlūkprogrammu konsekvence.