JavaWeb快速入门--CSS，从草根到百万年薪程序员的十年风雨之路
在JavaWeb快速入门中，我们通常不直接介绍CSS，因为它更多地是一种用于定义网页样式的技术，而不是编程语言本身。然而，了解如何在Web项目中使用CSS是很有用的。
以下是一个简单的HTML和CSS代码示例，演示了如何将CSS应用于HTML元素以改善网页样式：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>示例网页</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f8f8;
}
header {
background-color: #333;
color: white;
padding: 10px 0;
text-align: center;
}
nav ul {
list-style-type: none;
margin: 0;
padding: 0;
}
nav ul li {
display: inline;
margin-right: 10px;
}
nav ul li a {
text-decoration: none;
color: white;
}
section {
margin: 15px 0;
padding-left: 15px;
}
footer {
background-color: #333;
color: white;
text-align: center;
padding: 10px 0;
position: fixed;
bottom: 0;
width: 100%;
}
</style>
</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>© 2023 我的网站</p>
</footer>
</body>
</html>在这个示例中，我们定义了一些CSS规则来改善页面的布局和外观。这些规则被放在了<head>标签内的<style>标签中。在实际的JavaWeb项目中，CSS通常会放在外部文件中，以便于管理和重用。例如，可以创建一个名为styles.css的文件，然后在HTML文件中通过<link>标签引入它：
<head>
<link rel="stylesheet" type="text/css" href="styles.css">
</head>这种方法使得维护和更新样式更加容易，也符合分离关注点的原则。
评论已关闭