あなたのサイト丸裸にしますGoogle Chrome拡張機能「CSSViewer」

ブログ始めたけどみんなと同じデザインイヤだと思ってカスタマイズしようと思ったけど元々の設定が分からないんだけどと悩んでる方、これがあれば一発であなたのサイトが丸裸になります。

Google Chrome限定ですが「CSSViewer」という拡張機能を導入するだけで幸せになれます。

sponsored link

Google Chrome拡張機能「CSSViewer」の導入

151023-1

まずはこちらにアクセスしましょう。

CSSViewer – Chrome ウェブストア

ページにアクセスして右上にある”CHROMEに追加”をクリックするだけで導入できます。
ブラウザにこのアイコンが追加されたと思います。

151023-2

これで完了です。

Google Chrome拡張機能「CSSViewer」の使い方

使い方はめっちゃ簡単です。

CSSの設定を確認したいページにアクセスし「CSSViewer」のアイコンをクリックするだけです。
あとは任意の場所にカーソルを合わせましょう。
するとこんな感じになります。

151023-3

すごいっすねー
全部見えちゃいますね。

これであなたのサイトの設定が今どんな感じなのか簡単に分かるようになりましたね。

気になるあのサイトも丸裸に!サイトカスタマイズの参考に

もちろんどんなページでも使えるのでサイトカスタマイズの参考にもってこいですよね。
パクるんじゃなくてリスペクトしてるからこそのオマージュです。

私が昔から愛してやまない男子ハックを丸裸にしちゃいましょう。
ほらこの通り簡単だよ!

151023-4

参考:バック・トゥ・ザ・フューチャーに登場したNIKEの自動で靴紐を締める「NIKE MAG」2016年にオークション型式で販売 | 男子ハック

丸裸にした上でH2タグのデザインいいなーって思ったらそのままオマージュ(セケンハパクリトイウコトバニキビシイノデ)しましょう。
早速いただきました。カッコイイデザインありがとーございます。

ちなみに男子ハックのH2タグのCSSは以下の通りです。

こんな感じでサイトを丸裸にしていきサイトカスタマイズの参考にしましょう。

さいごにひとこと

またカスタマイズが捗るツールを発見してしまいました。
イジリだしたらキリがないんですけどあれやってる時ってめっちゃワクワクする。

初心者が徹夜でCSSイジった記事はこちら

この記事が気に入ったら
いいね!しよう

Twitter で

AT HOME GEEKのLINE@スタート!

ブログのご意見ご感想をお待ちしています!

僕の得意分野は、カナダへの成人向け留学、将来のこと、ハタラキカタ、離婚問題(バツ1です)、ブログや人生の悩みなどなんでも大歓迎!どんどんお待ちしております!

友だち追加

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA


こちらもオススメ!