• Страница 1 из 1
  • 1
Практикум по HTML/CSS #1: Информёр
๖ۣۜInspire
Понедельник, 22 Апреля 2013, 15:16 | Сообщение 1
Оффлайн
Vip
Сообщений:598
Награды: 3
Всем привет, это новая рубрика под названием "Практикум по HTML/CSS".

Сегодня будет не очень сложное задание. Наверно видели, что я нарисовал информёр "Лучшие пользователи", так вот его то и в как раз нужно сверстать.

При нажатии на ник открывается инфа о нём. В background класса "info" вставляем любую картинку. Если вы что-то не можете сделать, то всё-равно выкладывайте, я помогу довести до конца.



Естественно нужно чтобы вёрстка была валидной, кроссбраузерной (последние версии браузеров), и выполнена div-ами.

В четверг будут объявлены результаты кто лучше(если кто-то сверстает smile ).

PSD

В четверг я выложу урок как его сверстать.




Моё портфолио
Страна: (RU)
Kosten
Понедельник, 22 Апреля 2013, 15:25 | Сообщение 2
Оффлайн
Администраторы
Сообщений:44490
Награды: 70
Supermenыч, ты скинул PSD, а народ то не знает как верстать. ты бы урок сделал с чего начинать.
А так круто ты создал. Для игровых темных шаблонов думаю шикарно бы смотрелось.
Страна: (RU)
๖ۣۜInspire
Понедельник, 22 Апреля 2013, 15:27 | Сообщение 3
Оффлайн
Vip
Сообщений:598
Награды: 3
Kosten, я просто хочу посмотреть как другие сверстают и сравнить со своим



Моё портфолио
Страна: (RU)
Kosten
Понедельник, 22 Апреля 2013, 15:30 | Сообщение 4
Оффлайн
Администраторы
Сообщений:44490
Награды: 70
Supermenыч, а проблема может возникнуть в том что они представление не имеют как верстить. А научиться хочется. Хотя тебе видней, могут просто ждать четверга на информер когда ты зальешь. Думаю многим он понравиться, так как он оригинален и не у каго его нет. А оригинальность сам знаешь цениться.
Страна: (RU)
Kosten
Понедельник, 22 Апреля 2013, 15:32 | Сообщение 5
Оффлайн
Администраторы
Сообщений:44490
Награды: 70
Скинь мне в ЛС. где он у тебя стоит. Оценить в работе хочется.
Страна: (RU)
Kosten
Понедельник, 22 Апреля 2013, 15:41 | Сообщение 6
Оффлайн
Администраторы
Сообщений:44490
Награды: 70
Прикольно, все работает, на светлом дизайне просматриваются тени. Ребята реально круто cool

Прикрепления: 0729961.png (71.6 Kb)
Страна: (RU)
๖ۣۜInspire
Понедельник, 22 Апреля 2013, 15:47 | Сообщение 7
Оффлайн
Vip
Сообщений:598
Награды: 3
Kosten, блин я шрифты забыл прицепить

Добавлено (22.04.2013, 15:47)
---------------------------------------------
Могу дать структуру сего творения

Код
<div class="block"><div class="top">Лучшие пользователи</div><div class="users">$USERNAME$</div><div class="info"><div class="userinfotop"><div class="userinfo">Репутация: $REPUTATION$<span style="float:right;">Комментариев: $COM_POSTS$</span></div></div><a href="$PROFILE_URL$"><div class="userbut">Профиль</div></a><a href="#"><div class="userbut">Написать ЛС</div></a></div></div>


Остаётся только написать стили и анимацию smile




Моё портфолио
Страна: (RU)
Delete
Понедельник, 22 Апреля 2013, 17:02 | Сообщение 8
Оффлайн
Проверенные
Сообщений:1079
Награды: 7
всетаки не правильно...в теме написано Практикум...а в разделе Уроки по созданию сайта только один урок по созданию меню...
Цитата (Supermenыч)
Остаётся только написать стили и анимацию

а ты еще хочеш чтобы такое сделали...лучше бы выложил практику по меню т.к урок присутствует...ну кроме тех кто обучался такому уже...


На случай если буду нужен, то я там же, где и был, когда был не нужен...

Сообщение отредактировал
N_O_O_B - Понедельник, 22 Апреля 2013, 17:04
Страна: (RU)
๖ۣۜInspire
Понедельник, 22 Апреля 2013, 17:12 | Сообщение 9
Оффлайн
Vip
Сообщений:598
Награды: 3
N_O_O_B, ок напишу как сверстать



Моё портфолио
Страна: (RU)
RiPeR
Понедельник, 22 Апреля 2013, 17:51 | Сообщение 10
Оффлайн
Vip
Сообщений:523
Награды: 1
Supermenыч, Классно нарисовал)

Отличный сайт)
Страна: (RU)
Kosten
Понедельник, 22 Апреля 2013, 19:42 | Сообщение 11
Оффлайн
Администраторы
Сообщений:44490
Награды: 70
RiPeR, ты в рабочем виде не видел. Там реально все по теме.
Страна: (RU)
FeStemBer
Понедельник, 30 Ноября 2015, 04:53 | Сообщение 12
Оффлайн
Проверенные
Сообщений:355
Награды: 1
Так очень нормально получилось, но можно не только под лучшего пользователя сделать.
Страна: (RU)
  • Страница 1 из 1
  • 1
Поиск: