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

想做一个缩略图 但全图缩图又太小了 
就缩到一个合适的大小 用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裁掉

正解

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/3091914.html

(0)
上一篇 2025年3月28日 13:23:02
下一篇 2025年3月28日 13:23:11

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • PHP处理bmp格式图片的步骤

    白天qa提出项目上传图片有问题,具体为:上传成功,预览失败。我去了之后,又上传了几张其他的图片可以上传,然后仔细问了下他上传的是哪张图片,看了后使用getimagesize函数打印了下。本文主要和大家介绍了php处理bmp格式图片的方法,结…

    编程技术 2025年4月4日
    100
  • vscode如何缩小界面尺寸

    解决方法: Ctrl+ k\Ctrl +s 进入快捷键设置。搜索  缩小  然后会出现缩小的快捷键 按键缩小即可。   如果发现快捷键无效,双击编辑,自定义快捷键即可。 相关文章教程推荐:vscode教程 以上就是vscode如何缩小界面尺…

    2025年4月2日
    100
  • Vue实现图片懒加载的最佳实践

    随着互联网技术的不断发展,网页速度逐渐成为影响用户体验的一项关键指标。为提高网页加载速度,我们通常会考虑使用图片懒加载。图片懒加载就是在页面滚动到某个位置时,再去加载图片,这样可以避免一次性加载大量图片导致页面加载速度过慢的问题。 本文将介…

    编程技术 2025年4月1日
    100
  • PS为图片增加矢量马赛克

    最终的效果图:

    2025年4月1日
    100
  • Photoshop合成合成制作逼真鸭梨人像效果

    这节教程将告诉大家怎么在Photoshop中如何合成鸭梨人效果,整体的效果图处理的细节很不漂亮的说,喜欢的朋友一起来学习吧。先看看效果图打开图片。然后,你需要找到合适的人脸图片,把它放在水果。您可以使用我的图片,或随意使用自己的。好了,打开…

    2025年4月1日 编程技术
    100
  • PHOTOSHOP教你从一张图片开始自制笔刷

    虽然网络上有很多免费的笔刷可供下载,但却需要花费大量的时间搜索和下载,其实你只需要一张足够分辨率的图片就可以自己制作笔刷。  从一张照片开始  首先我们需要一张高分辨率的照片,最好是某个纹理照片,因为对笔刷来说,肯定是纹理照片要好过风景或人…

    2025年4月1日 编程技术
    100
  • Photoshop利用通道快速从图片中抠出火焰

    PS抠图的相关教程相信大家已经看了很多了吧,今天小编接着来给大家讲解关于Photoshop利用通道快速从图片中抠出火焰的教程,下面我们一起来看看具体内容首先来看看PS处理前后的对比效果图:原图:效果图: 具体步骤如下:步骤一、首先利用PS软…

    2025年4月1日 编程技术
    100
  • Photoshop为GIF动画制作简单的图片轮番展示

    最终效果 1、在ps中打开相同大小的三幅图片,为使图片不错位,图片大小要一致,也可以在打开后修改大小。  2、把图片拖入到统一文件夹内。 3、双击解锁背景层,按ctrl + j 复制一层。 4、选择菜单:图像 > 画布大小,打开画布大…

    2025年4月1日 编程技术
    100
  • Photoshop 图片添加隐形水印的简单方法

    Photoshop简单给图片添加隐形水印原图:   效果图:(按ctrl+a可以看到效果)   教程:

    2025年4月1日
    100
  • photoshop 让图片如丝带飘起来

    1.在ps中新建一个文档,然后利用钢笔工具描出发图所示的路径.( 呵呵,这步只能靠自已的经验了.) 2.打开三幅图,然后把它们结合在一起. 3.把图像的不透度改为40%-50%,这样就可以看到下层的路径.编缉> 变换>变形.这样…

    2025年4月1日 编程技术
    100

发表回复

登录后才能评论