引导表单检查内联不起作用
Loa*_*ron 0 html css bootstrap-4
我正在尝试使用https://getbootstrap.com/docs/4.0/components/forms/ form-check-inline而不成功，它通过将一个复选框放在另一个复选框下来呈现html：
这是我的html代码：
<h1>Crear Paciente</h1>
<hr />
<form>
<!-- #region General Data -->
<div class="form-group">
<label>Nombres y Apellidos</label>
<input type="text" class="form-control" id="namesAndSurnames" placeholder="Nombres y Apellidos">
</div>
<div class="form-group">
<label>Fecha de Nacimiento</label>
<input type="date" class="form-control" id="birthDate">
</div>
<div class="form-group">
<label>CI</label>
<input type="number" class="form-control" id="ci" placeholder="Cédula de Identidad">
</div>
<div class="form-group">
<label>Dirección</label>
<input type="text" class="form-control" id="address" placeholder="Dirección">
</div>
<div class="form-group">
<label>Email</label>
<input type="email" class="form-control" id="email" placeholder="Email">
</div>
<div class="form-group">
<label>Teléfono</label>
<input type="tel" class="form-control" id="phone" placeholder="Teléfono">
</div>
<div class="form-group">
<label>Sociedad Médica</label>
<input type="text" class="form-control" id="medicSociety" placeholder="Sociedad Médica">
</div>
<div class="form-group">
<label>Emergencia Móvil</label>
<input type="text" class="form-control" id="mobileEmergency" placeholder="Emergencia Móvil">
</div>
<div class="form-group">
<label>Ocupación</label>
<input type="text" class="form-control" id="occupation" placeholder="Ocupación">
</div>
<div class="form-group">
<label>Observaciones</label>
<input type="text" class="form-control" id="observations" placeholder="Observaciones">
</div>
<!--#endregion -->
<!-- #region Sicknesses -->
<div class="form-check form-check-inline">
<input type="checkbox" class="form-check-input" id="diabetes" value="diabetes">
<label class="form-check-label">Diabetes</label>
</div>
<div class="form-check form-check-inline">
<input type="checkbox" class="form-check-input" id="heartProblems" value="heartProblems">
<label class="form-check-label">Problemas Cardíacos</label>
</div>
<div class="form-check form-check-inline">
<input type="checkbox" class="form-check-input" id="hypertension" value="hypertension">
<label class="form-check-label">Hipertensión</label>
</div>
<div class="form-check form-check-inline">
<input type="checkbox" class="form-check-input" id="metallicProsthesis" value="metallicProsthesis">
<label class="form-check-label">Prótesis Metálicas</label>
</div>
<div class="form-check form-check-inline">
<input type="checkbox" class="form-check-input" id="pacemaker" value="pacemaker">
<label class="form-check-label">Marcapasos</label>
</div>
<div class="form-check form-check-inline">
<input type="checkbox" class="form-check-input" id="pregnancies" value="pregnancies">
<label class="form-check-label">Embarazos</label>
</div>
<div class="form-check form-check-inline">
<input type="checkbox" class="form-check-input" id="surgeries" value="surgeries">
<label class="form-check-label">Cirugías</label>
</div>
<div class="form-check form-check-inline">
<input type="checkbox" class="form-check-input" id="allergies" value="allergies">
<label class="form-check-label">Alergias</label>
</div>
<div class="form-group">
<label>Descripción de Alergias</label>
<input type="text" class="form-control" id="allergiesDescription" placeholder="Describir las Alergias del Paciente">
</div>
<!--#endregion -->
<button type="submit" class="btn btn-primary pull-right">Guardar</button>
</form>
我也在使用电子，尽管我怀疑这与电子有关（不应该）。所有以前的html代码都使用w3-include-html呈现，尽管它也不影响任何一个……这是正文html：
<body>
<div class="container">
<div id="includerDiv" w3-include-html="mainWindow.html"></div>
<script>w3.includeHTML();</script>
<hr />
<footer>
<p>
©
<script>document.write(new Date().getFullYear())</script> - Beaspa - Versión 1.0
</p>
</footer>
</div>
</body>
替换form-check form-check-inline为checkbox-inline，它将像内联一样工作：
<div class="checkbox-inline">
<input type="checkbox" class="form-check-input" id="diabetes" value="diabetes">
<label class="form-check-label">Diabetes</label>
</div>
<div class="checkbox-inline">
<input type="checkbox" class="form-check-input" id="heartProblems" value="heartProblems">
<label class="form-check-label">Problemas Cardíacos</label>
</div>
<div class="checkbox-inline">
<input type="checkbox" class="form-check-input" id="hypertension" value="hypertension">
<label class="form-check-label">Hipertensión</label>
</div>
<div class="checkbox-inline">
<input type="checkbox" class="form-check-input" id="metallicProsthesis" value="metallicProsthesis">
<label class="form-check-label">Prótesis Metálicas</label>
</div>
<div class="checkbox-inline">
<input type="checkbox" class="form-check-input" id="pacemaker" value="pacemaker">
<label class="form-check-label">Marcapasos</label>
</div>
<div class="checkbox-inline">
<input type="checkbox" class="form-check-input" id="pregnancies" value="pregnancies">
<label class="form-check-label">Embarazos</label>
</div>
<div class="checkbox-inline">
<input type="checkbox" class="form-check-input" id="surgeries" value="surgeries">
<label class="form-check-label">Cirugías</label>
</div>
<div class="checkbox-inline">
<input type="checkbox" class="form-check-input" id="allergies" value="allergies">
<label class="form-check-label">Alergias</label>
</div>