<Candidate Recommendation>

この項に記載したプロパティは「勧告候補(Candidate Recommendation)」になっているため、W3Cからはベンダープレフィックスを外すことを推奨されています。

opacity

opacity:0.5;

rgba

color:rgba
(245,00,127,0.75);

border-radius

border-radius:20px;

text-shadow

text-shadow:
-2px -2px 1px #fff,
2px 2px 1px #aaa

background

background:
url(images/bg01.png) repeat-x, url(images/bg02.png) repeat-y, url(images/bg03.png) repeat;

 

background-clip

background-clip:padding-box;

background-clip:content-box;

background-clip:border-box;

background-origin

background-origin:padding-box;

background-origin:content-box;

background-origin:border-box;

box-shadow

W3C

box-shadow:8px 8px 5px 3px rgba(00,24,49,0.3);

Webkit/Mozila/Opera/IE9

  • -webkit-box-shadow:8px 8px 5px 3px rgba(00,24,49,0.3);
  • -moz-box-shadow:8px 8px 5px 3px rgba(00,24,49,0.3);
  • -o-box-shadow:8px 8px 5px 3px rgba(00,24,49,0.3);
  • -ms-box-shadow:8px 8px 5px 3px rgba(00,24,49,0.3);

linear-gradient

W3C

background:linear-gradient(top,#00eee6,#00baff);

Webkit/Mozila/Opera/IE9

  • background:-webkit-linear-gradient(top,#00eee6,#00baff);
  • background:-moz-linear-gradient(top,#00eee6,#00baff);
  • background:-o-linear-gradient(top,#00eee6,#00baff);
  • background:-ms-linear-gradient(top,#00eee6,#00baff);

radial-gradient

W3C

background:radial-gradient(50% 50%,circle contain,#00eee6,#00baff);

Webkit/Mozila/Opera/IE9

  • background:-webkit-radial-gradient(50% 50%,circle contain,#00eee6,#00baff);
  • background:-moz-radial-gradient(50% 50%,circle contain,#00eee6,#00baff);
  • background:-o-radial-gradient(50% 50%,circle contain,#00eee6,#00baff);
  • background:-ms-radial-gradient(50% 50%,circle contain,#00eee6,#00baff);

transform

W3C

transform:translate(10px,20px) rotate(5deg);

Webkit/Mozila/Opera/IE9

  • -webkit-transform:translate(10px,20px) rotate(5deg);
  • -moz-transform:translate(10px,20px) rotate(5deg);
  • -o-transform:translate(10px,20px) rotate(5deg);
  • -ms-transform:translate(10px,20px) rotate(5deg);

transition

青い四角にマウスを載せてください。
#transition .blue_box:hover{ background:#00baff; }

W3C

transition:background ease 1s;

Webkit/Mozila/Opera/IE9

  • -webkit-transition:background ease 1s;
  • -moz-transition:background ease 1s;
  • -o-transition:background ease 1s;
  • -ms-transition:background ease 1s;

box-sizing

W3C
[border-box]
280px

width:280px;
padding:30px;box-sizing:border-box;

Webkit/Mozila/Opera/IE9
[border-box]
280px

  • width:280px;
  • padding:30px;
  • -webkit-box-sizing:border-box;
  • -moz-box-sizing:border-box;
  • -o-box-sizing:border-box;
  • -ms-box-sizing:border-box;

columns

W3C

columns:4;

「ではみなさん、さういふふうに川だと云はれたり、乳の流れたあとだと云はれたりしてゐた、このぼんやりと白いものが何かご承知ですか。」  先生は、黒板に吊した大きな黒い星座の圖の、上から下へ白くけぶつた銀河帶のやうなところを指しながら、みんなに問ひをかけました。  カムパネルラが手をあげました。それから四五人手をあげました。ジヨバンニも手をあげようとして、急いでそのままやめました。  たしかにあれがみんな星だと、いつか雜誌で讀んだのでしたが、このごろはジヨバンニはまるで毎日教室でもねむく、本を讀むひまも讀む本もないので、なんだかどんなこともよくわからないといふ氣持がするのでした。  ところが先生は早くもそれを見附けたのでした。 「ジヨバンニさん。あなたはわかつてゐるのでせう。」  ジヨバンニは勢よく立ちあがりましたが、立つて見るともうはつきりとそれを答へることができないのでした。ザネリが前の席から、ふりかへつて、ジヨバンニを見てくすつとわらひました。ジヨバンニはもうどぎまぎしてまつ赤になつてしまひました。

Webkit/Mozila/Opera/IE9

  • -webkit-columns:4;
  • -moz-columns:4;
  • -o-columns:4;
  • -ms-columns:4;

「ではみなさん、さういふふうに川だと云はれたり、乳の流れたあとだと云はれたりしてゐた、このぼんやりと白いものが何かご承知ですか。」  先生は、黒板に吊した大きな黒い星座の圖の、上から下へ白くけぶつた銀河帶のやうなところを指しながら、みんなに問ひをかけました。  カムパネルラが手をあげました。それから四五人手をあげました。ジヨバンニも手をあげようとして、急いでそのままやめました。  たしかにあれがみんな星だと、いつか雜誌で讀んだのでしたが、このごろはジヨバンニはまるで毎日教室でもねむく、本を讀むひまも讀む本もないので、なんだかどんなこともよくわからないといふ氣持がするのでした。  ところが先生は早くもそれを見附けたのでした。 「ジヨバンニさん。あなたはわかつてゐるのでせう。」  ジヨバンニは勢よく立ちあがりましたが、立つて見るともうはつきりとそれを答へることができないのでした。ザネリが前の席から、ふりかへつて、ジヨバンニを見てくすつとわらひました。ジヨバンニはもうどぎまぎしてまつ赤になつてしまひました。

memo