こんにちは、Sleipnir 3 for Windows 開発担当の森本です。 ←透明度付き画像です 今回は透明度のある画像を扱うときの話をしたいと思います。 近頃ハードウェアが高性能化するに従って、CSS3 では rgba( 0,0,255,0.5 ) のように色が指定できるなど、透過処理が広く使われる様になってきました。 普段、何も考えずテキトーに使用している透過処理ですが、実際どのような計算がされているのか、を解説していきます。 まず、一般的なコンピュータで画像の扱いを説明します。 コンピュータではアナログな情報は扱いづらいので、画像を細かいマス目状に区分けし、 マス目( pixel と呼びます )ごとの色を、「赤緑青」の三色の足し合わせとして表現しています。(詳細は この辺 からどうぞ) 赤緑青それぞれの明るさと、透明度を C 言語風に表現してみます。 struct pixel
![透過画像の表示の際にどんな処理がなされているのか](https://cdn-ak-scissors.b.st-hatena.com/image/square/4cd6bcd98c8e8a2a5ae1b2ffb7d8d168c9b80c31/height=288;version=1;width=512/https%3A%2F%2Fblog.fenrir-inc.com%2Fwp%2Fwp-content%2Fthemes%2Ffenrir_dev%2Fimg%2Fcommon%2Fogp_dev_engineer.png)