Главная страница, Миры, Джедаи Код сайта

Условие практики и во время семинара

Делаем небольшой сайт из 3 cтраниц, где все 3 страницы соединены друг с другом, на одной из страниц должен список из 4-5 элементов, на другой — таблица (не менее 3x3), на 3 странице — статья с картинкой. Его нужно разместить в Сети, указав источник информации.

Для примера во время занятия я опубликовала всё на своём сайте внутри бесплатного хостинга Бегет, для чего открыла панель управления, скопировала из графы "Сервер" адрес своего бесплатного сайта, а в Файловом менеджере открыла папку сайта, затем открыла папку public_html, и положила созданные во время занятия файлы прямо туда:

Структура практики

Папка с картинками (я перенесла их на сайт с Вукипедии)
В свойстве style тега гиперссылки на код сайта содержатся спойлеры к следующему занятию!

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Всё про Звёздные Войны</title>
</head>
<body>
    <a href="index.html">Главная страница</a>, <a href="planets.html">Миры</a>, 
    <a href="jedi.html">Джедаи</a> <a href="code.html" style="position: absolute; right: 10px; color: red; background: yellow;">Код сайта</a><br><hr>
    <p>
        «Звёздные войны» (англ. Star Wars) — североамериканская фантастическая медиафраншиза, созданная Джорджем Лукасом. В ней описываются приключения множества персонажей, происходящие «давным-давно, в далёкой-далёкой галактике». С 1976 года по настоящее время в рамках вселенной «Звёздных войн» были выпущены сотни книг и комиксов для аудитории всех возрастов, несколько анимационных сериалов, множество компьютерных и настольных игр, 9 полнометражных фильмов-эпизодов и несколько фильмов спин-оффов.
    </p>
    <img width="300" src="img/StarWarsOpeningLogo.webp"><br>
    <a href="https://starwars.fandom.com/ru/wiki/Звёздные_войны" target="_blank"><br>
        Оригинал статьи
    </a>
    <br>
    <br>
    <br>
    <p style="color: grey">
        По материалам <a style="color: grey" href="https://starwars.fandom.com/ru/wiki/Звёздные_войны" target="_blank">Вукипедии</a>.
    </p>
</body>
</html>

jedi.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Про Джедаев</title>
</head>
<body>
    <a href="index.html">Главная страница</a>, <a href="planets.html">Миры</a>, 
    <a href="jedi.html">Джедаи</a> <a href="code.html" style="position: absolute; right: 10px; color: red; background: yellow;">Код сайта</a><br><hr>
    <h1>Список Джедаев</h1>
    <ul>
        <li>
            Квай-Гон Джинн<br>
                <img width="150" src="img/Quigonheadshot.webp" alt="Тут фотка с зелёным световым мечом">
        </li>
        <li>
            Йода<br>
            <img width="150" src="img/Yoda_SWSB.webp" alt="">
        </li>
        <li>
            Оби-Ван Кеноби<br>
            <img width="150" src="img/Kenobi_from_Kenobi.webp" alt="">
        </li>
        <li>
            Терек<br>
            <img width="150" src="img/Terec-2021THR5.webp" alt="">
        </li>
    </ul>
    <br>
    <br>
    <br>
    <p style="color: grey">
        По материалам <a style="color: grey" href="https://starwars.fandom.com/ru/wiki/Звёздные_войны" target="_blank">Вукипедии</a>.
    </p>
</body>
</html>

planets.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Про Планеты</title>
</head>
<body>
    <a href="index.html">Главная страница</a>, <a href="planets.html">Миры</a>, 
    <a href="jedi.html">Джедаи</a> <a href="code.html" style="position: absolute; right: 10px; color: red; background: yellow;">Код сайта</a><br><hr>
    <table>
        <tr>
            <td>
                Название
            </td>
            <td>
               Картинка 
            </td>
            <td>
                Статья
            </td>
        </tr>
        <tr>
            <td>
                Корусант
            </td>
            <td>
               <img width="100" src="img/Coruscant-EotE.webp" alt=""> 
            </td>
            <td>
                <a href="https://starwars.fandom.com/ru/wiki/Корусант" target="_blank">На Вукипедии</a>
            </td>
        </tr>
        <tr>
            <td>
                Набу
            </td>
            <td>
               <img width="100" src="img/Naboo_FFGRebellion.webp" alt=""> 
            </td>
            <td>
                <a href="https://starwars.fandom.com/ru/wiki/Набу" target="_blank">на Вукипедии</a>
            </td>
        </tr>
    </table>
    <br>
    <br>
    <br>
    <p style="color: grey">
        По материалам <a style="color: grey" href="https://starwars.fandom.com/ru/wiki/Звёздные_войны" target="_blank">Вукипедии</a>.
    </p>
</body>
</html>

На главную курса