热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

HTML5&Bootstrapclass="container",可以应用于body还是只有div?

如何解决《HTML5&Bootstrapclass="container",可以应用于body还是只有div?》经验,为你挑选了1个好方法。

我不断碰到这个问题,每个人都在这里:a)想要用div包装HTML5语义标签,b)想要将类选择器应用于div而不是语义标签.就好像人们害怕出于某种原因将类打到语义标签上一样.

例如,我经常被告知这是"不正确的",

    
        
...

这样的事情更可取,

   
...

在这里,第一个例子我在h2标签中有列类

    

Featured Work

但"正确"的方法是添加另一个div标签来应用该类,

    

Featured Work

我理解这可能是基于意见的,但我发现在处理HTML5时,意见实际上很重要,因为几乎每个人都有问题,没有其他方法可以在没有意见的情况下敲定细节.



1> FredTheWebGu..:

我建议坚持下去

   
...

格式.

如果您打算与许多其他开发人员或使用bootstrap模板一起工作,您将看到容器类通常嵌套类div.

由于我们讨论的是标记,因此没有正确的答案,但强烈建议遵循此约定.

    为了一致性

    为了便于更改样式和其他项目的可重用性,这甚至打开了从其他项目或引导程序模板中直接替换css样式表的大门.(我有一些令人惊讶的好结果).

但是,如果您坚持给出非div标签"container"和"col-X"标签,请保持一致.我不会推荐它,并会考虑遵循其自己的约定的任何模板作为代码质量差的指标.


推荐阅读
  • 如何在jqGrid中调整shrinkToFit以避免水平滚动条,并解决页面存在垂直滚动条时表格超出父容器的问题
    1、下图右侧为表格超出panel部分页面html代码:jggrid-class ... [详细]
  • 本文详细解析了 Yii2 框架中视图和布局的各种函数,并综述了它们在实际开发中的应用场景。通过深入探讨每个函数的功能和用法,为开发者提供了全面的参考,帮助他们在项目中更高效地利用这些工具。 ... [详细]
  • ### 优化后的摘要本学习指南旨在帮助读者全面掌握 Bootstrap 前端框架的核心知识点与实战技巧。内容涵盖基础入门、核心功能和高级应用。第一章通过一个简单的“Hello World”示例,介绍 Bootstrap 的基本用法和快速上手方法。第二章深入探讨 Bootstrap 与 JSP 集成的细节,揭示两者结合的优势和应用场景。第三章则进一步讲解 Bootstrap 的高级特性,如响应式设计和组件定制,为开发者提供全方位的技术支持。 ... [详细]
  • Web开发框架概览:Java与JavaScript技术及框架综述
    Web开发涉及服务器端和客户端的协同工作。在服务器端,Java是一种优秀的编程语言,适用于构建各种功能模块,如通过Servlet实现特定服务。客户端则主要依赖HTML进行内容展示,同时借助JavaScript增强交互性和动态效果。此外,现代Web开发还广泛使用各种框架和库,如Spring Boot、React和Vue.js,以提高开发效率和应用性能。 ... [详细]
  • CSS3 @font-face 字体应用技术解析与实践
    在Web前端开发中,HTML教程和CSS3的结合使得网页设计更加多样化。长期以来,Web设计师受限于“web-safe”字体的选择。然而,CSS3中的`@font-face`规则允许从服务器端加载自定义字体,极大地丰富了网页的视觉效果。通过这一技术,设计师可以自由选择和使用各种字体,提升用户体验和页面美观度。本文将深入解析`@font-face`的实现原理,并提供实际应用案例,帮助开发者更好地掌握这一强大工具。 ... [详细]
  • 本文探讨了使用Python进行微服务架构设计的合理性和适用性。首先,介绍了微服务的基本概念及其在现代软件开发中的重要性。接着,通过具体的业务场景,详细分析了Python在微服务架构设计中的优势和挑战。文章还讨论了在实际应用中可能遇到的问题,并提出了相应的解决方案。希望本文能够为从事Python微服务开发的技术人员提供有价值的参考和指导。 ... [详细]
  • 深入解析:React与Webpack配置进阶指南(第二部分)
    在本篇进阶指南的第二部分中,我们将继续探讨 React 与 Webpack 的高级配置技巧。通过实际案例,我们将展示如何使用 React 和 Webpack 构建一个简单的 Todo 应用程序,具体包括 `TodoApp.js` 文件中的代码实现,如导入 React 和自定义组件 `TodoList`。此外,我们还将深入讲解 Webpack 配置文件的优化方法,以提升开发效率和应用性能。 ... [详细]
  • 在HTML5应用中,Accordion(手风琴,又称抽屉)效果因其独特的展开和折叠样式而广泛使用。本文探讨了三种不同的Accordion交互效果,通过层次结构优化信息展示和页面布局,提升用户体验。这些效果不仅增强了视觉效果,还提高了内容的可访问性和互动性。 ... [详细]
  • 如何在Mac上构建高效的本地服务器环境
    在Mac上构建高效的本地服务器环境,首先需要了解基本步骤:1. 配置目录基础;2. 启动Apache服务;3. 添加自定义文档至本地服务器;4. 查看自定义效果。此外,还可以通过手机或其他电脑访问本机服务器,以确保跨设备的兼容性和调试效果。Mac系统自带的Apache服务为本地开发提供了便捷的工具,本文将详细介绍每个步骤的具体操作方法。 ... [详细]
  • REST API 时代落幕,GraphQL 持续引领未来
    尽管REST API已广泛使用多年,但在深入了解GraphQL及其解决的核心问题后,我深感其将引领未来的API设计趋势。GraphQL不仅提高了数据查询的效率,还增强了灵活性和性能,有望成为API开发的新标准。 ... [详细]
  • Joomla!软件介绍【Joomla!概括介绍】国外相当知名的内容管理系统。【Joomla!基本介绍】Joomla!是一套在国外相当知名的内容管理系统(ContentManagem ... [详细]
  • 请在电脑上打开以下链接进行下载w3cschool离线版(chm):http:pan.baidu.coms1bniwRCV(最新,2014年10月21日更新)w3cschool离线版(ht ... [详细]
  • 早上好,我已经创建了我的项目,现在我想用ngbuild--prad命令输出,但是我遇到了错误。我该如何解决这个错误?我猜问题来自以下代码,但我不知道如何解决 ... [详细]
  • 90.bower解决js的依赖管理
    转自:https:blog.csdn.netu011537073articledetails52951122前言一个新的web项目开始,我们总是很自然地 ... [详细]
  • WebSocket与Socket.io的理解
    WebSocketprotocol是HTML5一种新的协议。它的最大特点就是,服务器可以主动向客户端推送信息,客户端也可以主动向服务器发送信息,是真正的双向平等对话,属于服务器推送 ... [详细]
author-avatar
书友34043247
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有