Question

我有一个网站，当它出现在一个小巧的智能手机（肖像）上时，该徽标太大了，我想把它换成一个较小的图像。

我可以做到没有问题，感觉非常聪明，但是当投注者拿着手机景观它会回到大图像时，我很高兴这样但是当下注者拿着手机肖像时，更大的图像仍然存在，直到页面刷新。

我可以做些什么才能让拍手在将手机从横向转为肖像后不需要刷新页面。

我在下面附上我当前的片段。它来自.css页面。请注意我也尝试将此代码段添加到.css页面中的前几行代码中，但它并没有什么区别。图像替换仅约10kb

/ * + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - * /

/* Samsung Galaxy S2 (portrait) ----------- */
@media only screen and (max-device-width: 320px) and (orientation :     portrait) {

.phonenum {
display: none; 
}
.two-column-column1 .hide-logo {
display: none !important;
}
.two-column-column1 {
width:274px; /*width of my new small image image*/
height:74px; /*height of my new small image image*/
background: url(images/londonfabriccompany274-74.png) no-repeat;
margin:0; /* I didn't want no margin */
padding:0; /* I didn't want padding either */
}
.inner-one-columns-wrapper {
margin-top: 6px;
}
}

/* +-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+- */

感谢您的输入欢呼

Seemore Yea Baby

Answer 1

您是否尝试将横向参数添加到媒体查询并围绕该媒体查询设置相同的图像要求？

/ *三星Galaxy S2（肖像）----------- * /

@media only screen and（max-device-width：320px）and（orientation：portrait）{

/ **您的参数在这里** / }

然后：

@media only screen and（min-device-width：320px）and（max-device-height：640px）and（orientation：landscape）{

/ **你的参数在这里** /

}

从纵向到横向css Mobile需要刷新页面

1 个答案: