可以来段代码示例吗
时间: 2023-09-26 18:09:12 浏览: 32
当然可以,以下是一个简单的示例代码,用于将 H5 页面适配到手机端:
```
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
/* 布局适配 */
body {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
/* 字体适配 */
p {
font-size: 16px;
font-size: calc(16px + (20 - 16) * ((100vw - 320px) / (750 - 320)));
}
/* 图片适配 */
img {
max-width: 100%;
height: auto;
}
</style>
</head>
<body>
<p>Hello, World!</p>
<img src="example.jpg" alt="example image">
</body>
```
在上述示例代码中,我们通过 CSS 技术进行了布局、字体和图片的适配,同时使用了 viewport 进行设备宽度的设置,以确保页面在手机端能够正确地显示。需要注意的是,这只是一个简单的示例代码,实际上适配的方式和方法还有很多,需要根据具体情况进行调整和优化。