关于css百分比的一个问题求助
本文介绍了关于css百分比的一个问题求助的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
*{margin:0;padding: 0;}
.img{border:none;
outline: none;}
</style>
</head>
<body>
<div style="width: 1920px;height: 6000px;overflow: hidden;">
<div class="img img1">
<a href="javascript:;">
<img src="//gdp.alicdn.com/imgextra/i3/2005956389/TB2dRiSnpXXXXbSXXXXXXXXXXXX_!!2005956389.gif" alt="" width="1920"height="767"/>
</a>
</div>
<div class="img img2">
<a href="javascript:;">
<img src="//gdp.alicdn.com/imgextra/i4/2005956389/TB2SWaWnpXXXXaUXXXXXXXXXXXX_!!2005956389.gif" alt="" width="1920"height="767"/>
</a>
</div>
<div class="img img3">
<a href="javascript:;">
<img src="//gdp.alicdn.com/imgextra/i1/2005956389/TB2iUKSnpXXXXbzXXXXXXXXXXXX_!!2005956389.gif" alt="" width="1920"height="767"/>
</a>
</div>
<div class="img img4">
<a href="javascript:;">
<img src="//gdp.alicdn.com/imgextra/i4/2005956389/TB2YvulnpXXXXXaXFXXXXXXXXXX_!!2005956389.gif" alt="" width="1920"height="767"/>
</a>
</div>
<div class="img img5">
<a href="javascript:;">
<img src="//gdp.alicdn.com/imgextra/i1/2005956389/TB2PLGjnpXXXXXTXFXXXXXXXXXX_!!2005956389.gif" alt="" width="1920"height="767"/>
</a>
</div>
<div class="img img6">
<a href="javascript:;">
<img src="//gdp.alicdn.com/imgextra/i4/2005956389/TB2jeWYnpXXXXaHXXXXXXXXXXXX_!!2005956389.gif" alt="" width="1920"height="767"/>
</a>
</div>
<div class="img img7">
<a href="javascript:;">
<img src="//gdp.alicdn.com/imgextra/i1/2005956389/TB20gS3npXXXXacXXXXXXXXXXXX_!!2005956389.gif" alt="" width="1920"height="767"/>
</a>
</div>
<div class="img img8">
<a href="javascript:;">
<img src="//gdp.alicdn.com/imgextra/i4/2005956389/TB234uZnpXXXXaPXXXXXXXXXXXX_!!2005956389.gif" alt="" width="1920"height="767"/>
</a>
</div>
</div>
</body>
</html>
这是我的代码 在我的屏幕上是溢出的 但是我如果想自适应的话 放到淘宝里 会有一个 写百分比的div他的父元素会有一个固定的宽度限制 我看别人的淘宝的 都可以自适应 我就做不出来 请问该怎么做? 希望大家能明白我的意思
解决方案
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
img,div {max-width:100%;}
*{margin:0;padding: 0;}
.img{border:none;
outline: none;}
</style>
</head>
<body>
<div style="width: 1920px;">
<div class="img img1">
<a href="javascript:;">
<img src="//gdp.alicdn.com/imgextra/i3/2005956389/TB2dRiSnpXXXXbSXXXXXXXXXXXX_!!2005956389.gif" alt="" width="1920" height="767"/>
</a>
</div>
<div class="img img2">
<a href="javascript:;">
<img src="//gdp.alicdn.com/imgextra/i4/2005956389/TB2SWaWnpXXXXaUXXXXXXXXXXXX_!!2005956389.gif" alt="" width="1920" height="767"/>
</a>
</div>
<div class="img img3">
<a href="javascript:;">
<img src="//gdp.alicdn.com/imgextra/i1/2005956389/TB2iUKSnpXXXXbzXXXXXXXXXXXX_!!2005956389.gif" alt="" width="1920" height="767"/>
</a>
</div>
<div class="img img4">
<a href="javascript:;">
<img src="//gdp.alicdn.com/imgextra/i4/2005956389/TB2YvulnpXXXXXaXFXXXXXXXXXX_!!2005956389.gif" alt="" width="1920" height="767"/>
</a>
</div>
<div class="img img5">
<a href="javascript:;">
<img src="//gdp.alicdn.com/imgextra/i1/2005956389/TB2PLGjnpXXXXXTXFXXXXXXXXXX_!!2005956389.gif" alt="" width="1920" height="767"/>
</a>
</div>
<div class="img img6">
<a href="javascript:;">
<img src="//gdp.alicdn.com/imgextra/i4/2005956389/TB2jeWYnpXXXXaHXXXXXXXXXXXX_!!2005956389.gif" alt="" width="1920" height="767"/>
</a>
</div>
<div class="img img7">
<a href="javascript:;">
<img src="//gdp.alicdn.com/imgextra/i1/2005956389/TB20gS3npXXXXacXXXXXXXXXXXX_!!2005956389.gif" alt="" width="1920" height="767"/>
</a>
</div>
<div class="img img8">
<a href="javascript:;">
<img src="//gdp.alicdn.com/imgextra/i4/2005956389/TB234uZnpXXXXaPXXXXXXXXXXXX_!!2005956389.gif" alt="" width="1920" height="767"/>
</a>
</div>
</div>
</body>
</html>
试试
这篇关于关于css百分比的一个问题求助的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文