CSSパーツ

概要

部分的なCSSの配布ページです。自分が普段使っているやつを整形して公開しています。

各ボックスからコピーしてご利用ください。

リストを横並びにし、区切りをつけます。
改行は項目単位です。

リンクをカードっぽくします。あくまでもそれっぽく。

長すぎるリンク名は省略されます。
青い部分にはお好みの色やアイコンフォントなどでカスタムしてください。

装飾的なタイトルなど、改行をある程度管理したいときに自分がよくやるやつです。

長いタイトルやサイト名が途中で改行されて微妙になる

ようなとき、display: inline-block;のクラスで文節ごとに囲むと、

長いタイトルやサイト名が途中で改行されて微妙になる

となります。言葉の一塊を指定する感じです。
あまり細かくしようとすると大変ですが、タイトルなど短い文章ならいい感じにしやすいと思います。レスポンシブ対応の一環にも。

ネタバレをしたくない文章に対して黒塗りで隠すCSSです。

カーソルを合わせる（スマホなどではタップする）と中身を表示します。
万全な非表示ではないことをご留意ください。

画像版のスポイラーです。カーソルを合わせる（スマホなどではタップする）と中身を表示します。