我正在嘗試將一到兩個表單元素與表單的其余部分對齊，但在嘗試執行此操作時遇到問題。我得到下面的輸出
但我想得到下面的輸出（“Genel a??klamalar”部分正在進行中）
我怎么能做到呢？我嘗試通過下面的 HTML 來完成它，但奇怪的是，它不起作用。（另外，我正在使用 Angular）
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous">
<div class="container mt-5">
<div class="row">
<div class="col-xs-2">
<strong><div class="text-danger">Makam Olur Tarihi</div></strong>
</div>
<div class="col-lg-4">
<input type="date" name="prmMakamOlurTarihi" class="form-control m-input" #searchDate>
</div>
<div class="col-xs-3">
<strong><div class="text-danger">Rapor Tarihi</div></strong>
</div>
<div class="col-lg-3">
<input type="date" name="prmRaporTarihi" class="form-control m-input" #searchDate>
</div>
</div>
<div class="row">
<div class="col-lg-6">
<div class="col-xs-4">
<label style="text-align: left;"><strong>Genel A??klamalar</strong></label>
</div>
<div class="col-lg-8">
<textarea name="textarea" maxlength="500" class="form-control m-input"></textarea>
</div>
</div>
<div class="col-lg-6">
<div class="row">
<div class="col-xs-6">
<strong>Raporu Düzenleyen Ki?i</strong>
</div>
<div class="col-lg-6">
<input name="prmRaporuDuzenleyenKisi" class="form-control m-input" maxlength="20" />
</div>
</div>
<div class="row">
<div class="col-xs-6">
<strong>Raporu Düzenleyen Ki?inin ünvan?</strong>
</div>
<div class="col-lg-6">
<input name="prmRaporuDuzenleyenKisininUnvani" maxlength="20" class="form-control m-input" />
</div>
</div>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-A3rJD856KowSb7dwlZdYEkO39Gagi7vIsF0jrRAoQmDKKtQBHUuLZ9AsSv4jD4Xa" crossorigin="anonymous"></script>uj5u.com熱心網友回復：
也許這個解決方案對你有用......
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA 058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<title>Hello, world!</title>
</head>
<body>
<div class="container mt-5">
<div class="row">
<div class="col-lg-2">
<strong>
<div class="text-danger">Makam Olur Tarihi</div>
</strong>
</div>
<div class="col-lg-4">
<input type="date" name="prmMakamOlurTarihi" class="form-control m-input" #searchDate>
</div>
<div class="col-lg-2">
<strong>
<div class="text-danger">Rapor Tarihi</div>
</strong>
</div>
<div class="col-lg-4">
<input type="date" name="prmRaporTarihi" class="form-control m-input" #searchDate>
</div>
</div>
<div class="row">
<div class="col-lg-2">
<label style="text-align: left;"><strong>Genel A??klamalar</strong></label>
</div>
<div class="col-lg-4">
<textarea name="textarea" maxlength="500" class="form-control m-input"></textarea>
</div>
<div class="col-lg-6">
<div class="row">
<div class="col-lg-6">
<strong>Raporu Düzenleyen Ki?i</strong>
</div>
<div class="col-lg-6">
<input name="prmRaporuDuzenleyenKisi" class="form-control m-input" maxlength="20" />
</div>
</div>
<div class="row">
<div class="col-lg-6">
<strong>Raporu Düzenleyen Ki?inin ünvan?</strong>
</div>
<div class="col-lg-6">
<input name="prmRaporuDuzenleyenKisininUnvani" maxlength="20" class="form-control m-input" />
</div>
</div>
</div>
</div>
</div>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-ApNbgh9B Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5 76PVCmYl" crossorigin="anonymous"></script>
</body>
</html>轉載請註明出處，本文鏈接：https://www.uj5u.com/net/507475.html