HTML5/CSS3

display: inline-block;

menuとか横に並べるのにdisplay: inline-block;が便利でfloatの代わりに使う。 IE7では縦に並んでしまうので、下記スターハックを指定する。 li { display: inline-block; *display: inline; /*for IE*/ *zoom: 1; /*for IE*/ }

IE8以前のブラウザでも、HTML5とCSS3に対応させるjs

タグ内に下記jsを記述する。 <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script> <script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>

3/13 横スライド

最終課題(なんか寂しい・・・)の横スライドでつまづく事ここ数日・・・・ モニターの大きさが変わっても表示が変わらないように、副講師さんから教えて頂いた「Making a Giveaway Randomizer App w/ jQuery」で出来そうなのだけど、ナビのリンク、ベージの…

1/2 HTML5でリキッドレイアウト

リキッドレイアウト スマホサイト制作ではリキッドレイアウト(表示幅が変わっても従来のレイアウトを保持して表示できるレイアウトのこと)が一般的 リンク領域は大きく取る 下記練習用はナビゲーションがサイトタイトルの下にあるため、タテ2つをひとつの…

12/26 HTML5復習

HTML5とは 動画や音声、グラフィックの描画が可能になる。(複雑な表現でない場合に限る) 長かったHTML記述がスッキリする。 主要なスマートフォンで搭載されているブラウザのほとんどがHTML5をサポートしている。 対応ブラウザ:Safari.Chrome.Firefox(若…