Untitled
unknown
plain_text
a month ago
3.3 kB
3
Indexable
Never
**HTML (`index.html`)**: ```html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="styles.css"> <title>Weather</title> </head> <body> <nav> <a href="index.html">Home</a> <a href="about.html">About</a> <a href="cities.html">Cities</a> </nav> <div class="weather-container"> <h1>Weather in Your City</h1> <input type="text" id="city-input" placeholder="Enter city"> <button id="check-weather">Check Weather</button> <div class="weather-info"> <h2 id="city-name"></h2> <p id="temperature"></p> <p id="description"></p> </div> </div> <script src="script.js"></script> </body> </html> ``` **HTML (`about.html`)**: ```html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="styles.css"> <title>About</title> </head> <body> <nav> <a href="index.html">Home</a> <a href="about.html">About</a> <a href="cities.html">Cities</a> </nav> <div class="content"> <h1>About this Weather App</h1> <p>This app provides weather information for cities around the world. Built with HTML, CSS, and JavaScript.</p> </div> </body> </html> ``` **HTML (`cities.html`)**: ```html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="styles.css"> <title>Cities</title> </head> <body> <nav> <a href="index.html">Home</a> <a href="about.html">About</a> <a href="cities.html">Cities</a> </nav> <div class="content"> <h1>Weather in Bulgarian Cities</h1> <div class="city-weather"> <h2>Sofia</h2> <p>Temperature: 20°C</p> <p>Condition: Sunny</p> </div> <div class="city-weather"> <h2>Plovdiv</h2> <p>Temperature: 22°C</p> <p>Condition: Partly Cloudy</p> </div> <div class="city-weather"> <h2>Varna</h2> <p>Temperature: 19°C</p> <p>Condition: Rainy</p> </div> </div> </body> </html> ``` **CSS (`styles.css`)**: ```css body { font-family: Arial, sans-serif; background-color: #e9f7fa; padding: 20px; } nav { display: flex; justify-content: space-between; padding: 10px; background-color: #4CAF50; } nav a { color: white; text-decoration: none; margin: 0 10px; } nav a:hover { text-decoration: underline; } .weather-container { box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); padding: 20px; background-color: #ffffff; border-radius: 10px; text-align: center; } .weather-info { margin-top: 20px; } button { margin-top: 10px; padding: 10px 15px; border: none; background-color: #4CAF50; color: white; cursor: pointer; border-radius: 5px; } button:hover { background-color: #45a049; } .city-weather { border: 1px solid #e0e0e0; padding: 10px; margin-top: 10px; border-radius: 5px; } ```