透明PNG スターハック

参照「講師日和
参照「CSS工房 きくちゃん」
参照「CSS Hack Lab


例えば「h1」を透過PNG画像にして背景に重ねる場合


お化けみたい・・・笑

《html》

<body>

<div id="container">

<div id="header">

<h1><img src="images/dollcolection_chuush.png" width="100" height="140" ></h1>

</div>

</div>

</body>



CSS

@charset "Shift_JIS";

*{
margin: 0;
padding: 0;
}

#container {
background: url(images/PICT0107-01.jpg) no-repeat;
height:337px;
width:450px;
}

*html h1{
  width: 100px;
  height: 140px;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader
(src=images/dollcolection_chuush.png);
}
*html h1 img{
display: none;
}

#header h1 {
margin-left: 160px;
margin-top: 150px;
}

透明PNGの使われ所

(例)メナード