Сброс CSS


Перед тем, как создавать новый документ со стилями, которые будут отвечать за форматирование вашего сайта или одной отдельной страницы, нужно выполнить сброс CSS. Как вы уже наверное догадываетесь при таком количестве браузеров, в которых может просматривать ваш будущий сайт посетители, сам документ со стилями может приводить к разным результатам. Все дело в том, что перед тем как применять слили к вашим страницам браузер устанавливает некоторые параметры для различных HTML-элементов в свои собственные начальные значения. Именно начальные (дефолтовые) знамения для различных HTML-элементов , различных в разных браузерах, и создают ситуацию, когда результат буден совершенно неодинаков.

Такие правила как margin, padding и line-height, выставленные по умолчанию по разному, создадут разный результат. Для того, чтобы избежать ошибок, необходимо выполнить в самом вначале документа со стилями глобальный сброс.
Существует несколько вариантов, которые вы можете применить для того, чтобы сбросить все правила

Сброс CSS от Эрика Мэйера

/* http://meyerweb.com/eric/tools/css/reset/ 
v2.0 | 20110126
License: none (public domain)
*/

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, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

источник

Сброс CSS от Yahoo!

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;
}

источник

Сброс CSS от Siolon Browser!

/*

Reset Default Browser Styles
- Place first in the listing of external style sheets for cascading.
- Be sure to explicitly set margin/padding styles.
- Styles are not reset that have to do with display (block, inline) are not reset.

By: Chris Poteet & various influences

*/

* {
vertical-align: baseline;
font-family: inherit;
font-style: inherit;
font-size: 100%;
border: none;
padding: 0;
margin: 0;
}
body {
padding: 5px;
}
h1, h2, h3, h4, h5, h6, p, pre, blockquote, form, ul, ol, dl {
margin: 20px 0;
}
li, dd, blockquote {
margin-left: 40px;
}
dt {
font-weight: bold;
}
table {
border-collapse: collapse;
border-spacing: 0;
}

источник

 

И ещё пара полезных ссылок:

  1. A Killer Collection of Global CSS Reset Styles;
  2. Less is more — my choice of Reset CSS(Эд Эллиот).
  3. Сброс стилей с помощью CSS Reset

 

Реклама
Поделиться
Качественные премиум темы и шаблоны для Вашего сайта:

Смотреть полный каталог качественных тем и шаблонов

Здесь Вы можете выбрать из более чем 46 000 готовых дизайнов. Шаблоны сайтов + установка + хостинг + персонализация + поисковая оптимизация + копирайтинг — все эти услуги вы всегда можете получить от профессионалов мирового уровня!

Добавить коментарий

семнадцать − тринадцать =