点击(此处)折叠或打开
-
<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>