点击(此处)折叠或打开

<html>
<head>
<title>怎样使图片半透明丨石家庄车库门-石家庄展柜</title>
<meta content=\"text/html; charset=gb2312\" http-equiv=\"Content-Type\">
<style type=\"TEXT/CSS\">.cool {
BORDER-BOTTOM-WIDTH: 1px; BORDER-LEFT-WIDTH: 1px; BORDER-RIGHT-WIDTH: 1px; BORDER-TOP-WIDTH: 1px; CURSOR: hand; FONT-SIZE: 9pt
}
A {
TEXT-DECORATION: none
}
A:hover {
COLOR: #ff9900; TEXT-DECORATION: underline
}
TD {
FONT-SIZE: 9pt; LINE-HEIGHT: 13pt
}
TH {
FONT-SIZE: 9pt; LINE-HEIGHT: 13pt
}
BODY {
FONT-SIZE: 9pt; LINE-HEIGHT: 13pt
}
.tm {
FILTER: Alpha(Opacity=50)
}
.style2 {
FILTER: Alpha(Style=2)
}
.style1 {
FILTER: Alpha( Style=1, StartX=30, StartY=20,FinishX=15,FinishY=5)
}
</style>
<meta content=\"Microsoft FrontPage 6.0\" name=\"GENERATOR\">
</head>
<body bgColor=\"#ffffff\" link=\"#6699FF\" vLink=\"#6699CC\">
<center>
<table cellPadding=\"0\" cellSpacing=\"0\" width=\"484\">
<TBODY>
<tr vAlign=\"top\">
<td width=\"490\"><table cellPadding=\"0\" cellSpacing=\"0\" width=\"100%\">
<TBODY>
<tr>
<td vAlign=\"top\" width=\"397\">
<div
id=\"Layer1\" style=\"HEIGHT: 31px; LEFT: 138px; POSITION: absolute; TOP: 166px; WIDTH: 14px\">
<dd>
<img class=\"tm\" src=\"/images/changshi.ico\" width=\"32\" height=\"32\"></dd>
</div>
<script>
//这是使图层移动的函数
function move_layer()
{
Layer1.style.left=event.clientX+document.body.scrollLeft+10;
Layer1.style.top=event.clientY+document.body.scrollTop+10;
}
//这里的意思是，如果鼠标移动时就调用\"move_layer\"函数
document.onmousemove =move_layer;
</script>
</td>
</tr>
</TBODY>
</table>
</td>
</tr>
<tr>
<td vAlign=\"top\" width=\"490\">
<table cellPadding=\"0\" cellSpacing=\"0\" width=\"392\">
<TBODY>
<tr>
<td height=\"1\" vAlign=\"top\" width=\"3\"></td>
<td vAlign=\"top\" width=\"11\"></td>
<td height=\"22\" vAlign=\"top\" width=\"487\">
<table cellPadding=\"0\" cellSpacing=\"0\" class=\"hs\"
width=\"487\" height=\"269\">
<TBODY>
<tr align=\"middle\">
<td height=\"33\" colspan=\"3\" width=\"485\" valign=\"bottom\">
<p align=\"center\"><font size=\"2\" color=\"#FF0000\">怎样使图片半透明</font></p>
</td>
</tr>
<tr vAlign=\"top\">
<td width=\"185\" height=\"236\"><span style=\"font-size:10.5pt;
font-family:宋体;mso-ascii-font-family:\"Times New Roman\";\"Times New Roman\";mso-bidi-font-family:\"Times New Roman\";
\"> </span>
<span style=\"
font-family:宋体;mso-ascii-font-family:\"Times New Roman\";\"Times New Roman\";mso-bidi-font-family:\"Times New Roman\";
\">
经常在网上见到半透明的图片吧！图片不会遮挡住后面的文字，想知道怎么做的吗，很简单，</span><span style=\"font-family:宋体;\"Times New Roman\";mso-bidi-font-family:\"Times New Roman\";
\">这就是<span lang=\"EN-US\">CSS样式表单滤镜Alpha的<span style=\"color:black\">强大功能，</span>仅用短短的几行代码，就实现了以上效果，</span></span>你应该看到了一个半透明的图片吧！ <br>
用的图片是这张：<img align=\"top\" height=\"32\" src=\"/images/m04.jpg\" width=\"32\"><br>
为了更加清楚的看到效果。我们让图片跟随鼠标! 产生半透明效果的方法用了CSS样式！<br>
</td>
<td width=\"68\" height=\"236\">
</td>
<td width=\"228\" height=\"236\">第一种效果:<font color=\"#006666\">Alpha( Style=1, StartX=30, StartY=20, FinishX=15,
FinishY=5)</font><br>
<img alt=\"返回首页!\" border=\"0\" class=\"style1\" height=\"69\" src=\"/images/M04.JPG\"
width=\"206\"><br>
<br>
第二种的效果.<font color=\"#006666\">Alpha(Style=2)</font> <br>
<img alt=\"返回首页!\" border=\"0\" class=\"style2\" height=\"65\" src=\"/images/M01.JPG\"
width=\"206\"><br>
其他参数自己试试吧！<br>
<br>
</td>
</tr>
</TBODY>
</table>
</td>
</tr>
</TBODY>
</table>
</td>
</tr>
<tr align=\"right\">
<td width=\"490\"></td>
</tr>
</table>
<p align=\"center\">　</p>
</center>
</body>
</html>
<br><br><hr>

ITPub博客

怎样使图片半透明

最新文章