WP-THEME.EU

Темы для WordPress европейского качества

Pамки в тройном измерении (3D)

Для особого эффекта наших таблиц, создаём рамки на базе CSS и HTML.

Преимущество, безусловно, в том, что не требуется применения графических изображений, а эффект, тем не менее, остаётся.

Наглядное пособие

Слева код, справа таблица с рамкой.

Создание

Создаем файл HTML, и рисуем таблицу.

Код страницы:

<!DOCTYPE html PUBLIC «-//W3C//DTD XHTML 1.0 Transitional//EN» «http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd»>

<html xmlns=»http://www.w3.org/1999/xhtml»>

<head>

<meta http-equiv=»Content-Type» content=»text/html; charset=utf-8″ />

<title>Рамка в тройном измерении</title>

<link href=»style-3d.css» rel=»stylesheet» type=»text/css» />

</head>

<body>

<table cellpadding=0 border=6>

<tr>

<td class=»3drahmen»>Пирамида</td>

</tr>

</table>

</body>

</html>

Далее создаём внешний список стилей под названием style-3d.css, в одной папке с основным файлом. Список стилей привязан к файлу в нашем примере.

Код списка стилей:

@charset «utf-8»;

.3drahmen {

border-top: solid #999999 6px;

border-left: solid #999999 6px;

border-bottom: solid #dddddd 6px;

border-right: solid #dddddd 6px;

}

Готово!

Будут вопросы – добро пожаловать в комментарии.

Я благодарю Вас за внимание к моему творчеству и надеюсь увидеть Вас на страницах WP-Theme.eu
снова и вновь

Мир Вашему дому
РГ, Автор сайта WP-Theme.eu

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *