📜  Bootstrap v4.3的新功能是什么?

📅  最后修改于: 2021-05-25 11:39:26             🧑  作者: Mango

前端Web开发轨道由几种语言,框架和库组成。 HTML,CSS,JavaScript,jQuery,AngularJS,ReactJS,VueJS,Bootstrap就是其中一些。这些是开发人员必须具备的一些技术,才能制作美观,响应迅速且功能强大的网站和Web应用程序。

Bootstrap是一个开放源代码框架,建立在HTML,CSS,Less(v3),Sass(v4)和JavaScript之上。 Bootstrap于2011年首次发布。其开发目的是简化前端开发。使用Bootstrap,可以相当快速,轻松地创建诸如轮播,卡片等功能。如果没有Bootstrap,它将需要大量的编码。使用Bootstrap的另一个优势是,它使整个网站设备都具有响应能力。这意味着无论屏幕大小,操作系统或设备类型(智能手机,平板电脑,笔记本电脑,功能手机等)如何,该网站在所有设备上的外观都很好。

最新版本的Bootstrap版本v4.3.1已于2019年2月发布。

让我们看一下这个新版本必须提供的新功能。

  1. .rounded-sm.rounded-lg已添加为较小和较大的边界半径。
  2. 添加了.modal-dialog-scrollable修饰符类,用于滚动模态内的内容。
  3. .list-group-horizontal修饰符类已添加。这些用于将列表组显示为水平行。
  4. 新引入了.text-break,用于在段落中应用分词。
  5. .rounded-sm.rounded-lg用于将边界半径应用于分隔线。
  6. .modal-dialog-scrollable允许在给定模态内滚动。这样可以在模式框中输入更多数据,而不必担心段落大小。
  7. .list-group-horizontal修饰符类已添加。它将列表组显示为水平行。

新版本的改进

  1. 曾经有一些变量用于从父元素或其他元素继承其值。对于这些元素,固有值已设置为null,并将保持不变,直到用户亲自修改为止。
  2. 徽章的焦点样式现在与其背景颜色匹配。

不推荐使用:

    img-retinainvisiblefloatsize mixins属性在v4.3中已被弃用,并将从v5.0开始完全删除。

可滚动对话框的示例



  

    Bootstrap Images
  
    
    
  
    
  
    
  
    
  
    

  

    

Scrollable Dialog Box - Bootstrap v4.3

                      

输出