首页 > 解决方案 > 响应式网站,将正文设置为设备宽度

问题描述

在此处输入图像描述

我希望页面的正文具有响应性,以便用户在移动网站上轻松阅读。但是当我使用这行代码时。我得到这个烂摊子。有什么建议么?

<meta name="viewport" content="width=device-width">

提前致谢!

标签: htmlcss

解决方案


    <!-- Try in this way it may help You --->

    <!DOCTYPE html>
    <html>
    <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
    body {
      background-color: yellow;
    }

    @media only screen and (max-width: 600px) {
      body {
        background-color: lightblue;
      }
    }
    </style>
    </head>

推荐阅读