HTML <Div>标签
HTML <Div>标签
HTML <Div>标签用于
将大部分HTML元素分组在一起。
我们知道每个标签都有特定的用途，例如p标签用于指定段落，<h2>至<h6>标签用于指定标题，但<Div>标签就像一个容器单元，用于封装其他页面元素并将HTML文档分为多个部分。
Web开发人员通常使用div标签将HTML元素组合在一起，并一次将CSS样式应用于许多元素。例如:如果将一组段落元素包装到div元素中，则可以利用CSS样式的优势并将字体样式立即应用于所有段落，而不是为每个段落元素编码相同的样式。
<div style="border:1px solid pink;padding:20px;font-size:20px">
<p>欢迎使用https://www.lidihuo.com，在这里您可以获得有关最新技术的教程。</p>
<p>这是第二段。</p>
</div>
输出:
欢迎使用https://www.lidihuo.com，在这里您可以获得有关最新技术的教程。
这是第二段。
HTML div标签和span标签之间的区别
| div标签 |
span标签 |
| HTML div是一个块元素。 |
HTML span是一个行元素 |
| HTML div元素用于包装大部分元素。 |
HTML span元素用于包裹一小部分文本，图像等。 |
HTML div示例:登录表单
在此示例中，我们使用div标签创建框。框内有一个登录表单。让我们看一下CSS和HTML代码。
CSS代码:
.loginform{
padding:10px;
border:1px solid pink;
border-radius:10px;
float:right;
margin-top:10px;
}
.formheading{
background-color:#FFDB47;
color:white;
padding:4px;
text-align:center;
}
.sub{
background-color:blue;
padding: 7px 40px 7px 40px;
color:white;
font-weight:bold;
margin-left:70px;
}
HTML代码:
<div class="loginform">
<h3 class="formheading">Please Login</h3>
<form action="LoginServlet" method="post">
<table>
<tr><td>电子邮件:</td><td><input type="email" name="email"/></td></tr>
<tr><td>密码:</td><td><input type="password" name="password"/></td></tr>
<tr><td colspan="2" style="text-align:center"><input class="sub" type="submit" value="login"/></td></tr>
</table>
</form>
</div>
输出:
支持浏览器
