CSS を使ってよくある問題を解決する

ボックスに影を追加するには、box-shadow プロパティを使用します。このチュートリアルでは、その作業方法を説明し、例を示します。

縦横比の異なるボックスに画像を収める異なる方法が object-fit プロパティによって提供されており、その使用方法はこのチュートリアルで確認することができます。

CSS を使用してボックスをスタイル設定する際に有益な、さまざまなプロパティを紹介します。

opacity プロパティや、アルファチャンネルのついたカラー値を使うと実現できます。いつどちらを使うかについて確認しましょう。

テキストに影を追加するには、text-shadow プロパティを使用します。このチュートリアルでは、その作業方法を説明し、例を示します。

::first-line 擬似要素で段落の最初の行を対象とする方法を確認しましょう。

:first-child 擬似クラスで最初の段落を対象とする方法を確認しましょう。

結合子は、文書内のどこにある要素を正確に対象とするのに役立ちます。このチュートリアルでは、見出しの直後に続く段落に対して CSS を適用する方法について説明します。

ボックスの中にあるアイテムを水平方向と垂直方向にセンタリングするのは厄介なことでしたが、フレックスボックスなら簡単にできるようになりました。