不用js,css也可以。
// 大螢幕,當螢幕寬度等於641px或者大於641px的時候
@media screen and (max-width: 641px) {
.container { width: 640px; margin: 0 auto; }
}
// 小螢幕,當螢幕最大寬度600px或者小於600px的時候
@media screen and (max-width: 640px) {
.container { width: auto; margin: 0; }
js的話,判斷一下window.innerWidth
var ww = window.innerWidth
if (ww
document.documentElement.setAttribute("class", "container-mobile")
} else {
document.documentElement.setAttribute("class", "container")
.container-mobile { width: auto; margin: 0; }
不用js,css也可以。
// 大螢幕,當螢幕寬度等於641px或者大於641px的時候
@media screen and (max-width: 641px) {
.container { width: 640px; margin: 0 auto; }
}
// 小螢幕,當螢幕最大寬度600px或者小於600px的時候
@media screen and (max-width: 640px) {
.container { width: auto; margin: 0; }
}
js的話,判斷一下window.innerWidth
var ww = window.innerWidth
if (ww
document.documentElement.setAttribute("class", "container-mobile")
} else {
document.documentElement.setAttribute("class", "container")
}
.container { width: 640px; margin: 0 auto; }
.container-mobile { width: auto; margin: 0; }