Блочная верстка (div-верстка) видеоурок #14
Предлагаю вашему вниманию, уважаемый читатель, последний урок из видеокурса по блочной div-верстке для начинающих. Но вы не переживайте, будут еще и дополнительные уроки, а так же новые видеокурсы. Пока основной костяк завершен и в следующем посту я подытожу наш сериал из 14-ти частей.
Теперь переходите к просмотру видео. Я расскажу вам, как сверстать футер, дам несколько наглядных советов по работе с Photoshop. Давайте добьем эту верстку!
Видео на сервисе RuTube
Видео на сервисе YouTube (часть 1)
Видео на сервисе YouTube (часть 2)
Видео на сервисе YouTube (часть 3)
Из-за сжатия видео сервисами RuTube и YouTube мелкие детали становятся плохо различимы. Чтобы увидеть все до мелочей – скачайте видео в лучшем качестве с DepositFiles (*wmv 43.9 МБайт).
Чтобы не пропустить завершающей части видеокурса по блочной верстке сайта, а так же выхода новых видеокурсов для веб-мастера подписывайтесь на RSS или получайте обновления блога на эл. почту.
С уважением, Андрей Морковин.
Похожие материалы:
Отзывов: 32 на «Блочная верстка (div-верстка) видеоурок #14»









Автор: , 27.09.2009 в 19:03
Так будет урок как сделать эти полосы или нет???
Автор: , 27.09.2009 в 19:18
Урока по поводу бордеров не будет. Предлагаю размять наш коллективный разум.
Автор: , 27.09.2009 в 19:05
Идейка пришла, а что если 1px бакграунд для внутренней части сайта и использовать как фон??
Автор: , 27.09.2009 в 19:20
Попробуйте. Но для какого блока Вы собираетесь использовать этот фон?
Автор: , 27.09.2009 в 19:30
Попробовать создать div в который нужно будет поместить всё содержимое сайта (шапка, менюха, футер и т.д.) и у него задать заливку в виде 1px картинки с этим бордером. Только я думаю нужно будет зет индекс прописывать и других див блоков, что бы они были поверх него.
Автор: , 28.09.2009 в 07:55
Первая часть размышления очень даже правильная. Только зачем шапку засовывать в этот div?
Не нужно создавать картинку, есть такое свойство CSS – border: 2px solid #…
Автор: , 27.09.2009 в 19:33
Ну или подрисовать у картинок этот брдер
Автор: , 27.09.2009 в 20:02
На самом деле есть довольно простое решение. Нужно совсем чуть-чуть подумать.
Автор: , 27.09.2009 в 20:04
Ну и какое же оно?
Автор: , 27.09.2009 в 21:09
Давайте развивать коллективный разум, все таки. Тот кто будет первый – победит. Я не в счет (т.к. уже решил эту загадку).
Автор: , 27.09.2009 в 20:54
А если прописать wrapper тока правый бордер а левый зделать footeru и containeru
Автор: , 27.09.2009 в 21:04
А вы пробуйте. Думаю, что у Вас будет дыра между контейнером и футером. Контейнер разве тянется до футера? По моему он обрывается там, где заканчивается контент.
Автор: , 27.09.2009 в 21:15
Точна
а вы сделали их? если да напишите как буду очень признателен
Автор: , 27.09.2009 в 21:17
А я сделал. Хочу, чтобы вы подумали иначе все это обучение бесполезно. Давайте-давайте. Кто будет первый, тому респект.
Автор: , 27.09.2009 в 21:22
Дайте подсказку она идёт Backgroundom или Borderam?:)
Автор: , 27.09.2009 в 21:41
Можно создать новый див и поместить его под header и закрыть под footerom и задать левую рамку а правую задать wrapperu я угадал ? хе хе
Автор: , 28.09.2009 в 08:07
Да, так и нужно делать. Респект и уважуха!
Автор: , 05.04.2010 в 21:51
Ничего не понял. Как можно открыть див внутри одного дива, а закрыть за его пределами. И второе если правый бордер поставить только врапперу, то футер без правого остаётся.
Автор: , 27.09.2009 в 23:05
…а где же обещанная ссылка на весь архив?
Автор: , 28.09.2009 в 07:51
Все будет, не переживайте.
Автор: , 28.09.2009 в 09:14
Уважаемый Андрей!
Спасибо вам за курс, действительно у вас отлично получилось, а главное курс помогает разобраться и вникнуть в саму суть блочной верстки! У меня к вам вопрос: Вы не будете против, если я ваш курс выложу на других ресурсах? Разумеется с сылками на ваш!
Автор: , 28.09.2009 в 12:44
Спасибо Вам за спасибо. Я рад, что сделал полезный курс.
Разумеется, я не против распространения моего курса если вы ссылаетесь на данный сайт, я только ЗА!
Автор: , 28.09.2009 в 12:22
До меня допёрло!
Создаём div в него закидываем всё кроме шапки и так делает бордер ораджевого цвета!
Автор: , 28.09.2009 в 12:42
Только у меня почему-то не прорисовались бордеры на футере. Но это можно поправить задав принудительно бордеры и для футера.
Автор: , 28.09.2009 в 13:59
А будут ли новые уроки???
Автор: , 28.09.2009 в 15:24
Обязательно будут!
Автор: , 29.09.2009 в 03:27
Спасибо за уроки по блочной верстке и было б не плохо если б сделали еще уроки по javascrip
Автор: , 14.12.2009 в 20:13
Можно хэдер абсолютно запозиционировать относительно враппера и все проблемы решатся.
Автор: , 26.02.2010 в 23:35
Спасибо, Андрей, за Ваш полезный сайт. Очень порадовал курс по дивной вёрстке, понятных уроков по этой теме в Интернете очень мало. С удовольствием буду изучать Ваши новые уроки:)
Автор: , 06.03.2010 в 16:38
Андрей, ОГРОМНЕЙШЕЕ ПРИ ОГРОМНЕЙШЕЕ Вам спасибо!!! Я у удовольствием пересмотрел все 14 уроков и в течении 2-3 практически закончил верстать свой сайт.
так и происходит!
Было смешно, когда про ошибку в старом уроке вы говорили только в следующем, а я его из принципа не смотрел и мучался с позиционирование несколько часов, пока не запустил следующее видео))) Я в этих видео уже здороваться начал с Вами)))))
Я несколько недель уже по статьям пытался что-то сделать, но ничего не получалось, пока не нашёл ваш блог – информации океан, как уже говорилось и я её с огромным удовольствием впитываю))) всё это должно быть в радость
можете взглянуть на работу вашего ученика))) мне уже мало осталось исправить) (картинок у меня МНОГО)
http://hallmark2010.narod.ru
ещё раз ОГРОМНОЕ спасибо!!!
Автор: , 16.03.2010 в 04:47
Есть куда рости Олег, советую прежде всего задуматься не над красочностью а над весом сайта; ну и в идеале вес и внешний вид должны быть в гармонии.
Вообщем пробуйте тестите на разных скоростях браузерах, но сильно стараться смысла нет так как “народ” это не место для внушительных сайтов а скорее просто для частных страничек…….. Так что если есть серьезная задумка, советую платный хостинг – он и выглядит солидней и страницу обязательной рекламой не портит, да и качество сайта будет лучше и функциональность….
Андрей, спасибо за урок и отдельное спасибо за то что предлагаете думать своей головой и искать решения, это правильно в обучении.
Автор: , 05.04.2010 в 20:23
Андрей, спасибо огромное за видеоматериалы. Есть идея. А что если не просто делать уроки. А, как в случае с этими бордерами, давать какое-нибудь задание для начинающих. Очень развивает. И вам обратная связь. И новичкам каждая решённая задача опыт.