为了账号安全,请及时绑定邮箱和手机立即绑定

位置改变样式就变了

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
*{margin:0px; padding:0px;}
.concent{border:1px solid #0F0;padding:44px 15px 15px; width:730px;}
.book{background:url(case2/images/t_book.gif) no-repeat;background-color:#CCC;}
img{margin:12px 18px; border:1px solid #CCC;}
</style>
</head>

<body>
<div class="concent book">
<!--<ing>是行级元素所以每个标签不单独占行-->
<img src="case2/images/book1.jpg" width="80" height="80"/>
<img src="case2/images/book2.jpg" width="80" height="80"/>
<img src="case2/images/book3.jpg" width="80" height="80"/>
<img src="case2/images/book4.jpg" width="80" height="80"/>
<img src="case2/images/book5.jpg" width="80" height="80"/>
</div>
</body>
</html>
为什么#CCC;这个属性值放在content中颜色就显示不出来,而放在book中就显示出来了

正在回答

1 回答

因为.book中已经定义了background,如果放在book中,后面就是#ccc,后面的属性覆盖前面的同名属性;

如果放在content中,也是后面的属性覆盖前面的同名属性,但后面的属性是url(图片)了

0 回复 有任何疑惑可以回复我~
#1

街角疯 提问者

额,你的意思是如果我把背景颜色放在.content中那么由于盒子的3D模型,背景图片就会掩盖背景颜色!是这样理解的吗?刚又有一个问题,我的背景图片宽度是770,如果我把<div>的宽度设置为770时就会导致图片与边框有距离!为什么要把盒子的宽度设置的比图片小些呢?
2016-12-08 回复 有任何疑惑可以回复我~
#2

stone310 回复 街角疯 提问者

因为.concent上面有border和padding
2016-12-08 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
网页布局基础
  • 参与学习       214707    人
  • 解答问题       1756    个

让你精通CSS中三大定位机制,彻底掌握网页布局的相关知识

进入课程

位置改变样式就变了

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信