Home  >  Article  >  Web Front-end  >  图片缩小和图片定位_html/css_WEB-ITnose

图片缩小和图片定位_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 12:03:411704browse

想做一个缩略图 但全图缩图又太小了 
就缩到一个合适的大小 用overflow剪出显示大小的 
但图片的定位是从左边开始的  图片中的一些信息也剪掉了
请前辈指点

.post{float: left;width: 210px;height: 150px;overflow:hidden;background-color: #fff;margin: 10px 0px 0px 10px;}.post img{max-width: 300px;max-height: 167px;}

效果如下


回复讨论(解决方案)

用于裁剪的div设置相对定位 position:relative;
然后 缩小后的图片设置绝对定位,那么你就可以通过控制定位的left或者top来显示你想要的区域,多出的区域即被div裁掉

用于裁剪的div设置相对定位 position:relative;
然后 缩小后的图片设置绝对定位,那么你就可以通过控制定位的left或者top来显示你想要的区域,多出的区域即被div裁掉


正解


用于裁剪的div设置相对定位 position:relative;
然后 缩小后的图片设置绝对定位,那么你就可以通过控制定位的left或者top来显示你想要的区域,多出的区域即被div裁掉


正解
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn