繁體中文当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > 可以给img元素设置背景图
- CSS样式表
- 网页设计中谨慎使用CSS sprites
- CSS教程:清除浮动方法大全
- CSS教程:伪清除浮动
- 网页布局教程:边距和绝对定位
- CSS教程:论CSS选择器的浏览器支持
- 如何在CSS中设定文本的尺寸
- CSS网页布局应该避免滥用div元素
- CSS教程:CSS定位属性
- CSS网页布局教程:层叠加的5条原则
- css字体设置(不同浏览器设置效果)
- CSS教程:15个必须阅读的CSS入门文章
- IE6下注释引起的文字溢出和浮动错位
- CSS教程:语义化标记抛弃DIV标记
- 不再使用class和id进行网页布局
- 利用CSS3定位页面元素
- CSS网页布局实例:三栏等高布局
- CSS实例:日期垂直排列的两种技巧
- css教程：font-size属性
- CSS教程:认真学习haslayout
- CSS教程:认识CSS初始化(重设浏览器的样式)
CSS样式表 中的 可以给img元素设置背景图
出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-10-12 浏览: 147 ::
收藏到网摘: n/a
惊叹于老外的发现 《CSS Background image on html image element?》，自己从没关注过，也没想过如此的问题。
实现方法很简单：设置 img 元素为块元素（display:block;），并赋一个 padding 值。
点击运行可以看到效果:
[Ctrl+A 全选 提示:你可先修改部分代码,再按运行]
[Ctrl+A 全选 提示:你可先修改部分代码,再按运行]
复制代码 代码如下:
img {
display:block; b
ackground:url('parallax.gif') no-repeat bottom left;
padding:93px 100px 75px 100px;}
根据上面的原理，举一反三，通过类似的方法，我们还可以给 img 元素设置双边：
复制代码 代码如下:
img {
display:block;
padding:1px;
background:red;
border:1px solid black;
}
评论 (0) All
