如何解决如何在html设计界面中添加行?
我正在尝试设计我的界面。但是我以某种方式产生它会产生我想要的错误输出。我不知道为什么会这样。
我的界面:
我想要做的界面:
welcome.blade.php
<div class="w-100 h-100 d-flex justify-content-center align-items-center">
<div class="w-50">
<h1 class="display-2 text-white"> Task App </h1>
<h2 class="text-white pt-5"> Next Task? </h2>
<form action="{{route('task.store')}}" method="POST">
@csrf
<div class="input-group mb-3 w-100">
<input type="text" class="form-control form-control-lg" name="title" placeholder="Type here..." aria-label="Recipient's username" aria-describedby="button-addon2">
<div class="input-group-append">
<button class="btn btn-success" type="submit" id="button-addon2">Add your task</button>
<div>
<div>
</form>
<h2 class="text-white pt-2"> My Task List:</h2>
</div>
</div>
解决方法
首先,如果您的代码片段是您的实际代码,则您的HTML语法无效。某些<div>
标签未关闭。我已经解决了,一切看起来都正确。
#main-div {
background: #555;
}
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet"/>
<div class="w-100 h-100 d-flex justify-content-center align-items-center" id="main-div">
<div class="w-50">
<h1 class="display-2 text-white"> Task App </h1>
<h2 class="text-white pt-5"> Next Task? </h2>
<form action="{{ route('task.store') }}" method="POST">
<div class="input-group mb-3 w-100">
<input type="text"
class="form-control form-control-lg">
<div class="input-group-append">
<button class="btn btn-success"
type="submit">
Add your task
</button>
</div>
</div>
</form>
<h2 class="text-white pt-2"> My Task List:</h2>
</div>
</div>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。