All for Web
По этой ссылке вы можете сразу увидеть базовые примеры: http://getbootstrap.com/getting-started/#examples, открыть их и изучить. Бутстраповская верстальная сетка состоит из 12 колонок. Если вы никогда не видели печатные верстальные сетки для газет, то выглядели они примерно так: Когда верстка была не компьютерной, а ручной, верстальщики поверх этих […]
Начнем с общих слов, что бутстрап сейчас — самая популярная и распрастраненная платформа для создания адаптивных сайтов. Сегодня практически нет ни одной платной темы на вордпресс без бутстрапа. Верстать на бутстрапе — хороший тон, так как позволяет разработчикам со всего мира «подхватывать» чужие проекты для […]
Теперь разберемся с мелкими огрехами, которые не дают нам жить и сжирают массу времени, если мы не пользуемся бутстрапом. Всем противникам бутстрапа я могу сказать — вы не правы )). Дело в том, что бутстрап содержит огромное количество мелочей, которые мы не узнаем, даже изучая […]
Для начала разберемся в терминах. Респонсив, от англ. responsive — отзывчивый, то есть отзывается на смену ширины экрана, зависит от этой ширины. Адаптивный — от англ. adaptive — примерно то же самое, то есть макет адаптируется к ширине экрана. Разница в том, что респонсивный — […]
В одном из прошлых уроков мы собрали несколько таблиц. Возьмем самую сложную из них: Для начала, пересоберите таблицу так, чтобы правая часть состояла из трех таблиц внутри содержащего их <td>. То есть на левый элемент мы не ставим rowspan. А в правой части мы избавляемся […]
На прошлом уроке мы сделали вот такой смайлик, ДЗ было — вставить ему полон рот разнокалиберных и разноцветных зубов. Пришел черед регулировать их длину, цвет и выпадение. Для начала скачайте этот зип-файл: smile Распакуйте его, откройте все файлы в текстовом редакторе. Любую анимацию можно легко осуществить […]
В предыдущем уроке мы собрали настоящий макет: Здесь у нас была кнопка Read more, поговорим для начала о ней. Раз мы хотим быть модными и красивыми, то нужно дате ей скругленные углы, вот так: Вы не представляете, как мы мучались до появления CSS3!!! […]
Друзья, многие ругают Дримвивер за его «тяжеловесность» — он долго открывается. Для мелких правок, действительно, лучше использовать более «легкие» редакторы. Некоторые программисты вообще презрительно на него смотрят — почему-то воображают, что вот ОНИ-то пишут код руками, а на дримвивере якобы все само делается ))) — […]
После того, как вы выполнили задание по уроку Делаем таблицы — HTML-старт для детей, у вас должна была получится такая таблица: Теперь мы соберем на ее основе настоящий макет веб-страницы: Для этого вам понадобится .psd макет, скачайте его по этой ссылке: table_maket1 Итак, что тут у нас. […]
Таблицы сейчас очень недооценены. Все начинающие кидаются сразу в пучину резиновой верстки дивами и в итоге, переходя к бутстрапу, начинают биться ап стену, ничего не понимая. А тем временем таблицы — это ОСНОВА бутстрапа. Понимание таблиц приведет вас к выводу, к которому пришли разработчики 2000-ых. […]
В предыдущем уроке мы закончили на том, что хотели узнать, какие цвета можно обозначать словами. На примере цветов я вам покажу, как можно подсмотреть в вебе любую чужую страницу и любой стиль на ней! Это чрезвычайно полезный инструмент Google, постоянный помощник веб-разработчика — Google Inspector. […]