Сегодня
25 января 2022
14:24
Вход Регистрация Забыли пароль ?

Mine Worker | ZX Spectrum | maze game | Firestarter, 2010
Mine Worker | ZX Spectrum | maze game | Firestarter, 2010 Автор(ы): Firestarter, Jerri
подробнее...

Теги

сайты, игры, дизайн, продвижение, php, html, css, my sql, c++, delphi, photoshop, 3ds max, fl studio, трекерская музыка, уроки

Статьи сайта

Урок 2 Написание Win32-приложений. Обзор стартового кода Win32-приложения. Добавление ресурса текстовая строка

Урок 3 Создание Win32-приложений. Создание меню и простых диалоговых окон.

Урок 4 Создание Win32-приложений. Стандартные диалоги. Изучение сопутствующих конструкций языка. Консольные Win32-приложения. Указатели. Ссылочный тип. Массивы.

Урок 4 часть 2 Win32. Диалог выбора цвета, смена цвета фона окна приложения

Написание приложения DirectX9c + MFC в среде MSVS 2005

webinformatic - Создание компьютерных игр на основе DirectX в среде Delphi 6, 7

webinformatic - Создание компьютерных игр на основе DirectX в среде Delphi 6, 7 - Почему избраны DX8 и Delphi ?

webinformatic - Основы IDirectMusic8 в среде Delphi6-7

webinformatic - Основы DirectInput8 в среде Delphi 7

webinformatic - Основы DirectSound8 в среде Delphi6-7

webinformatic - Плагин для 3DS MAX из DX9 SDK

webinformatic - Мастер-класс: Создание модели и текстуры Коммандного Центра (как в StarCraft 2)

webinformatic - Мастер-класс: Создание модели и текстуры Коммандного Центра (как в StarCraft 2) Часть 2

webinformatic - Мастер-класс: Создание модели и текстуры Коммандного Центра (как в StarCraft 2) Часть 3

webinformatic - Мастер-класс: Создание модели и текстуры Коммандного Центра (как в StarCraft 2) Часть 4

webinformatic - Мастер-класс: Создание модели и текстуры Коммандного Центра (как в StarCraft 2) Часть 5

webinformatic - Мастер-класс: Создание модели и текстуры Коммандного Центра (как в StarCraft 2) Часть 6

Система управления сайтом - megainformatic cms e-shop

Система управления сайтом - megainformatic cms e-shop

Система управления сайтом - megainformatic cms e-shop

webinformatic - Уроки 3ds max - Введение в 3ds max

webinformatic - ГАЛЕРЕЯ 3D-моделей

webinformatic - СОЗДАНИЕ МАКЕТА ПОМЕЩЕНИЯ

webinformatic - Создание макета помещения - этап 2

webinformatic - МОДЕЛИРОВАНИЕ НА УРОВНЕ МНОГОУГОЛЬНИКОВ

webinformatic - СОЗДАНИЕ ПРЕДМЕТОВ ОБСТАНОВКИ ПОМЕЩЕНИЯ

webinformatic - Моделирование обстановки помещения

webinformatic - Создание модели автомобиля

webinformatic - Создание текстурной развертки для модели автомобиля

webinformatic - Создание анимации вращающихся колес автомобиля

webinformatic - игра Нечто: Необъяснимое и в плену желаний

webinformatic - Основы 3D-анимации, экспорт скелетной анимации

webinformatic - Подготовка модели к использованию скелетной анимации

webinformatic - Продолжаем Создание скелета для данной модели

webinformatic - Построение ирерархических связей между объектами и основы 3d анимирования

webinformatic - Особенности экспорта моделей и анимации экспортером kWXPort080719 из 3ds max 2009 

webinformatic - Создание модели броневика (Хэд)

megainformatic cms e-mailer

megainformatic cms e-mailer

megainformatic cms e-mailer

Бесплатная Система Управления Вашим Сайтом - megainformatic cms free

webinformatic - Путешествие в мир 3d

webinformatic - Путешествие в мир 3d - страница 2

webinformatic - Путешествие в мир 3d - страница 3

webinformatic - Путешествие в мир 3d - страница 4

webinformatic - Путешествие в мир 3d - страница 5

webinformatic - Путешествие в мир 3d - страница 6

webinformatic - Создание модели броневика (Хэд) - Анимация вращения колес

megainformatic cms express files

megainformatic cms express files

megainformatic cms express files

webinformatic - Уроки Photoshop - Чудеса

megainformatic cms express files - Развертывание сайта на Вашем хостинге

webinformatic - Настольная игра "Веселый Буквоежка"

webinformatic - Уроки delphi directx 8.1

webinformatic - Уроки delphi directx 8.1 - Урок 1 - Введение в Delphi DirectX 8.1. Создание шаблона стартового приложения.

Что нужно знать для создания сайта ? float - использование в css - стилях

[к содержанию]

Атрибут float применяется для выравнивания блоков div по

<div style="float: left;">по левому краю отведенного пространства страницы</div>


по левому краю отведенного пространства страницы



<div style="float: right;">по правому краю отведенного пространства страницы</div>


по правому краю отведенного пространства страницы



<div>без выравнивания</div>


без выравнивания



аналогично объявляется в виде атрибута для описанного в css - файле класса или id

<style>
.element1 {
float: left; border: 1px solid #000000; background: #75ab41;
}


#element_2 {
float: right; border: 1px solid #000000; background: #75ab41;
}


</style>

<div class="element1">по левому краю отведенного пространства страницы</div>


<div id="element_2">по правому краю отведенного пространства страницы</div>


еще один пример -



<style>
.element1 {
float: left; border: 1px solid #000000; background: #75ab41;
}

#element_2 {
float: right; border: 1px solid #000000; background: #75ab41;
}

#elem_3 {
width: 400px;
background: #ffff00;
}

#elem_3 .elem_4 {
border: 1px solid #000000; background: #75ab41; width: 200px;
}

#elem_3 .elem_5 {
float: left; border: 1px solid #000000; background: #EC64FF; width: 200px;
}

#elem_3 .elem_6 {
float: right; border: 1px solid #000000; background: #6C87F1; width: 200px;
}
</style>

<div class="element1">по левому краю отведенного пространства страницы</div><br><br><br>

<div id="element_2">по правому краю отведенного пространства страницы</div><br><br><br>

<div id="elem_3">
<div class="elem_4">
какой-то текст в блоке без float
</div>

<div class="elem_5">
другой текст - float: left;
</div>

<div class="elem_4" style="background: #ff0000;">
снова текст в блоке без float
</div>

<div class="elem_4" style="background: #00ff00;">
и еще текст в блоке без float
</div>

<div class="elem_6">
теперь текст в блоке float: right;
</div>

</div>

<br><br><br>

<div style="clear: both;"></div>

а вот как он выводится -

по левому краю отведенного пространства страницы



по правому краю отведенного пространства страницы



какой-то текст в блоке без float
другой текст - float: left;
снова текст в блоке без float
и еще текст в блоке без float
теперь текст в блоке float: right;



В показанном примере видно как ведут себя блоки div имеющие или не имеющие тот или иной тип выравнивания блока с атрибутом float.

Важно запомнить всего 2 важных момента:

1) Если блоки не имеют указанного атрибута float - то они выводятся "как есть" - занимая всё отведенное им пространство и очередной блок будет помещен ниже данного;

2) Если вам требуется очистить пространство, занимаемое любыми блоками - примените атрибут clear: both; как показано в примере выше.

далее

[к содержанию]

 

Оставленные комментарии



Время загрузки: 0,1762