Разметка страницы с помощью элементов DIV

Написать веб-страницу, в которой реализовать разметку страницы на блоки с помощью элементов DIV. Ширину страницы делать фиксированной, 1000 пикселей. Ширина каждого блока дана в варианте. Высота страницы и каждого блока определяется высотой контента. В каждый блок поместить текст, чтобы было видно, как работает разметка с контентом.

Страница должна быть выровнена посредине окна браузера по горизонтали.

Варианты

Вариант 1


Вариант 2

Вариант 3

Вариант 4


Вариант 5


Вариант 6

Ширина 220 пикселей

Вариант 7

Вариант 8

Вариант 9

Вариант 10

Вариант 11

Вариант 12

Вариант 13

Вариант 14


Вариант 15

Вариант 16

Контрольные вопросы

• Для чего используется свойство float?

• Для чего используется свойство clear?

• Для чего используется свойство border-style?

• Для чего используется свойство width?

• Как задать цвет фона элемента?


Лабораторная работа №9. Знакомство с JavaScript

• Написать три веб-страницы: 1.html, 2.html, 3.html, на которые вставить программу на JavaScript по варианту. Вставка должна осуществляться тремя способами (по одному на веб­страницу): в 1.html — из файла scriptjs, в 2.html — в теге script, в 3.html — в атрибуте onclick элемента input.

• На веб-странице должно быть поле ввода и кнопка «Вычислить», при клике на которую браузер выводит в абзац на этой же странице результат вычислений по варианту.

Варианты

Вариант 1

• На входе: выражение из двух целых чисел и знака операции между ними. Должны поддерживаться операции +,-, *, /.

• На выходе: результат вычисления выражения.

Пример: 1 + 1 и 2.

Вариант 2

• На входе: строка.

• На выходе: символ с наименьшим кодом из этой строки. Пример: abcd и a.

Вариант 3

• На входе: целое число.

• На выходе: строка «простое», если это простое число, и «не простое» в противном случае. Пример: 11 и простое.

• Вариант 4

• На входе: целое число.

• На выходе: количество десятичных цифр в этом числе. Пример: 1234 и 4.

Вариант 5

• На входе: строка.

• На выходе: количество цифр в этой строке. Пример: 7раз отмерь, 1 раз отрежь и 2.

Вариант 6

• На входе: строка.

• На выходе: строка, состоящая из символов исходной строки, отсортированных по коду. Пример: to be и beot.

Вариант 7

• На входе: целое число.

• На выходе: наибольший делитель этого числа, отличный от самого числа, или слово «нет», если число простое.

• Пример: 12 и 6.

Вариант 8

• На входе: три числа, разделенных пробелами На выходе: корни уравнения, или один корень Пример: -1 0 1 и -1 1.

Вариант 9

• На входе: два целых числа, разделенных пробелом. На выходе: результат целочисленного деления первого числа на второе. Пример: 10 4 и 2.

Вариант 10

• На входе: строка.

• На выходе: строка, состоящая из символов исходной строки, отсортированных по коду в обратном порядке.

Пример: it works и wtsroki.

Вариант 11

• На входе: строка.

• На выходе: количество символов исходной строки, являющихся буквами английского алфавита.

Пример: 1st string и 8.

Вариант 12

• На входе: строка.

• На выходе: символ с наибольшим кодом из этой строки. Пример: abcd и d.

Вариант 13

• На входе: целое число.

• На выходе: наименьший делитель этого числа, отличный от единицы, или слово «нет», если число простое.

• Пример: 12 и 2.

Вариант 14

• На входе: строка.

• На выходе: сумма кодов символов этой строки. Пример: abc и 294.

Вариант 15

• На входе: строка.

• На выходе: эта строка без 10% символов слева и 10% символов справа с точностью до одного символа.

Пример: abcdefghij и bcdefghi.

Вариант 16

• На входе: одно целое число от 1 до 10 включительно. На выходе: факториал этого числа Пример: 5 и 120.


Работа 10. JavaScript и объекты браузера.

Написать страницу с использованием JavaScript, по варианту.

Варианты

Вариант 1

Калькулятор с кнопками-цифрами, четырьмя арифметическими действиями, вычислением степеней, одним регистром памяти.

Вариант 2

Построение столбчатых диаграмм. Пользователь вводит последовательность чисел, программа строит столбчатую диаграмму.

Вариант 3

Форма ввода email с дополнительными кнопками (.com,.ru,.net) и проверкой адреса на корректность.

Вариант 4

Выпадающее меню (как в приложениях)

Вариант 5

Раскрывающееся вертикальное меню. При клике на элемент под ним появляется подменю, а лежащие ниже элементы сдвигаются вниз. При повторном клике подменю сворачивается.

Вариант 6

Объект, «привязанный» к указателю

Вариант 7

Слайдер изображений.

Вариант 8

Выбор значения с автоподбором по мере ввода (пример: ввод города вконтакте)

Вариант 9

Слайд-шоу изображений. Изображения автоматически меняются на одном месте.

Вариант 10

Псевдо 3d - вращение предмета. Имеется несколько фотографий предмета с разных сторон. Скрипт показывает их последовательно, создавая эффект вращения.

Вариант 11

Иерархическое меню (как в области переходов роводника)

Вариант 12

Объект, «убегающий» от указателя. При попытке навести указатель на объект он перемещается в другое место окна.

Вариант 13

Настройка оформления страницы: цвета фона и текста, шрифты текста (из готовых вариантов). Пользователь сам выбирает вариант оформления.

Вариант 14

Игра «15».

Вариант 15

Календарь текущего месяца с переходами на следующий и предыдущий месяцы, в них тоже переходы на предыдущий и следующий месяцы и так далее.

Вариант 16

Скрипт, выводящий в абзац текста на странице информацию о ней: количество символов, слов, абзацев, таблиц, рисунков, форм. Сам абзац для вывода в расчетах не учитывает


Понравилась статья? Добавь ее в закладку (CTRL+D) и не забудь поделиться с друзьями:  



double arrow
Сейчас читают про: