📜  bootstrap.css和bootstrap-theme.css之间的区别

📅  最后修改于: 2021-05-25 15:59:55             🧑  作者: Mango

Bootstrap是HTML,CSS和JS前端框架,用于在网络上开发响应式和移动优先的项目。它是预定义术语附带的框架,因此使您能够使用这些代码,而不必从头开始创建代码。它是HTML,CSS和JS代码的集合,旨在帮助构建用户界面组件。它具有多个版本,最新版本是2019年11月28日发布的4.4.1。

Bootstrap易于使用,既可以使用此链接从官方网站下载,也可以从免费提供的官方网站复制书面代码。
Bootstrap CDN是公共内容交付网络,使用户可以从其服务器远程加载CSS或js和图像。 Bootstrap CDN包含以下功能:

  • 易于使用且具有HTML的基本知识,我们可以开始使用Bootstrap。
  • 简单集成: Bootstrap可以与不同的其他平台和框架简单地集成在一起,既可以在现有站点上也可以在新站点上进行集成,此外,您还可以将Bootstrap的特定元素与当前CSS一起使用。
  • 大型网格系统: Bootstrap建立在响应迅速的12列网格,布局和组件上。无论您需要固定的网格还是响应式的,只需几处更改即可。

示例:用于将网页分为三列的示例代码,可直接使用引导程序,而无需创建官方网站上可用的新方法。 (来源:https://getbootstrap.com/docs/4.4/getting-started/introduction/)



  

    

  

    
        
            
                n One of three columns             
                                        
                One of three columns             
               
                One of three columns             
        
    
  

输出:

引导程序问题:文件覆盖很多,需要花费更多时间来设计网站。我们需要花更多的时间来创建设计,否则大多数网页看起来都一样。 JS与jquery绑定在一起,是常见的库之一,因此大部分插件都未使用。

Bootstrap主题简介: Bootstrap主题是HTML,CSS和js程序包,它们提供样式,UI组件和页面布局以在Web项目中使用。模板已经由开发人员编写,用于修改脚本并易于学习个人以构建新网站。

功能: Bootstrap主题包括按钮,下拉菜单,导航栏,进度条,面板。术语类允许我们通过类选择器访问CSS和JS的特定元素。预定义的按钮中的类可以节省大量时间,可以自定义。用于设置网格高度和网页背景颜色的主题可以使用文本的不同样式格式以及文本的内容和高度来设置网格的填充。容器流体可创建流体布局,以在所有设备上利用视口的100%宽度。

例子:



  

    Bootstrap Example
    
    
    
    
    
    

  

  
    
  
    
                                                                                     Previous                                                       Next              
       
        

What We Do

        
        
            
                                 

Current Project

            
            
                                 

Project 2

            
            
                
                    

Some text..

                
                
                    

Some text..

                
            
        
    
    
       
        

Footer Text

    
     

输出:

Bootstrap主题的问题:编写代码时应记住这些术语,不会显示任何错误,我们应该重新检查代码以获取正确的输出。应指定用于网站样式的每个术语。

区别: Bootstrap.css框架用于设计具有某些上下文和预定义设计的基本网页。通过在官方网站中导入CSS链接来完成网站的样式设置。就像bootstrap-theme.css用于下拉菜单,导航栏,进度条,不同样式的按钮一样,我们可以通过在代码中调用类属性来添加它们。用不同的样式设置文本格式,在网站上滑动文本。

我们可以通过图标在网站上的图像和社交媒体按钮上添加动画,以共享网站上的内容。我们在包装上有预定义的类,我们需要调用按钮样式的属性。