不出现滚动条，图片自动缩放为屏幕_html/css_WEB-ITnose

回复讨论(解决方案)

style="width:100%"就是自动适应宽度，需要注意图片外面是否还有其他对象，如果有，一般采用js计算

有几种解决办法，分别适合不同的场景。
1. 背景图片。
background-image:url();background-size:100% 100%;
这种缺点是不兼容低版本ie浏览器。
2. 绝对定位，js计算宽高。
#a{position:absolute:top:0;left:0};

function getSize() {    var winWidth = 0,        winHeight = 0;    if (window.innerWidth)        winWidth = window.innerWidth; else if ((document.body) && (document.body.clientWidth))        winWidth = document.body.clientWidth;    // 获取窗口高度     if (window.innerHeight)        winHeight = window.innerHeight; else if ((document.body) && (document.body.clientHeight))        winHeight = document.body.clientHeight;    if (document.documentElement && document.documentElement.clientHeight && document.documentElement.clientWidth) {        winHeight = document.documentElement.clientHeight;        winWidth = document.documentElement.clientWidth;    }    return {        w : winWidth,        h : winHeight    };}var size = getSize();document.getElementById('a').width = size.w + 'px'; document.getElementById('a').heigth = size.h + 'px';  

img{width:100%}

个人一般用：max-width:100%，这个样式。这个好处在于如果图片小于屏幕宽度时，不会被放大模糊，如果超出屏幕时，会自动调整为屏幕大小且不会变形。
代码如下：

     无标题文档  body,html{	margin:0px;	height:100%;}   	


      
查看更多关于不出现滚动条，图片自动缩放为屏幕_html/css_WEB-ITnose的详细内容...
        

          
声明：本文来自网络，不代表【好得很程序员自学网】立场，转载请注明出处：http://haodehen.cn/did114182