Как создать сайт на HTML?

Question

Как создать сайт на HTML?

Сашок Колесников Ученик (94), открыт 4 дня назад

Мне нужно до завтра сделать сайт-визитку на HTML! Там должна быть просто одна страничка с небольшим текстом и фотографиями! Для школьного проекта, а я совсем не знаю как это делать!
Буду рад если кто-то поможет, желательно в дискорде, я не думаю, что это займет много времени, мой дс cerdat, ПОМОГИТЕ ПЖ!!!!

Answer 1

миленький котярик Гуру (4972) 4 дня назад

<body>
<H1>Я ПРОГРОМИСТ. Я СОЗДАЛ ЭТОТ САЙТ.</H1>
</body>

Скопируй это в блокнот, сохрани как sait.html

Дай мне денег на пивоПросветленный (31007) 4 дня назад

Так нельзя делать. Хотя бы doctype укажи

миленький котярик Гуру (4972) Дай мне денег на пиво, можно. Доктайп опшанал

⚠Оракул (50002) 4 дня назад

 если
автору
вопроса
нужен
сайт

то нужно регистрировать
хостинг с доменом
и
только
туда загрузить
его
созданный
файл html

и тогда
будет сайт html

миленький котярик Гуру (4972) ⚠, может ему и локальный сайт норм. Давайте двигаться по пути наименьшего сопротивления

Answer 2

Картинки вставляются тегом <img>. Через ключ src вставляешь относительный путь к картинке. Не забудь картинки прикрепить к проекту.
Например, картинка в папке с веб-страницей:
<!doctype html>
<html>
<head>
<title>Сайт - визитная карточка</title>
</head>
<body>
<p>ФИО</p>
<img src="./image.png" width="100" height="100">
</body>
</html>
Где width - ширина картинки, а height - высота в пикселах.

Answer 3

Сохраняешь этот код в файл index.htm

 <!DOCTYPE html> 
<html lang="ru"> 
<head> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <title>Визитка</title> 
    <style> 
        body { 
            font-family: Arial, sans-serif; 
            margin: 0; 
            padding: 0; 
            background: #f7f7f7; 
            color: #333; 
            line-height: 1.6; 
        } 
        header { 
            background: #333; 
            color: #fff; 
            text-align: center; 
            padding: 1.5rem 0; 
        } 
        header h1 { 
            margin: 0; 
            font-size: 2.5rem; 
        } 
        header p { 
            font-size: 1rem; 
            margin: 0.5rem 0 0; 
        } 
        .container { 
            max-width: 900px; 
            margin: 2rem auto; 
            padding: 0 1rem; 
            text-align: center; 
        } 
        .photos { 
            display: grid; 
            grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); 
            gap: 1rem; 
            margin-top: 1.5rem; 
        } 
        .photos img { 
            width: 100%; 
            border-radius: 8px; 
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); 
        } 
        footer { 
            background: #333; 
            color: #fff; 
            text-align: center; 
            padding: 1rem 0; 
            margin-top: 2rem; 
        } 
        footer p { 
            margin: 0; 
            font-size: 0.875rem; 
        } 
    </style> 
</head> 
<body> 
    <header> 
        <h1>Ваше Имя</h1> 
        <p>Краткое описание или слоган</p> 
    </header> 
    <div class="container"> 
        <p>Добро пожаловать на мой сайт-визитку! Здесь вы найдете немного информации обо мне и мои работы.</p> 
        <div class="photos"> 
            <img src="http://via.placeholder.com/300x300" alt="Фото 1"> 
            <img src="https://via.placeholder.com/300x300" alt="Фото 2"> 
            <img src="https://via.placeholder.com/300x300" alt="Фото 3"> 
            <img src="https://via.placeholder.com/300x300" alt="Фото 4"> 
        </div> 
    </div> 
    <footer> 
        <p>&copy; 2024 Ваше Имя. Все права защищены.</p> 
    </footer> 
</body> 
</html>

Кладешь в папку твои картинки, например с названиями img1.jpg, img2.jpg и вместо <img src="http://via.placeholder.com/300x300" alt="Фото 1"> пишешь

 <img src="img1.jpg" alt="Фото 1">

.jpg формат картинки может быть еще .png

Answer 4

сайт нужен в интернете, или на компе просто?
есть куча готовых шаблонов.

Answer 5

Открой блокнот и напиши:
<!DOCTYPE html>
<html>
<head>
<title>Заголовок сайта на вкладке</title>
</head>
<body>
<h1>Текст</h1>
<img src="название картинки и формат" width="800" height="600">
Сохрани файл как "название".html
Где "заголовок сайта на вкладке","Текст","название картинки и формат" можно ввести любое название. Здесь на ваш вкус.