繁體中文当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > css为图片设置背景图片
- CSS样式表
- DIV+CSS网页制作这种叫法不准确
- CSS初学者入门:使用table布局网页不明智
- xHTML+CSS网页制作和搜索引擎优化SEO的关系
- CSS控制页面样式的4种方式和优先级问题
- CSS入门教程:CSS选择器
- CSS基础入门教程:CSS选择器规范化命名
- CSS基础入门教程:理解盒子模型
- CSS教程:2个重要概念块状元素和内联元素
- CSS实例:盒模型、块状元素与内联元素、CSS选择器
- css实例教程:理解Float的含义
- CSS实例教程:清除浮动Clear
- CSS网页制作教程:制作网页导航条
- CSS实例教程:浮动(float)页面布局
- CSS实例教程:定位(position)布局页面
- CSS实例教程:用position来布局页面
- CSS实例教程:CSS Hack
- CSS制作网页技巧:单图片按钮实例
- CSS网页制作入门实例:首行缩进两个文字
- 2天掌握DIV+CSS网页制作技术
- CSS网页定位教程:详细学习定位知识
CSS样式表 中的 css为图片设置背景图片
出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-10-12 浏览: 272 ::
收藏到网摘: n/a
为图片设置背景图片，是一个非常搞的实例。这句话或许就感觉有点好玩。我们为以IMG标签引入页面的图片设置背景图片。 CSS的功能是非常强大的，对于元素的表现以及页面的布局，都提供了非常强大的功能，这主要在于我们灵活的运行，在这方面提供了丰富且富含价值的各种教程与信息。对于图片的使用，其实更多的是在内容层。根据WEB标准的思路，表现层的图片，已经都被分离到CSS中去了。只有作为内容的图片才能以IMG标签插入在页面中，这也是一直强调的语义。
为图片设置背景图片，是一个非常搞的实例。这句话或许就感觉有点好玩。我们为以IMG标签引入页面的图片设置背景图片。这样的应用范围或许并不大，但可以锻炼你的思路，让你理解元素在HTML与CSS中的意义与灵活性。
我们看下面的代码。
<img scr="jb51.jpg" />
这是以img标签将图片引入到页面中。
我们再编写CSS。
img {
display:block;
width:443px;
height:60px;
padding-bottom:10px;
background:url(jb52bg.jpg) no-repeat left bottom;
}
将img元素转换为块元素，设置宽和高。设置下侧的内边距为10px。为背景图片显示出来预留一定的空间。最后定义背景图片即可。
由此小实例，可以看出CSS的灵活和强大的功能。
评论 (0) All
