簡単なCSS3の実装を試してみる。
シンプルですが、今までは画像を用意しないとできなかった事が、
画像がなくても(コーディングのみで)表現できるようになりました。
■文字に影をつけてみる。
愉以
■ボックスを作り影をつけてみる。
ボックス
■ボックスの中に影をつける。
ボックス
■上記3つを組み合わせる。
ボックス
これは何が良いかというと、
画像だとファイルサイズにより読み込みが遅かったりするのですが、
画像ではなく、文字情報(?)で表現するので、
例えばスマートフォンなどで表示が速くなる!
のです。
これらを使う注意点として、
パソコンのブラウザ(IEやChromeやFirefox)によっては、
対応していないものもあるので、
さらにいくつかの記述をして、表示させるそうです。
「ベンダープレフィックス」という、
それぞれのブラウザに用意された記述を追加します。
対応しているかどうかの判断は、caniuse.comというサイトで確認出来ます。
https://caniuse.com/
さて、今日のBGMは、BONNIE PINK「冷たい雨」です。
かっこいいなぁ。このPVの雰囲気好きです。
背景の文字のフォントが少し可愛い雰囲気で、
かっこいい冷たい感じの曲をマイルドにしてる気がします。
愉以
コメント