system
マリンロード

2013.11.20HTML/CSS 

マリンロード

CSS3を使ってみよう!

こんにちは、佐藤です。

寒くなって来ましたね。

 

さてさて今回はCSS3のお話です。

私が選んだ「CSS3でできちゃう事」3つご紹介します。

1.角丸背景ができる!

角丸っていうと普通は画像使いますよね。

でも、CSS3を使うと簡単に角丸作れちゃうんです。

それに加えて、角の丸さ(?)まで調整できちゃう優れもの。

素晴らしい。。。

参考サイト☆http://www.css-lecture.com/log/css3/css3-border-radius.html

 

2.グラデーションができる!

2色以上のグラデも可能です。また、方向や開始色なども設定できます。

参考サイト☆http://touch-slide.jp/column/454/

 

3.背景画像を拡大・縮小できる!

縦横比を保持して要素のサイズに合うよう拡大・縮小してくれます。

CSSは「background-size:cover;」

jsを使わなくとも背景画像を調整してくれるんです。

参考サイト☆http://www.allinthemind.biz/markup/css/background-size.html

 

しかし、対応ブラウザによってはきちんと表示できない事があります。

IE6,7はほぼ全滅ですのでご注意を。(´;ω;`)ウゥゥ

 

まだまだいっぱいCSS3はありますので、皆様もぜひ試してみてください。

 

以上、佐藤でした((・´∀`・))♪

 

PC

 

 

 

 

WEBサイト自己診断シート イメージ
ホームページ制作サービスはこちら
ページTOPへ