「ブラウザ固有の接頭辞(プレフィックス)のあるCSS3プロパティをまとめて挿入するコードヒント」
火曜／金曜担当の@cremaです。本日は、さらっと短いエントリにて失礼。
鳥取にお住まいの凄腕Webクリエーター丸山章さんが、Dreamweaverで使える素敵なコードヒントを発表されていましたので、早速導入してみました。
で作業してて思ったのが、まだCSS3は正式勧告ではないし、ブラウザ対応のためにまだ多くのプロパティに接頭辞付きプロパティを追加しないといけない現状があります。となるとプロパティによっては各ブラウザ毎に3-4つくらい、さらには値も指定してやる必要があります。
ということで多少の入力補助になるかもと思って、接頭辞付きもまとめて挿入するコードヒント拡張機能を作ってみました。
とご本人もおっしゃっている、なかなかに素敵機能なので、試してみましょう。
上記ページから「css3_setwithprefix_v100.zip」をダウンロードし、.zipを解凍してできた「css3_setwithprefix_v100.mxp」をダブルクリック、Extention Managerでインストールします。
Dreamweaverを再起動し、CSSを書いてみます。
最初の数文字をタイプすると候補のプロパティが出てきます。ここでは「box-shadow」を使おうとしています。「box-shadow」が2つ候補で出てきますが、お尻に「+」がついている方を選択しましょう。
「-moz-」と「-webkit-」の接頭辞がついたプロパティがまとめて挿入されました。値はひとつずつ設定する必要がありますが、ちょっと作業時間を得した気分になれる素敵拡張機能です！
さすが丸山さん！ 使わせていただき感謝です☆
トラックバックこの記事へのトラックバックURL
http://linker.in/mtos/mt-tb.cgi/528
コメント
-
ブログで紹介ありがとうございます。凄腕じゃないので「凄腕Webクリエーター」ってめっちゃ恥ずかしいです。w
要望があれば頑張って取り入れたいと思います。akira2010年09月15日 -
おお、ご本人からコメント感謝です！
使わせていただいて、何かあればご連絡させていただきまーす！個人的には、
filter: alpha(opacity=25);
-moz-opacity:0.25;
opacity:0.25;
がワンセットで入れられたら嬉しかったりします;-)黒野明子2010年09月15日 -
Twitterでご指摘を受けたので、メモ。
E {
filter: alpha(opacity=0);
-ms-filter: alpha(opacity=0);
opacity: 0.5;
}黒野明子2010年09月15日 -
更新したよ。IEにも一部対応。
http://dwlog.net/2010/09/css3-setwithprefix-update.htmlakira2010年09月15日 -
きゃーーーー！！！！！
さっすがです！！！！！
早速使わせていただきます！多謝！！
黒野明子2010年09月15日
コメントする
