HTML Div标签 HTMLDiv标签|HTML5

本文概述

HTML div标签和span标签之间的区别
HTML div示例：登录表单
支持的浏览器

HTML < div> 标记用于将大部分HTML元素组合在一起。
我们知道每个标签都有特定的用途, 例如p标签用于指定段落, < h1> 至< h6> 标签用于指定标题, 但是< div> 标签就像一个容器单元, 用于封装其他页面元素并将HTML文档分为多个部分。
Web开发人员通常使用div标签将HTML元素组合在一起, 并将CSS样式一次应用于多个元素。例如：如果将一组段落元素包装到div元素中, 则可以利用CSS样式的优势并将字体样式立即应用于所有段落, 而不是为每个段落元素编码相同的样式。

< div style="border:1px solid pink; padding:20px; font-size:20px"> < p> Welcome to srcmini.com, Here you get tutorials on latest technologies.< /p> < p> This is second paragraph< /p> < /div>

立即测试
【HTML Div标签】输出：
HTML div标签和span标签之间的区别

div标签	跨日
HTML div是一个block元素。	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:red; color:white; padding:4px; text-align:center; } .sub{ background-color:blue; padding: 7px 40px 7px 40px; color:white; font-weight:bold; margin-left:70px; border-radius:5px; }

HTML代码：

< div class="loginform"> < h3 class="formheading"> Please Login< /h3> < form action="LoginServlet" method="post"> < table> < tr> < td> Email:< /td> < td> < input type="email" name="email"/> < /td> < /tr> < tr> < td> Password:< /td> < td> < input type="password" name="password"/> < /td> < /tr> < tr> < td colspan="2" style="text-align:center"> < input class="sub" type="submit" value="http://www.srcmini.com/login"/> < /td> < /tr> < /table> < /form> < /div>

立即测试
输出：
支持的浏览器