1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 | <!DOCTYPE html> <html lang="ko"> <head> <meta charset="utf-8"> <style type="text/css"> /* 요소의 속성값을 CSS에서 바로 사용이 가능하다. */ #box:before { content: attr(data-start); } #box:after { content: attr(data-end); } </style> </head> <body> <div id="wrapper"> <div id="box" data-start="~~ 전" data-end="~~ 후"> <div> ------------------ </div> </div> </div> </body> </html> |
반응형
'CSS' 카테고리의 다른 글
[CSS] 텍스트 그라디언트 넣기 - css text color gradient (0) | 2017.01.05 |
---|---|
[CSS] 인라인요소 수직, 수평 정렬 - vertical-align: middle (0) | 2016.11.14 |
[CSS] animation (0) | 2016.08.31 |
[CSS] 테이블 상단 고정 스크롤 - fixed table header (2) | 2016.08.12 |
[CSS] 자바스크립트 click이벤트 없이 CSS만으로 toggle 구현하기 (0) | 2016.07.12 |