@規則 - soyjoynice @ ウィキ

具体的には、
@media…指定したメディアだけに有効なプロパティ定義を記述する。
ex）

/*幅が1000px以上のときに適用される部分*/
@media screen and (max-width: 1000px) {
  #container{
    width : 95%;
  }
}

/*幅が760px以上のときに適用される部分*/
@media screen and (max-width: 760px) {
   #container{
    width : 95%;
  }
}

/*幅が480px以上のときに適用される部分*/
@media screen and (max-width: 480px) {
   #container{
    width : 95%;
  }
}

/*幅が320px以上のときに適用される部分*/
@media screen and (max-width: 320px) {
   #container{
    width : 95%;
  }
}

- - -
CSSなので、.cssファイルにそのまま書いてもいいし
HTMLファイルに

<style type="text/css">
<!--
@media all and (orientation:landscape){
...
}
@media all and (orientation:portrait){
...
}

などと書いてもOK。

* * *

参考：
http://www6.plala.or.jp/go_west/nextcss/ref/slctr/at_rule.htm
http://www.marguerite.jp/Nihongo/WWW/CSS/AtMark.html