如何使用 jQuery EasyUI Mobile 设计标签和药丸？

在本文中，我们将学习如何使用 jQuery EasyUI Mobile 插件设计选项卡和药丸。药丸基本上是下拉菜单形式的选项卡。

EasyUI 是一个 HTML5 框架，用于使用基于 jQuery、React、Angular 和 Vue 技术的用户界面组件。它有助于为交互式 Web 和移动应用程序构建功能，为开发人员节省大量时间。

EasyUI for jQuery 下载：

https://www.jeasyui.com/download/index.php

示例 1：以下演示了使用 jQuery EasyUI Mobile 插件的基本选项卡。

html

 

    
    
 
    
    
 
    
 
    
 
    
    
    
 
    
    
    
 
    
    
    
 
    
        p {
            line-height: 150%;
        }
    

 

    
        
             
H
                TML stands for HyperText Markup
                Language. It is used to design
                web pages using a markup language.
                HTML is the combination of Hypertext
                and Markup language. Hypertext
                defines the link between the web
                pages. A markup language is used
                to define the text document within
                tag which defines the structure of
                web pages.
            
 
        
 
        
             

                The term PHP is an acronym for PHP:
                Hypertext Preprocessor. PHP is a
                server-side scripting language
                designed specifically for web
                development. PHP can be easily
                embedded in HTML files and HTML
                codes can also be written in a
                PHP file. The thing that
                differentiates PHP with client-side
                language like HTML is, PHP codes
                are executed on the server whereas
                HTML codes are directly rendered
                on the browser.
            
 
        
 
        
             

                Cascading Style Sheets, fondly referred
                to as CSS, is a simply designed language
                intended to simplify the process of
                making web pages presentable. CSS allows
                you to apply styles to web pages. More
                importantly, CSS enables you to do this
                independent of the HTML that makes up
                each web page.
            
 
        
    

 

输出：

• 简单的标签：

• 标签执行：

示例 2：以下代码演示了使用 jQuery EasyUI Mobile 插件的各种类的选项卡导航。

html

 

    
    
 
    
    
 
    
 
    
 
    
    
    
 
    
    
    
 
    
    
    
    
        .tab-title {
            display: inline-block;
            line-height: 12px;
            padding-top: 5px;
        }
 
        p {
            line-height: 150%;
        }
    

 

    
    
        
            
                
                    Technology
                
            
        
 
        
        
 
            
                
                    
                    HTML
                
                 

                    HTML stands for HyperText Markup
                    Language. It is used to design
                    web pages using a markup language.
                    HTML is the combination of
                    Hypertext and Markup language.
                
 
            
 
            
                
                
                    
                    PHP
                
                 

                    The term PHP is an acronym for
                    PHP: Hypertext Preprocessor. PHP
                    is a server-side scripting language
                    designed specifically for web
                    development. PHP can be easily
                    embedded in HTML files and HTML
                    codes can also be written in a
                    PHP file.
                
 
            
 
            
                
                    
                    CSS
                
                 

                    Cascading Style Sheets, fondly
                    referred to as CSS, is a simply
                    designed language intended to
                    simplify the process of making
                    web pages presentable. CSS allows
                    you to apply styles to web pages.
                
 
            
 
            
                
                    
                    Python
                
 
                 

                    Python is a high-level, general
                    -purpose and a very popular
                    programming language.
                
 
                 
                 

                    Python programming language (latest
                    Python 3) is being used in web
                    development, Machine Learning
                    applications, along with all cutting
                    edge technology in Software Industry.
                
 
            
        
    

 

输出：

示例 3：以下示例使用上述插件演示了类似于下拉菜单的药丸。

html

 

    
    
 
    
    
 
    
 
    
 
    
    
    
 
    
    
    
 
    
    
    
 
    
        p {
            line-height: 150%;
        }
    

 

    
    
        
             

                HTML stands for HyperText Markup
                Language. It is used to design
                web pages using a markup language.
                HTML is the combination of
                Hypertext and Markup language.
            
 
        
 
        
             

                Cascading Style Sheets, fondly
                referred to as CSS, is a simply
                designed language intended to
                simplify the process of making
                web pages presentable. CSS allows
                you to apply styles to web pages.
            
 
        
 
        
             

                The term PHP is an acronym for PHP:
                Hypertext Preprocessor. PHP is a
                server-side scripting language
                designed specifically for web
                development. PHP can be easily
                embedded in HTML files and HTML
                codes can also be written in a PHP
                file.
            
 
        
    

 

输出：