让html在手机端自动适应是不是要写几个版本的CSS样式呢？

如果是针对于手机使用，不必写几个版本，只需要做好行列样式的宽度在最大屏幕和最小屏幕中显示正常即可。

遇到不宽度兼容的时候需要调整样式宽度就需要让css做判断，使用不同的样式，这个时候就需要使用两种或多种样式，以下就是对于一个样式在不同屏幕下显示不同效果的样例，@media是一个选择器，括号内为条件：

@media screen and (min-width: 320px)  {
.mine_coupon_words {
float: left;
width: 50%;
}
}
@media screen and (min-width: 414px)  {
.mine_coupon_words {
float: left;
width: 50%;
margin-top:15px;
}
}
@media screen and (min-width: 800px) {
.mine_coupon_words {
float: left;
width: 50%;
margin-top:40px;
}
}
@media screen and (min-width: 1024px)  {
.mine_coupon_words {
float: left;
width: 50%;
margin-top:80px;
}
}

温馨提示：答案为网友推荐，仅供参考

当前网址：https://verywind.cn/ee/yy37yfxryeyv7jy7ve.html