CSSファイルを保存すると同時にブラウザをリロード
自動リロードで開発をアジャイルにするたったひとつの方法！や萌ディタで保存と同時にSafariをリロードするデモと似たようなものをWSH with JScriptと秀丸マクロで泥臭く実現してみようとかいう話。やろうと思えばいろんな環境で実現できそうてなもんだ。 ブラウザのリロードは魔法のメソッドSendKeyでF5を送ってやれば良し。ただ、SendKeyはアクティブなウィンドウにしか効果が無いので、 CSSファイルを保存 ブラウザをアクティブに F5をSendKey エディタをアクティブに としてやる必要がある。エディタをアクティブにするのはPIDさえ知ってればJScriptでいけるけど、調べるのはちょっと面倒。しかしながらほとんどのエディタは「既に開いているファイルを開こうとすると、既にそのファイルを開いているウィンドウ(とかタブ)を最前面にする」という動作をするので、保存したCSSファイ
CSS で面倒くさいのは < 13 < July < 2006 < nulog, NULL: : something : out of the headphone
ブラウザ間のアレなんだから、あんまり CSS 書くこと自体を面倒くさいことにしないほうがいいよね、って思うんだ。 ところで自分が CSS を書くときに気をつけていることを書くよ！ 必ずルールをインデントする (TAB インデント) セレクタを複数書く場合は最後以外改行する 規則のあとには必ずセミコロンを入れる (最後も) 最後のルールのあとも改行する 宣言ブロック間はホワイトラインを入れる border, border-style, border-color, border-width 以外の border 系プロパティを極力使わない font プロパティを使わない。 list-style 以外の list 系プロパティを極力使わない margin, padding 以外の margin, padding 系プロパティを極力使わない background 以外の background 系プ
スタイルシートを書く時のガイドライン - 2xup.org
2006-07-11T19:56:28+09:00 会社ではやっているのだけれど、自分のウェブサイトでもやってみよう。と簡略記述を利用する場合の値の順序やらもまとめとく必要があるのかもしれないけれど、セットフォーマットルールやプロパティの順番だけをサクッとまとめて資料にしてみました。課題は残したもののこれだけでも相当すっきり。詳細やセットフォーマットルールに関しては、ダウンロードできるようにしている資料を参考にしていただくとして、このエントリーではプロパティの順序についてまとめることに。自分自身が実際に作業を進めていくことを考慮し、その考えに基づいて設定したモデル別の順序は以下の通り。 生成 内容, 自動番号付け及びリスト (Generated content, Automatic numbering, and Lists) 利用者インターフェイス (User Interface) ビジュ
毎日考ブログ -Web屋のウェブログ- | Web標準に進路を取れ 第5回「テーブルレイアウトは罪なのか」
テーブルレイアウトとはテーブルタグを、左のようにセルを切ってレイアウトするもの。そもそもはテーブルタグは表に使われるものであって、レイアウト目的で使うべきではないという意見はごもっともなものの、きっちり幅指定や余白指定ができてブラウザ依存しにくいことから、企業サイトはもとよりいろいろなサイトに使われておりました。いや、今でも立派に使われています。 対してCSSレイアウトは、上と同じレイアウトをHTML（XHTML）＋CSSで表現するもの。こんな感じです。記述は一例として適当に書いてるんで、アテにしたり突っ込みいれたりしないでくださいね(笑)。 【HTML】 <div id="header"> <h1>毎日考ブログ（ヘッダ部分）</h1> </div> <div id="main"> <div class="menu">メニュー部分</div> <div class="contents">本
mixiをXHTML CSSで組みなおす
mixiをXHTML+CSSで組みなおすで取り上げた生徒の提出した課題には、記事にも書いたとおり、まだいくつか改善できる点がありました。が、色々修正+αしたようで、再提出してもらいました。 前回提出したものと比べると、XHTMLが部分的に修正され、classの数が減っている。オーイェス。機能ごとにclassを与えて共通するスタイルをまとめることで、管理も編集も楽チンにする事が出来るんだ。 Comments:4 上場 2006年6月10日 23:34 力作ですね。そんな技術があってうらやましいです。 MUSCAT 2006年11月20日 07:23 感動しました。 参考に研究したのですが、小生のは拡大で破壊されました。 どか?んん！ wu 2006年11月23日 04:56 どか～ん！ 僕がレイアウトを組む際は、大小に+2ほどの拡大で可読が可能になるというラインで制作しています。 XHTM
mixiをXHTML+CSSで組みなおす - 3ping.org
授業内で、既存サイトをXHTML+CSSで組み直す練習をするのですが、生徒が提出したのが「mixi」を書き直したもので、とてもよく出来てました。 mixiはテーブルレイアウトで組まれていて、基本は3カラムだけど、もとがテーブルなだけあって、ヘッダーのメニューが少し複雑だったり、セクションごとのビジュアル的なデザインや、細かい文字の余白のとり方が難しい。 現在のCSSは「どんな見栄えも出来てしまう」とは言えない。本当は言いたいのだけど、実際にはブラウザーのバグを回避するためにバッドノウハウを駆使したり、CSSの限界から、見栄えとは切り離すべきXHTML部分を調整しなくては再現できない見栄えがある。 けど、生徒の提出したものは、見栄えのためだけのdivも無ければ、ヴァリデーターだけを100点で通過するような機械騙しのXHTMLでもない。(一部、リストとしてマークアップできるところはある) もち
Ajaxian » Prototype adds CSS selector function: $$(’div#page p.summary img’)
Enterprise Strategy Group: Go-to-market Expertise to Help You Win
注意点,ブラウザ振り分け
IE3はサポートしていない単位（em, ex）, 単位のない実数を全てpxとして扱います。 外部ファイルを参照する場合、IE3ではBODY要素に対するbackground指定が無視されます。 相対URIはスタイルシートを基準にしなければならないのですが、NC4はHTML文書が基準です。 </TD>, </TH>, </P>等は省略可能なのですが、出来れば省略しない方が良いです。例えば、画像やテーブルにline-height指定が及ぶとブラウザによってはとんでもない表示になるので、分割するとします。以下のような場合、省略してしまうとブラウザによっては分割したのが無駄になります。 <P style="font-size: 12pt; line-height: 15pt">段落</P> <P><IMG src="x.gif" alt="画像"></P> IEはParagraph、NC4はTabl
リンク先のファイルの種類によってマウスカーソルを変える -- 3m/746の日記 2.0 final β - 久しぶりに
日光を浴びた。 日が昇る前に会社に行って、日が沈んでから家に帰る日がずーっと続いていたのだ。 疲れたよ。でも今日は休みだ…もう今日も終わるケド。 （12/14に書き直しました。以前の内容は念のため id:mitamu:20051214#1134571263 にとっておきました。ご迷惑をおかけしてたいへん申し訳ございません。） WebページのリンクをクリックしたらそれがPDF文書だったりWord文書だったりExcelワークシートだったりして、ファッキン*1なAdobe ReaderとかMicrosoft WordとかMicrosoft Excelとかが起動してしまった…。 なんてコトがよくあるわたしとしては、PDF文書だとかがはっきりわかればそもそもクリックせずにすむワケなのだ。 Mozilla Firefox 1.5だとマウスカーソルを変えられるので、userContent.cssにごにょ
遂に完成 - jazzanovaのブログ
12月5日追記:元のデザインに戻しました。 aamall.jpさんに依頼していたデザインですが、随分遅くなりましたが遂に完成です。 見て下さい、これが15,000円のデザインです！！！ どーですか、このデザイン。 あ、私の方では一切いじっておりませんからね！ 一応参考にして欲しいURLとして3つ渡しました。 http://www.2manydjs.org/v2/frameset.htm http://www.davisbusinessconsultants.com/ http://www.spoiltchild.com/ それと、デザイナーさんとのやりとりの際、こちらから細かく指定したり注文をするのは控えました。 デザイナーさんに自由にやって欲しいですからね！ 皆さんの感想を聞かせて下さい！！！ 追記 ちなみにFirefoxで見るとこんな感じです！！！ ある程度修正されたので画像は削除しま
#!shebang.jp : Yellow Fade Technique
November 14, 200515:50 Yellow Fade Technique カテゴリ技術ネタ 最近、よく見かけるので prototype.js 使って実装してみる。 fat.js ってもっと便利なやつもあるけど、単純にやってる事がよく分かるように実装してみたつもり。 エフェクトをかけたい要素の id を指定して、 <script type="text/javascript"> new Fade('id'); </script> みたいな感じで使う。 var Fade = Class.create(); Fade.Colors = ['#ffff99', '#ffffaa', '#ffffbb', '#ffffcc', '#ffffdd', '#ffffee', '#ffffff',]; Fade.prototype = { initialize: function(eleme
hail2u.net - Weblog - FirefoxのuserContent.cssネタ
Firefox 1.5 Beta 1よりURLやドメインなどでCSSルールを切り分けることが可能になりました。これによりuserContent.cssがとてもいじりやすくなった(あるサイト向けにテキトウに書いても他のサイトに誤爆しなくなった)ので、userChrome.cssと同じくガリガリいじると楽しいようなそうでもないような感じです。 _blankなリンクのカーソルを変更 a[target="_blank"] { cursor: alias !important; } cursor: crosshair !important;とかやってる人が多いことと思われますが、1.5 Beta 1から先取りサポートされたaliasにするとより直観的に把握できるようになると思います。 View Page Sourceのフォントを固定する body#viewsource * { font-family
スタイルシートによる崩れない 2カラム 3カラム・レイアウト
このウェブサイトは販売用です！ desperadoes.biz は、あなたがお探しの情報の全ての最新かつ最適なソースです。一般トピックからここから検索できる内容は、desperadoes.bizが全てとなります。あなたがお探しの内容が見つかることを願っています！
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
On the Road
CodeWeb: ブラウザ別CSSハック一覧表