1、CSS选择器first-letter,first-line
选择器 | 例子 | 例子描述 | CSS |
---|---|---|---|
:first-letter | p:first-letter | 选择每个 <p> 元素的首字母。 | 1 |
:first-line | p:first-line | 选择每个 <p> 元素的首行。 | 1 |
::selection | ::selection | 选择被用户选取的元素部分。 | 3 |
2、效果演示
源代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CSS伪类选择器</title>
<style type="text/css">
.divContent:first-line{
color: blue;
}
.divContent:first-letter{
color: red;
}
.divSelect::selection{
color :red;
}
</style>
</head>
<body>
<div class="divContent">
这是第一行的内容<br/>
这是第二行的内容<br/>
</div>
<div class="divSelect">
选择部分文本,查看效果变化!
</div>
</body>
</html>
效果演示:(从后向前选择了部分文字)
CSS选择器-系列文章
下一节 CSS-选择器10-first-child、last-child、nth-child 和 nth-last-child