写一个简约大气静态html的页面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>简约大气静态页面</title>
<style>
body {
margin: 0;
padding: 0;
font-family: Arial, sans-serif;
background-color: #f2f2f2;
}
<pre><code> .container {
width: 80%;
max-width: 1200px;
margin: 0 auto;
padding: 20px;
background-color: #fff;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
h1 {
text-align: center;
font-size: 36px;
margin-bottom: 20px;
}
p {
font-size: 18px;
line-height: 1.5;
margin-bottom: 10px;
}
.btn {
display: inline-block;
padding: 10px 20px;
background-color: #4CAF50;
color: #fff;
text-decoration: none;
border-radius: 4px;
transition: background-color 0.3s ease;
}
.btn:hover {
background-color: #45a049;
}
</style>
</code></pre>
</head>
<body>
<div class="container">
<h1>Welcome to Our Website</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed eget lectus sem. Nullam euismod metus id diam tincidunt, in eleifend tellus blandit. In hac habitasse platea dictumst. Phasellus fringilla orci nec risus commodo, sed consectetur mauris varius. Nunc sagittis lorem at risus ullamcorper, nec porttitor diam porttitor. Nam vitae ex auctor, porta nisl ac, fermentum lectus. Phasellus tincidunt, nisl et malesuada efficitur, ante leo consequat lorem, vitae cursus diam turpis id odio.</p>
<p>Donec consequat, sapien quis faucibus commodo, ligula ipsum tincidunt mauris, sed euismod dolor nisl at sem. Donec rhoncus sem vel consectetur semper. Sed euismod elit at sem consequat, nec auctor massa luctus. Ut eget varius lacus. Sed pellentesque metus a turpis fermentum, quis tristique est eleifend. Aliquam laoreet, mauris sed egestas vulputate, velit tortor viverra odio, a tincidunt turpis dolor sit amet nunc. Aliquam erat volutpat.</p>
<a href="#" class="btn">Learn More</a>
</div>
</body>
</html
原文地址: https://www.cveoy.top/t/topic/iDHG 著作权归作者所有。请勿转载和采集!