Vai ai contenuti

LAU



Home > realizzare > accessibilità: fogli di stile > CSS Master: azzerare i valori di default dei fogli di stile dei browser


CSS Master: azzerare i valori di default dei fogli di stile dei browser

Tecniche CSS per neutralizzare gli stili di default dei browser.

A cura di: Vincenzo Mania | 30 giugno 2008


Per chi non lo sapesse un CSS Master è un foglio di stile che contiene delle regole che neutralizzano il foglio di stile di default dei browser. L'adozione di un CSS Master agisce dunque sul posizionamento e sui comportamenti degli elementi HTML riportando ad esempio margin e padding a 0, rimuovendo gli stili e le dimensioni del testo nonché i comportamenti di default di ogni tag HTML.

Il CSS Master va richiamato nella sezione HEAD come qualsiasi altro CSS. L'adozione di un CSS Master vi consentirà di ridefinire all'interno del vostro vero CSS l'aspetto dei vostri elementi HTML a prescindere dalla resa di default del browser, ottendendo così un comportamento uguale su tutti i browser.

Eric Mayer [link esterno] mette a disposizione degli sviluppatori web un CSS Master:

/*Non dimenticare di settare un colore 
di primo piano e di sfondo sull'elemento
'html' o 'body'*/
html, body, div, span,
applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dd, dl, dt, li, ol, ul,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, 
tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	line-height: 1;
	font-family: inherit;
	text-align: left;
	vertical-align: baseline;
}
a img, :link img, :visited img {
	border: 0;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
ol, ul {
	list-style: none;
}
q:before, q:after,
blockquote:before, blockquote:after {
	content: "";
}

come pure il team di sviluppatori di Yahoo [link esterno] all'interno delle librerie UI:

body,div,dl,dt,dd,ul,ol,li,
h1,h2,h3,h4,h5,h6,pre,form,
fieldset,input,textarea,p,
blockquote,th,td { 
	margin:0;
	padding:0;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img { 
	border:0;
}
address,caption,cite,code,
dfn,em,strong,th,var {
	font-style:normal;
	font-weight:normal;
}
ol,ul {
	list-style:none;
}
caption,th {
	text-align:left;
}
h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:normal;
}
q:before,q:after {
	content:'';
}
abbr,acronym { border:0;
}

David Rodriguez [link esterno], in un articolo pubblicato nel maggio del 2008 espone vantaggi e svantaggi di questa pratica e conclude il suo articolo sostenendo che il CSS Master è solo uno strumento che ogni sviluppatore può decidere o meno di utilizzare secondo il suo personale metodo di progettazione.

L'adozione di un CSS Master infatti, se da un lato ci assicura una buona compatibilità cross browser dall'altro lato richiede tempi più lunghi nello sviluppo del CSS dovuti al fatto che bisognerà necessariamente ridefinire tutti gli elementi HTML utilizzati all'interno del nostro progetto.

torna su

[ Torna all’inizio della pagina ]



Sito realizzato dal Laboratorio di Accessibilità e Usabilità del CSI-Piemonte - Privacy, cookies e accessibilità

[ Torna all’inizio della pagina ]