понедельник, 20 декабря 2010 г.

Границы странички на CSS

Интересная и простая реализация границ страниц реализованная на чистом CSS. Суть в применении серии элементов<b> с фиксированными позициями, что создает иллюзию фиксированной границы.
Пример тут: http://jsfiddle.net/hrwFn/
/*------------------------------------*\
 BORDERS
\*------------------------------------*/

/* Create a series of empty pseudo-elements... */
html:before,html:after,body:before,body:after{
 content:"";
 background:#dad8bb;
 position:fixed;
 display:block;
 z-index:5;
}

/* ...and position them! */
html:before{
 height:10px;
 left:0;
 right:0;
 top:0;
}
html:after{
 width:10px;
 top:0;
 right:0;
 bottom:0;
}
body:before{
 height:10px;
 right:0;
 bottom:0;
 left:0;
}
body:after{
 width:10px;
 top:0;
 bottom:0;
 left:0;
}

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

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