HTML&CSS基础学习笔记1.19-DIV标签1
程序员文章站
2022-04-28 14:10:44
...
div标签
这里我们要认识一下HTML里使用非常多的的一个标签:<div>。
<div>标签定义文档中的分区或节(division/section),他可以把文档分割为独立的、不同的部分。它也可以用来布局,划分网页的区域。在标签的嵌套使用上会经常使用<div>标签,让页面结构更加清晰。
具体使用是这样的:
<!DOCTYPE html>
<htmllang="en">
<head>
<metacharset="UTF-8">
<title></title>
</head>
<body>
<h1>添加一个<div>标签</h1>
<div>第一个DIV</div>
<div>第二个DIV</div>
<div>第三个DIV</div>
</body>
</html>
页面的效果也比较明了简单:
一块块的列表
网页上经常会呈现许许多多的东西,这时候我们就要给不相关的两个东西分别套上div标签,表示这是两个独立的部分。
<div>标签经常用来包在其他标签的外面,这样可以让布局更加清晰。如果你是一个爱整理的人,你会很喜欢使用<div>标签。
试着给列表标签嵌套上div标签,会是怎样的呈现呢?
<!DOCTYPE html>
<htmllang="en">
<head>
<metacharset="UTF-8">
<title></title>
</head>
<body>
<h1>给标签嵌套上<div>标签</h1>
<div>
<ul>
<li>第一个列表项</li>
<li>第二个列表项</li>
</ul>
</div>
<div>
<ol>
<li>第一个列表项</li>
<li>第二个列表项</li>
</ol>
</div>
</body>
</html>
更多学习体验,就在码芽网http://www.mayacoder.com/lesson/index
上一篇: HTML&CSS基础学习笔记1.20-DIV标签2
下一篇: 4S店售后在线预约完美解决方案
推荐阅读
-
学习笔记—HTML基础标签
-
ASP.NET基础教程学习笔记:1、架构
-
Android入门到精通|安卓/Android开发零基础系列Ⅱ【职坐标】-学习笔记(1)-- 常用控件及资源介绍
-
FishC《零基础学习python》笔记--第007、008讲、009讲:了不起的分支和循环1、2、3
-
算法学习笔记之基础dp之(0/1)背包问题
-
python 基础学习笔记(1)
-
web前端基础之HTML5语义化新标签学习笔记(8)学会用语义化标签
-
HTML&CSS基础学习笔记1.10-添加链接
-
javascript学习全过程-----js学习笔记(1)------js的基础语法
-
HTML&CSS基础学习笔记1.24-input标签的单选与多选