/* 行番号を表示 -- ウィンドウ幅768px以上で適用 */ @media screen and (min-width: 768px) { .lines { counter-reset: line } /* タイトルから数えるときは :not(.line-title) を消してね */ .line:not(.line-title) { counter-increment: line } /* タイトルから数えるときは :not(.line-title) を消してね */ .app:not(.presentation) .line:not(.line-title)::before { content: counter(line); position: absolute; display: inline-block; left: -110px; z-index: 10; min-width: 50px; text-align: right; vertical-align: middle; /* 行番号のフォントとか色とかの指定はここ */ font-family: monospace; color: grey } /* カーソル行の行番号を濃く表示する */ .line:not(.line-title)::before { opacity: .5 } .line.cursor-line:not(.line-title)::before { opacity: 1; font-weight: bolder } }