我刚刚完成了创建我的网站,但现在我发现了一个问题。我的问题是当我在电脑上查看时,我的网站看起来非常好。但是如果我从我的手机上查看它,某些图片之间的间距等等就太大了...
所以我的问题是,如何创建一些只影响移动设备和平板电脑的CSS代码呢?
有方法吗?
CSS具有名为媒体查询的功能。 来自MDN链接:
在CSS3中添加了媒体查询功能,它可以根据特定范围的输出设备自定义内容的展示方式,而无需更改内容本身。
例如:
div {
background: black;
}
@media (max-width: 1000px) {
div {
background: yellow;
}
}
1000
px会更好,以区分移动和桌面设备。 - ashleedawg#image img {
width:375px;
}
@media screen and (min-width: 1366px) {
#image img {width:375px;}
}
@media
来编写 CSS,以仅在某些屏幕分辨率上应用。 - Masoud