Html 如何显示为移动桌面？

我创建了一个div，用于在图像上放置文本

此处为代码：

你好
文本就在这里
是的，我想要
不，我不想要
手册历史
主要故事

在浏览器上预览时，按crtl/COM和shiftstrong textM，它将显示手机上的显示方式。

---

希望我能很好地回答你

在浏览器上预览网站时按ctrl/command shiftM，它将显示网站在手机上的显示方式，您也可以根据平板电脑大小调整手机的大小。 希望我回答得很好

<style type="text/css">
.wrapper{
    background-color: red;
    margin: auto;
    width: 23%;
    text-align: center;
    padding: 4px 1px;   
}

.包装纸{
背景色：红色；
保证金：自动；
宽度：23%；
文本对齐：居中；
填充物：4px1px；
}

你好
文本就在这里
是的，我想要
不，我不想要
手册历史
主要故事

---

我想你也需要检查一下媒体查询

简单，修正页边空白

你好
文本就在这里
是的，我想要
不，我不想要
手册历史
主要故事

您只需将位置更改为相对位置

你好
文本就在这里
是的，我想要
不，我不想要
手册历史
主要故事

<div class="wrapper">
<h3 style="font-size:100%;font-family:RightChalk;color:white">Helloo</h3>
<h4 style="font-size:75%;font-family:RightChalk;color:white">Text right here</h4>
<h5 style="font-size:85%;font-family:RightChalk;;color:white;">Yes, i want<br/>No, i don't</h5>
<h5 style="font-size:70%;font-family:RightChalk;color:white">MANUAL HISTORY<br/>PRINCIPAL Story</h5>
</div>