WEB画像について－GIF・JPEG・PNGの特徴
GIFは透明色の指定ができる GIFは画像に使われている色のうちの1色を指定して透明にすることができます。 WEB上に掲載する画像は全て輪郭が四角形ですが、 GIFの背景を透明にすることで見かけ上は四角形以外の輪郭の画像が可能となります。 尚、JPEGでは透明色の指定はできません。 GIFはアニメーションにできる アニメーションにできることもGIFの特徴の1つです。 GIFアニメはコマ画像をパラパラマンガの要領で表示させることで実現しています。 滑らかな動きを表現するのにはあまり向いていませんが、アイコンやボタン画像などにちょっとしたアクセントの動きを加えるのには最適です。 GIFアニメが他の動画形式に比べて優れているのは、 特別なプラグインを必要とせずより多くの環境で作者の意図通りに表示させることができる点です。 GIFのライセンス問題について GIFに使われているLZW圧縮の技術は、1
box-sizing－CSS3リファレンス
box-sizingプロパティは、ボックスサイズの算出方法を指定する際に使用します。 値にcontent-boxを指定すると、 widthとheightで指定する幅と高さが内容領域に対して適用されます。 幅と高さにはパディングとボーダーは含まれません。 これはCSS2.1の仕様通りの解釈で、DOCTYPEスイッチの標準モードのような表示になります。 値にborder-boxを指定すると、widthとheightで指定する幅と高さがボーダーボックスに対して適用されます。 内容領域にパディングとボーダーを含んだ範囲に対して幅と高さが適用されるため、 パディングとボーダーの分だけボックスサイズが小さくなります。 DOCTYPEスイッチの互換モードのような表示になります。 ■値 content-box パディングとボーダーを幅と高さに含めない（初期値） border-box パディングとボーダーを
transform:scale()－CSS3リファレンス
transformプロパティのscale()、scaleX()、scaleY()、scaleZ()、scale3d()は、要素を拡大、または、縮小表示する際に使用します。 ■値 scale(数値, 数値) scale()関数では、2つの数値で2D縮尺比率を指定します。 1つ目の数値はX方向、2つ目の数値はY方向の比率です。 2つ目の数値は省略することができますが、この場合には最初の値と同じになります。[sx,sy] scaleX(数値) scaleX()関数では、X方向の縮尺比率を指定します。Y方向とZ方向の比率は1となります。[sx,1,1] scaleY(数値) scaleY()関数では、Y方向の縮尺比率を指定します。X方向とZ方向の比率は1となります。[1,sy,1] scaleZ(数値) scaleZ()関数では、Z方向の縮尺比率を指定します。X方向とY方向の比率は1となります。[
box-orient－CSS3リファレンス
box-orient …… ボックス内の子要素の配置方向を指定する ※サポートされているブラウザは現在調査中です。 box-orientプロパティは、フレキシブルボックス内の子要素の配置方向を指定する際に使用します。 フレキシブルボックスとは、サイズや配置を相対的に指定できる柔軟なボックスのことです。 ブロックレベルボックスをフレキシブルボックスにするには、displayプロパティの値に box を指定します。 また、インラインボックスをフレキシブルボックスにするには、displayプロパティの値に inline-box を指定します。 例えば、<div>～</div>に display:box を指定すると、このdiv要素はフレキシブルボックスとなります。 このフレキシブルボックスの中にある<div>～</div>などの子ボックス達が水平に並んで、 あたかも全体がひとつのボックスであるか
CSS3リファレンス
背景 background-clip …… 背景の適用範囲を指定する background-origin …… 背景の基準位置を指定する background-size …… 背景画像のサイズを指定する 角丸 border-radius …… 角丸をまとめて指定する border-top-left-radius …… 左上の角丸を指定する border-top-right-radius …… 右上の角丸を指定する border-bottom-left-radius …… 左下の角丸を指定する border-bottom-right-radius …… 右下の角丸を指定する 画像ボーダー border-image …… 画像ボーダーを指定する border-image-source …… 画像ボーダーに使用する画像ファイルを指定する border-image-slice …… ボーダー画像の
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
