タグ

css3とHTML5に関するsnobsnogのブックマーク (4)

  • Google

    世界中のあらゆる情報を検索するためのツールを提供しています。さまざまな検索機能を活用して、お探しの情報を見つけてください。

    snobsnog
    snobsnog 2011/08/08
    素敵HTML5。
  • IDとclassを使わないで、HTML5とCSS3でコーディングしてみた。

    IDとclassを使わないで、HTML5とCSS3でコーディングしてみた。 2011-05-02 Webサイトをコーディングする時に、IDとclassを考えるのが面倒臭くなったので、IDとclassを使わないでコーディングしてみました。 シンプルなサイトなら簡単でつまらないので、IDとclassを使っても難しそうなデザインにしています。 今回もJavaScriptは一切、使用していません。 完成したサイト ID, classなしで組んだサイトを見る。 サイトでやってみたHTML5 HTML5では、html, head, bodyタグを完全に省略しても構わないとされています。 省略してもDOMツリー上に存在しているので、 body {background:#f00;} というCSSの記述も認識してくれました。 サイトで使用したCSS, CSS3の簡単なまとめ Child Selector 結

    IDとclassを使わないで、HTML5とCSS3でコーディングしてみた。
    snobsnog
    snobsnog 2011/05/09
    どうせコーディングするならこれくらいのスキルがほしい。頑張ろう…。
  • [CSS]CSS3のMedia Queries(メディアクエリ)の使い方と実装例

    CSS3 Media Queries 下記は各ポイントを意訳したものです。 はじめに CSS2のMedia typesではscreen, printなどのように特定のメディア用のスタイルシートを設定することができました。CSS3ではクエリを加えることで、さらに効率的にスタイルシートを使用できます。 Media Queriesはユーザーの状態を調べ、それにあった特定のスタイルシートを適用することができます。例えば、大きいディスプレイ用と小さいモバイル用にそれぞれ異なるスタイルシートを指定することができます。 Media Queriesの使い方 まずは、デモページをみてください。 ブラウザのサイズを変更すると、スタイルが変更されます。

    snobsnog
    snobsnog 2010/11/29
    ふー。いくつ準備すればいいんだろうなあ。
  • CSS media query によるスタイル切り替え : Serendip – Webデザイン・プログラミング

    CSS3 では media query に画面の幅などのプロパティを指定することにより、適用するスタイルシートを切り替えることができるらしい。 画面の幅のプロパティの場合、Firefox 3.5、Opera 9.64、Safari 4.0.1、Google Chrome 2.0.172.33 で動作することが確認できた。IE6,7,8 はダメ。 デモ:CSS media query によるスタイル切り替え <style type="text/css" media="screen and (max-width: 500px)"> <!-- body { background-color: #fcc; } #note:after { content: "500"; } --> </style> <style type="text/css" media="screen and (min-widt

  • 1