SUPERMANwebsite name: SUPERMAN website theme : blackish"home " page content:1. background image : "I:\Images\Cinematic\super_man_ready_to_fly.jpg"2. front texts:-superman : stonger than yesterday ( lighter character)-the hero you can trust ( bold character)-Born on the planet Krypton, Kal-El was sent to Earth by his parents, Jor-El and Lara, before their planet was destroyed. He was found and adopted by Jonathan and Martha Kent, who raised him as their ow in allville, Kansas(quotes )a right pointing arrow logo link button that open main page (at buttom)“main” page content :Header with new row : 6 deadly villains fought with superman New row ; image + text button link : Superman vs. DoomsdayNew row ; image + text button link : Superman vs. BrainiacNew row ; image + text button link :Superman vs. BizarroNew row ; image + text button link :Superman vs. DarkseidNew row ; image + text button link :Superman vs. Lex LuthorHome button that return to home page Containt pages :- will include header and paraghaph - home button that return to main page - logo button that return top smoothly - Initial Deployment
7e1153f
verified
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>SUPERMAN | Home</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <link href="https://unpkg.com/[email protected]/dist/aos.css" rel="stylesheet"> | |
| <script src="https://unpkg.com/[email protected]/dist/aos.js"></script> | |
| <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> | |
| <script src="https://unpkg.com/feather-icons"></script> | |
| <style> | |
| .hero-bg { | |
| background-image: url('https://static.photos/black/1200x630/42'); | |
| background-size: cover; | |
| background-position: center; | |
| background-attachment: fixed; | |
| min-height: 100vh; | |
| } | |
| .text-outline { | |
| text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8); | |
| } | |
| .scroll-down { | |
| animation: bounce 2s infinite; | |
| } | |
| @keyframes bounce { | |
| 0%, 20%, 50%, 80%, 100% {transform: translateY(0);} | |
| 40% {transform: translateY(-20px);} | |
| 60% {transform: translateY(-10px);} | |
| } | |
| </style> | |
| </head> | |
| <body class="bg-black text-white"> | |
| <div class="hero-bg flex flex-col justify-between"> | |
| <div></div> | |
| <div class="container mx-auto px-4 py-16" data-aos="fade-up"> | |
| <h1 class="text-5xl md:text-7xl font-light mb-4 text-red-500 text-outline">SUPERMAN</h1> | |
| <h2 class="text-2xl md:text-4xl font-light mb-8 text-gray-300">Stronger than yesterday</h2> | |
| <h3 class="text-3xl md:text-5xl font-bold mb-12 text-red-500 text-outline">The hero you can trust</h3> | |
| <blockquote class="max-w-2xl text-lg md:text-xl italic border-l-4 border-red-500 pl-4 mb-12 text-gray-300"> | |
| "Born on the planet Krypton, Kal-El was sent to Earth by his parents, Jor-El and Lara, before their planet was destroyed. He was found and adopted by Jonathan and Martha Kent, who raised him as their own in Smallville, Kansas." | |
| </blockquote> | |
| </div> | |
| <div class="flex justify-center pb-12" data-aos="fade-up" data-aos-delay="300"> | |
| <a href="main.html" class="bg-red-600 hover:bg-red-700 text-white font-bold py-4 px-8 rounded-full flex items-center transition-all duration-300 transform hover:scale-105"> | |
| Explore Superman's Battles | |
| <i data-feather="arrow-right" class="ml-2"></i> | |
| </a> | |
| </div> | |
| <div class="scroll-down flex justify-center pb-8"> | |
| <i data-feather="chevron-down" class="text-white w-12 h-12"></i> | |
| </div> | |
| </div> | |
| <script> | |
| AOS.init({ | |
| duration: 800, | |
| easing: 'ease-in-out', | |
| once: true | |
| }); | |
| feather.replace(); | |
| </script> | |
| </body> | |
| </html> | |