[CSS] text 마우스 드래그 시 CSS 설정 (::selection)

[HTML/CSS] 텍스트 마우스 드래그시 색상 변경방법, ::selection

---

input 태그에 text나 p, span 태그의 text 등등 사용자가 웹 페이지에서 특정 text를 드래그할 때 드래그를 못하는 기능도 있지만, 또 다른 방법으로는 드래그 시 CSS를 커스텀하는 방법도 있다.

<p>특정 text 드래그 CSS 커스텀 하기</p>

테스트를 진행하기 위해 p 태그를 생성하고, text를 삽입 해줬다.

 

이제 ::selection 선택자를 사용해서 drag 시 p 태그의 CSS를 커스텀해준다.

p::selection {
    background: tomato;
    color: white;
}