📜  Semantic-UI 图标集编辑器

📅  最后修改于: 2022-05-13 01:56:13.794000             🧑  作者: Mango

Semantic-UI 图标集编辑器

Semantic UI 是一个开源开发框架,它提供了预定义的类,使我们的网站看起来漂亮、令人惊叹且响应迅速。它类似于具有预定义类的 Bootstrap。它使用 jQuery 和 CSS 来创建接口。它也可以像 bootstrap 一样通过 CDN 直接使用。

Semantic UI 为用户提供了各种不同的图标,这些图标可用于不同的目的,并具有漂亮的用户界面。图标比文字表示为网站增添了更多美感。

在本文中,让我们了解一下编辑器的图标集。 Semantic UI 提供了一些最常用的设计图标类,这些类主要用于编辑器,类如下。

图标是用于表示其他内容的字形,它可以表示文本编辑器和常见的编辑器操作。

语义 UI 图标集编辑器类:

  • 剪贴板:该类用于创建剪贴板图标。
  • 剪贴板轮廓:该类用于创建剪贴板轮廓图标。
  • clone:该类用于创建克隆图标。
  • 克隆轮廓:该类用于创建克隆轮廓图标。
  • columns:该类用于创建列图标
  • copy:该类用于创建复制图标。
  • 复制大纲:该类用于创建复制大纲图标。
  • cut:该类用于创建剪切图标
  • edit:该类用于创建和编辑图标
  • 编辑大纲:该类用于创建编辑大纲图标。
  • 橡皮擦:该类用于创建橡皮擦图标
  • file:该类用于创建文件图标
  • 文件大纲:该类用于创建文件大纲图标
  • 文件备用:该类用于创建文件备用图标
  • 文件备用大纲:该类用于创建文件备用大纲图标
  • font:该类用于创建字体图标
  • 标题:该类用于创建标题图标
  • i cursor:该类用于创建 I 光标图标
  • indent:该类用于创建缩进图标
  • italic:该类用于创建斜体图标
  • linkify:这个类用来创建一个linkify图标
  • list:该类用于创建列表图标
  • listalternate:该类用于创建备用图标列表。
  • 列表备用大纲:该类用于创建列表备用大纲图标
  • list ol:该类用于创建列表“ol”图标
  • list ul:该类用于创建list ul图标
  • outdent:这个类用于创建一个outdent图标。
  • 纸飞机:该类用于创建纸飞机图标
  • 纸飞机轮廓:该类用于创建纸飞机轮廓图标
  • 回形针:这个类用于创建回形针图标
  • 段落:该类用于创建段落图标
  • paste:该类用于创建粘贴图标
  • 铅笔替代:该类用于创建铅笔替代图标
  • print:该类用于创建打印图标
  • 左引号:该类用于创建引号左图标
  • 引用权:该类用于创建引用权图标
  • redo:该类用于创建重做图标
  • redoalternate:这个类用于创建redoalternate图标
  • reply:该类用于创建回复图标
  • 全部回复:该类用于创建回复全部图标
  • share:该类用于创建分享图标
  • 删除线:该类用于创建删除线图标
  • subscript:该类用于创建下标图标
  • 上标:该类用于创建上标图标
  • sync:该类用于创建同步图标
  • 同步备用:该类用于创建同步备用图标
  • table:该类用于创建表格图标
  • tasks:该类用于创建任务图标
  • 文字高度:该类用于创建文字高度图标
  • 文字宽度:该类用于创建文字宽度图标
  • th:该类用于创建th图标
  • th large:该类用于创建th大图标
  • th list:该类用于创建第一个列表图标
  • 垃圾箱:该类用于创建垃圾箱图标
  • 垃圾桶备用:该类用于创建垃圾桶备用图标
  • 垃圾桶备用大纲:该类用于创建垃圾桶备用大纲图标
  • underline:该类用于创建下划线图标
  • undo:该类用于创建撤消图标
  • 撤消备用:该类用于创建撤消备用图标
  • unlink:该类用于创建取消链接图标

句法:

示例 1:此代码演示了所有编辑器的图标集类。

HTML


  

        

  

    
        

GeeksforGeeks

        Semantic-UI Icon Set Editors         

                    
            
                                   
                                     
                   
                                     
                   
                                     
                   
                                     
                   
                                     
                   
                                     
                   
                                     
                   
                                     
                   
                                     
                   
                                     
                   
                                     
                   
                                     
                
                                     
                
                                 
                
                                     
                
                                     
                
                                     
                
                                     
                
                                     
                
                                     
            
        
    


HTML


  

        

  

    
        

Geeksforgeeks

        Semantic UI Icon Set Editors         
        
        
                                                            
    


输出:

Semantic-UI 图标集编辑器

Semantic-UI 图标集编辑器

示例 2:以下代码演示了另一组图标编辑器。

HTML



  

        

  

    
        

Geeksforgeeks

        Semantic UI Icon Set Editors         
        
        
                                                            
    

输出:

Semantic-UI 图标集编辑器

Semantic-UI 图标集编辑器

参考: https://semantic-ui.com/elements/icon.html#editors