CSS,电脑上和手机上 不一样

html-css013

CSS,电脑上和手机上 不一样,第1张

建议你加个@media (max-width: 767px) {这里是样式代码}如下:

@media (max-width: 767px) {

.nav{display:none}

.nav{width:120pxleft:noneright:50px}

.ym8_nr1{width:90%}

}

这段代码的意思是当屏幕宽度小于767px时执行里面的css代码,你在这里调手机宽度的css就行了

手机上设置css为cm不准是由于手机分辨率低。根据查询相关信息,所谓的绝对单位(cm,mm,in,pt和pc)在CSS中的含义与其他地方相同,但前提是您的输出设备具有足够高的分辨率。在激光打印机上,1厘米应该恰好是1厘米。但是在低分辨率设备上,例如计算机屏幕,CSS并不需要这样。事实上,从一个设备到另一个设备以及从一个CSS实现到另一个设备的结果往往不同。

根据页面设计情况选择相应的参数,方法就是设计背景size参数

background-size:cover ,适用于上半部分背景图片,下半部分纯色

将背景图像等比缩放到完全覆盖容器,背景图像有可能超出容器。

background-size:contain 适用于一屏幕,缺点屏幕宽度高度不一致,会有缝隙

将背景图像等比缩放到宽度或高度与容器的宽度或高度相等,背景图像始终被包含在容器内。

background-size:100% 100%;

最简单粗暴的方法,缺点会给背景拉伸变形