首页与国土资源有关网页设计html css js

与国土资源有关网页设计html css js

时间: 2023-12-25 22:04:38 浏览: 72

以下是一个与国土资源有关的网页设计的示例，使用HTML、CSS和JavaScript： HTML部分： ```html <!DOCTYPE html> <html> <head> <title>国土资源网页设计</title> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <header> <h1>国土资源网页设计</h1> </header> <nav> <ul> <li><a href="#">首页</a></li> <li><a href="#">关于我们</a></li> <li><a href="#">资源展示</a></li> <li><a href="#">联系我们</a></li> </ul> </nav> <section> <h2>欢迎来到国土资源网页设计</h2> <p>这里展示了国土资源相关的信息和资源。</p> </section> <footer> <p>版权所有 © 2021 国土资源网页设计</p> </footer> <script src="script.js"></script> </body> </html> ``` CSS部分（style.css）： ```css body { font-family: Arial, sans-serif; margin: 0; padding: 0; } header { background-color: #333; color: #fff; padding: 20px; } nav ul { list-style-type: none; margin: 0; padding: 0; background-color: #f2f2f2; } nav ul li { display: inline-block; margin-right: 10px; } nav ul li a { display: block; padding: 10px; text-decoration: none; color: #333; } section { padding: 20px; } footer { background-color: #333; color: #fff; padding: 10px; text-align: center; } ``` JavaScript部分（script.js）： ```javascript // 在这里可以添加与国土资源相关的JavaScript代码 ``` 这个示例展示了一个简单的国土资源网页设计，包括一个标题、导航菜单、内容区域和页脚。你可以根据自己的需求进行修改和扩展。

阅读全文