Първи проект: Лична уеб страница

От WIKI-TONI
Направо към навигацията Направо към търсенето
Версията за печат вече не се поддържа и може да има грешки при изобразяване. Моля, актуализирайте отметките на браузъра си и вместо това използвайте функцията за печат на браузъра по подразбиране.

📚 Това съдържание е част от личния архив и база знания на Тони Ангелчовски, създадено в рамките на проекта WIKI-TONI. Уики платформата е достъпна само за четене. Не се поддържат регистрации или външни редакции. ⚠️ Забранява се копирането, възпроизвеждането или използването на текстовете без предварително писмено разрешение от автора. Благодарим, че уважаваш авторството и вдъхновението зад всяка дума.

🛠️ Първи проект: Лична уеб страница с HTML, CSS и JavaScript

🌟 Време е да създадеш нещо свое

Това не е просто урок. Това е **твоят първи уеб проект**. Ще съчетаем всичко, което научи – в една стилна, интерактивна и изцяло твоя уеб страница.

🔗 Какво ще включва страницата?

• Заглавие и представяне • Лични умения и интереси • Контактна информация • Динамичен бутон с JavaScript • Елементарен, но красив CSS стил

💡 Код на проекта

<!DOCTYPE html>
<html lang="bg">
<head>
  <meta charset="UTF-8">
  <title>Тони Ангелчовски – Моето дигитално начало</title>
  <style>
    body {
      background: linear-gradient(to bottom, #eaf6ff, #ffffff);
      font-family: 'Segoe UI', sans-serif;
      padding: 40px;
      color: #333;
    }

    h1 {
      color: #004080;
      text-transform: uppercase;
      border-bottom: 2px solid #00ccff;
      padding-bottom: 10px;
    }

    ul {
      list-style: none;
      padding-left: 0;
    }

    ul li::before {
      content: "🔥 ";
    }

    a {
      color: #e60039;
      text-decoration: none;
    }

    a:hover {
      text-decoration: underline;
    }

    button {
      background-color: #004080;
      color: white;
      border: none;
      padding: 10px 20px;
      font-size: 16px;
      border-radius: 5px;
      cursor: pointer;
    }

    button:hover {
      background-color: #0066cc;
    }
  </style>

  <script>
    function поздрав() {
      alert("👋 Здравей! Радвам се, че посети моята страница!");
    }
  </script>
</head>
<body>

  <h1>Тони Ангелчовски</h1>
  <p>Създател на WIKI-TONI, дигитален творец и ковач на знание.</p>

  <h2>💡 Моите умения:</h2>
  <ul>
    <li>Заваряване и инженеринг</li>
    <li>Системна администрация (Linux, Windows, Apple)</li>
    <li>Уеб програмиране и AI интеграции</li>
  </ul>

  <p>📬 Свържи се с мен: <a href="mailto:toni@example.com">toni@example.com</a></p>

  <p style="margin-top:30px;">
    <button onclick="поздрав()">👉 Натисни, ако вярваш в силата на знанието</button>
  </p>

</body>
</html>

🧭 Какво научи с този проект?

✅ Обедини основни технологии: HTML + CSS + JS ✅ Изгради реална страница с ясна структура и стил ✅ Създаде интеракция – сайтът ти **реагира**

🔥 Накратко:

Това е **твоето начало като създател на уеб съдържание**. С всяка нова страница ще се доближаваш до свободата да изразиш себе си напълно.

–––––––––––––––––––––––––––––––––––––––––

Следваща крачка: Как да качиш своята страница онлайн

Сподели тази страница:

🔵 Facebook 🐦 Twitter 📨 Telegram 🔗 LinkedIn ✉️ Email
Взето от „http:///wiki/index.php?title=Първи_проект:_Лична_уеб_страница&oldid=382“.