CSS层样式 图片效果

图片CSS样式
.imgborder{
  filter:shadow(color=gray,direction=90);/*使用滤镜*/
}
图片可能会阴影在内测而无法显示出来可以使用下面代码
<img src="图片地址" width="871" height="531"

style="filter:progid:DXImageTransform.Microsoft.Shadow(color='#666666',

Direction=135, Strength=32)">

.back{
   background:url(图片地址)
}

filter:Gray (黑白滤镜)
Xray 图片转为X光效果
FlipH  图片左右相反
FlipV  图片上下相反
invert 负面效果
Mask(color=参数)  遮罩效果
Glow(color=参数,Strength=参数)    图片边缘产生光晕
blur(diection=参数,Strength=参数)   模糊效果
alpha(Opacity=参数,style=参数)      将图片透明化
waver(freq=参数,lightstrength=参数,phase=参数,strength=参数) 波浪效果

 

 

图文并茂的效果
直接在<img>设置align="left"  也可以设置图片的浮动位置
float:left;   设置浮动位置
margin:0 8px 8px 0; 属性是用于在一个声明中设置四个外边距的所有属性的简

写属性。
div.img-left p{
   这里修改图旁边文字的字体以及一些显示效果
}

--------
给未下载图片增加提示

将一个提示图设置为背景
background:url(提示图地址)
background-repeat  属性设置是否及如何重复背景图像。

鼠标移动过去 图片放大效果
IE 7,8下可以的,IE6不支持 .skyimg:hover
IE6要加一个a
.skyimg{
filter:alpha(opacity=60);
width:180px;
height:auto;
}
.skyimg:hover{

filter:alpha(opacity=100);
width:220px;
height:auto;
}

.skyimg{
filter:alpha(opacity=60);
width:180px;
height:auto;
}
a:hover .skyimg{
filter:alpha(opacity=100);
width:220px;
height:auto;
}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值