ENGLISH | | | БЛОГ

CSS-фреймворки. Часть 1

Автор: Кирилл Панфилов

Любое удачное технологическое решение постоянно находит применение. Если это общепринятая технология, как язык разметки или программирования, то рано или поздно в ней формируются целые наборы постоянно используемых фрагментов кода, которые нет смысла повторять от раза к разу. Наборы кода, выполняющие часто используемые задачи, собираются во фреймворки — файлы или наборы файлов, которые можно включать в свои проекты, особо не задумываясь о том, как это работает. Есть такие фреймворки и в CSS.

Например, я всегда, начиная писать CSS-код для проекта, начинаю его набором правил вроде следующих:

/* General Cleaning */

* {margin:0;
	padding:0;
	font-family:Verdana, Arial, Helvetica, Sans-Serif;
	font-size:9pt;
	}
body {
	background-color:#b5e0fe;
	}
table, img {
	border:0;
	}
table {
	border-collapse:collapse;
	}
table td {
	padding:0px;
	vertical-align:top;
	}
div {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	}

a, a:link, a:visited, a:active {
	color:#1e8cdc;
	}
a:hover {
	color:#52bef5;
	}

/* Special Elements */

Если в нескольких словах описать то, что делает этот код — убирает все отступы у всех объектов, в том числе и у тела документа, и у ячеек таблиц, рамки у изображений и таблиц, назначает размер и гарнитуру шрифта, исправляет некоторые браузерные разночтения в ширине и высоте блоков, назначает корректные выравнивания и цвета ссылок.
Несомненно, такой код не претендует на полноценный фреймворк, но избавляет от большого количества рутинной работы.

VN:F [1.0.9_379]
Рейтинг: 5.0/5 (голосов: 2)

Метки:

Оставить комментарий

CAPTCHA Image Audio Version
Reload Image

 

Copyright © 1999–2012 LAR