ページを見ながら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拡張機能 『Linkclump』

    Webページ上で範囲指定したリンクを一括で全て開いてくれるとい…

  2. Chromeツール

    Chromeを快適化!! 使っていないタブを自動で閉じて保管してくれる拡張機能 『Tab Wrang…

    一定時間使っていないタブを自動で閉じて保管してくれるChrom…

  3. Chromeツール

    Todoやタブ管理、メモ帳など便利機能がシンプルに満載なChrome拡張機能 『Jety』

    Chromeの新しいタブにTodoやメモ帳機能タブ管理機能や美…

  4. Chromeツール

    リンク先画像を中央に表示してくれるChrome拡張機能 『画像を中央に』

    リンク先画像を画面中央に表示してくれるChrome拡張機能…

コメント

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

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

PAGE TOP