当我没有给img设置宽高的时候,我的herd没有设置高度,没有限制,为什么图片完全显示

来源:3-3 Float案例演示(3)

chat_c

2019-04-29 17:49:43

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title></title>

<style type="text/css">

*{margin: 0;padding: 0;}

.zhuti{width: 100%;}

.herd{

width: 100%;

background: #000000;

overflow: hidden;

zoom: 1;

}

.li1{

color: ghostwhite;

float: left;

margin-right: 20px;

font-size: 30px;

font-weight: 600;

height: 80px;

padding: 0 20px;

}

ul{

list-style: none;

}

a{

text-decoration: none;

}

.left{

float: left;

width: 200px;

height: 80px;

}

.ul1{

float: right;

}

img{

width: 200px;

height: 80px;

}

</style>

</head>

<body>

<div class="zhuti">

<div class="herd">

<div class="left">

<a href="#"><img src="http://climg.mukewang.com/58c0d2d900016ce303000100.png"></a>

</div>

<ul class="ul1">

<li class="li1">的士</li>

<li class="li1">的士</li>

<li class="li1">的士</li>

<li class="li1">的士</li>

<li class="li1">的士</li>

</ul>

</div>

</div>

</body>

</html>


写回答

2回答

好帮手慕星星

2019-04-29

你好,是因为.left盒子设置了固定高度,图片的高度大于盒子的高度,所以显示不完全:

http://img.mukewang.com/climg/5cc6d98d000147f310790731.jpg

去掉就会显示出来了,可以试一下。

0

好帮手慕星星

2019-04-29

同学你好,当父容器和图片没有宽高限制之后,图片是多大的就会显示多大。

是有什么疑问吗?建议描述清楚一些,便于准确定位问题,给你解决。

祝学习愉快!

0
hhat_c
h 你看下我的代码,当我的图片没有宽高限制后,图片是300X80的,图片的高度在herd这个背景上显示不完全,帮忙看下,谢谢
h019-04-29
共1条回复

0 学习 · 40143 问题

查看课程