HTML шаблоны сайтов и просто примеры / приёмы верстки.


HTML шаблоны на базе Twitter Bootstrap. Часть первая.

Далее вам будет представлена авторская подборка из HTML-шаблонов, которые были сделаны на базе CSS-фреймворка от разработчиков Twitter — Twitter Bootstrap.

Clean Blog

Clean-Blog

Достаточно простенький, но аккуратненький и современный одно-колоночный макет с красивой большой картинкой в верхней части веб-страницы. Для блогов. Фон белый. Ссылки бирюзового оттенка. В подвале есть круглые кнопочки социальных сервисов.

Скачать Просмотреть

(далее…)

Опубликовано 11-12-2014 в 16:00

HTML шаблоны 2014: подборка

Affinity

Affinity

Красивый современный шаблон для блога. Выполнен в коричневых оттенках. Помимо основной трех-колоночной структуры предусмотрены парочка двух-колоночных вариантов с правым и левым расположениями боковых колонок, а также одно-колоночная сборка макета. Уголки некоторых областей как бы загнуты. В подвале в наличии три дополнительных блока для размещения информации.

Скачать Просмотреть

Telephasic

Telephasic

Хороший макет с адаптивной версткой. На шапку помимо плавного красновато-розово-оранжевого градиента нанесено несколько диагональных линий-бликов. Далее представлена двух-колоночная структура с фотографиями, промежуточная заставка-картинка, три колонки с изображениями и шаблон формы обратной связи с кнопками социальных сетей.

Скачать Просмотреть

(далее…)

Опубликовано 21-11-2014 в 14:43

Как убрать resizer / ресайзер у textarea в браузерах

Большинство современных браузеров всегда в нижнем правом уголке элемента многострочного поля ввода показывают ресайзер, который позволяет пользователю, дернув за него изменить таким образом размеры (ширину, высоту) оного объекта. Однако не во всякой концепции дизайна веб-сайта такое явление является уместным, потому ниже мы рассмотрим то, как же можно убрать resizer / ресайзер у textarea в браузерах. (далее…)

Опубликовано 5-05-2014 в 11:12

Что такое спрайты в CSS

CSS спрайты — это картинки, которые объединяют в себе другие картинки, служащие для оформления каких-либо элементов сайта. С применением CSS спрайтов вы уменьшаете количество подгружаемых браузером изображений с вашего сайта, что позволяет немножко снизить количество HTTP-запросов.

Давайте рассмотрим их использование на примере верстки кнопки в двух состояниях: обычном и при наведении.

Итак, собственно image:

Что такое CSS спрайты

HTML:

<input class="rbc-btn" type="submit" value="Скачать!!!" />

CSS: (далее…)

Опубликовано 2-04-2014 в 14:39

HTML + CSS и выравнивание блока по центру с известными шириной и высотой

Ниже представлен один из многочисленных способов того, каким образом можно решить задачку по центрированию блочного элемента (выравниванию элемента, как по вертикали, так и по горизонтали).

Смотрим код CSS:

.roditelskii {
    position: relative;

    background: #fffcb7;
    height: 350px;
    width: 350px;
}

.po-centru {

(далее…)

Опубликовано 29-11-2013 в 15:43

Как убрать дубли страниц из поисковой выдачи — канонические ссылки

Канонические ссылки помогают роботам поисковых систем, особенно Яндексу, более корректно индексировать сайт. В частности, если на вашем сайте имеются дублированные веб-страницы, доступные по разным адресам, но с одинаковым / идентичным содержимым, то атрибут rel со значением canonical поможет вам решить проблему дублей в поиске.

К примеру известно, что в CMS Drupal большинство страниц всегда имеют адреса вида http://code-snippets.ru/node/1, http://code-snippets.ru/node/2, http://code-snippets.ru/node/3… (далее…)

Опубликовано 27-11-2013 в 10:56

Как выровнять DIV по центру

Данная заметка содержит небольшой пример по CSS, который решает вопрос выравнивания блочного элемента div по центру. Заранее отмечу, что выравнивать я буду по вертикали.

Итак, стили:

.vertical-center-table {
    display: table;
}
.vertical-center-cell {
    display: table-cell;
    vertical-align: middle;
}

(далее…)

Опубликовано 19-08-2013 в 17:25













Свежие комментарии

  • krasnov8953: к записи Не работает как мне кажется строчка $newTvId = $ »
  • Dimanski: к записи ничего не понимаю. Ставлю ModX на хостинг r01.ru »
  • Дмитрий: к записи Спасибо! Очень выручили. С битриксом беда, а прав »
  • леонид: к записи как сделать что были в ряд? у меня получается по о »
  • Администратор: к записи Статический IP. »
  • Steel: к записи Администратор, вы данную проблему решили подключен »
  • Дмитрий: к записи Хотел узнать как прикрутить данное окно (http://re »

Последние твиты