Заглавная страница Избранные статьи Случайная статья Познавательные статьи Новые добавления Обратная связь FAQ Написать работу КАТЕГОРИИ: ТОП 10 на сайте Приготовление дезинфицирующих растворов различной концентрацииТехника нижней прямой подачи мяча. Франко-прусская война (причины и последствия) Организация работы процедурного кабинета Смысловое и механическое запоминание, их место и роль в усвоении знаний Коммуникативные барьеры и пути их преодоления Обработка изделий медицинского назначения многократного применения Образцы текста публицистического стиля Четыре типа изменения баланса Задачи с ответами для Всероссийской олимпиады по праву
Мы поможем в написании ваших работ! ЗНАЕТЕ ЛИ ВЫ?
Влияние общества на человека
Приготовление дезинфицирующих растворов различной концентрации Практические работы по географии для 6 класса Организация работы процедурного кабинета Изменения в неживой природе осенью Уборка процедурного кабинета Сольфеджио. Все правила по сольфеджио Балочные системы. Определение реакций опор и моментов защемления |
Язык гипертекстовой разметки HTML. Синтаксис языка.Содержание книги
Поиск на нашем сайте Синтаксис документа <!DOCTYPE html> <!-- Объявление формата документа --> <html> <head> <!-- Техническая информация о документе --> <meta charset="UTF-8"> <!-- Определяем кодировку символов документа --> <title>...</title> <!-- Задаем заголовок документа --> <link rel="stylesheet" type="text/css" href="style.css"> <!-- Подключаем внешнюю таблицу стилей --> <script src="script.js"></script> <!-- Подключаем сценарии --> </head> <body> <!-- Основная часть документа → <!-- А дальше вы знаете и сами, самый легкий вопрос --> </body> </html>
Основные теги <h1></h1>......<h6></h6>. — теги заголовков, от самого большого к самому маленькому.
<b></b> — жирный текст без придания важности выделенному фрагменту.
<strong></strong> — расставление акцентов в тексте путём выделения его фрагментов полужирным начертанием.
<em></em> — расставление акцентов путём выделения фрагментов текста курсивом.
<mark></mark> — выделение частей текста жёлтым маркером.
<pre></pre> — вывод неформатированного текста с сохранением пробелов и особенностей переносов.
<p></p> — контейнер для абзаца.
<br> — переносит текст на другую строку без создания абзаца.
<ol></ol> — список с цифрами.
<ul></ul> — список со значками.
<li> — отметка каждого элемента перечня (цифра или значок в зависимости от типа списка).
<a></a> — добавление гиперссылки в текст. Имеет обязательный атрибут href, в котором указывается ссылка или якорь. Внутри контейнера помещается текст, при нажатии на который происходит переход на другую страницу или другое место на этой же странице.
<img></img> — вставка изображения. Имеет атрибут src, который указывает на адрес нужного файла. Есть и другие атрибуты: <audio></audio> — вставка звукового контента.
<video></video> — вставка видео (поддерживается Ogg, WebM и MP4).
<source></source> — указывает местоположение файла для <video>, <audio> и <picture>
<track> — формирует субтитры для <video> и <audio>.
<object></object> — контейнер, через который встраиваются мультимедийные файлы. Для передачи параметров применяется тег <param>.
<hr> — размещает на странице горизонтальную линию. Имеет несколько атрибутов.
<table></table> — размещает таблицу. Все остальные теги для форматирования таблиц должны находиться внутри это контейнера.
<td></td> — создаёт одну ячейку.
<th></th> — указывает на заголовок ячейки.
<tr> — создание одной строки. <form></form> — создание форм на странице. С помощью HTML описывается только внешний вид, для выполнения функций требуется запуск соответствующих скриптов на сервере.
<button></button> — создаёт интерактивную кнопку. Внутри контейнера нужно поместить текст или изображение.
<input> — формирует поля для добавления пользовательских данных.
<output> — выводит результаты вычислений, сделанных с помощью скрипта.
<label> — оформляет пометку для поля, созданного тегом <input>.
<textarea></textarea> — создаёт большие поля для ввода текста. Приложение №1 Задание 1. 1. Создайте простой HTML-документ. 2. Добавьте два абзаца с произвольным текстом. 3. Организуйте между двумя абзацами вывод приветсвенного сообщения в диалоговом окне, задав необходимые команды внутри тэга <script>. 4. Добавьте команду вывода аналогичного приветсвенного сообщения в окно браузера после закрытия диалогового окна. 5. Сохраните документ с именем Ex1.html в рабочей папке.
Приложение № 2 Задание 2. 1. Создайте простой HTML-документ. 2. Добавьте два абзаца с произвольным текстом. 3. Организуйте между двумя абзацами вывод приветсвенного сообщения в диалоговом окне, задав необходимые команды JavaScript во внешем файле. Для этого: создайте новый текстовый файл, поместите в него код JavaScript, сохраните файл с именем main.js следующим образом: укажите тип файла “Все файлы”, кодировку “UTF-8”. 4. Добавьте ссылку на внешний скриптовый файл из рабочего HTML-документа. Сохраните документ с именем Ex2.html в рабочей папке.
Приложение №3 Задание 3. 1. Создайте простой HTML-документ. 2. Сохраните документ с именем Ex3.html в рабочей папке. 3. Добавьте в документ код JavaScript так, чтобы в диалоговом окне появлялось поле с надписью "Введите сюда своё имя" и со значением по умолчанию в поле "Введите имя". Для этого используйте метод promt(...) объекта window. Для хранения введенного значения заведите новую переменную. 4. Организуйте вывод введенного значения имени в окно браузера в виде: "Ваше имя <…..>". 5. Дополните код, чтобы в новом диалоговом окне появилось надпись "Начать заново? " При положительном ответе появлялось диалоговое окно: "Не надоело? ", при отказе – "Ну и правильно!". Используйте для написания методы alert(…) и confirm(…) объекта window.
Задание 4.
1. Рассмотрите пример крипта: <html> <head> <title>if</title> </head> <body> <script language="JavaScript" type="text/JavaScript"> var x, y; x=parseInt(prompt("Введите значение х",'')); // метод parseInt() переводит строку в целое y=parseInt(prompt("Введите значение у",'')); // число if(x<y) { alert("Максимальное число - y") } else { alert("Максимальное число - x")
}
</script> </body> </html> • Допишите скрипт так, чтобы при введении пользователем одинаковых чисел, открывалось сообщение "Введенные числа равны!". • Напишите скрипт, в котором пользователя просят ввести правильный пароль. При вводе правильного пароля, в окне браузера появляется сообщение о том, что пароль верен. При вводе неправильного пароля – выпадает сообщение о неправильно введенном пароле. Для выполнения задания введите переменную password, в которую сохраните верное значение пароля. • Сохраните документ с именем Ex4.html в рабочей папке.
Приложение № 5 Задание 5. • Рассмотрите пример скрипта: <html> <head> <title>for</title> </head> <body> <h1>Пример простой</h1> <script language="JavaScript" type="text/JavaScript"> function line() { document.writeln("<hr align='center' width='100'>"); } for (var i=1; i<10; i++) line();
</script> </body> </html> • Cоздайте вариант прорисованных линий со следующим условием:
десять линий должны располагаться друг под другом, первая должна быть длинной 10 пикселей, каждая последующая на 10 пикселей больше.
• Сохраните документ с именем Ex5.html в рабочей папке.
Приложение №6 Задание 6.
• Рассмотрите пример скрипта: <html>
<head> <title>array</title> </head> <body> <script language="JavaScript"> year=new Array("декабрь","январь","февраль","март","апрель","май", "июнь","июль","август","се нтябрь","октябрь","ноябрь");
summer=new Array(); //летние месяцы summer=year.slice(6,9); document.write(summer+"<br>"); </script> </body> </html> Создайте массив, содержащий названия школьных предметов. Выделите из него два массива. Пусть к первому относятся предметы из раздела точных наук, а ко второму - из раздела гуманитарных наук. Для создания и вывода в окно браузера новых массивов используйте метод slice(…) и wtite(…) объекта document. Оформите исполняющий скрипт в виде отдельной функции, описанной в разделе <head> и вызванной в разделе <body>.
Сохраните документ с именем Ex6.html в рабочей папке.
Приложение №7 Задание 7.
Рассмотрите скрипт: <html> <head> <title>document</title> </head> <body> <script language="JavaScript" type="text/JavaScript"> document.write("Спасибо, что пришли к нам на курсы!"); </script> </body> </html> Допишите скрипт так, чтобы
цвет фона документа был #E7E6D8, цвет шрифта – красный, внизу выводилась дата последней модификации документа, используйте для этого слияние методов wtite(…) и lastModified(…) объекта document.
Сохраните документ с именем Ex7.html в рабочей папке.
Приложение № 8
Задание 8
Рассмотрите пример скрипта открытия нового окна на странице: <html> <head> <title>window</title> </head> <body> <h1>Создание нового окна</h1> <hr>
<script language="JavaScript" type="text/JavaScript"> window.open("http://www.google.com","","toolbar=no,scrollbars=yes,widt h=250, height=250, resizable=yes, top=100, left=500") </script> </body> </html> Измените скрипт так, чтобы выполнялись следующие условия:
открытие нового окна происходило при нажатии на ссылку с текстом: «Щелкните на ссылке для получения справочной информации», размеры окна - 500х500, есть возможность изменения размеров окна. Для выполнения задания используйте написание функции.
Сохраните документ с именем Ex8.html в рабочей папке.
Приложение № 9
Задание 9.
1. Создайте страницу с переадресацией на другой адрес (redirect). 2. Измените скрипт так, чтобы переадресация на другой адрес была с задержкой 5 секунд. 3. Сохраните документ с именем Ex9.html в рабочей папке.
Приложение №10
Задание 10 Создайте HTML-документ, в котором будет 2 ссылки:
первая ссылка должна ссылаться на PDF файл; при нажатии на нее выпадает сообщение с предупреждением о том, что для загрузки документа требуется программа Acrobat, и продолжить загрузку или нет; используйте для написания метод confirm(…) для подтверждения загрузки;
вторая ссылка должна содержать такой код, чтобы при наведении на нее мыши менялся цвет фона документа на красный.
Сохраните документ с именем Ex10.html в рабой папке.
Приложение №11
Задание 11.
Создайте HTML-документ, содержащий любую картинку.
Добавьте скрипт с условиями:
при наведении курсора мыши на картинку она увеличивается, при отведении курсора мыши – уменьшается до исходного размера.
Постройте скрипт через использование функций и событий MouseOver и MouseOut.
Сохраните документ с именем Ex11.html в рабочей папке.
Приложение №12 Задание 12
Рассмотрите скрипт: <head> <title>h1</title>
<script language="JavaScript"> function colorchange()
{ head.style.color = "red"; } </script> </head> <body> <h1 id="head" onmouseover="colorchange()">Добро пожаловать на нашу страницу!</h1>
</body> </html> Допишите скрипт страницы таким образом, чтобы красный цвет исчезал после отвода курсора мыши с заголовка. Сохраните документ с именем Ex12.html в рабочей папке.
Приложение №13
Задание 13. Рассмотрите скрипт: <html> <head> <title>text decoration</title> <script language="JavaScript"> function addunderline() { head.style.textDecoration = "underline"; } function removeunderline() { head.style.textDecoration = "none"; } </script> </head> <body> <h1 id="head" onMouseover="addunderline()" onMouseout="removeunderline()"> Добро пожаловать на нашу страницу! </h1> </body> </html> Допишите скрипт страницы таким образом, чтобы на одинарный щелчок мыши появлялось полоса над заголовком, а на двойной щелчок – текст зачеркивался. Используйте события onclick, ondblclick и значения рассматриваемого свойства overline и line-through. Сохраните документ с именем Ex18.html в рабочей папке.
Приложение №14
Задание 14.
Выведите на экран одна за другой четыре строки: 'Всем ', 'привет ', 'от ', 'PHP!<br><br>', используя для этого только один операторecho. После данной инструкции напишите два однострочных комментария: 'Для вывода слов на разных строках мы используем элемент "br", т.е разрыв строки' и 'Переменные выводимые оператором echo перечисляются через запятую'. Далее измените код первой части так, чтобы слова после вывода на экран находились на разных строках. В самом конце нашего кода напишите многострочный комментарий: 'После каждой инструкции мы будем ставить точку с запятой даже, если инструкция является последней в блоке php-кода!'.
Приложение №15
Задание 15
Восстановите по комментариям php-код условия
Приложение №16
Задание 16 Восстановите по комментариям php-код условия.
Приложение №17
Задание 17 Создайте переменную $a и присвойте ей значение 10. Создайте переменную $b и присвойте ей значение 20. Теперь создайте переменную $car и присвойте ей строку с именем первой переменной. Выведите на экран ${$car}. Создайте еще одну переменную $trackи присвойте ей строку с именем второй переменной. Выведите на экран ${$track}.
Приложение №18 Задание 18 Создайте простую HTML-форму, которая принимает имя пользователя и отображает его с помощью оператора PHP echo
Приложение №19
Задание 19 Написать программу, которая сокращает ФИО. Например, Иванов Иван Иванович, результат - Иванов И. И.
Приложение №20
Задание 20 Создайте форму с одним полем ввода с запросом любимого города пользователя. Используйте для формы метод "post". После того, как пользователь щелкнет кнопку отправки, выведите название города, введенное пользователем, сразу же под кнопкой "Отправить". Подсказка: переменная, содержащая пользовательский ввод, является массивом. Переменная массива - $_POST['name'], где 'name' - имя вашего поля ввода.
Приложение №21 Задание 21 Написать программу, которая сокращает ФИО. Например, Иванов Иван Иванович, результат - Иванов И. И.
Приложение №22
Задание 22 Дан массив $arr. С помощью цикла foreach запишите английские названия в массив $en, а русские — в массив $ru.
Приложение №23
Задание 23 Составьте массив дней недели. С помощью цикла foreach выведите все дни недели, а выходные дни выведите жирным
Приложение №24
Задание 24. Дано число $num=1000. Делите его на 2 столько раз, пока результат деления не станет меньше 50. Какое число получится? Посчитайте количество итераций, необходимых для этого (итерация - это проход цикла). Решите задачу сначала через цикл while, а потом через цикл for
Приложение №25
Задание 25 Дан массив с элементами 1, 2, 5, 9, 4, 13, 4, 10. С помощью цикла foreach и оператора if проверьте есть ли в массиве элемент со значением, равным 4. Если есть - выведите на экран 'Есть!' и выйдите из цикла. Если нет - ничего делать не надо.
|
|||||||||||||||||||||||||||||||||||
|
Последнее изменение этой страницы: 2021-06-14; просмотров: 1113; Нарушение авторского права страницы; Мы поможем в написании вашей работы! infopedia.su Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав. Обратная связь - 216.73.217.21 (0.013 с.) |