メインコンテンツにスキップ
ToolShed
ホーム
人気
新着ツール
すべてのツール
読み込み中...
ホーム
デザイン・CSS
CSS詳細度計算機
デザイン・CSS
無料
登録不要
CSS詳細度計算機
CSSセレクタの詳細度(Specificity)をID・クラス・要素別にスコア計算。スタイル競合の解決に便利な無料オンラインツール。
CSSセレクタ (1行1つ)
h1 .title #header .nav a .btn.primary:hover div > p.intro
#header .nav a
1
1
1
最強
.btn.primary:hover
0
3
0
div > p.intro
0
1
2
.title
0
1
0
h1
0
0
1
a
ID
b
クラス/属性/疑似クラス
c
要素/疑似要素
FAQ
よくある
質問
主要ブラウザでの互換性はどうですか？
+
CSS詳細度計算機の出力はChrome、Safari、Firefox、Edgeの最新版で動作します。古いブラウザ対応が必要な場合はCaniuse.comで各プロパティの対応状況を確認してください。
対応しているブラウザは？
+
入力したデータはサーバーに送信されますか？
+
関連ツール
こちらも
おすすめ
CSS角度単位
CSS角度単位を表示する無料オンラインツール。CSS角度単位をブラウザ上で即座に実行でき、デザイン・CSSとして登録不要で利用できます。
animation-direction
animation-directionを表示する無料オンラインツール。animation-directionをブラウザ上で即座に実行でき、デザイン・CSSとして登録不要で利用できます。
animation-fill-mode
animation-fill-modeを表示する無料オンラインツール。animation-fill-modeをブラウザ上で即座に実行でき、デザイン・CSSとして登録不要で利用できます。
CSSアニメーション生成
CSSアニメーションのキーフレームを視覚的に作成・プレビュー。イージング関数の選択、コードのコピーまでワンストップ。Web開発に便利な無料ツール。
border-radiusジェネレーター
CSSのborder-radiusをGUIで視覚的に調整。4隅個別・楕円形の角丸にも対応。コードをコピーしてすぐ使える無料オンラインツール。
Box Shadow生成
CSS box-shadowをGUIで直感的に作成。多重シャドウ、ニューモーフィズム、テキストシャドウにも対応。コード即コピーの無料ツール。
CSS Specificity Calculator | Design & CSS | ToolShed | ToolShed