/* 根据标签名来选择 */ p { font-size: 16px; color: #333; } /* 根据类名来选择 */ .title { font-weight: bold; font-size: 20px; } /* 根据ID名来选择 */ #intro { background-color: #eee; } /* 根据属性值来选择 */ input[type="text"] { border: 1px solid #ccc; } /* 选择所有子元素 */ nav li { display: inline-block; } /* 选择紧跟在前一个元素后的元素 */ h1 + p { font-size: 18px; } /* 选择第一个元素 */ ul li:first-child { font-weight: bold; } /* 选择最后一个元素 */ ul li:last-child { font-style: italic; }
除了上面提到的选择器,CSS还支持许多其他的选择器,例如伪类选择器、伪元素选择器、属性选择器等。掌握好CSS选择器可以更加准确地定位和修改页面元素,提高网页的可读性和美观性。