CSS - :not

外部サイトのリンクにだけ特定のアイコンを付与する

Result See the Pen Inline Icons & Wrapping by kachibito (@kachibito) on CodePen. 外部サイトのリンクにだけ特定のアイコンを付ける、...

CSSだけでチェックボックスにチェックしたらテキストに打ち消し線してチェックした数も表示する

Result See the Pen CSS-only Todo by kachibito (@kachibito) on CodePen. いわゆるTodoアプリです。 機能的に完成させるのは難しいですが、CSSで...

簡単なコードでマウスホバーした要素以外を透過する

Result See the Pen Sibling fade by kachibito (@kachibito) on CodePen. かなり昔にJSによる方法を書きましたがどこちらの方がスマートだったのでメモ ハイライト...

クリックで展開する円状のメニュー

Result See the Pen 🌟 Circle Menu #PureCss 🌟 by kachibito (@kachibito) on CodePen. SNSのPathっぽい円状のメニューです。 クリックでメニューが展...

メニューの項目毎にborderで区切り線を入れる

Result See the Pen Use `:not()` to Apply/Unapply Borders on Navigation by kachibito (@kachibito) on CodePen. シンプルな線区...
Ads