【JavaWeb】CSS基础知识：引入方式 + 选择器
CSS（级联样式表）是一种用来描述网页和其他HTML文件样式的语言。CSS可以通过多种方式引入HTML文档中，主要有以下几种方式：
- 内联样式：直接在HTML标签中使用
style属性来添加样式。
<p style="color: blue;">这是一个蓝色的段落。</p>- 内部样式表：在HTML文档的
<head>部分使用<style>标签来添加样式。
<head>
<style>
p { color: red; }
</style>
</head>
<body>
<p>这是一个红色的段落。</p>
</body>- 外部样式表：创建一个CSS文件，并通过HTML文档的
<link>标签引入。
<!-- 在<head>部分引入外部CSS文件 -->
<head>
<link rel="stylesheet" type="text/css" href="styles.css">
</head>在CSS中，选择器是一种模式，用于选择需要应用样式的元素。CSS中的选择器主要有以下几种：
- 类选择器：以
.开头，用来选择class名匹配的元素。
.blue-text {
color: blue;
}
<p class="blue-text">这是一个蓝色的段落。</p>- ID选择器：以
#开头，用来选择id名匹配的元素。
#red-text {
color: red;
}
<p id="red-text">这是一个红色的段落。</p>- 元素选择器：直接使用HTML元素名称来选择该元素。
p {
color: green;
}
<p>这是一个绿色的段落。</p>- 伪类选择器：用来选择某些元素的特定状态，比如链接的不同状态。
a:hover {
text-decoration: underline;
}
<a href="https://example.com">悬停我！</a>CSS选择器可以结合使用，以实现更为复杂的选择需求，例如：
/* 选择class为"button"且具有"highlighted"类的元素 */
.button.highlighted {
background-color: yellow;
}
<button class="button highlighted">高亮按钮</button>以上是CSS引入方式和基本选择器的简单介绍和示例。在实际开发中，CSS还可以用来设置字体、布局、背景等多种属性，并可以通过继承、层叠等机制处理样式冲突。
评论已关闭