Создание сайта. 1. Первый документ Мой первый шаг Здравствуйте, это моя первая страница. Добро пожаловать ! :) - презентация

1 Создание сайта

2 1. Первый документ Мой первый шаг Здравствуйте, это моя первая страница. Добро пожаловать ! :)

3 2. Html html не является языком программирования, он предназначен для разметки текстовых документов То, как будут выглядеть картинки, текст и другие элементы на вашей странице, и как они будут располагаться относительно друг друга, определяют метки (tags или тэги ). Мой первый шаг Здравствуйте, это моя первая страница. Добро пожаловать ! :)

4 3. Тег Все, что находится между - это тэг. Текст, не находящийся между такими скобками - весь виден при просмотре в броузере - этот тэг должен открывать документ закрывающий тег - перенос текста на другую строку ( не требуют закрывающего тэга ) Мой первый шаг Здравствуйте, это моя первая страница. Добро пожаловать ! :)

5 4. Очередность тегов - голова документа - тело документа... Только такая очередность закрывающих тэгов верна : тэг, который мы открыли первым - закрываем последним, второй – предпоследним и т. д.

6 5. Раскрашивание Палитра ( все цвета интернета Добро пожаловать ! :) Цвет - решетка - имя цвета

7 6. Второй документ Мой первый шаг Здравствуйте, это моя первая страница. Добро пожаловать ! :)

8 7. Другой способ раскрашивания Мой первый шаг Здравствуйте, это моя первая страница. Добро пожаловать ! :)

9 8. Фон документа Мой первый шаг Здравствуйте, это моя первая страница. Добро пожаловать ! :)

10 9. Параграфы … Выравнивание текст - центрировать текст текст - по левому краю текст - по правому краю текст - по обоим краям Мой первый шаг Здравствуйте, это моя первая страница. Добро пожаловать ! :)

11 10. Центрирование ! Нельзя вводить в документ подобную конструкцию : после закрывающего тега автоматически происходит перенос строки текст - тэг альтернативный Мой первый шаг Здравствуйте, это моя первая страница. Добро пожаловать ! :)

12 11. Альтернатива выравнивания текст Мой первый шаг Здравствуйте, это моя первая страница. Добро пожаловать ! :)

13 12. и Запрещается текст текст текст И текст текст текст Можно текст первого абзаца текст второго абзаца текст третьего абзаца

14 13. Заголовки и размер шрифта текст после закрывающего происходит автоматически перенос на другую строку для выделения небольшой части текста Для большого фрагмента текста предназначен атрибут size тэга текст

15 14. Стиль шрифта Полужирный текст Наклонный текст ( курсив ) моноширинный шрифт ( куча пробелов ) Или Можно применять сразу несколько тэгов : текст Подчеркнутый текст Перечеркнутый Или Перечеркнутый

16 15. Стиль шрифта Малый Нормальный текст Большой Верхний индекс sup Нижний индекс sub

17 16. Тип шрифта текст ( шрифт Arial) Стандартные типы шрифтов Times; Times New Roman; Arial; Helvetica; Courier; Verdana; Tahoma; Cosmic Sans; Garamond В атрибуте face можно указать сразу несколько типов шрифтов : текст ( шрифт Arial)

18 17. Тип шрифта В атрибуте face можно указать сразу несколько типов шрифтов : текст ( шрифт Arial)

19 18. Вставка картинки картинка в той же папке, что и документ во вложенной папке на уровень выше на другом сайте

20 19. Обтекание картинки текстом слева справа текст внизу текст посередине текст сверху

21 20. Обтекание картинки текстом расстояние между текстом и рисунком ( по вертикали ) по горизонтали ( в пикселях ) описание картинки ширина самой картинки высота самой картинки рамка вокруг самой картинки Атрибуты для одного тэга могут употребляться одновременно друг с другом

22 21. Картинку можно сделать фоном документа

23 22. Завершение обтекания текстом или all, right

24 23. Создание ссылок Создать отдельную папку и поместить в ней index.html – главный документ prf.html – документ с фотографиями посмотреть мои фотографии Тэг делает ссылкой заключенную в него картинку или фразу ( текст ). мои фотографии в той же папке мои фотографии в папке /photos мои фотографии на сайте

25 24. Цвета ссылки link - цвет просто ссылки alink - цвет активной ссылки ( нажатой ) vlink - цвет уже посещенной ссылки прописан один цвет для всех ссылок в документе Разный цвет ссылок делается при помощи тэга и его атрибута color: посмотреть мои фотографии ! - прописывается внутри тэга

26 25. Ссылка на почтовый ящик У mailto есть еще некоторые опции : - ?subject= Тема пи c ьма - &Body= Текст вашего сообщения - ( копии письма через запятую ) - ( скрытые копии письма через запятую ) Все вместе это будет выглядеть так :

27 26. Подсказка к текстовой ссылке текст - ссылка текст - ссылка

28 27. Картинка - ссылка Рамочку вокруг картинки можно убрать, если вы зададите картинке атрибут border="0"

29 28. Цвет рамки вокруг картинки задается атрибутом bordercolor,

30 29. Увеличение картинки Нажимаешь на маленькую картинку - загружается большая - в том же окне - в новом окне

31 30. Навигационная карта Навигационные карты задаются тэгом. Тэг включает себя тэг ( и ), которые определяют геометрические области внутри карты и ссылки, связанные с каждой....

32 31. Навигационная карта Атрибут shape - определяет форму области : будет ли она прямоугольником (shape="rect"), кругом (shape="circle") или многоугольником (shape="poly"). Атрибут shape - определяет форму области : прямоугольник (shape="rect"), круг (shape="circle") или многоугольник (shape="poly").

33 31. Навигационная карта 1., где x1=25, y1=36, x2=114, y2=98 2. Ссылка области 3. Дать имя карты 4. Связать карту с картинкой Текст

34 31. Навигационная карта Круглой область : координаты центра (x и y) и длина радиуса (R) в пикселях. Многоугольная область : координаты вершин (x и y)

35 32. Ссылка внутри документа – « якорь » Заголовки сделаем закладками, использовав атрибут тэга A - name: Стих третий Затем, мы сделаем на них ссылки : Ссылка на стих третий Вы можете ссылаться на закладку и из других документов, тогда ссылка будет выглядеть следующим образом : Ссылка на стих третий из какого - то другого документа или Ссылка на стих третий из какого - то другого документа ( имя сайта, имя документа + имя закладки )