1. **标签选择器**：这种基本而直接的方式是通过指定 HTML 标签名称来选取所有该类型的元素并设置其共性样式。
示例：
css
p {
color: red;
font-size: 16px;
}
上述代码会把整个页面内所有的段落文本颜色设为红色，字体大小设定为16像素。
2. **类选择器 (Class Selector)** ：使用点号`.`前缀结合自定义类名可以针对具有相同class属性值的所有元素进行样式的定制化处理。
实例:
html
<div class="highlight">关键内容</div>
<p class="highlight">重要提示</p>
.highlight {
background-color: yellow;
border: 1px solid black;
}
在此例子中，“highlight” 类被添加到两个不同的HTML元素上，在CSS里对该类进行统一风格配置后，这两个元素都将获得高亮背景及黑色边框的效果。
3. **ID 选择器**: ID选择器以其唯一性和优先级高的特性备受青睐。它采用井字号`#`作为标识符前缀，后面跟具体的id名称来进行精确匹配单个元素。
应用实例:
html
<h1 id="main-title">网站主标题</h1>
#main-title {
text-align:center;
color: blue;
}
此处“#main-title”的规则仅对拥有"id"属性等于 "main-title" 的 h1 元素生效，使其文字居中并对齐，并将其颜色变为蓝色。
4. **后代/子代选择器**: 后代选择器由空格分隔多个选择器表示一个层级关系；若要严格限定父子层次，则可选用大于符号 `>` 进行子代选择。
- 子代选择器示例:
css
div > ul li {
list-style-type:none;
}
当li元素位于ul之下并且这个ul又恰好嵌套于某个div之内时，上述CSS将会移除列表项的小圆点标记。
5. **伪类选择器**: 定义了特殊状态或位置下的元素样式。如`:hover`, `:active`, 和`:visited`等常用于链接的不同状态下变换样式。
使用范例:
css
a:hover {
color: green;
cursor:pointer;
}
button:focus {
outline: none;
box-shadow:0 0 2px rgba(0,0,0,.8);
}
第一条规则将在鼠标悬停在任何锚(a)元素之上时改变其颜色至绿色并将光标显示成手型图标。第二条则当按钮获取焦点时取消轮廓线并在四周生成浅色阴影特效。
以上仅为部分常用的CSS选择器类型举例说明，实际上还有更多复杂精妙的选择器组合等待开发者们探索实践，例如群组选择器、相邻兄弟选择器 (`+`)、一般同胞选择器 (~)，以及更高级别的:nth-child() 等结构性 pseudo-class 选择器等等，帮助我们更好地控制网页组件间的视觉表现与交互体验。