WEBツールSassネタは今日はお休みしてbrackets-cssfierが気になったので使ってみました。感想やら手順などをちょこっと。書かないってことはどういうことだかお利口さんなみんなは分かるよね。Bracketsです。Downloadとりあえずダウンロードしてインストールしておきましょう。brackets-cssfierのインストールファイル→拡張機能マネージャーをクリック。URLからインストールをクリック。テキストボックスに「https://github.com/rcaferati/brackets-cssfier」を貼り付けてインストールをクリック。以上でbrackets-cssfierのインストールは終わりです。brackets-cssfierを使ってみる使い方は至ってシンプルです。htmlを書く→コピーする→cssファイル(scssファイル)に貼り付ける以上です。htmlを書くコピーする※今回はnav,ul,li,aまでをコピーしてみました。cssファイルに貼り付けるあら不思議。コピーしたhtmlがcssのセレクタに変身しましたね!超便利!超楽!まとめ環境も簡単に作れてcssを書くのが楽になりそうですね。css大好きなみんなは気づいてると思うけど2階層までしか対応しないみたいです。階層を明確に書くようにしている方にはちょっとですね。今回のようにサンプルみたいなものを作る際はすごく手間が省けてゆっくりコーヒーを飲む時間もできますね。要は使いドコロを選ぶしSass派のみんなには不向きかな?ってツールの紹介でした。関連記事[CSS3]transitionのまとメモ昨夜は会社で寝てました。「え?え?え?どこ?いつ?なんじ?」な状態です。最近頻繁に使うtransit...記事を読む[CSS]奇数とか偶数とかn番目とか忘れてしまうのでメモ。tableで交互に色つけてーとかn番目の要素だけ背景色変えてーとか、よく忘れます・・・歳ですもん。ことで、今回は筆者の本当のメ...記事を読む[CSS,rem,Sass]remとか言う単位とSassで思い通りのfont-sizeライフを送ればいいと思うの。remと聞くとレム睡眠しか思い浮かびません。体は眠っているのに脳は活発に稼働しているだなんてニンゲンの神秘を感じてしまいますが、今回...記事を読む[jQuery]製作時にGoogleにホスティングされてるjQueryやprototypeなどのscriptタグをコピーできるサイト今更ですが便利なのでメモっておきます。Numbers」を使っている方も少なくないはず。...記事を読む[CSS3,animation]CSS3のanimationで何ができるか試してみた!使わないと思うけどwやっぱり動きがあると面白いですよね!動かさないけど。書くと複数人で更新してるみたでかっこいい。...記事を読む[Compass,CSS3]CompassのCSS3モジュールをまとめてみた(2)予定は未定でしたが2度めの更新ですよ。今回は「あ~見たことある~」的なところでいくつかピックアップしてみました。Font]Webフォントを使って洒落たメニューをおっさんが作ってみる。WebFontって使ったことないなー。アイコン的に使ってみた。洒落たメニュー作ってみたよ。今回使ったのは「Fo...記事を読む[CSS]擬似クラス:first-letterでドロップキャップ今回も紙面デザイン的WEBデザイン。擬似クラス:first-letterを使ったドロップキャップの3分クッキング。ドロップキャッ...記事を読む[Compass,CSS3]CompassのCSS3モジュールをまとめてみた(随時更新予定は未定)自分ノートとしてCSS3モジュールをまとめてみるわけさ。絶対使いそうなもの3つから。