美造人公司作为品牌商,也希望我们能以优质的产品回馈广大消费者,材料选择上,经达八个月的实验调试,最终也是希望以好的产品走向市场,并能得到娃友的认同,企业走得长远与否,最终也是靠品质取胜。...
使用CSS为图片添加更多趣味的5种方法
今天我们将向大家分享一些为你平淡乏味的图片添加更多趣味情调的简单技巧。使用Photoshop为每个图片添加某种样式虽然可行,但会是相当乏味且困难的长久工作。下面要介绍的CSS技巧将帮助你从痛苦中解脱出来!如果你也有自己独到的CSS技巧,希望能一同分享。
今天我们将向大家分享一些为你平淡乏味的图片添加更多趣味情调的简单技巧。使用Photoshop为每个图片添加某种样式虽然可行,但会是相当乏味且困难的长久工作。下面要介绍的CSS技巧将帮助你从痛苦中解脱出来!如果你也有自己独到的CSS技巧,希望能一同分享。
阴影效果
通过使用带有一些padding之的背景图来添加阴影效果。
HTML
CSS
img.shadow {
background: url(shadow-1000×1000.gif) no-repeat right bottom;
padding: 5px 10px 10px 5px;
}
双边框效果
这应该是目前最常见的技巧,我们通过以下方式创建说边框。
HTML
CSS
img.double-border {
border: 5px solid #ddd;
padding: 5px; /*Inner border size*/
background: #fff; /*Inner border color*/
}
图片外框效果
上有最好的讲解,这个效果是基于在上面层叠一个有透明度的图片的技术。至于IE6的PNG透明度问题,可以参考。
HTML
CSS
.frame-block {
position: relative;
display: block;
height:335px;
width: 575px;
}
.frame-block span {
background: url(frame.png) no-repeat center top;
height:335px;
width: 575px;
display: block;
position: absolute;
}
水印效果
你可以通过降低主图片的透明度来让背景图片透过来显示的方法添加水印
HTML
CSS
.transp-block {
background: #000 url(watermark.jpg) no-repeat;
width: 575px;
height: 335px;
}
img.transparent {
filter:alpha(opacity=75);
opacity:.75;
}
为图片添加说明文字
使用绝对定位和透明度的设置来添加灵活的说明。
HTML
Salone del mobile Milano, April 2008 - Peeta
CSS
.img-desc {
position: relative;
display: block;
height:335px;
width: 575px;
}
.img-desc cite {
background: #111;
filter:alpha(opacity=55);
opacity:.55;
color: #fff;
position: absolute;
bottom: 0;
left: 0;
width: 555px;
padding: 10px;
border-top: 1px solid #999;
}
原文:
翻译:
(责任编辑:admin)
- 上一篇:精选15个国外CSS框架
- 下一篇:20个让你学习并精通CSS的网站
推荐内容
-
-
很多人一提到成人用品就想到充气娃娃,或者明明看到了实体娃娃了,还一本正经的喊:哇充气娃娃,甚至有娃友还是小白时还被卖家骗过,网上部分无良商家拿充气娃娃冒充实体娃娃出售给娃友,事实上充气娃娃和实体娃娃完全是两件不同的商品。写这篇文章主要是让准...
-
手部是用来抓持工件(或工具)的部件,根据被抓持物件的形状、尺寸、重量、材料和作业要求而有多种结构形式,如夹持型、托持型和吸附型等。...
-
玻璃胶设备|分装机|装箱机-东莞格瑞机械有限公司www.dggreat.cn开通了。...
-
国联 服装 网:微信上怎么卖 衣服 ?没有客源怎么办?现在很多人都做起了微商,既不影响自己的工作又能获得额外收入。但是微信上卖衣服并不是那么好卖的?首先一点你的朋友圈可能没有那么多的好友,还有就是发多了可能会被人屏蔽,面对诸如此类的 问题 ,我...
-
【设计分享】这个栏目 是我们为木头爱好者准备的分享栏目 这里会有 来自我的木头WOODWOOD成员的设计 也会有我们平时学习、生活中看到的 有趣的好玩的有价值的 艺术设计、文学作品、展览展会等等 和木头有关的分享 希望你们在片刻闲暇中遇到喜欢的内容 当然也...