这个问题在这里已经有答案了:
响应式网站在手机上缩小到全宽(4个答案)
引导程序在移动设备上无法正确扩展(4个答案)
昨天关门了。
我正在处理一个html页面。当我把它放在手机上时,它的缩放比例不合适。这很奇怪,因为我在浏览器中使用了f12工具,效果很好。
我查看了f12调试工具,发现了一些有趣的东西。当我选择电话时。缩放不再有效。选择手机时不缩放
另一方面。当我手动编辑宽度时,缩放就起作用了。如果我手动输入宽度,缩放就起作用`
这是这一页。我不知道发生了什么。现在是凌晨2点请帮忙
<!DOCTYPE html>
<html lang="de" xmlns:th="http://www.thymeleaf.org">
<head>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6" crossorigin="anonymous">
<meta charset="UTF-8">
<title>Schnelltest</title>
</head>
<body class="bg-light">
<div class="container">
<!--/* Workaround for bug https://youtrack.jetbrains.com/issue/IDEA-132738 -->
<!--@thymesVar id="post" type="your.package.Post"-->
<!--@thymesVar id="title" type="String"-->
<!--@thymesVar id="content" type="String"-->
<!--*/-->
<div class="py-5 text-center">
<img class="d-block mx-auto mb-4" src="../static/placeholder.png" alt="" width="72" height="57">
<h2>Schnelltestzentrum Hochzeitsgeschäft</h2>
<p class="lead">Um Wartezeiten zu verkürzen haben Sie die Möglichkeit Ihre Daten bereits im Vorfeld
festzuhalten. Nach Zustellung Ihres Testergebnisses werden Ihre persönlichen Daten von unseren Servern
gelöscht.</p>
</div>
<h4 class="mb-3">
Anmeldung Covid-19 Schnelltest
</h4>
<form th:action="@{/registerUser}" th:object="${registrationDto}" method="POST">
<div class="row">
<div class="col-md-6 col-sm-12 mb-3">
<label for="name" class="form-label">Vorname</label>
<input type="text" class="form-control" id="name" th:field="*{firstName}" aria-describedby="nameHelp"
required>
</div>
<div class="col-md-6 col-sm-12 mb-3">
<label for="surname" class="form-label">Nachname</label>
<input type="text" class="form-control" id="surname" th:field="*{surName}"
aria-describedby="surnameHelp" required>
</div>
</div>
<div class="mb-3">
<label for="email" class="form-label">E-Mail</label>
<div class="input-group has-validation">
<span class="input-group-text">@</span>
<input type="email" class="form-control" id="email" th:field="*{eMail}" required>
<div class="invalid-feedback">
Die E-Mail wird benötigt um Ihnen ihr Ergebnis zu senden.
</div>
</div>
</div>
<div class="mb-4">
<label for="birthday" class="form-label">Geburtsdatum</label>
<input type="date" class="form-control" id="birthday" th:field="*{birthDate}"
aria-describedby="birthdayHelp" required>
</div>
<hr class="mb-4">
<h4 class="mb-3">Adresse</h4>
<div class="mb-3">
<div class="row">
<div class="col-md-8 mb-3">
<label for="street" class="form-label">Straße</label>
<input type="text" class="form-control" id="street" th:field="*{street}"
aria-describedby="streetHelp" required>
</div>
<div class="col-md-4 mb-3">
<label for="housenumber" class="form-label">Hausnummer</label>
<input type="number" class="form-control" id="housenumber" th:field="*{houseNumber}"
aria-describedby="housenumberHelp" required>
</div>
</div>
</div>
<div class="mb-3">
<div class="row">
<div class="col-md-4 mb-3">
<label for="zipCode" class="form-label">Postleitzahl</label>
<input type="number" class="form-control" id="zipCode" th:field="*{zipCode}"
aria-describedby="zipCodeHelp" required>
</div>
<div class="col-md-8 mb-3">
<label for="place" class="form-label">Ort</label>
<input type="text" class="form-control" id="place" th:field="*{place}" required>
</div>
</div>
</div>
<div class="mb-3 form-check">
<input type="checkbox" class="form-check-input" id="exampleCheck1" required>
<label class="form-check-label" for="exampleCheck1">
<p>Ich habe die <a th:href="@{/dsgvo}">Datenschutzerklärung</a> zur Kenntnis genommen. Ich stimme zu, dass meine Angaben und Daten zur Beantwortung meiner Anfrage vorübergehend elektronisch erhoben und gespeichert werden.</p></label>
</div>
<button class="btn btn-primary btn-lg btn-block" type="submit">Bestätigen</button>
</form>
</div>
</div>
</body>
</html>
1条答案
按热度按时间11dmarpk1#
事实证明,阅读文档是有帮助的。我补充道
现在可以了