HTML中的文本、清单和表格内容元素的详细说明


一、文本内容元素<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
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值