2019. 2. 14. 00:19ㆍFront End 강의내용
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
p{
padding: 20px;
border: 5px solid teal;
}
p:first-child::selection{
/* 첫번째 p, 드래그 선택 */
background-color: teal;
color: #fff;
}
p:last-child::selection{
/* 마지막 p, 드래그 선택 */
background-color: red;
color: #fff;
}
</style>
</head>
<body>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Omnis quidem rerum quaerat. Asperiores explicabo, accusantium obcaecati velit ipsum unde, repudiandae, corporis dignissimos ipsam sequi voluptatem esse placeat, provident id atque!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Beatae veritatis labore ullam. Repudiandae, saepe vitae non hic velit quasi quaerat, repellat nihil vel fuga ut ex maxime. Nobis, aliquam, libero.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsam porro vitae, sequi impedit tempora at ab, repellendus minima quidem ipsum reprehenderit consequatur placeat animi quo dolorem, voluptatibus amet qui, quaerat.</p>
</body>
</html>
'Front End 강의내용' 카테고리의 다른 글
128강. clearfix 적용 (0) | 2019.02.15 |
---|---|
126강. Dropcap 적용 (0) | 2019.02.13 |
125강. ::before, ::after 적용 (0) | 2019.02.13 |
124강. ::first-letter, ::first-line, ::selector 적용 (0) | 2019.02.13 |
122강. only-of-type 적용 (0) | 2019.02.12 |