Основы создания HTML и CSS документов в программе Aptana Studio 3. 4 страница

2. Задать первый абзац: выравнивание по центру, цвет текста задать в RGB-палитре (250,250,210), размер шрифта равен 6 миллиметрам, тип шрифта Arial Black, слово первый выделить курсивом. Текст абзаца "Это первый абзац, выровненный по центру, цвет текста в RGB-палитре (250,250,210), размер шрифта равен 6 миллиметрам, тип шрифта Arial Black, слово первый выделить курсивом "

3. Задать второй абзац: выравнивание по ширине, цвет текста задать в шестнадцатеричном написании 1188bb, размер шрифта равен 5 точкам, тип шрифта Century Schoolbook, слово Это сделать жирным. Текст абзаца "Это второй абзац, выровненный по ширине, цвет текста в шестнадцатеричном написании 1188bb, размер шрифта равен 5 точкам, тип шрифта Century Schoolbook, слово Это сделать жирным "

5. Варианты заданий на списки

Вариант

1. font-size

II. font-variant

3. text-transform

    • lowercase

преобразует текст в строчные буквы

    • uppercase

преобразует текст в прописные буквы

o capitalize

преобразует все начальные буквы слов в прописные

IV. text-decoration

B. underline

подчеркивание

С. line-through

зачеркивание (оно используется, к примеру, чтобы выделить

неверные или неактуальные идеи в тексте)

iv. overline

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

e. none

удаляет любой вид линий

Е. line-height

III. pt

Единицами измерения служат точки

XV. %

Единицами измерения служат проценты

13 font-weight

Вариант

A. font-size

II. font-variant

C. text-transform

o lowercase

преобразует текст в строчные буквы

§ uppercase

преобразует текст в прописные буквы

o capitalize

преобразует все начальные буквы слов в прописные

IV. text-decoration

c. underline

подчеркивание

d. line-through

зачеркивание (оно используется, к примеру, чтобы выделить

неверные или неактуальные идеи в тексте)

vi. overline

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

g. none

удаляет любой вид линий

Е. line-height

3. pt

Единицами измерения служат точки

4 %

Единицами измерения служат проценты

7 font-weight

Вариант

a. font-size

b. font-variant

c. text-transform

V. lowercase

преобразует текст в строчные буквы

VI. uppercase

преобразует текст в прописные буквы

vii. capitalize

преобразует все начальные буквы слов в прописные

4 text-decoration

a. underline

подчеркивание

b. line-through

зачеркивание (оно используется, к примеру, чтобы выделить

неверные или неактуальные идеи в тексте)

c. overline

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

d. none

удаляет любой вид линий

H. line-height

b. pt

Единицами измерения служат точки

5 %

Единицами измерения служат проценты

e. font-weight

Вариант

1. font-size

2. font-variant

ii. text-transform

c lowercase

преобразует текст в строчные буквы

d. uppercase

преобразует текст в прописные буквы

e. capitalize

преобразует все начальные буквы слов в прописные

1. text-decoration

a. underline

подчеркивание

III. line-through

зачеркивание (оно используется, к примеру, чтобы выделить

неверные или неактуальные идеи в тексте)

iv. overline

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

V. none

удаляет любой вид линий

b. line-height

5. pt

Единицами измерения служат точки

7. %

Единицами измерения служат проценты

· font-weight

Вариант

i. font-size

ii. font-variant

iii. text-transform

3. lowercase

преобразует текст в строчные буквы

4. uppercase

преобразует текст в прописные буквы

5. capitalize

преобразует все начальные буквы слов в прописные

o text-decoration

IV. underline

подчеркивание

V. line-through

зачеркивание (оно используется, к примеру, чтобы выделить

неверные или неактуальные идеи в тексте)

VI. overline

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

vii. none

удаляет любой вид линий

c. line-height

b. pt

Единицами измерения служат точки

d. %

Единицами измерения служат проценты

§ font-weight

Вариант

d. font-size

e. font-variant

f. text-transform

VI. lowercase

преобразует текст в строчные буквы

VII. uppercase

преобразует текст в прописные буквы

viii. capitalize

преобразует все начальные буквы слов в прописные

B. text-decoration

d. underline

подчеркивание

· line-through

зачеркивание (оно используется, к примеру, чтобы выделить

неверные или неактуальные идеи в тексте)

i. overline

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

e. none

удаляет любой вид линий

J. line-height

c. pt

Единицами измерения служат точки

i. %

Единицами измерения служат проценты

f. font-weight

Вариант

B. font-size

III. font-variant

C. text-transform

o lowercase

преобразует текст в строчные буквы

§ uppercase

преобразует текст в прописные буквы

· capitalize

преобразует все начальные буквы слов в прописные

V. text-decoration

С. underline

подчеркивание

D. line-through

зачеркивание (оно используется, к примеру, чтобы выделить

неверные или неактуальные идеи в тексте)

VI. overline

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

g. none

удаляет любой вид линий

F. line-height

4. pt

Единицами измерения служат точки

5. %

Единицами измерения служат проценты

ix. font-weight

Вариант

e. font-size

g. font-variant

h. text-transform

VIII. lowercase

преобразует текст в строчные буквы

IX. uppercase

преобразует текст в прописные буквы

x. capitalize

преобразует все начальные буквы слов в прописные

11. text-decoration

f. underline

подчеркивание

g. line-through

зачеркивание (оно используется, к примеру, чтобы выделить

неверные или неактуальные идеи в тексте)

i. overline

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

· none

удаляет любой вид линий

L. line-height

2. pt

Единицами измерения служат точки

9. %

Единицами измерения служат проценты

e. font-weight

Вариант

h. font-size

i. font-variant

j. text-transform

3. lowercase

преобразует текст в строчные буквы

4. uppercase

преобразует текст в прописные буквы

5. capitalize

преобразует все начальные буквы слов в прописные

k. text-decoration

a. underline

подчеркивание

b. line-through

зачеркивание (оно используется, к примеру, чтобы выделить

неверные или неактуальные идеи в тексте)

iii. overline

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

d. none

удаляет любой вид линий

· line-height

II. pt

Единицами измерения служат точки

VI. %

Единицами измерения служат проценты

l. font-weight

Вариант

· font-size

· font-variant

· text-transform

I. lowercase

преобразует текст в строчные буквы

II. uppercase

преобразует текст в прописные буквы

iii. capitalize

преобразует все начальные буквы слов в прописные

m. text-decoration

5. underline

подчеркивание

6. line-through

зачеркивание (оно используется, к примеру, чтобы выделить

неверные или неактуальные идеи в тексте)

A. overline

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

8. none

удаляет любой вид линий

· line-height

b. pt

Единицами измерения служат точки

e. %

Единицами измерения служат проценты

i. font-weight

Вариант

· font-size

ii. font-variant

· text-transform

A. lowercase

преобразует текст в строчные буквы

D. uppercase

преобразует текст в прописные буквы

E. capitalize

преобразует все начальные буквы слов в прописные

o text-decoration

2. underline

подчеркивание

iii. line-through

зачеркивание (оно используется, к примеру, чтобы выделить

неверные или неактуальные идеи в тексте)

4. overline

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

5. none

удаляет любой вид линий

· line-height

II. pt

Единицами измерения служат точки

V. %

Единицами измерения служат проценты

· font-weight

Вариант

I. font-size

II. font-variant

III. text-transform

b. lowercase

преобразует текст в строчные буквы

c. uppercase

преобразует текст в прописные буквы

iv. capitalize

преобразует все начальные буквы слов в прописные

IV. text-decoration

1. underline

подчеркивание

B. line-through

зачеркивание (оно используется, к примеру, чтобы выделить

неверные или неактуальные идеи в тексте)

3. overline

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

4. none

удаляет любой вид линий

VIII. line-height

§ pt

Единицами измерения служат точки

· %

Единицами измерения служат проценты

IX. font-weight

6. Варианты заданий на таблицы

Во всех таблицах сделать: ширину 20%, высоту 200, совпадение границ, значение border равное 1. Задание выполнить с использованием двух файлов html и css.

1 Вариант
       

1,4,10-цвет фона синий, цвет шрифта белый

3,5,9-цвет фона желтый, цвет шрифта красный

2,6,8-цвет фона голубой, цвет шрифта зеленый

7-цвет фона красный, размер шрифта 20 точек

2 вариант

       

1,3,9-цвет фона черный, цвет шрифта белый

2,5,7-цвет фона коричневый, цвет шрифта желтый

4,6,10-цвет фона красный, цвет шрифта зеленый

8-цвет фона синий, размер шрифта 20 точек

3 вариант

       

1,6,7-цвет фона синий, цвет шрифта желтый

2,5,9-цвет фона малиновый, цвет шрифта зеленый

3,4,8-цвет фона серый, цвет шрифта голубой

10-цвет фона желтый, размер шрифта 14 точек

4 вариант

       

2,3,8-цвет фона синий, цвет шрифта белый

1,5,7-цвет фона зеленый, цвет шрифта красный

4,6,10-цвет фона желтый, цвет шрифта малиновый

9-цвет фона голубой, размер шрифта 14 точек

5 вариант

       

1,2,7-цвет фона красный, цвет шрифта желтый

3,4,8-цвет фона черный, цвет шрифта белый

5,6,9-цвет фона голубой, цвет шрифта зеленый

10-цвет фона зеленый, размер шрифта 14 точек

6 вариант

       

2,6,9-цвет фона желтый, цвет шрифта коричневый

1,4,7-цвет фона зеленый, цвет шрифта голубой

5,8,10-цвет фона синий, цвет шрифта белый

3-цвет фона малиновый, размер шрифта 14 точек

7 вариант

       

4,5,9-цвет фона малиновый, цвет шрифта синий

1,3,7-цвет фона желтый, цвет шрифта красный

6,8,10-цвет фона синий, цвет шрифта голубой

2-цвет фона серый, размер шрифта 14 точек

8 вариант

       

1,6,8-цвет фона желтый, цвет шрифта синий

2,4,9-цвет фона синий, цвет шрифта белый

3,5,10-цвет фона серый, цвет шрифта малиновый

7-цвет фона зеленый, размер шрифта 14 точек

9 вариант

       

2,5,7-цвет фона синий, цвет шрифта белый

3,4,9-цвет фона голубой, цвет шрифта зеленый

6,8,10-цвет фона желтый, цвет шрифта коричневый

1-цвет фона красный, размер шрифта 14 точек

10 вариант

       

4,6,10-цвет фона красный, цвет шрифта белый

1,3,8-цвет фона зеленый, цвет шрифта желтый

2,5,9-цвет фона голубой, цвет шрифта синий

7-цвет фона синий, размер шрифта 14 точек


11 вариант

       

1,4,5-цвет фона зеленый, цвет шрифта красный

2,5,6-цвет фона черный, цвет шрифта малиновый

3,7,10-цвет фона синий, цвет шрифта белый

8-цвет фона голубой, размер шрифта 14 точек

12 вариант

       

3,4,10-цвет фона синий, цвет шрифта красный

1,2,7-цвет фона зеленый, цвет шрифта голубой

5,8,9-цвет фона розовый, цвет шрифта коричневый

6-цвет фона малиновый, размер шрифта 14 точек


Список литературы

1 Кастро Э. HTML и CSS для создания Web-страниц. Издательство: «Издательская группа АСТ», 2006, – 144 c.

2 Клонингер К. Свежие стили Web-дизайна: как сделать из вашего сайта «конфетку»: «Издательство ДМК Пресс», 2009. – 250 с.(1)

3 Комолова Н., Яковлева Е. "HTML. Самоучитель "2-е издание. Издательство: Питер, 2011 г.

4 Рева О. Н. "Использование HTML, JavaScript и CSS. Руководство Web-дизайнера " Издательство: Эксмо, 2008 г.

5 Тихонов А.И. Динамический HTML. – М.: ЗАО «Издательство БИНОМ», 2001. – 496 с.

6 Роберт Агулар "HTML и CSS. Основа любого сайта " Издательство: Эксмо, 2010 г.

7 Чак Муссиано и Билл Кеннеди "HTML и XHTML. Подробное руководство" 6-е издание. Издательство: Символ-Плюс, 2008 г.

8 Эрик А. Мейер "CSS. Каскадные таблицы стилей. Подробное руководство " 3-е издание. Издательство: Символ-Плюс, 2008 г.

Содержание

Введение. 3

Часть 1. Основы создания HTML и CSS документов. 4

1. Структура HTML документа. 4

2. Создание HTML-документа. 5

3. Просмотр документа в окне браузера. 6

4. Разметка текста с помощью HTML. 7

4.1. Абзац. 7

4.2. Атрибуты тегов. 7

4.3. Заголовки. 9

4.4. Списки. 9

4.4.1 Неупорядоченный список. 9

4.4.2 Упорядоченный список. 10

4.4.3 Многоуровневый список. 11

4.4.4 Список определений. 12

4.5. Теги strong и b. 12

4.6. Теги em и i 13

4.7. Теги br и hr. 13

4.8. Тег mark. 13

4.9. Ссылки. 14

4.9.1 Абсолютные адреса. 14

4.9.2 Относительные адреса. 14

4.9.3 Ссылка с якорем.. 15

4.9.4 Всплывающая подсказка. 15

4.10. Вставка изображения. 16

4.10.1 Размеры изображения. 16

4.10.2 Альтернативный текст. 16

4.10.3 Изображение-ссылка. 17

4.11. Таблицы.. 17

4.11.1 Выравнивание содержимого ячеек. 21

4.11.2 Объединение ячеек в таблице. 22

4.11.3 Заголовок таблицы.. 27

4.11.4 Расстояние между ячейками. 28

5. CSS. 29

5.1. Селекторы.. 33

5.2. Краткий перечень CSS-команд. 44

Часть 2. Задания на лабораторные работы.. 49

1. Форматирование текста. 49

2. Списки. 54

3. Таблицы.. 64

4. Варианты заданий на форматирование текста. 70

5. Варианты заданий на списки. 76

6. Варианты заданий на таблицы.. 88

Список литературы.. 92


УЧЕБНОЕ ИЗДАНИЕ

Наши рекомендации