CSS :nth-last-of-type() 疑似クラス| CSS:スタイルシート関数要素使い方・書き方例 CSS サンプル

2018-06-04 css-reference

ページコンテンツ

▼:nth-last-of-type() 疑似クラス CSS プロパティとは
▼疑似クラスセレクター :nth-last-of-type()
▼実例コード 1
▼CSSコード：例
▼構文
▼サポートするデスクトップブラウザ対応・互換性
▼サポートするモバイルブラウザ対応・互換性

`:nth-last-of-type()` 疑似クラス CSS プロパティとは

トピック：最後の子から数えて、特定の型の親のn番目の子であるすべての要素にマッチ(選択)する事ができる n には、数値、キーワード、または式を指定できる兄弟要素のグループの中で指定された、 type の要素を、最後から数えた位置に基づいて選択することができる

疑似クラスセレクター `:nth-last-of-type()`

実例コード 1

サンプルコードを試す

p:nth-last-of-type(2) {
     background: red;
}

CSSコード：例

p:nth-last-of-type(4n){
   color: lime;
}

/* 兄弟の <p> 要素の中で、後ろから数えて3つおきに選択 */

メモ: この疑似クラスは、最初から後に向けてではなく最後から前に向けて数えるという点を除けば、本質的に :nth-of-type と同じ。

構文

:nth-last-of-type(number) { css : properties ; }
 疑似クラス名 {スタイル要素のプロパティ : プロパティ値; }

nth-last-of-type 疑似クラスは、要素を選択する最後のカウントパターンを表す1つの引数をとります。

CSS バージョン	CSS 3

サポートするデスクトップブラウザ対応・互換性

Property	Desktop 互換性
:nth-last-of-type()	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari
基本サポート	フルサポート◯4	フルサポート◯あり	フルサポート◯3.5	フルサポート◯9	フルサポート◯9.5	フルサポート◯3.2

サポートするモバイルブラウザ対応・互換性

Property	Mobile 互換性
:nth-last-of-type()	Android	Chrome for Android	Edge Mobile	Firefox for Android	Opera for Android	iOS Safari	Samsung Internet
基本サポート	フルサポート◯2.1	不明	フルサポート◯あり	フルサポート◯4	フルサポート◯10	フルサポート◯3.2	不明

：:nth-last-of-type() 疑似クラス 関連記事

CSS :nth-last-of-type() 疑似クラス| CSS:スタイルシート関数要素使い方・書き方例 CSS サンプル — CSS :nth-last-of-type() 疑似クラス | CSS プロパティ値| 意味使い方実例 – WebRef

タグ:

#CSS プロパティ
#CSS 疑似クラス