totorajの開発日記

僕がなんかメモる

CSS3で画面ピッタリな三角形を表示する

できたもの

GIFでどうぞ。

f:id:totorachan:20160824230357g:plain

方法

vwvhを使います。

この単位はviewportの横幅と縦幅のパーセントということになります。

ですので100vwと書くとviewportの横幅の100%ということになります。

あとはいつも通りborderを使って三角を作れば終了っす。

なんで%を使わないかって?使えないからだよ!

ソースコード

Gistにあります。

https://gist.github.com/totoraj930/6f15685b9749ad4493c296d1fc04ce11

おわりに

誰得すぎる・・・。

それにしても記事雑っ!