CSS（层叠样式表）是一种用于描述HTML或XML文档呈现的样式的语言，它允许开发者通过简单的语法规则来控制网页元素的外观和布局，以下是一个简单的CSS示例，展示了如何设置字体、颜色、背景等属性。
/* 选择器 */
body {
/* 属性 */
font-family: Arial, sans-serif; /* 字体 */
font-size: 16px; /* 字体大小 */
color: #333; /* 文本颜色 */
background-color: #f5f5f5; /* 背景颜色 */
}
h1 {
/* 属性 */
font-size: 24px; /* 字体大小 */
color: #007bff; /* 文本颜色 */
margin-bottom: 10px; /* 下边距 */
}
p {
/* 属性 */
line-height: 1.5; /* 行高 */
text-indent: 2em; /* 缩进 */
}
a {
/* 属性 */
color: #007bff; /* 文本颜色 */
text-decoration: none; /* 无下划线 */
}
a:hover {
/* 属性 */
color: #0056b3; /* 鼠标悬停时的颜色 */
text-decoration: underline; /* 鼠标悬停时有下划线 */
}
/* 类选择器 */
.container {
/* 属性 */
width: 80%; /* 宽度 */
margin: 0 auto; /* 居中 */
}
.button {
/* 属性 */
display: inline-block; /* 内联块级元素 */
padding: 10px 20px; /* 内边距 */
background-color: #007bff; /* 背景颜色 */
color: #fff; /* 文字颜色 */
border-radius: 5px; /* 圆角 */
text-align: center; /* 文字居中 */
}
/* ID选择器 */
#header {
/* 属性 */
background-color: #333; /* 背景颜色 */
color: #fff; /* 文字颜色 */
padding: 20px; /* 内边距 */
}
这个示例包含了一些基本的CSS选择器，如元素选择器、类选择器和ID选择器，还展示了如何使用属性来设置字体、颜色、背景等样式，在实际开发中，CSS可以应用于各种场景，如布局、动画、响应式设计等。