pc端适配移动端
Posted yh6652210
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了pc端适配移动端相关的知识，希望对你有一定的参考价值。
废话不多说了，心里难受
在html页面头部加上
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
content属性值 :
width:可视区域的宽度，值可为数字或关键词device-width
height:同width
intial-scale:页面首次被显示是可视区域的缩放级别，取值1.0则页面按实际尺寸显示，无任何缩放
maximum-scale=1.0, minimum-scale=1.0;可视区域的缩放级别，
maximum-scale用户可将页面放大的程序，1.0将禁止用户放大到实际尺寸之上。
user-scalable:是否可对页面进行缩放，no 禁止缩放
注意有时候可能会出现白边。切记initial-scale=1，只能是1，不能修改别的。
字体大小适配用响应式（媒体查询）
比如：
.Con_Cones{
color:#FFF;
font-size:5vh;
width:100%;
text-align: center;
padding-top:20vh;
font-weight: bolder;
}
@media screen and (max-width: 600px) {
.Con_Cone{
font-size:4vh
}
.Con_Cones{
font-size:3.5vh
}
}
简单明了
这说明一下用的vh进行适配的
呼呼呼，
以上是关于pc端适配移动端的主要内容，如果未能解决你的问题，请参考以下文章