如何同时使用 Tailwind CSS 和 Bootstrap 4？

在本文中，我们将了解如何在同一代码中使用 Bootstrap 和 Tailwind CSS。我们可以同时使用这两个 CSS 框架，但不建议这样做。因为很少有类会像“container”、“clearfix”等相互矛盾。众所周知，Bootstrap 是一个已知的 CSS 框架。尽管与 Bootstrap 相比，Tailwind CSS 框架也可以并行使用。 Tailwind CSS 基本上是一个实用程序优先的 CSS 框架，有助于快速构建自定义用户界面。所以，在开发领域，它更熟悉的是 Tailwind 而不是 Bootstrap。 Tailwind CSS 与 Bootstrap 存在显着差异。

假设有一个预建网站，老开发者使用 Bootstrap，而新开发者想使用 Tailwind。在这种情况下，新开发人员必须小心使用的 Bootstrap 类，其中类不应相互矛盾。我们将在代码示例中使用以下 CDN 链接，以便使用各种适用的 Bootstrap 和 Tailwind CSS 类，并在单个页面上使用它们。

引导 CDN 链接：

 
 
 

  

Tailwind CSS CDN 链接：

 

示例：在此示例中，我们将使用 Bootstrap 进行内容对齐，而对于文本和背景颜色，我们将使用 Tailwind CSS。所以这两个框架都适用。

HTML

 

    
    
    
    
    
    
    
    
 
    
    

 

   
    
    
        
           
            
            
                GeeksforGeeks
                This example illustrates the use of
                    Bootstrap and Tailwind side by side.
            
 
        
    

 

输出：