如何将一个 CSS 文件包含在另一个文件中？

是否可以将一个 CSS 文件包含在另一个文件中?
是的，可以将一个 CSS 文件包含在另一个文件中，并且可以多次完成。此外，在主 HTML 文件或主 CSS 文件中导入多个 CSS 文件。可以通过使用@import 关键字来完成。

示例 1：

• HTML 部分：文件名为index.html

   
   
      
      
      
       
        
       
           
          
  GeeksforGeeks
   
          
  GeeksforGeeks: It is a computer science
          portal. It is an educational website. Prepare for the
          Recruitment drive of product based companies like 
          Microsoft, Amazon, Adobe etc with a free online placement 
          preparation course.
          
   
           
       
                                  
  

  输出：不使用 CSS 文件
  

• CSS 部分 1：文件名为style1.css

  
  @import "style2.css";
     
   h1 {
       color:green;   
   }
     
  .css1 {
       color:black;
       background-image: linear-gradient(to right, #DFF1DF, #11A00C);
       position:static;   
   }
  

  输出：使用 style1.css 文件而不导入第二个 CSS 文件 (style2.css)。
  

• CSS section2：文件名为style2.css

  body {
      background:black;
          opacity: 0.5;
  }
  

  输出：使用@import 关键字将style2.css 文件导入style1.css 文件后。
  

注意：可以使用一个 CSS 文件导入多个 CSS 文件。

示例 2：

• HTML 部分：文件名为Example.html

   
   
       
           
       
       
          
  GeeksforGeeks
   
          
   
               
                  Example Placeholder 
                    
                  
                  GeeksforGeeks 
                  w3skul 
                  tuitorial point 
                  CodeComunity 
                  Coders 
               
          
   
       
                                    
  

  输出：不使用 CSS 文件
  

• CSS Section1：文件名为style1.css

  @import "style2.css";
  body { 
      border:black; 
      justify-content: center; 
      text-align: center; 
  }                 
  

  输出：使用 style1.css 文件而不导入 style2.css 文件。
  

• CSS Section2：文件名为style2.css

  h1 { 
      color:green;
      text-decoration: underline overline;;
  }                    
  

  输出：使用两个 CSS 文件(style1 和 style2)后。

  

注意：有两种不同的方法可以使用 @import url(“style2.css”); 将 CSS 文件导入到另一个文件中。或@import “style2.css”；或直接在