📜  布尔玛 |通知

📅  最后修改于: 2021-08-31 02:17:52             🧑  作者: Mango

Bulma是一个基于 Flexbox 的免费开源 CSS 框架。它组件丰富、兼容且文档齐全。它本质上是高度敏感的。它使用类来实现其设计。
通知是一个简单的彩色块,用于吸引用户对某事的注意。它可以用作视口角落的固定通知。它支持使用删除元素。

示例 1:此示例使用 Bulma 创建一个简单的通知框。



  

  Bulma Notification
  
  
  
  

  

  
    
      
        
          

            Geek for Geeks                        

             

            'GeeksforGeeks' is a computer science              portal. It was created with a goal in              mind to provide well written, well              thought and well explained solutions              for selected questions. The core team             of five super geeks constituting of              technology lovers and computer science              enthusiasts have been constantly working             in this direction.           

        
      
    
  
  

输出:

示例 2:此示例使用 Bulma 创建带有颜色的通知块。



  

  Bulma Notification
  
  
  
  

  

  
    
      
        
          

            Geek for Geeks                        

             

            'GeeksforGeeks' is a computer science              portal.it was created with a goal in              mind to provide well written, well              thought and well explained solutions              for selected questions. The core team             of five super geeks constituting of              technology lovers and computer science              enthusiasts have been constantly working             in this direction.           

        
      
         
               
    
  
  

示例 3:此示例使用 Bulma 创建带有颜色的通知块。



  

  Bulma Notification
  
  
  
  

  

  
    
      
        
          

            Geek for Geeks                        

             

            'GeeksforGeeks' is a computer science              portal.it was created with a goal in              mind to provide well written, well              thought and well explained solutions              for selected questions. The core team             of five super-geeks constituting of              technology lovers and computer science              enthusiasts have been constantly working             in this direction.           

        
      
         
        
          

            Geek for Geeks                        

             

            'GeeksforGeeks' is a computer science              portal.it was created with a goal in              mind to provide well written, well              thought and well explained solutions              for selected questions. The core team             of five super geeks constituting of              technology lovers and computer science              enthusiasts have been constantly working             in this direction.           

        
      
    
  
  

输出:

示例 4:此示例使用 Bulma 创建带有颜色的通知块。



  

  Bulma Notification
  
  
  
  

  

  
    
      
        
          

            Geek for Geeks                        

             

            'GeeksforGeeks' is a computer science              portal.it was created with a goal in              mind to provide well written, well              thought and well explained solutions              for selected questions. The core team             of five super geeks constituting of              technology lovers and computer science              enthusiasts have been constantly working             in this direction.           

        
      
         
        
          

            Geek for Geeks                        

             

            'GeeksforGeeks' is a computer science              portal.it was created with a goal in              mind to provide well written, well              thought and well explained solutions              for selected questions. The core team             of five super geeks constituting of              technology lovers and computer science              enthusiasts have been constantly working             in this direction.           

        
      
    
  
  

输出:

示例 5:此示例创建文本消息界面(使用类“通知”)。



  

  Bulma Notification
  
  
  
  

  

  
    
      
                                                                                                                                                                                                                                                                                                                                                                                                          
              
                

Hi, How are you?

              
            
              
                

I'm good, how are you?

              
            
              
                

well, me too!!

              
            
              
                

How, your study going on?

              
            
              
                

Its quite well!!

              
            
              
                

                  well, i guess you started                    to learn javascript                 

              
            
              
                

is it going on?

              
            
              
                

Yeah!! its going on!!

              
            
              
                

infact i do some projects too!!

              
            
              
                

wooo!! thats realy cool!

              
            
      
    
  
  

输出:

注意:在上面的所有示例中,我们使用了一些额外的 Bulma 类,例如容器、列、表等来很好地设计内容。