Primer CSS Toasts 默认

Primer CSS是一个 CSS 框架，旨在使用预制设计系统引导您的 Web 项目，其中包括间距、排版、颜色以及许多组件和实用程序。它遵循 BEM（块、元素和修饰符）方法来命名 CSS 类。

Primer CSS Toasts用于向用户显示实时反馈。要创建默认 toast，使用Toast类。默认吐司包括一个图标和一条消息。 Toast 消息也可以被格式化。建议使用信息图标并将吐司信息保持在 140 个字符以内。

Primer CSS Toasts 默认类：

• Toast：这个类是 Primer CSS toast 元素的主要容器。
• Toast-icon：这个类包装了 toast 图标。
• Toast-content：此类包含 toast 消息。

句法：

    ...

示例 1：此示例显示使用Toast类创建默认 toast。

HTML

  

    

  

    

        
GeeksforGeeks
        
Primer CSS - Default Toast
    
  
    

  
        
        

            
  
                
                
            
  
            
                GeeksforGeeks is Awesome.
            
        
    

  

输出：

示例 2：此示例显示带有格式化 toast 消息的默认文本。

HTML

  

    

  

    

        

            GeeksforGeeks
        
          
        
Primer CSS - Default Toast with Formatted message
    
  
    

  
        
        

            
  
                
                
            
  
            
                GeeksforGeeks is Awesome.
            
        
    

  

输出：

参考： https://primer.style/css/components/toasts#default