pc端适配移动端之背景颜色和背景图片

 翻开之前仿作的小米官网页面，打开谷歌浏览器的手机端界面，发现我之前做的界面背景颜色和背景图片会变得非常小，具体图如下：

可以看到我们无论是背景图片或者背景颜色都没有显示出来，针对这个问题先进行了思考，我的背景图片和背景颜色的宽度是设置的100%，那只能说明父元素的宽度很窄，导致子元素的宽度只能跟随于父元素的宽度。ok，我们先来看下body的宽度。

 可以看到body的宽度的减小，是导致背景图片和背景颜色变小的原因，这是因为当我们打开移动端时，body的宽度会自动变小，那么这个时候我们只需要给body添加属性min-width即可，但是因为我的内容区为1200像素，为了使切换移动端时，内容不会贴边，这里我将min-width设置宽度为1230px。即为：

body{
	min-width:1230px;
}

 
问题应该解决啦，有帮助的话就点个赞呗。