ydzf.net
当前位置:首页 >> Css图片超出部分隐藏 >>

Css图片超出部分隐藏

你给图片外面加个div,然后在css中加上overflow:hide; width:500px; 这样的话图片如果大于500就隐藏了

#component设置固定的宽高;放图片的div #component 设置overflow:hidden;

<html><head></head><body><div id="test" style="width:100px; height:140px; overflow:hidden; text-align:right"><img src=" http://cache.soso.com/wenwen/i/w_logo.png" style="float:right; margin-left:-90px;" /></div> </body></html>

用JS实现应该可以,你可以试一下当图片完全超出了外层DIV的边框,就让JS重新对图片定位position:;

像你这么说,貌似只有用js来判断了,首先给图片上下左右居中,给父级元素设置overflow:hidden; 然后用过js来获取当前图片的宽高,如果宽度大于高度,那么就高度为100%,宽度自适应,反之宽度100%,高度自适应;

把图片作为div的背景图片是最容易实现你所要的效果的方式:<div style="width:400px; height:400px; background:url(图片url写在这) no-repeat center / cover"></div>如果一定要用img标签那就要css和js结合才能实现了:<div style="position:

div 的css加 overflow:hidden;

用JS控制图片的位置,具体有点复杂,搜索一下“javascript拖拽”方面的教程

css如下:#nav{background:url(beijing.jpg) no-repeat center 0;}PS:关键是后面的“center 0”

左边和右边外补都是AUTO,宽度又是%,所以没办法隐藏吧!

网站首页 | 网站地图
All rights reserved Powered by www.ydzf.net
copyright ©right 2010-2021。
内容来自网络,如有侵犯请联系客服。zhit325@qq.com