css로만 html 내용 수정하기

다른 회사와 협업을 하다보면 일정 기간이 지나면 인력을 지원하지 않는 곳이 있는데 디자인이나 여러 이유로 html을 수정할 일이 생긴다. html파일은 손댈 수 없고, css 파일만 수정가능 할 때 말이다…

Source

나의 경우는 html에 있는 텍스트를 바꿀 일이 있었다. ::before, ::after selector를 본의 아니게 많이 사용하게 되었다.

<p class="desc">테스트입니다.</p>

.desc {  
  visibility: hidden;  
  position: relative;  
}
.replaced:after {
  visibility: visible;  
  position: absolute;  
  top: 0;  
  left: 0;  
  content: "테스트일까요?";  
}