ページを見ながらCSSスタイルを調整できるChrome拡張機能 『Code Cola』



ページを見ながら直接レイアウトを調整して確認する

事ができるChrome拡張機能

CSSなどの記述に非常に便利で

確認して記述とWebページ作成が捗ります

codecola61

Chrome拡張機能 Code Cola インストール

インストール

codecola1

上記リンク先ページをChromeで開き

「CHROMEに追加」をクリックします

codecola2

追加でインストール完了です

アイコンが追加されます

レビュー

codecola3

CSS調整を見たいページにてアイコンを

クリックするとこの様な画面が表示されます

codecola4

CSS調整したい部分をページから指定して

クリックします

codecola5

あとはフォントなど様々なCSS機能を選択して

調整していくとページに反映されていきます

codecola6

TextShadowを使ってみたいけど

どんな感じだろう?という時でもサクッと確認ができます

CSSスタイル作成に非常に便利な拡張機能です

  • コメント: 0

関連記事

  1. Chromeツール

    ギゃー!! 登録したサイトを開くと恐怖動画で開けなくしてくれるChrome拡張機能 『Scary P…

    登録したサイトを開くと恐怖動画を再生して開けなくしてくれるCh…

  2. Chromeツール

    Chromeでパスワードを〇〇を表示してくれる拡張機能『Show Password on Focus…

    Chrome内でパスワードの伏字を表示してくれる拡張機能通常は…

  3. Chromeツール

    快適!! 次ページを自動的に表示してくれるChrome拡張機能 『uAutoPagerize』

    Webページで次ページなどページを送らなくてもどんどん次ページ…

  4. Chromeツール

    現在見ているページをQRコードで簡単共有!! スマホにもサクッと読み込めるChrome拡張機能 『Q…

    現在表示しているページのURLをQRコードで簡単に作成して共有でき…

  5. Chromeツール

    Twitter投稿の画像を元画像サイズでダウンロードできるChrome拡張機能 『Twitter,D…

    Twitterへ投稿された画像を元画像サイズでダウンロードでき…

  6. Chromeツール

    便利な拡張機能!! 検索結果に画面スクショを表示してプレビューできるChrome拡張機能 『Sear…

    検索結果にサイトのプレビュー画面を表示してくれるChrome拡張機…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

最近の記事

PAGE TOP