CSS selector automatic extraction/generation tool

CSSセレクタ自動抽出/生成ツールについて

静的なコーディングを行う際、まずHTMLタグを記述してから、記述したclass名をCSSセレクタとしてCSSファイルに書き、CSSの中身を記述していく、という手順が基本になります。その中で、「CSSセレクタをCSSファイルに書く」という作業が毎回生じて、意外と時間をとられてしまうので、HTMLタグからCSSセレクタを抽出してCSSを自動生成するツールを作成しました。

初めてご利用の方はページ下部をご利用下さい。

HTMLタグ

このツールの使い方

HTMLタグを入力して「CSSを生成」ボタンをクリックすると、「生成後のCSS」のテキストエリア内に生成されたCSSが表示されますので、コピーしてご使用下さい。

このツールが生成するCSSの対象

classとIDどちらでも対象となり、親子関係を含めてCSSのセレクタが生成されます。classとIDどちらも付与されている場合、classが優先されます。

classとIDどちらも付与されていない要素は、生成されるCSSに含まれません。

個人事業主、法人、問いません。
フロントエンド、バックエンド、インフラなど、
技術屋からのお問い合わせをお待ちしております。

ITコンサルティング、開発、その他、
弊社へのお問い合わせはこちらから。

CSSセレクタ自動抽出/生成ツール