Главная » CSS » Сброс CSS

Сброс CSS

Хитрости 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




 

Рекомендую также:

Нашли это полезным? Поделитесь с другими!

Комментарии Facebook:

Оставить комментарий :
"Сброс CSS"

Правила комментирования

  1. Кoммeнтapий всегда проходит премодерацию.
  2. В поле "URL блога" можно указывать только ссылку на главную страницу вашего блога. Ссылки на прочие веб-ресурсы (в том числе блоги/сплоги, созданные не для людей) будут удалены.
  3. Запрещается использовать в качестве имени комментатора слоганы/названия сайтов, рекламные фразы, ключевые и т.п. слова. В случае несоблюдения этого условия имя изменяется по усмотрению владельца блога. Просьба указывать нормальное имя или ник.
  4. Весьма вероятно, что короткий и неинформативный кoммeнтapий вида "Спасибо!", "Интересная статья", будет удален. Исключение составляют знакомые автору блога комментаторы.