文章目录
一、文本内容元素<div>
HTML <div>
元素 (或 HTML 文档分区元素) 是一个通用型的流内容容器,在不使用CSS的情况下,其对内容或布局没有任何影响。
定义和用法
<div>
可定义文档中的分区或节(division/section)。
<div>
标签可以把文档分割为独立的、不同的部分。它可以用作严格的组织工具,并且不使用任何格式与其关联。
用法
<div>
是一个块级元素。这意味着它的内容自动地开始一个新行。实际上,换行是 <div>
固有的唯一格式表现。可以通过<div>
的 class 或 id 应用额外的样式。
不必为每一个 <div>
都加上类或 id,虽然这样做也有一定的好处。
可以对同一个 <div>
元素应用 class 或 id 属性,但是更常见的情况是只应用其中一种。这两者的主要差异是,class 用于元素组(类似的元素,或者可以理解为某一类元素),而 id 用于标识单独的唯一的元素。
如果用 id 或 class 来标记 <div>
,那么该标签的作用会变得更加有效。
支持的浏览器
注意:
<div>
中避免使用其他有关文本内容、内容分区这样的元素,因为在<div>
中使用会将其分成多个小块,而不是一个整体。
<body>
<div>
生活有一点,我不是太喜欢,
<p>
那就是他总让更懂事的人来承担糟糕的感受和结果。
</p>
<address>
独木舟
</address>
</div>
</body>
原本应该是占全部<div>
元素,结果被分成一小块了。
而其他元素各占一小块。
二、 清单(也称做列表)
1.<ul>
无序清单(也称作无序列表)
HTML <ul>
元素(或称 HTML 无序列表元素)表示一个内可含多个元素的无序列表或项目符号列表。
定义和用法
<ul>
标签定义无序列表。
浏览器支持:
<ul>
是以清单项目(list item) 为子元素
<ul>
无序清单
<li>无序列表</li>
<li>unordered list</li>
<li>以 清单项目(list item) 为子元素</li>
</ul>
其中子元素前的项目符号有三个,但并不推荐使用:
- disc
- square
- circle
分别效果:
(disc)
<ul>
无序清单
<li type="disc">无序列表</li>
<li type="disc">unordered list</li>
<li type="disc">以 清单项目(list item) 为子元素</li>
</ul>
(square)
<ul>
无序清单
<li type