modified: begushiybashkir/src/index.html

modified: begushiybashkir/src/styles/style.css text on top of img
2025-08-09 05:14:10 +05:00
parent b5bac2ad61
commit 8157ce49b8
2 changed files with 61 additions and 39 deletions
@@ -11,18 +11,22 @@
 <html>
  <body>
    <header>
+      <div class="header_img" id="header_img">
        <img
          class="MainPhoto"
          id="MainPhotoID"
          src="./photo/ZagirTrainer.jpg"
          alt="BegushiyBashkirClub'sPhoto"
        />
-      <h3>Running club - Беговой клуб</h3>
+      </div>
+      <div class="text_card" id="text_card">
        <h1>Begushiy Bashkir</h1>
+        <h3>Running club - Беговой клуб</h3>
        <h3>
          «БЕГ — ЭТО НЕ ТОЛЬКО СКОРОСТЬ. ЭТО — СИЛА ПРЕДКОВ, ДУХ БАТЫРА И
          ШАПКА-БҮРЕК НА ГОЛОВЕ!»
        </h3>
+      </div>
    </header>

    <main class="MainContent" id="MainContent">
@@ -1,6 +1,6 @@
-@import url('mobileStyle.css');
-@import url('tabletStyle.css');
-@import url('descktopStyle.css');
+@import url("mobileStyle.css");
+@import url("tabletStyle.css");
+@import url("descktopStyle.css");

 html {
  margin: 0;
@@ -20,6 +20,24 @@ body {

 header {
  background-color: #888888;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.header_img {
+  position: relative;
+  width: 100%;
+  height: auto;
+}
+
+.text_card {
+  position: absolute; /* накладываем элемент поверх */
+  bottom: 0;
+  top: 0;
+  left: 0;
+  right: 0;
+  background-color: rgba(0, 255, 0, 0.5);
 }

 footer {