2012年2月| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29
トップ > Computer and Internet > WEB > 今日のコラム:Firebugはマークアップエンジニアの強い味方。テラ便利!

今日のコラム:Firebugはマークアップエンジニアの強い味方。テラ便利!

2007年12月20日 23:30

このエントリーをはてなブックマークに追加 Check Clip to Evernote

Firebug

Firebugは、WebブラウザFirefox用のアドオンで、CSSおよびJavaScriptの単純なテンプレートから複雑なAjaxアプリケーションに至るまでのすべての編集とデバッグを行うことができ、テラ便利。

CSSをさわる人なら知っていて当然だと思っていたら、意外にも周囲に知らない人が多かったので簡単に紹介することにした。

公式サイトは日本語版の解説サイトもあり、わかりやすく解説されているから気に入った人は導入するといいだろう。

Firebug日本語版
http://www.getfirebug.com/jp.html

使い方の例

Firebug

公式サイトに親切に解説があるから、ここでは簡単に。FirebugをFirefoxに組み込み、F12を押すと、画面下にFirebugを呼び出せる。paddingや、marginを調節したいときは、タブメニューから[レイアウト]を選ぶと上記のような編集画面になる。

Firebug

margin-leftの数値を変更したい場合は、marginの左数字をクリックすると編集可能になるので変更してやる。

Firebug

画面下青で反転された部分に、margin-left: -20pxと追加されているのがおわかりだろうか、マウスの右ボタンをクリックすると画像のメニューが出るので、HTMLコピーを選んで、本来のソースにペーストすればいい。

参考になれば幸い。

投稿者: Dakiny 日時: 2007年12月20日 23:30 |   |  トラックバック (0)

このエントリーをはてなブックマークに追加 Check Clip to Evernote

トラックバック

このエントリーのトラックバックURL:
http://www.dakiny.com/mtos/mt-tb.cgi/1126
※文章内容と関係のないトラックバックは固くお断り。

コメント