Cntlog > スキルアップ・ノウハウ > コーディング > コーディングのお供に!CSSの更新を自動で反映させてくれる便利なブックマークレート

コーディングのお供に!CSSの更新を自動で反映させてくれる便利なブックマークレート

最近コーディングで便利なブックマークレートを見つけましたのでご紹介します。
CSSrefresh

このブックマークレートは表示しているページで使われているCSSファイルの更新を自動的に確認してブラウザに反映させてくれるというものです。
コーディングといえば、書いてはF5キー、書いてはF5キーの繰り返しでブラウザを更新して表示を確認していたかと思いますがもうその手間は必要ありません。

制作の現場でも最近はディアルディスプレイが主流となっていますので、片面はブラウザ、片面でエディターの画面のように切り分けて制作をする人にとってはうってつけのブックマークレートです。

私も今スマートフォンサイトを作りながら使っていますが、わざわざ確認の度にブラウザをリロードしなくていいというのは本当に楽です。

使い方

CSSrefreshにアクセスしてページ下部にあるアイコンをブックマークに登録します。
※chomeの場合はブックマークバーにドラッグ&ドロップで登録できます。
cap
後はコーディング中のページを開いて、登録したブックマークをクリックだけで準備完了です。
これだけでCSSを更新する度にページに反映されます
楽ちんですね。

ブックマークレートは結構登録しているのですが、 CSSrefreshは感動の出来栄えでした。

関連記事

Bootstapのグリッドでcolumn崩れが起きるときの対処法... Bootstrap3でグリッドを使っているとしばしば、カラム落ちしてレイアウト崩れをおこしている状態を見かけます。 今回はその対処方を紹介します。 対処方法 Flexboxを使う gridの.rowにFlexboxを当てれば解決します。 CSS ....
コーディングが苦手な初心者Webデザイナーに上達するCSSの勉強法... Webデザイナーになろうとして、まず最初につまずくのがコーディングです。 CSSは慣れてくると簡単なのですが初めて触るとなると、何から手を付けてよいかわからない、何が正解がわからないなどの理由で挫折する人を多く見かけます。 本記事ではCSSが全然わからない方がCSSのコーディングに慣れるため...
gulpで作るスタイルガイドをFrontNoteにした... みなさん、スタイルガイドは使ってますか。 私は今年になって使い始めました。 これまではstyledoccoを使っていましたが、長年メンテナンスされてない不安と、使ってるうちに自分のCSS設計と合わない部分がでてきたので乗り換える事にしました。 乗り換えたスタイルガイドジェネレーターは「fron...
今更だけど押さえておきたいHTML5のマークアップやAPIの基本的なところ... HTML5の言葉が流行りだして結構な時間が経ちましたが、何が使えて、何がまだ使いにくい状況なのかをずっと放置していましたのでマークアップ、API周りについて少しまとめてみました。 HTML5で追加された基本的なタグ 新しいタグの追加によって文章構造がより明確化できるようになり...
RGBAをIE8でも使う簡単な方法 CSS3で使いたい機能というと角丸やグラデーション系が多いと思いますが、割りとRGBAも便利かなと思っています。 PIEを始め、角丸やグラデーションはIE8でも使えるようにという対策はありますが、RGBAはあまり聞きませんね。 私はPHPを使ってRGBAで色指定(透過率も)したものを画像生成する...
コーディング規約(HTML・CSS)を作ってみた(公開済)... WEB制作に関わって4年位経ちましたが、最近自分のコーディングルールがバラバラで無駄が多いなと思ってきたので自分用にコーディング規約をまとめてみました。 作って見た規約はこちら。 WEB制作ガイドライン コーディング規約を作った理由 オレオレフレームワークやWordPres...