MENU

簡単なCSS3の実装1(BGMは冷たい雨)

簡単なCSS3の実装を試してみる。

シンプルですが、今までは画像を用意しないとできなかった事が、
画像がなくても(コーディングのみで)表現できるようになりました。

■文字に影をつけてみる。

愉以

■ボックスを作り影をつけてみる。

ボックス

■ボックスの中に影をつける。

ボックス

■上記3つを組み合わせる。

ボックス

これは何が良いかというと、
画像だとファイルサイズにより読み込みが遅かったりするのですが、
画像ではなく、文字情報(?)で表現するので、
例えばスマートフォンなどで表示が速くなる!
のです。

これらを使う注意点として、
パソコンのブラウザ(IEやChromeやFirefox)によっては、
対応していないものもあるので、
さらにいくつかの記述をして、表示させるそうです。
「ベンダープレフィックス」という、
それぞれのブラウザに用意された記述を追加します。
対応しているかどうかの判断は、caniuse.comというサイトで確認出来ます。
https://caniuse.com/

さて、今日のBGMは、BONNIE PINK「冷たい雨」です。
かっこいいなぁ。このPVの雰囲気好きです。
背景の文字のフォントが少し可愛い雰囲気で、
かっこいい冷たい感じの曲をマイルドにしてる気がします。

愉以

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

ミュージシャン、作詞家、Webデザイナー。

長所:人見知りしないので、気になる人にはどんどん話しかけていくことができること。好奇心旺盛。人を信じやすい。

短所:興味をもったらどんどん手を広げてしまうので中途半端である。
自分に甘いこと。おせっかい。人を信じやすい。

コメント

コメントする

目次
閉じる