プロパティ(画像トリミング)https://webst8.com/blog/css-object-fit/ボックスにはまるように画像をトリミングする。指定しないとボックスがはみ出た状態で表示になったりする。ポートフォリオの画像の縦横合わせたいときとか使えるが、乱用しない!基本はPhotoshopやIllustratorでやってから!大量の写真をトリミングしてギャラリー作成して、など頼まれた時くらい。使うのはcover:ボックスにはめようとする。coverで、カメのはめ込みたい場所を変えたいとき、position使う。タグの中身のはめ込み方法を指定します。はめ込み方法は、以下の値で指定します。コンテンツのアスペクト比を維持したまま、要素のコンテンツボックスに収まるように拡大縮小してはめ込みます。コンテンツのアスペクト比を維持したまま、要素のコンテンツボックス全体を埋めるように拡大縮小してはめ込みます。オブジェクトコンテンツと要素のコンテンツボックスのアスペクト比が合わない場合は、オブジェクトの方が合うように切り取られます。要素のコンテンツボックス全体を埋めるように拡大縮小してはめ込みます。オブジェクトコンテンツと要素のコンテンツボックスのアスペクト比が合わない場合は、オブジェクトが合うように拡大縮小されます。コンテンツは、拡大縮小されません。指定されたかのようにサイズが決められ、オブジェクトの実際のサイズが小さい方を採用します。タグの中身の配置位置を指定します。配置位置は、以下の値で指定します。配置位置を以下の値で指定します。配置位置を以下の値で指定します。数値(単位付き)数値(単位付き)画像がはみ出した場合は、はみ出した部分は非表示(トリミング)になります。指定したセレクタにおまじないをかける!クラスを使わなくても適用できる!擬似クラスとは指定の要素が特定の状態である場合にスタイルを適用させるセレクタです。文章構造の範囲外にある情報によってスタイルを変化させることができます。擬似要素とは、要素の一部に対してスタイルを適用できる指定方法です。HTML​の要素を擬似的にCSSで設定するので、コーディングに手を加えることなく装飾を適用することができます。}未訪問リンクのスタイルを指定します。検索で、未訪問は青色になるやつ。}訪問済リンクのスタイルを指定します。検索で、1回見たら紫色になるやつ。}オンカーソル時(要素にカーソルが乗った時)のスタイルを指定します。スマホの場合は対象の要素をタップしてから他の要素をタップするまでの間になります。検証ツール右上:hovを使うと、作りやすい。hoverにチェックすると、hoverのタグを作ってくれる。}要素がアクティブになった時のスタイルを指定します。アクティブとは要素をクリックしてから離すまでの状態を示します。スマホの場合はタップしている間になります。}先頭(first-child)・最終(last-child)の子要素にスタイルを指定します。子にclass名を書かなくても指定できる。番目の子要素にスタイルを指定します。部分は「(整数)・odd(奇数)・even(偶数)・(数式)」を指定することができます。各値は、以下の型式で指定します。番目の子要素が対象になります。odd(奇数)奇数番目の子要素が対象になります。even(偶数)偶数番目の子要素が対象になります。子要素の対象を数式で指定します。奇数の子要素の場合は「2n+1」、偶数の子要素の場合は「2n+0」となります。番目の子要素にスタイルを指定します。番目の子要素が対象になります。部分は「(整数)・odd(奇数)・even(偶数)・(数式)」を指定することができます。各値は、以下の型式で指定します。番目の子要素が対象になります。odd(奇数)奇数番目の子要素が対象になります。even(偶数)偶数番目の子要素が対象になります。(数式)子要素の対象を数式で指定します。奇数の子要素の場合は「2n+1」、偶数の子要素の場合は「2n+0」となります。含まない要素を指定します。タグ以外の要素が対象になります。これを使わないと、河川の例だとborder:none;を書かないといけなくなる。1文字目を大きくしたり。}要素の直前(::before)または直後(::after)へのコンテンツの挿入を指定します。プロパティで指定します。コメントをキャンセルメールアドレスが公開されることはありません。※サイト次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。