Инструкция по изучению уроков
Урок 1. "Ширина элемента и свойство float". В этом уроке мы досконально разберем все подводные камни такого, казалось бы, простого понятия, как ширина элемента. Поймем, из чего она складывается и что представляет на самом деле. Так же рассмотрим работу свойства float. Рассмотрим на примере, почему плавающие элементы при изменении ширины окна браузера съезжают на новую строку, и решим данную проблему. Рассмотрим и решим проблему схлопывания границ блока.
Урок 2. Создание резинового меню. Вы наверняка согласитесь со мной в том, что навигация – это, пожалуй, самая главная часть сайта. И у резинового сайта, как правило, навигация тоже резиновая. Создать резиновое меню, используя таблицы, труда не составит. Но когда речь заходит о создании такого меню, используя списки, возникает много вопросов. В уроке мы как раз создадим резиновое меню, используя списки. Разберемся с теорией создания такого меню. Выявим и решим возможные проблемы.
Урок 3. Выстраиваем элементы позиционированием.
В прошлом уроке мы с Вами говорили о создании резинового меню, используя списки.
В сегодняшнем, 3-м уроке нашего мини-курса, речь пойдет о позиционирование элементов.
Часто возникают ситуации, когда нужно сделать перекрытие элементов. Или заставить элемент располагаться, например, в правом нижнем углу, независимо от того, как расположены окружающие блоки.
Данную проблему лучше всего решает свойство position. В уроке мы разберемся с позиционированием элементов. Поработаем над перекрытием элементов с помощью свойства z-index. Выясним необходимое условие для работы свойства z-index.
Урок 4. Центрирование элементов переменной ширины.
При верстке макетов, часто возникает ситуация, когда необходимо центрировать элемент.
Когда известна ширина центрируемого элемента, то проблем не возникает. Все становиться сложнее, когда ширина блока, который нужно расположить по центру, не известна или она может меняться.
В уроке мы рассмотрим пример центрирования блока переменной ширины, на примере создания постраничной навигации.
Урок 5. Выравнивание блоков.
Иногда возникает задача, когда нужно расположить несколько блоков по всей ширине родительского блока.
То есть первый блок должен быть у самого левого края, последний блок должен быть у правого края. А расстояния между остальными элементами чтобы было одинаковым.
Такого несложно добиться при верстке макета фиксированной ширины. Но мы усложним задачу и решим ее в уроке для резинового блока.
При перепечатке материалов с сайта ссылка на источник обязательна (кликабельная и не шифрованая). Запрещено вносить изменения в графический материал, например, обрезание водяного знака или перекрытие его своими знаками.
