ДЗ-2 (создание простой страницы)
реклама
Язык разметки гипертекста HTML Hyper Text Markup Language Основа языка HTML – теги Теги – управляющие слова. Они бывают парные(контейнеры) и непарные. <body></body> - парный тег <br>- непарный У тега могут быть свойства, называемые атрибутами, дающие дополнительные возможности форматирования текста. Они записываются в виде пары имя-значение, причем нечисловое значение заключается в кавычки. Например: align="center“ <p align="center“>Новый абзац</p> size=5 <font size=5 > Шрифт</font> Структура html-документа <html> <head> <title>Заголовок документа</title> </head> <body> Тело документа </body> </html> Теги разметки HTML-документа <html></html> - обозначение HTML документа <head></head> - здесь располагается тег названия документа и теги для поисковых машин <title></title> - название документа, отображаемое в заголовке браузера <body></body> - Определяет видимую часть документа 1. Заголовок <h1> head самый большой заголовок</h1> <h2>…</h2> <h6> самый маленький заголовок</h6> <h1 align= “left | center | right “> 2. Разделение на абзацы и перенос строки <br> -begin row тег принудительного перевода строки. <p>paragraph </p> - разделяет текст на абзацы. <P align=“left | center | right | justify”> Пример: <p align="left">Коммуникация</p> Пример <h1>Это заголовок первого уровня</h1> <h2>Это заголовок второго уровня</h2> <h3>Это заголовок третьего уровня</h3> <h4 align="right">Это заголовок четвертого уровня</h4> <h5 align="center">Это заголовок пятого уровня</h5> <h6 align="justify">Это заголовок шестого уровня</h6> Это просто текст 3. Форматирование шрифта <i> italyc курсив </i> <b> bold полужирный</b> <u> для подчеркивания </u> <tt> моноширинный шрифт </tt> Verdana <sup>верхний индекс</sup> <sub> нижний индекс</sub> Для вывода математических и химических формул. y=x2 x1=0 y=x <sup>2</sup> x <sub>1</sub> =0 <font>текст</font> - указывают параметры шрифта текста <font face = “название шрифта” size = “размер шрифта в условных единицах от ±1 до ±7” color = “red”> цвет текста (по умолчанию - черный). <font face=“Arial” size=“+2” color=“#FF0000”> <basefont size=1..7> базовый размер шрифта По умолчанию размер равен 3 4. Горизонтальная линия <hr> horisont row <hr align = “left | center| right” - выравнивание size = 1..10 - толщина линии width =“70%” – ширина линии noshade> - сплошная заливка (без объема) <body> Это простой текст. <br> <font face="Verdana" size=5 color="red"> Этот текст красный, размера 5.</font> <br> <font face="Arial" size=2 color=“#0000ff"> Этот текст синий, размера 2. </font> </body> Этапы создания web-страницы 1. 2. 3. 4. 5. 6. В блокноте набрать текст и с тегами Сохранить файл с расширением .htm (имя и расширение из строчных латинских букв). При выбирете в Типе файла Все файлы. Например, index.htm Закрыть блокнот Открыть web-страницу Для редактирования страницы открыть её с помощью блокнота Чтобы сохранить изменения в блокноте Ctrl +S. Обновить страницу F5. <HTML> <HEAD><TITLE>Работа со шрифтами</TITLE> </HEAD> <BODY><basefont size="5"> <h1 align="center">ШРИФТЫ</h1> Шрифты бывают разные<br> <i> с курсивом </i><br> <b> полужирные </b><br> <font face="Arial"> Arial </font><br> <font face="Times New Roman"> Times New Roman <br> <font color="red"><tt>красный моноширинный</tt></font><br> <hr size="3" color="red"> <h2 align="center"> Формулы </h2> <p align="center"> q=2<sup>n</sup><br> x<sub>1</sub>+x<sub>2</sub>=10<br> <hr size="3" color="red" width="70%"> </BODY> </HTML> Домашнее задание Создайте СВОЮ web-страницу по образцу (пишите о себе, кроме формул). Сохраните под своей фамилией с указанием класса. Например, islamov9b.htm Цвета линий должны становиться короче (70%, 60%, 50%) и светлее Пришлите страницу учителю (Морева Е.А. [email protected] Мустафина А.Т. [email protected]) В теме письма укажите тему: Фамилия класс Первая страница. Например, Исламов 9Б Первая страница Чтобы вставить знак ±, необходимо ввести &plusmn; Например, х= ±2 X= &plusmn; 2 Фон страницы Для изменения фона служит атрибут тега <body></body>: 1. bgcolor-задает цвет в формате #RRGGBB Например: < BODY bgcolor="#FF0000">< /BODY> Цвет страницы красный. 2. background — позволяет задать в качестве фона html-страницы картинку. <BODY background="logo.jpg"></BODY>
