为什么用多个div标签?

新手上路,请多包涵

前端开发时用多个div标签包围某个元素,就像下面给出的代码,为什么要这样写?只用一个div不行么?我是初学者,一直有这个疑问。

<div class="top-bar py-2 border-bottom">
    <div class="container">
        <div class="row middle-flex">
            <div class="col-xl-7 text-lg-left text-center">
                <div class="row">
                    <div class="col-xl-3 col-6 header-top_w3layouts">
                                <p class="text-da">
                                    <span></span>Parma Via, Italy
                                </p>
                    </div>
                    <div class="col-xl-3 col-6 header-top_w3layouts">
                            <p class="text-da">
                                <span class="fa fa-phone mr-2">a</span>
                                </p>
                    </div>
                <div class="col-xl-6"></div>
            </div>
        </div>

暂无

阅读 1.6k
2 个回答

用一个就行。一般来说 dom 越少渲染越快,但是有时候为了一些模块化复用,我们也能接受这种嵌套

你要看他实现了什么功能

只说 row 和 col,分别是定义了一行和每一个元素,col-xl-7 是栅格系统,在 xl 尺寸可以变为 7 宽度。你不可能行和列用一个 div 表示

至于 top-bar py-2 border-bottomcontainer 大概是可以合并的。

  1. 有时候写代码的时候考虑不周,会有冗余,很正常。不需要把别人的代码当成完美的,大家都是跑起来就行。
  2. 代码并不是越精简越好,很多时候为了可维护性,要牺牲一些性能。尤其在前端领域,因为用户电脑的计算资源通常来说是富裕的,开发效率和维护效率更重要。
  3. 初学的时候有问题很正常,有时候不用想太多,多写一写,判断力会提升不少,你也会知道哪些地方该思考,哪些地方不用考虑那么多。
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏