Как сделать сайт в программе Dreamweaver ?
Что такое float!?
Float - элемент, который обозначает расположение объекта. Либо слева, либо справа.
Мы возьмём новую страницу, создадим две таблицы – дива. Присвоим им класс разные названия.
Коды с данной страницы см.здесь - Тема CSS, № 1.
Новые шрифты для сайта – качаем отсюда!
fpoat-primer-left
fpoat-primer-right
Код:
<div class="fpoat-primer-left">Div –позиция слева</div>
<div class="fpoat-primer-right">Div – позиция справа </div>
И там же на старнице создадим два разных стиля, в них отличается лишь значение Float.
1.Стиль Float- слева:
.fpoat-primer-left { float: left; /* Обтекание по правому краю */
background: #fd0; /* Цвет фона */
border: 1px solid black; /* Параметры рамки */
padding: 10px; /* Поля вокруг текста */
margin-right: 20px; /* Отступ справа */
width: 20%; /* Ширина блока */
2. Стиль Float- справа:
.fpoat-primer-right { float: right; /* Обтекание по левому краю */
background: #fd0; /* Цвет фона */
border: 1px solid black; /* Параметры рамки */
padding: 10px; /* Поля вокруг текста */
margin-right: 20px; /* Отступ справа */
width: 20%; /* Ширина блока */
Как будет выглядеть наши div-ы, с калассами в котротых прописано свойство float смотрим..
Float в программе Dreamweaver.
Мы продолжаем нашу эпопею с первой страницей, не буду вам заново перечислять, что мы с ней сделали, ли скажу, что мы в прошлый раз удалили ненужные элементы на странице, и наш див сместился налево.
Смотрим на нашу страницу.
Поэтому мы и отредактируем свойства Float в программе Dreamweaver.
Выделим интересующий нас див и смотрим информацию по нему.
Для редактирования float данного дива нам нужно открыть файл css - style.css.
Открыли файл css нажимаем ctrl + F, и вбиваем название нашего дива – rightPan – нажимаем найти далее…
Из всех свойств нас интересует
float:left;
Меняем его на
float:right;
Смотрим, как это будет в программе Dreamweaver, и видим, что наш див сместился с левого края на правый! что и требовалось нам сделать для правильного позиционирования дива!
А теперь смотрим свойства float:left; и float:right;
Как переводится Float.
- плавать, парить, всплывать, всплыть
(swim, soar, pop, resurface)
- float in water — плавать в воде
- float pallet — парящая платформа
- плыть, поплыть, проплывать, проплыть, уплыть
(swim)
- разместить
- float bonds — разместить облигации
- вплыть
- поплавок
- with a float — с поплавком
- терка
- плавающий
(swimming)
- поплавковый
(float-type)
- float switch — поплавковый выключатель
Свойства Float.
Если вы ещё не совсем разбираетесь в коде, в его нюансах, то не расстраивайтесь! Опыт со с временем придёт!
И вам покорятся не только свойства Float, но и все другие! Ивы будете щелкать код как семечки!
Вот и всё!
Удачи и лёгкого понимания всех свойств кода!!!
А теперь самое время развлечься!
Улучши поведенческий фактор на своём сайте!
Если понравится игра, то можно забрать код для своего сайта отсюда!