我想在我的网站上制作一个粘性标题。我正在尝试使用CSS,但是当我使用下面的CSS时,我的徽标在移动设备上查看时会缩小。
网站的网址:http://gomodemo.se/port73/
CSS
@media only screen and (max-width: 768px){
header{
position: fixed !important;
top: 0px;
}
});
我在桌面上没有任何问题,但在移动设备上,徽标会缩小。当我点击移动设备中的汉堡菜单时,徽标会缩小。不仅标识我的标题部分缩小了。请帮我解决这个问题。谢谢
答案 0 :(得分:0)
答案 1 :(得分:0)
在设置徽标样式时,请务必使用百分比而不是像素。
使用像素时,您将根据分辨率设置徽标的位置和大小 - 从不同的分辨率(因为您的移动设备可能具有更高的分辨率)使其看起来变焦。如果分辨率较高的人查看您的网站,则由于分辨率上的其他像素,您有一个未覆盖的区域。
答案 2 :(得分:0)
我建议你在百分比中使用高度值。 除非你没有其他选择,否则不要使用重要的东西。
您可以使用以下代码:
@media screen and (min-device-width: 768px) and (max-device-width: 1200px) {
.logo img {
margin-top: -10%;
max-height: 50%;
}
}