マーカー記法
マーカー記法
code:style.css
/* 二重括弧による強調をマーカーっぽくする */
.line strong:not(class) { background: linear-gradient(transparent 60%, rgba(171, 255, 79, .6) 60%, rgba(171, 255, 79, .6) 100%);
}
青背景に黒文字だとちょっと読みづらくないかなyuta0801.icon
引用元の色に直しましたtakker.icon
色反転の都合上、青色で設定しないといい感じにならなかった
code:style.css
.line strong:not(class):hover { background: linear-gradient( to right,
transparent,
rgba(171, 255, 79, .6),
transparent 50%
) 0% center / 400% auto ; /* グラデーション */
padding: 0.1em 0.2em 0.1em 0.2em;
animation: marker 10s linear infinite;
animation-direction: reverse;
}
@keyframes marker {
to { background-position-x: 400%; }
}
hover時にアニメーションを追加してみました suto3.icon
すごい地味に宣伝してくれていたstar_field.icon
自分も今日気がつきました
シャランラみたいな感じで消えておもしろい
Settings.icon
UserCSS.icon