Форум Diz-Cs.Ru
Преимущества регистрации:
Возможность создания тем
Общение с пользователями
Найдете множество полезной информации
Найдете своих единомышленников
DIZ-CS.RU - Мы с Вами НАВСЕГДА!
  • Страница 1 из 1
  • 1
Модератор форума: -SAM-  
Светлый вид материалов форума
Дата: Сб, 08.06.2013, 00:48:53 | Сообщение # 1
Аватарка Woodo
Aqua-Studio
OFF
Пользователь
349 Сообщения:
95 Награды:
28 Отзывы:
Верстал первый раз такую работу "Вид материалов форума"

Вот что вышло :



Взял PSD с сайта: art-ps

вышло конечно не как на оригинале, но все же первый раз )

вот собственно :

CSS:

Код
/* Вид материалов форума by Woodo */
body {background:#flflfl;margin:0;padding:0}
.forum_content {width:233px;}
.forum_topSub {background:url(/img/kartinka.png)no-repeat;height:29px;color:#6b6b6b;font-size:11px;font-family:Tahoma, Geneva, sans-serif;text-shadow:1px 1px 0 #f7f7f7;}
.forum_topSub a {color:#6b6b6b;font-size:11px;font-family:Tahoma, Geneva, sans-serif;text-shadow:1px 1px 0 #f7f7f7;text-decoration:none;padding:10px;line-height:-1px}
.forum_topSub a:hover {text-decoration:underline;}
.status_user {float:right;margin-right:12px;color:#5f9900;}
.vid_materialov {background:#e0e0e0;padding:13px;}
.vid_materialov1 {background:url(/img/vid_materialov1.png)no-repeat;width:158px;height:21px;padding:1px 0;font-family:Tahoma, Geneva, sans-serif;font-size:11px;color:#fff;line-height:20px;}
.vid_materialov2 {background:url(/img/vid_materialov1.png)no-repeat;width:158px;height:21px;padding:1px 0;font-family:Tahoma, Geneva, sans-serif;font-size:11px;color:#fff;line-height:20px;}
.vid_materialov3 {background:url(/img/vid_materialov1.png)no-repeat;width:158px;height:21px;padding:1px 0;font-family:Tahoma, Geneva, sans-serif;font-size:11px;color:#fff;line-height:20px;}
.vid_materialov4 {background:url(/img/vid_materialov_4.png)no-repeat;width:158px;height:21px;padding:1px 0;font-family:Tahoma, Geneva, sans-serif;font-size:11px;color:#fff;line-height:20px;}
.vid_materialov4 .plus {float:left;margin-left:11px;}
.vid_materialov4 .reputation {float:left;margin-left:42px;}
.vid_materialov4 .minus {float:right;margin-right:14px;}
.vid_materialov4 a {font-family:Tahoma, Geneva, sans-serif;font-size:11px;color:#fff;line-height:20px;text-decoration:none;}
.vid_materialov4 .minus a:hover {color:#ff0061}
.vid_materialov4 .plus a:hover {color:#0f8300}
.vid_materialov3 a {font-family:Tahoma, Geneva, sans-serif;font-size:11px;color:#fff;line-height:20px;text-decoration:none;}
.vid_materialov2 a {font-family:Tahoma, Geneva, sans-serif;font-size:11px;color:#fff;line-height:20px;text-decoration:none;}
.vid_materialov1 a {font-family:Tahoma, Geneva, sans-serif;font-size:11px;color:#fff;line-height:20px;text-decoration:none;}

В "Вид материалов" :

Код
<!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]</title>
<link href="Style.css" rel="stylesheet" type="text/css" />
</head>

<body>
<table class="forum_content">
<tr>
<td class="forum_topSub" style="border-right: 1px solid #eaeaea"><a href="#"><b>$USERNAME$</b></a><div class="status_user">$USER_STATUS$</div></td>
</tr>
<tr>
<td width="233px" align="center" class="vid_materialov"><div><img src="http://diz-cs.ru/avatar/24/563733.png" width="150" height="100"</img></div>
<img src="/img/bez_imeni-4.png" width="149" height="27"</img>
<div class="vid_materialov1">Сообщений: <a href="#">1234</a></div>
<div class="vid_materialov2">Награды: <a href="#">450</a></div>
<div class="vid_materialov3">Замечаний: <a href="#">0%</a></div>
<div class="vid_materialov4"><div class="plus"><a href="#">+</a></div><div class="reputation"><a href="#">«1456»</a></div><div class="minus"><a href="#">-</a></div></div>
</td>
</tr>
</table>
</body>
</html>


Файлы залить в папку img :
Прикрепления: 1805403.png (1.5 Kb) · 7779673.png (1.0 Kb) · 3905839.png (1.4 Kb) · 3242515.png (7.7 Kb)
Сообщение отредактировал Woodo - Сб, 08.06.2013, 00:54:52
Дата: Сб, 08.06.2013, 10:23:28 | Сообщение # 2
Аватарка koffee
the perfect koffee©
OFF
Премиум
2955 Сообщения:
321 Награды:
170 Отзывы:
Skype пользователя:
Woodo, перекрасил бы в серые цвета, чтоб более востребованным был good

Нарисую любую графику, взамен на сайты uCoz
SEO Оптимизация сайтов uCoz
Связь только по ЛС!!!
Дата: Сб, 08.06.2013, 12:18:56 | Сообщение # 3
Аватарка zheka0107
OFF
Пользователь
100 Сообщения:
1 Награды:
10 Отзывы:
Skype пользователя:
Сайт пользователя:
Woodo, цвета не гармонируют вообще closedeyes
Дата: Сб, 22.06.2013, 22:31:39 | Сообщение # 4
Аватар не установлен
OFF
Пользователь
21 Сообщения:
0 Отзывы:
ICQ пользователя:
Skype пользователя:
Сайт пользователя:
Ну что, что не гармонируют? Вебмастер сам под себя сможет настроить цвета, делов то good

Качественная верстка веб-страниц, недорого и быстро!
Дата: Вс, 16.02.2014, 12:21:50 | Сообщение # 5
Аватарка imdima
OFF
Новичок
5 Сообщения:
0 Отзывы:
  • Страница 1 из 1
  • 1
Поиск: