Файловый менеджер - Редактировать - /home/carpe/public_html/sae 202/header.php
Назад
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head> <body style="margin: 0"> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> </head> <div class="navbar"> <div class="nav-item"> <div class="label"><a href='content3.php'>trash2trend</a></div> <div class="dropdown"> <a href="#">Sub-item 1</a> <a href="#">Sub-item 2</a> <a href="#">Sub-item 3</a> </div> </div> <div class="nav-item"> <div class="label"><a href='campagne.php'>campagne</a></div> <div class="dropdown"> <a href="#">Sub-item 1</a> <a href="#">Sub-item 2</a> <a href="#">Sub-item 3</a> </div> </div> <div class="nav-item"> <div class="label"><a href='galerie.php'>galerie</a></div> <div class="dropdown"> <a href="#">Sub-item 1</a> <a href="#">Sub-item 2</a> <a href="#">Sub-item 3</a> </div> </div> <div class="nav-item"> <div class="label"><a href='page2.php'>partenaires</a></div> <div class="dropdown"> <a href="#">Sub-item 1</a> <a href="#">Sub-item 2</a> <a href="#">Sub-item 3</a> </div> </div> <div class="nav-item2"> <a href="#"><img src="YouTube.png" alt="YouTube" /></a> </div> <div class="nav-item2"> <a href="#"><img src="TikTok.png" alt="TikTok" /></a> </div> <div class="nav-item2"> <a href="#"><img src="Instagram.png" alt="Instagram" /></a> </div> </div> </body> <style> body { margin: 0; font-family: Arial, sans-serif; } a{ text-decoration:none; color:white; } .label { display: flex; font-size: 20px; text-align: center; width: 200%; transform: rotate(-90deg); position: absolute; z-index: 2; background-color: #313131; justify-content: center; height: 80px; text-decoration: none; align-items: center; -webkit-user-select: none; /* Safari */ -ms-user-select: none; /* IE 10 and IE 11 */ user-select: none; } .label:hover { text-shadow: 0 0 7px #fff, 0 0 10px #fff, 0 0 21px #fff, 0 0 42px rgb(255, 255, 255), 0 0 82px rgb(255, 255, 255), 0 0 92px rgb(253, 255, 254), 0 0 102px rgb(255, 255, 255), 0 0 151px rgb(255, 255, 255); } .nav-item2 a:hover { -webkit-filter: drop-shadow(1px 1px 0 rgba(255, 255, 255, 0.247)) drop-shadow(-1px -1px 0 rgba(255, 255, 255, 0.356)); filter: drop-shadow(1px 1px 0 rgba(255, 255, 255, 0.315)) drop-shadow(-1px -1px 0 rgba(255, 255, 255, 0.384)); } .navbar { position: fixed; z-index: 1001; top: 0; left: 0; width: 80px; height: 100%; background-color: #313131; display: flex; flex-direction: column; align-items: center; padding-top: 10px; } .nav-item { display: flex; text-align: center; color: white; align-items: center; justify-content: center; padding: 10px 0; text-align: center; width: 100%; height: 100%; transform: rotate(90); position: relative; z-index: 2; background-color: #313131; } .nav-item2 { display: flex; text-align: center; color: white; align-items: center; justify-content: center; padding: 10px 0; text-align: center; width: 100%; transform: rotate(90); position: relative; background-color: #313131; } .nav-item img { width: 40px; height: 40px; } .nav-item:hover .dropdown { transform: translateX(0px); } .dropdown { display: flex; flex-wrap:wrap; align-items:center; justify-content:center; position: absolute; top: 0; left: 80px; min-width: 160px; transform: translateX(-500px); transition: opacity 1s ease, transform 1s ease; z-index: 0; background-color: #313131; } .dropdown a { color: white; padding: 12px 16px; text-decoration: none; display: block; } .dropdown a:hover { background-color: #555; } img{ border:none; } </style> </html>
| ver. 1.4 |
Github
|
.
| PHP 8.0.30 | Генерация страницы: 0 |
proxy
|
phpinfo
|
Настройка