Semantic-UI 表单大小变化

Semantic UI 是一个开源框架，它使用 CSS 和 jQuery 构建出色的用户界面。它与使用的引导程序相同，并且有很多不同的元素可用于使您的网站看起来更神奇。它使用一个类将 CSS 添加到元素中。

表单是文档的一部分，其中包含许多输入字段，例如文本字段、密码和复选框等。

Semantic-UI 表单用于使用语义 UI 类创建有吸引力的表单。设计有吸引力的形式非常容易。 Semantic-UI Form Size Variation 用于创建不同大小的表单元素。

Semantic-UI Form Size Variation 使用的类：

• mini：用于设置图片大小为mini。
• tiny：用于将图像大小设置为 tiny。
• 小：用于将图像大小设置为小。
• large：用于将图像尺寸设置为大。
• big：用于设置图片大小为大。
• 巨大的：用于将图像大小设置为巨大。
• 海量：用于将图像大小设置为海量。

句法：

   ...

示例 1：在本文中，我们将描述具有 mini、tiny、small 和 large 尺寸的 Semantic-UI Form Size Variation。

HTML

 

    
 
    

 

    

        

            GeeksforGeeks
        
 
        
Semantic-UI Form Size Variation
    
 
    

        
Mini Size Form
        

            Username
            
        
 
        

            Password
            
        
 
        
            Submit
        
    
    


 
    

        
Tiny Size Form
        

            Username
            
        
 
        

            Password
            
        
 
        
            Submit
        
    
    


     
    

        
Small Size Form
        

            Username
            
        
 
        

            Password
            
        
 
        
            Submit
        
    
    


 
    

        
Large Size Form
        

            Username
            
        
 
        

            Password
            
        
 
        
            Submit
        
    
    





 

输出：

示例 2：在本文中，我们将描述 Semantic-UI Form Size Variation 的 big、huge 和 mass 大小。

HTML

 

    
 
    

 

    

        

            GeeksforGeeks
        
 
        
Semantic-UI Form Size Variation
    
 
    

        
Big Size Form
        

            Username
            
        
 
        

            Password
            
        
 
        
            Submit
        
    
    


 
    

        
Huge Size Form
        

            Username
            
        
 
        

            Password
            
        
 
        
            Submit
        
    
    


     
    

        
Massive Size Form
        

            Username
            
        
 
        

            Password
            
        
 
        
            Submit
        
    
    





 

输出：

参考： https://semantic-ui.com/collections/form.html#size