Strelban’s Blog.

5 Удобных CSS Reset Техник

Reset CSS – сброс стилей, устанавливаемых по-своему разными браузерами. Очень помогает тем, кто хочет, чтобы его сайт нормально выглядел не только у пользователей Internet Explorer.

1. Reset CSS от Chris Poteet

* {
    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;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}

2. Reset 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 {
    padding: 0;
    margin: 0;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
fieldset,img {
    border: 0;
}
address,caption,cite,code,dfn,em,strong,th,var {
    font-weight: normal;
    font-style: normal;
}
ol,ul {
    list-style: none;
}
caption,th {
    text-align: left;
}
h1,h2,h3,h4,h5,h6 {
    font-weight: normal;
    font-size: 100%;
}
q:before,q:after {
    content:'';
}
abbr,acronym { border: 0;
}

3. CSS Reset от Eric Mayer

html, body, div, span, applet, object, iframe, table, caption,
tbody, tfoot, thead, tr, th, td, del, dfn, em, font, img, ins,
kbd, q, s, samp, small, strike, strong, sub, sup, tt, var,
h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr,
acronym, address, big, cite, code, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend {
    vertical-align: baseline;
    font-family: inherit;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    outline: 0;
    padding: 0;
    margin: 0;
    border: 0;
}
:focus {
    outline: 0;
}
body {
    background: white;
    line-height: 1;
    color: black;
}
ol, ul {
    list-style: none;
}
table {
    border-collapse: separate;
    border-spacing: 0;
}
caption, th, td {
    font-weight: normal;
    text-align: left;
}
blockquote:before, blockquote:after, q:before, q:after {
    content: "";
}
blockquote, q {
    quotes: "" "";
}

4. Сбрасываем стили вместе с Tantek Celik

:link,:visited { text-decoration:none }
ul,ol { list-style:none }
h1,h2,h3,h4,h5,h6,pre,code { font-size:1em; }
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input
{ margin:0; padding:0 }
a img,:link img,:visited img { border:none }
address { font-style:normal }

5. Сбрасываем стили, как это всегда делает Christian Montoya

html, body, form, fieldset {
    margin: 0;
    padding: 0;
    font: 100%/120% Verdana, Arial, Helvetica, sans-serif;
}
h1, h2, h3, h4, h5, h6, p, pre,
blockquote, ul, ol, dl, address {
    margin: 1em 0;
    padding: 0;
}
li, dd, blockquote {
    margin-left: 1em;
}
form label {
    cursor: pointer;
}
fieldset {
    border: none;
}
input, select, textarea {
    font-size: 100%;
    font-family: inherit;
}

Вы также можете ознакомиться с докладом Вадима Макеева «CSS-изначальности: фреймворки, reset.css» на встрече WSG Russia в прошлом году (Видео)

–
На других блогах тем временем:

• Шесть вещей, которые не скажут вам клиенты – Интересно, правда? Лондонский бурундук ждет, когда вы ознакомитесь с заметкой.
• Бурнис разошелся. Анализирует блоги направо и налево
• Работа во время кризиса – Макс Ищенко – одних из авторов блога разработчиков developers.org.ua – публикует результаты опроса об увольнениях, зарплатах, падении курса валюты и настроении во время “кризиса”.

До новых встреч, уважаемые!

Опубликовано: 15 December 2008    Тема: css

Ссылка на этот пост для блога:

Ссылка для форума:

Постоянная ссылка на пост:

Дополнить запись своим комментарием
Подписаться на обновления по RSS

Предыдущая запись: Новый Браузер Google Chrome – Плюсы, Минусы и Как Жить Дальше — Следующая запись: Самый Простой Способ Победить СПАМ