Header v3

This commit is contained in:
Петухова Ростислава
2023-11-01 00:52:34 +03:00
parent 987a90f5ab
commit ae7c6a33af
3 changed files with 44 additions and 3 deletions

View File

@@ -1,6 +1,7 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="ru"> <html lang="ru">
<head> <head>
<link rel="stylesheet" href="/style/menu.css">
<link rel="stylesheet" href="/style/textFont.css"> <link rel="stylesheet" href="/style/textFont.css">
<link rel="stylesheet" href="/style/background.css"> <link rel="stylesheet" href="/style/background.css">
<link rel="stylesheet" href="/style/buttonStyle.css"> <link rel="stylesheet" href="/style/buttonStyle.css">

View File

@@ -1,6 +1,4 @@
.button-grid { .button-grid {
display: grid;
display: grid; display: grid;
grid-template-columns: 4fr 4fr 4fr; grid-template-columns: 4fr 4fr 4fr;
grid-template-rows: 4fr 4fr; grid-template-rows: 4fr 4fr;
@@ -33,6 +31,11 @@
background: rgba(0, 0, 0, 0.5); background: rgba(0, 0, 0, 0.5);
} }
.headerButton-grid {
display: grid;
grid-template-columns: auto auto auto auto auto;
}
:root { :root {
--sizeButton: 1.5; --sizeButton: 1.5;
} }
@@ -69,6 +72,17 @@
--sizeButton: 4; --sizeButton: 4;
} }
.hidingMenu {
Display: none;
}
.headerButton-grid {
display: grid;
grid-template-columns: auto;
text-align: center;
}
.button-grid { .button-grid {
display: grid; display: grid;
display: grid; display: grid;

View File

@@ -1,3 +1,29 @@
<header> <header>
<div class="headerButton-grid">
<a href="/pages/Музей кружева.html" style="text-decoration:none">
<button style="background: transparent; border: none !important;">
<p class="titleText">Вологда путешествия</p> <p class="titleText">Вологда путешествия</p>
</button>
</a>
<a href="/pages/Музей кружева.html" style="text-decoration:none" class="hidingMenu">
<button style="background: transparent; border: none !important;"> </button>
<p class="titleTextMini">Вологда</p>
</a>
<a href="/pages/Музей кружева.html" style="text-decoration:none" class="hidingMenu">
<button style="background: transparent; border: none !important;"> </button>
<p class="titleTextMini">Достопримечательности</p>
</a>
<a href="/pages/Музей кружева.html" style="text-decoration:none" class="hidingMenu">
<button style="background: transparent; border: none !important;"> </button>
<p class="titleTextMini">Рестораны</p>
</a>
<a href="/pages/Музей кружева.html" style="text-decoration:none" class="hidingMenu">
<button style="background: transparent; border: none !important;"> </button>
<p class="titleTextMini">Отели</p>
</a>
</div>
</header> </header>