Авторизация
Логин:
Пароль:
Запомнить меня
Регистрация
Забыли свой пароль?
Войти как пользователь:
Войти как пользователь
Вы можете войти на сайт, если вы зарегистрированы на одном из этих сервисов:
Livejournal
Mail.Ru
Liveinternet
Blogger
OpenID
.livejournal.com
@mail.ru
liveinternet.ru/users/
.blogspot.com
OpenID:
Главная
Введение
Введение
1. Об авторе
2. Кому предназначается справочное пособие?
3. Что можно узнать, прочитав справочное пособие?
Глава I
1. Набор HTML кода в блокноте Notepad++
1.1 Изменение имени и сохранение файла с расширением .html
1.2 Открытие и редактирование файла с расширением .html
1.3 Почему имя главной страницы выбирается, как index.html?
1.4 Как запустить программу на выполнение?
1.5 Отображение текста на русском языке в Notepad++
2. Теги: <span class="tag"><span class="consol"><</span>html<span class="consol">></span></span>, <span class="tag"><span class="consol"><</span>head<span class="consol">></span></span>, <span class="tag"><span class="consol"><</span>body<span class="consol">></span></span> и <span class="tag"><span class="consol"><</span>title<span class="consol">></span></span>
3. Теги: <span class="tag"><span class="consol"><</span>header<span class="consol">></span></span>, <span class="tag"><span class="consol"><</span>hgroup<span class="consol">></span></span>
4. Теги заголовков: <span class="tag"><span class="consol"><</span>h1<span class="consol">></span></span>, <span class="tag"><span class="consol"><</span>h2<span class="consol">></span></span> и другие
5. Пример 1: Ваша первая программа на языке HTML5
5.1 Пояснение к программе Пример 1
6. Отображение графических изображений тег <span class="tag"><span class="consol"><</span>img<span class="consol">></span></span>
6.1 Атрибут <span class="red">src</span> тега <span class="tag"><span class="consol"><</span>img<span class="consol">></span></span>
6.2 Атрибуты <span class="red">height</span> и <span class="red">width</span> тега <span class="tag"><span class="consol"><</span>img<span class="consol">></span></span>
6.3 Форматы графических изображений jpg, gif, tiff и png
6.4 Пример 2: Отображение графических изображений
6.5 Пояснение к программе Пример 2
7. Маркированный список
8. Нумерованный список
8.1 Атрибут <span class="red">start</span>
8.2 Пример 3: Создание маркированного и нумерованного списка
8.3 Пояснение к программе Пример 3
Глава II
1. Что такое таблица стилей CSS?
2. Зачем нужна таблица стилей?
3. Как определить таблицу стилей?
4. Определяем фон для <span class="tag"><span class="consol"><</span>body<span class="consol">></span></span>, применяя растровое изображение
5. Пример 4: Задаем фон для <span class="tag"><span class="consol"><</span>body<span class="consol">></span></span>, применяя растровое изображение
5.1 Пояснение к программе Пример 4
6. Как задать цвет фона для <span class="tag"><span class="consol"><</span>body<span class="consol">></span></span>?
7. Пример 5: Задаем фон для <span class="tag"><span class="consol"><</span>body<span class="consol">></span></span>, применяя градиентную заливку
7.1 Пояснение к программе Пример 5
8. Определение текстового абзаца тегом <span class="tag"><span class="consol"><</span>p<span class="consol">></span></span>
8.1 Выделение части текста тегами <span class="tag"><span class="consol"><</span>mark<span class="consol">></span></span> и <span class="tag">span<span class="consol">></span></span>
8.2 Как задать высоту, имя и семейство шрифта
8.3 Свойства <span class="red">text-align</span> и <span class="red">text-indent</span>
8.4 Свойство <span class="red">color</span> и <span class="red">background-color</span>
8.5 Свойство <span class="red">word-spacing</span> и <span class="red">letter-spacing</span>
8.6 Свойство <span class="red">font-style</span>, <span class="red">font-weight</span> и <span class="red">text-decoration</span>
8.7 Поиск ошибок в коде HTML
8.8 Как добавить декоративный шрифт в код программы
8.9 Пример 6: Определение текстового абзаца и задание его свойств
8.10 Пояснение к программе Пример 6
9. Создание ссылок тег <span class="tag"><span class="consol"><</span>a<span class="consol">></span></span>
9.1 Атрибут <span class="red">href</span> тега <span class="tag"><span class="consol"><</span>a<span class="consol">></span></span>
9.2 Определение свойств элемента
9.3 Тег <span class="tag"><span class="consol"><</span>nav<span class="consol">></span></span>
9.4 Пример 7: Создание ссылок
9.5 Пояснение к программе Пример 7
10. Введение в тег <span class="tag"><span class="consol"><</span>div<span class="consol">></span></span>
10.1 Что такое и как задать атрибут <span class="red">id?
10.2 Что такое и как задать атрибут <span class="red">class?
10.3 Свойства <span class="red">outline</span>, <span class="red">margin</span>, <span class="red">padding</span> и <span class="red">border</span>
10.4 Свойства <span class="red">width</span> и <span class="red">height</span>
10.5 Свойство <span class="red">background-color</span>
10.6 Задаем фон для элемента <span class="tag"><span class="consol"><</span>div<span class="consol">></span></span>, применяя радиальную заливку
10.7 Теги: <span class="tag"><span class="consol"><</span>aside<span class="consol">></span></span>, <span class="tag"><span class="consol"><</span>section<span class="consol">></span></span> и <span class="tag"><span class="consol"><</span>article<span class="consol">></span></span>
10.8 Пример 8: Определение блока <span class="tag"><span class="consol"><</span>div<span class="consol">></span></span> и его свойств
10.9 Пояснение к программе Пример 8
11. Как задать абсолютное позиционирование для элементов HTML?
11.1 Свойство <span class="red">position</span>
11.2 Свойство <span class="red">top</span>, <span class="red">left</span>, <span class="red">bottom</span>, <span class="red">right</span>
11.3 Пример 9: Абсолютное позиционирование элемента <span class="tag"><span class="consol"><</span>div<span class="consol">></span></span>
11.4 Пояснение к программе Пример 9
12. Как задать <span class="red">z-index?</span>
12.1 Пример 10: Определение свойства <span class="red">z-index</span>
12.2 Пояснение к программе Пример 10
Глава III
1. Рисование простейших геометрических фигур
1.1 Отображение круга
1.2 Отображение квадрата
1.3 Отображение треугольника
1.4 Отображение параллелограмма
1.5 Прозрачность
1.6 Пример 11: Геометрические фигуры и прозрачность
1.7 Пояснение к программе Пример 11
2. Как задать тени для шрифтов, применяя свойство <span class="red">text-shadow</span>
2.1 Как закруглять углы, применяя свойство <span class="red">border-radius</span>
2.2 Пример 12: Отображение текста с различными комбинациями теней
2.3 Пояснение к программе Пример 12
3. Как создать горизонтальное меню
3.1 Свойства <span class="red">min-height</span> и <span class="red">max-height</span>
3.2 Функция <span class="blue">linear-gradient()</span>
3.3 Пример 13: Создание горизонтального меню
3.4 Пояснение к программе Пример 13
4. Как создать вертикальное меню
4.1 Как задать тени для элемента <span class="tag"><span class="consol"><</span>div<span class="consol">></span></span>, применяя свойство <span class="red">box-shadow</span>
4.2 Пример 14: Проектирование вертикального меню
4.3 Пояснение к программе Пример 14
5. Как создать выпадающее меню
5.1 Свойство <span class="red">transition</span>
5.2 Пример 15: Проектирование выпадающего меню
5.3 Пояснение к программе Пример 15
6. Создание трансформации
6.1 Свойство <span class="red">transform</span>
6.2 Масштабирование фотографий
6.3 Поворот в пространстве, функция <span class="blue">rotate3d(x,y,z,angle)</span>
6.4 Пример 16: Изменение положения и размеров элементов HTML
6.5 Пояснение к программе Пример 16
7. Создание анимации
7.1 Свойства <span class="red">animation-name</span>, <span class="red">animation-duration</span> и <span class="red">animation-direction</span>
7.2 Свойства <span class="red">animation-timing-function</span> и <span class="red">animation-iteration-count</span>
7.3 Правило <span class="blue">@keyframes</span>
7.4 Создание эффекта 3D вращения
7.5 Пример 17: Создание эффекта 3D вращения
7.6 Пояснение к программе Пример 17
8. Введение в элемент <span class="tag"><span class="consol"><</span>svg<span class="consol">></span></span>
8.1 Отображение текста элемент <span class="tag"><span class="consol"><</span>text<span class="consol">></span></span>
8.2 Атрибуты <span class="red">fill</span>, <span class="red">stroke</span> и <span class="red">stroke-width</span>
8.3 Градиентная заливка, элемент <span class="tag"><span class="consol"><</span>linearGradient<span class="consol">></span></span><
8.4 Отображение окружности, элемент <span class="tag"><span class="consol"><</span>circle<span class="consol">></span></span><
8.5 Отображение прямоугольника, элемент <span class="tag"><span class="consol"><</span>rect<span class="consol">></span></span>
8.6 Атрибуты <span class="red">width</span> и <span class="red">height</span>
8.7 Элемент <span class="tag"><span class="consol"><</span>path<span class="consol">></span></span>
8.8 События <span class="blue">click</span>, <span class="blue">mouseover</span>, <span class="blue">mouseout</span>, <span class="blue">mousedown</span> и <span class="blue">mouseup</span>
8.9 Атрибуты <span class="red">begin</span>, <span class="red">end</span> и <span class="red">repeatCount</span>
8.10 Создание анимации, элементы <span class="tag"><span class="consol"><</span>animateMotion<span class="consol">></span></span> и <span class="tag"><span class="consol"><</span>animate<span class="consol">></span></span>
8.11 Пример 18: Создание элементов <span class="tag"><span class="consol"><</span>svg<span class="consol">></span></span>
8.12 Пояснение к программе Пример 18
9. Правило <span class="blue">@media</span>
9.1 Правило <span class="blue">@page</span>
9.2 Свойство <span class="red">display</span>
9.3 Правило <span class="blue">@media print</span>
9.4 Правило <span class="blue">@media (max-width)</span>
9.5 Правило <span class="blue">@media all and (orientation)</span>
9.6 Правило <span class="blue">@media screen and (device-width)</span>
9.7 Пример 19: Применение правила <span class="blue">@media</span>
9.8 Пояснение к программе Пример 19
Наверх
Глава IV
1. Проигрывание видеофайлов на веб-странице, тег <span class="tag"><span class="consol"><</span>video<span class="consol">></span></span>
1.1 Атрибуты тега <span class="tag"><span class="consol"><</span>video<span class="consol">></span></span>
1.2 Атрибуты <span class="red">controls</span> и <span class="red">autoplay</span>
1.3 Атрибуты <span class="red">loop</span> и <span class="red">poster</span>
2. Проигрывание аудиофайлов на веб-странице, тег <span class="tag"><span class="consol"><</span>audio<span class="consol">></span></span>
2.1 Атрибуты тега <span class="tag"><span class="consol"><</span>audio<span class="consol">></span></span>
2.2 Атрибуты <span class="red">controls</span>, <span class="red">autoplay</span> и <span class="red">loop</span>
3. Пример 20: Воспроизведение видео и аудио файлов
3.1 Пояснение к программе Пример 20
4. Создание формы, тег <span class="tag"><span class="consol"><</span>form<span class="consol">></span></span>
4.1 Теги <span class="tag"><span class="consol"><</span>fieldset<span class="consol">></span></span>, <span class="tag"><span class="consol"><</span>legend<span class="consol">></span></span> и <span class="tag"><span class="consol"><</span>label<span class="consol">></span></span>
4.2 Атрибуты <span class="red">autofocus</span>, <span class="red">placeholder</span>, <span class="red">pattern</span> и <span class="red">required</span>
4.3 Элемент <span class="tag"><span class="consol"><</span>input<span class="consol">></span></span>
4.4 Пример 21: Создание формы
4.5 Пояснение к программе Пример 21
5. Программа-обработчик для формы на языке PHP
5.1 Пример 22: Программа-обработчик для формы на языке PHP
5.2 Пояснение к программе Пример 22
Глава V
1. Разработка совместимого HTML и CSS кода
1.1 Пример 23: Определение версии Internet Explorer
1.2 Пояснение к программе Пример 23
1.3 Пример 24: Совместимость HTML кода
1.4 Пояснение к программе Пример 24
2. Проверка HTML кода
2.1 Пример 25: Исправление ошибок в HTML коде
2.2 Пояснение к программе Пример 25
3. Проверка CSS кода
4. Тег <span class="tag"><span class="consol"><</span>meta<span class="consol">></span></span>
5. Как разместить веб-сайт на сервере, применяя программу FileZilla
Купить
Введение
1. Об авторе
2. Кому предназначается справочное пособие?
3. Что можно узнать, прочитав справочное пособие?
Главная
Книги
Книга по HTML5 and CSS3