はっきり仕様には書いてますね。気づかなかった。
書くとどうなるか。
pタグの中にdivを書くとこうなる。赤いボーダーがpタグ。pタグがdivをかこっているが、floatしたみたいに高さが消えている(Fx3[mac])。divの中にあるpタグは正しい挙動をしているのもわかる。そして、ブラウザによってタグの挙動が違う。
pタグの中にdivを書くと変な感じになる。
ブラウザ比較
firefox3.5 |
safari4 |
opera9 |
BookMarks: 2009年8月まとめ
サンプルがすごく素直に動いてくれた。
urlに引数を付与しておいて、リンク先のページのjavascriptで引数を読み込み、ページ内のタブ切り替えを制御できるようにした。
↓とりあえず、タイトルがすごくながい。今まで見た中で一番か二番に長いかもしれない。
今日いじっているhtmlが、実はよく見るとdoctype宣言がない状態とほぼ等しい宣言だった。。。つまり後方互換モードになっていました。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
↑ほぼすべてのモダンブラウザが後方互換モードになる。
↑この互換モードの一覧表を見ると、一目瞭然。この宣言だと表のすべてのブラウザで後方互換モードになる宣言のようだ。
そして、後方互換モードだと、:hoverなどの疑似要素はliなどの普通のタグでは効かなくなる。
firebugで一生懸命クラスを探しても認識されていないcssは表示されない。
このことから:hoverがブラウザに認識されていないことがわかる。
結論
後方互換モードで疑似要素を使う時はaタグなら動きます。
フラッシュみたいな動き。クリックするといろいろな反応をしてくれる。
CSSいじるだけだからもっと簡単にできるかと思ったけど、クロスブラウザ問題でややこしくなってますね。だからjQueryとかの外部ライブラリを利用したサンプルが横行してるんだ。
これはすごい。操作も簡単。マクロの編集も誰でもできる。
- 正規表現
Dreamweaver 8 ヘルプ
表の一番下に解説になっているのかなっていないのか、微妙な改行についての解説もありますね。
[ホワイトスペースの違いを無視] をオフにしてください。
と、書いてあるので、改行とホワイトスペースのマッチに関係がありそう。
- はじめてのＤＯＭ
Domのノードの解説 - DOM Samples /Core NodeList/item() - ［JavaScript］All About
item()
ノードリスト内のindex番目にある項目を返します。
世の中本当に面白くなってきましたね。名刺に音声情報が入っているのでしょうか？
AR Business Card from James Alliban on Vimeo.
設計事務所らしいデザインがjavascriptとマッチしている。
