CSS选择器详解与样式表位置介绍
需积分: 9 141 浏览量
更新于2024-09-02
收藏 279KB DOC 举报
"Css基础(二).doc"
在CSS(层叠样式表)中,选择器是用于指定HTML或XML文档中元素的关键工具,它们决定了哪些元素将应用特定的样式。本资料主要介绍了CSS的选择器种类,包括基础选择器、复合选择器以及样式表的书写位置,帮助初学者更好地理解和运用CSS。
1. 基础选择器:
- **标签选择器**:通过HTML标签名来选择元素,例如`p{样式}`会应用到所有段落元素。
- **类选择器**:使用`.`前缀,如`.myClass{样式}`,可应用于任何调用该类名的元素,一个元素可以有多个类选择器。
- **ID选择器**:使用`#`前缀,如`#uniqueId{样式}`,每个ID在页面上只能出现一次,适用于唯一标识元素。
- **通配符选择器**:`*{样式}`,应用于所有元素。
2. 复合选择器:
- **交集选择器**:`标签 + .class` 或 `标签 + #id`,选择同时满足标签和类或ID的元素。
- **后代选择器**:`parent selector > child selector`,选择父元素内的所有子元素,不限层级。
- **子代选择器**:`parent selector > child selector`,仅选择父元素的直接子元素。
- **并集选择器**:`selector1, selector2, selector3`,将多个选择器组合,应用相同的样式。
3. 样式表书写位置:
- **内嵌式写法**:在`<head>`标签内使用`<style>`标签,样式仅作用于当前文档。
- **外链式写法**:通过`<link rel="stylesheet" href="1.css">`引入外部CSS文件,便于样式复用和管理。
- **行内样式表**:直接在HTML元素的`style`属性中写样式,优先级最高,但不推荐,因为不利于维护。
了解这些基本概念后,开发者可以更灵活地控制页面元素的外观,如设置`font-style`、`font-weight`、`font-family`、`font-size`来改变文本样式,用`line-height`调整行间距,通过`color`和`background-color`设定文本和背景颜色,利用`text-align`控制文本对齐,以及`text-indent`实现首行缩进。掌握选择器的运用是CSS学习的关键,它能帮助我们精确地定位和美化页面上的每一个元素。
2013-08-27 上传
2009-09-19 上传
2010-04-11 上传
2018-10-29 上传
2010-05-17 上传
2012-10-08 上传
2022-12-23 上传
2021-10-10 上传
2008-10-21 上传