javascript - CSS能否使图片放大到窗口大小
ringa_lee
ringa_lee 2017-04-10 14:52:05
0
6
569

加了max-width:100%能够使大图片缩小到窗口大小,那么如何设置能使小图片放大到窗口大小呢。还是必须得用js来做这个事?

ringa_lee
ringa_lee

ringa_lee

모든 응답(6)
刘奇

1.图片方式

img{
    width: 100%;
    height: auto;
}

2.背景图+background-size
此处利用padding-top的百分比特性

.img{
    padding-top: 图片高度/图片宽度 * 100%;
    background-size: 100% 100%;
}
大家讲道理

可以作为其他元素的背景,然后设置background-size

Ty80

直接用 width: 100% 不行嗎?

max-width: 100%;
min-width: 100%;

等於 width: 100%

左手右手慢动作

CSS实现响应式全屏背景图

PHPzhong

background-size: cover;

小葫芦

html {
width: 100%;
height: 100%;
background: url(bg.jpg) no-repeat center center fixed;
background-size: cover;
}


参考资料:http://css-tricks.com/perfect-full-page-background-image/

최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿