Задача 1. Измените фон веб-страницы на светло-синий (цветовой код: #B8E3E9). Введите «History of Mobile Phones» с заголовком <h2>, отцентрируйте его по горизонтали, установите…

Question

Задача Задача №2504717

А

Аноним

16 декабря 2024 07:23 · публичный вопрос

А

Аноним 16 декабря 2024 07:23

Задача 1. Измените фон веб-страницы на светло-синий (цветовой код: #B8E3E9). Введите «History of Mobile Phones» с заголовком <h2>, отцентрируйте его по горизонтали, установите…

Запрос пользователя

Задача 1. Измените фон веб-страницы на светло-синий (цветовой код: #B8E3E9). Введите «History of Mobile Phones» с заголовком

, отцентрируйте его по горизонтали, установите цвет текста на Dark Fire (цветовой код: #FF5C00) и измените тип шрифта на Tahoma. [4 балла] Задача 2. С остальным текстом сделайте следующее: [8 баллов] а) Установите тип шрифта Verdana, размер шрифта 20 пикселей; b) Выровняйте 1-й абзац по левому краю, измените цвет текста на красный. c) Выровняйте абзац 2 вправо, измените цвет текста на magenta (код цвета: #FF00FF). d) Выровняйте абзац 3 с обеих сторон, измените цвет текста на синий. Задача 3. Для работы с изображением выполните следующие действия, сохраните изображение в папке images: [6 баллов] а) Поместите картинку martin.png размером 125x125 в правую часть 1-го абзаца. б) Поместите изображение nokia.png размером 200х125 в левую часть 2-го абзаца. в) В правой части 3-го абзаца поместите картинку iphone.jpg размером 125x125. Задача 4. Выделите курсивом «About mobile phones» и создайте такой список: [4 балла] Задача 5. Установите ссылки (гиперссылки) на каждый из телефонов в списке выше: [3 балла] a) для Old mobile phones: https://en.wikipedia.org/wiki/Mobile_phone b) для Samsung phones: https://en.wikipedia.org/wiki/Samsung c) для Apple phones: https://en.wikipedia.org/wiki/Apple_Inc.

Ответ нейросети

16 декабря 2024 07:23

Конечно! Давайте разберёмся с задачами по созданию веб-страницы, шаг за шагом.

Задача 1:

Чтобы изменить фон веб-страницы на светло-синий цвет, добавить заголовок и отцентрировать его, используйте следующий HTML и CSS код:

<!DOCTYPE html>
<html>
<head>
    <style>
        body {
            background-color: #B8E3E9; /* Светло-синий фон */
        }
        h2 {
            text-align: center; /* Отцентрировать заголовок */
            color: #FF5C00; /* Цвет текста Dark Fire */
            font-family: Tahoma; /* Шрифт: Tahoma */
        }
    </style>
</head>
<body>
    <h2>History of Mobile Phones</h2>
</body>
</html>

Задача 2:

Теперь немного изменим текст и выравниваниеParagraph styles.

<p style="font-family: Verdana; font-size: 20px; text-align: left; color: red;">Первый абзац текта.</p>
<p style="font-family: Verdana; font-size: 20px; text-align: right; color: #FF00FF;">Второй абзац текта.</p>
<p style="font-family: Verdana; font-size: 20px; text-align: justify; color: blue;">Третий абзац текта.</p>

Задача 3:

Для работы с изображениями, поместим их в соответствующие абзацы:

<p style="font-family: Verdana; font-size: 20px; text-align: left; color: red;">
    Первый абзац текта. <img src="images/martin.png" alt="Мартин" width="125" height="125" style="float: right;">
</p>
<p style="font-family: Verdana; font-size: 20px; text-align: right; color: #FF00FF;">
    <img src="images/nokia.png" alt="Нокиа" width="200" height="125" style="float: left;"> Второй абзац текта.
</p>
<p style="font-family: Verdana; font-size: 20px; text-align: justify; color: blue;">
    Третий абзац текта. <img src="images/iphone.jpg" alt="Айфон" width="125" height="125" style="float: right;">
</p>

Задача 4:

Чтобы выделить текст курсивом и создать список, используем следующий код:

<p style="font-style: italic;">About mobile phones</p>
<ul>
    <li>Old mobile phones</li>
    <li>Samsung phones</li>
    <li>Apple phones</li>
</ul>

Задача 5:

Добавим гиперссылки на каждый из телефонов в списке:

<ul>
    <li><a href="https://en.wikipedia.org/wiki/Mobile_phone">Old mobile phones</a></li>
    <li><a href="https://en.wikipedia.org/wiki/Samsung">Samsung phones</a></li>
    <li><a href="https://en.wikipedia.org/wiki/Apple_Inc.">Apple phones</a></li>
</ul>

Общий код:

Теперь я объединю все части в один код для вашей веб-страницы:

<!DOCTYPE html>
<html>
<head>
    <style>
        body {
            background-color: #B8E3E9; /* Светло-синий фон */
        }
        h2 {
            text-align: center; /* Отцентрировать заголовок */
            color: #FF5C00; /* Цвет текста Dark Fire */
            font-family: Tahoma; /* Шрифт: Tahoma */
        }
        p {
            font-family: Verdana;
            font-size: 20px;
        }
    </style>
</head>
<body>
    <h2>History of Mobile Phones</h2>
    
    <p style="text-align: left; color: red;">
        Первый абзац текта. <img src="images/martin.png" alt="Мартин" width="125" height="125" style="float: right;">
    </p>
    <p style="text-align: right; color: #FF00FF;">
        <img src="images/nokia.png" alt="Нокиа" width="200" height="125" style="float: left;"> Второй абзац текта.
    </p>
    <p style="text-align: justify; color: blue;">
        Третий абзац текта. <img src="images/iphone.jpg" alt="Айфон" width="125" height="125" style="float: right;">
    </p>
    
    <p style="font-style: italic;">About mobile phones</p>
    <ul>
        <li><a href="https://en.wikipedia.org/wiki/Mobile_phone">Old mobile phones</a></li>
        <li><a href="https://en.wikipedia.org/wiki/Samsung">Samsung phones</a></li>
        <li><a href="https://en.wikipedia.org/wiki/Apple_Inc.">Apple phones</a></li>
    </ul>
</body>
</html>

Теперь у вас есть полный код для создания вашей веб-страницы с выполнением всех задач! Если у вас есть дополнительные вопросы или нужно что-то уточнить, не стесняйтесь спрашивать!