블로그CSS2 순위 번호를 손으로 고치다가 같은 번호가 두 개 생긴 날 CSS Counter - counter-reset, 자동번호, 가상요소 솔직히 저는 꽤 오랫동안 순위 번호를 HTML에 직접 손으로 입력했습니다. 번호 하나 바꾸려고 태그를 하나씩 열고 닫는 게 당연한 줄 알았거든요. CSS Counter를 알게 된 건 실수를 반복하고 나서였는데, 알고 보니 이미 CSS 안에 자동 번호 기능이 내장되어 있었습니다.이 글을 쓰면서 드는 생각이 있습니다. CSS Counter가 존재한다는 것을 늦게 알았다는 사실 자체보다, 그걸 몰랐던 이유가 더 흥미롭습니다. 저는 CSS를 "스타일을 입히는 도구"로만 인식하고 있었고, 번호 매기기는 당연히 HTML이나 JavaScript의 영역이라고 생각했습니다. 그 선입견이 학습의 범위를 좁혀놓고 있었던 겁니다.하드코딩 번호가 무너지던 날TOP 10 추천 글을 처음 발행했을 때 저는 모든 순위 번호를 HTM.. 2026. 4. 17. CSS 눈 피로 줄이기 (색상 설정, 줄 길이, 다크모드) - 모니터도 안경도 아닌, 설정 색상 설정, 줄 길이, 다크모드. 직접 써보고 달라진 것들.한참 모니터를 들여다보다가 퇴근하면 눈이 뻑뻑하고 화면이 잔상처럼 남는 느낌, 한 번쯤 겪어봤을 겁니다. 저는 그게 당연한 줄 알았습니다. 컴퓨터를 많이 써서 그런 거라고. 그런데 어느 날 CSS를 조금 손봤더니 같은 시간을 봐도 눈이 덜 피로한 걸 느꼈습니다. 모니터가 바뀐 것도, 안경을 새로 맞춘 것도 아니었는데.그 뒤로 화면이 눈에 주는 피로감이 설정에 따라 달라진다는 걸 체감했습니다. 이 글은 제가 직접 써보고 "이건 확실히 다르다"고 느낀 CSS 설정 다섯 가지와, 그걸 다크모드까지 연결하는 방법을 정리한 기록입니다.배경색, 글자색, 줄 길이 — 숫자로 보는 색상 설정배경색을 순수 흰색 대신 아주 약간 따뜻한 색으로 바꾸는 것은 단순한 .. 2026. 4. 10. 이전 1 다음
