1. Reset CSS от Chris Poteet
[sourcecode language='css']

* {
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;
}
[/sourcecode]

2. Reset CSS от Yahoo
[sourcecode language='css']

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;
}
[/sourcecode]

3. CSS Reset от Eric Mayer
[sourcecode language='css']
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: “” “”;
}
[/sourcecode]

4. Сбрасываем стили вместе с Tantek Celik
[sourcecode language='css']
: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 }
[/sourcecode]

5. Сбрасываем стили, как это всегда делает Christian Montoya
[sourcecode language='css']

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;
}
[/sourcecode]

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

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

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

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

Больше или меньше стандартного. Причины этого я рассматривать не буду, задача этой заметки немного другая.

При увеличении(или уменьшении) стандартного размера шрифта, меняется размер текста. Но размеры изображений остаются неизменными. Такую проблему можно легко решить с помощью CSS:

Здесь представлены два изображения: размер верхней неизменен, а вот нижняя будет становиться меньше или больше, в зависимости от размера текста, который определяет пользователь.

Единственное различие между верхней и нижней картинкой в добавленном css-коде, указывающим ее размер в em единицах:
style="width: 14.29em; height: 9.5em;"
Попробуйте поменять стандартный размер шрифта (нажав сочетание клавиш “Ctrl +” или “Ctrl -”, например ) и посмотрите результат.

Для вычисления размера в единицах em удобно пользоваться em calculator

Спасибо за ваше внимание.
До встречи в следующих заметках на Блоге Стрельбана.

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

• Вся правда о блогах – от Arser, который ходит на работу в интернет.
• 3 сервиса для создания он-лайн презентаций – небольшой обзор от Уникального человека
• Интернет маркетинг для директоров от Саминского Алексея