一、图片背景设置lbimage.css文件
@charset "utf-8";
body{
background-image: url(../images/scenics/p1.jpeg); (插入图片)
background-size: cover;
}
html,body{
margin: 0;
padding: 0;
width: 100%;
height: 100%; (屏幕尺寸调整)
}
img{
width: 850px;
height: 500x; （图片尺寸设置）
body {
background-color: #909eab;
font-family: "微软雅黑";
font-size: 18px;
line-height: 24px; （背景颜色与字体设置）
}
二、移动屏幕尺寸设置iphone.css
/*iphone6*/
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: portrait) {
html{
font-size: 30.1932px;
}
}
/*iphone6+*/
@media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (orientation: portrait) {
html{
font-size: 33.3333px;
}
}
/*Galaxy S5*/
@media only screen and (min-device-width: 360px) and (max-device-width: 640px) and (orientation: portrait) {
html{
font-size: 28.9855px;
}
}
/*iphone5*/
@media only screen and (min-device-width: 320px) and (max-device-width:568px) and (orientation: portrait) {
html{
font-size: 25.7649px;
三、HTML外部链接CSS文件
<head>
<link rel="stylesheet" type="text/css" href="css/lbimage.css" />
<link rel="stylesheet" type="text/css" href="css/iphone.css" />
</head>
原文：https://www.cnblogs.com/alision/p/11140473.html