css – one euro

Published 2020年11月27日 by mick

CSSでチェックマークを文頭に付ける方法【ファビコン版】

ファビコンを使ってチェックマークを文頭に付ける方法を紹介。CSSでチェックマークをつくりたい／ファビコンの使い方を知りたい／擬似クラスでFont Awesomeを使いたい／こんな方向けの記事になります。コピペですぐに使えるようにしています。

Published 2020年10月13日 by mick

CSSを使って画像はスライドショーしつつ、パララックスする方法を紹介。CSSで画像をスライドショーする、CSSでパララックスする、この2つの実装を組み合わせた形になります。サンプルをコピペして画像のリンクを変更するとすぐに使えるようにしています。

Published 2020年10月12日 by mick

スライドショーをCSSで実装する方法を紹介。スライドショーを実装する方法はJavaScriptやWordPressならプラグインで実装する方法もあります。ここではCSSだけを使うため初期設定も不要で簡単。Webサイトの速度にも影響を与えません。

Published 2020年10月5日 by mick

スタイルシートであるCSSの記述順の優先順位（カスケード順）についておさらいをしています。CSSはシンプルな分、Webサイトが思い通りの見え方が思い通りになかなかならないこともあります。これはCSSを書くときに決まっている優先順位が関係しているケースが多いです。

Published 2020年10月3日 by mick

パララックスの効果をCSSで実装する方法を紹介。パララックスは目の錯覚を利用して画面に奥行きを感じることができる視覚効果です。JavaScriptライブラリで実装する方法もありますが、CSSだけを使うため初期設定も不要でらくらくです。

Published 2020年9月29日 by mick

CSSの（見栄えの）動作チェックをするWebサイト。CSSの整形とコーディングエラーを見つけるWebサイト。この2つのWebサイトを紹介します。これらのWebサイトは、CSSを部分的にチェックしたいときや、ソースコードの整形をしたい人に役立ちます。とにかく便利。

Published 2020年9月14日 by mick

CSSはあとに記述した方が優先される。とても基本的なことのはずなのですが、ふとした瞬間に抜け落ちてしまうことがあると思います。a:hoverが効かなくて困ってしまうのもそのひとつ。これはユーザーが操作することで順序が生まれる特殊な例だと思います。

Published 2020年9月12日 by mick

Webサイトを早く表示するには、CSSファイルが少ない方がオススメです。そのため、ひとつのCSSファイルが大きくなります。CSSファイルが大きくなってくると、同じCSSの内容を書いて冗長になってしまうことがあります。このCSSの冗長を自動的にチェックするツールを使うと便利です。