搜索文件 /
阴影

离子选择 - 选项

选择选项是Select的子元素的组件。定义的每个选项都传递并显示在“选择”对话框中。有关更多信息,请参阅 选择docs.

定制

每个 离子选择 - 选项 作为一个孩子添加的组件 离子选择 传递给接口以在对话框中显示它。重要的是要注意 离子选择 - 选项 元素本身隐藏在视图中。这意味着尝试样式它不会对对话框中的选项产生任何影响:


              / *不起作用* /
             
              离子选择 - 选项
             
              {
             
              颜色
              
             红色的
              ;
             
              }
复制 复制

相反,每个接口选项都有类 .select-interface-option 哪个可以样式。请记住,由于覆盖范围范围,所以选择器本身将无法工作和自定义 CSSCLASS. 建议将传递到界面。


              / *这将无法自己工作* /
             
              .select-interface-option
             
              {
             
              颜色
              
             红色的
              ;
             
              }
             
              / * *“我的自定义界面”需要通过*界面选项的CSSClass来传递到工作* /
             
              .my-custom-interface .select-interface-option
             
              {
             
              颜色
              
             红色的
              ;
             
              }
复制 复制

注意:由于如何呈现选项,某些接口需要更多深度样式。有关扩展信息,请参阅使用情况。

通过添加您自己的类,可以单独打造选项 离子选择 - 选项 它传递给接口选项。看看 用法 下面的部分,用于样式和设置选项上的单个类的示例。

用法


                  <
                 离子项目
                 >
               
                  <
                 离子标签
                 >
               选择
                  
                 离子标签
                 >
               
                  <
                 离子选择
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 棕色的
                  
                 >
               棕色的
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 金发女郎
                  
                 >
               金发女郎
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 黑色的
                  
                 >
               黑色的
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 红色的
                  
                 >
               红色的
                  
                 离子选择 - 选项
                 >
               
                  
                 离子选择
                 >
               
                  
                 离子项目
                 >
复制 复制

自定义选项


                  <
                 离子项目
                 >
               
                  <
                 离子标签
                 >
               选择:警报界面
                  
                 离子标签
                 >
               
                  <
                 离子选择
                
                 班级
                  =
                  
                 自定义选项
                  
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 棕色的
                  
                 >
               棕色的
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 金发女郎
                  
                 >
               金发女郎
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 黑色的
                  
                 >
               黑色的
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 红色的
                  
                 >
               红色的
                  
                 离子选择 - 选项
                 >
               
                  
                 离子选择
                 >
               
                  
                 离子项目
                 >
               
                  <
                 离子项目
                 >
               
                  <
                 离子标签
                 >
               选择:警报界面(多个选择)
                  
                 离子标签
                 >
               
                  <
                 离子选择
                
                 班级
                  =
                  
                 自定义选项
                  
                
                 
                  =
                  
                 真的
                  
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 棕色的
                  
                 >
               棕色的
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 金发女郎
                  
                 >
               金发女郎
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 黑色的
                  
                 >
               黑色的
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 红色的
                  
                 >
               红色的
                  
                 离子选择 - 选项
                 >
               
                  
                 离子选择
                 >
               
                  
                 离子项目
                 >
               
                  <
                 离子项目
                 >
               
                  <
                 离子标签
                 >
               选择:弹出窗口
                  
                 离子标签
                 >
               
                  <
                 离子选择
                
                 界面
                  =
                  
                 弹出组
                  
                
                 班级
                  =
                  
                 自定义选项
                  
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 棕色的
                  
                 >
               棕色的
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 金发女郎
                  
                 >
               金发女郎
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 黑色的
                  
                 >
               黑色的
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 红色的
                  
                 >
               红色的
                  
                 离子选择 - 选项
                 >
               
                  
                 离子选择
                 >
               
                  
                 离子项目
                 >
               
                  <
                 离子项目
                 >
               
                  <
                 离子标签
                 >
               选择:操作表界面
                  
                 离子标签
                 >
               
                  <
                 离子选择
                
                 界面
                  =
                  
                 行动表
                  
                
                 班级
                  =
                  
                 自定义选项
                  
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 棕色的
                  
                 >
               棕色的
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 金发女郎
                  
                 >
               金发女郎
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 黑色的
                  
                 >
               黑色的
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 红色的
                  
                 >
               红色的
                  
                 离子选择 - 选项
                 >
               
                  
                 离子选择
                 >
               
                  
                 离子项目
                 >
复制 复制

                / * popover界面:使用项目的CSS变量设置POLPOVER的颜色* /
               
                .my-custom-interface .select-interface-option
               
                {
               
                - 颜色
                
               #971E49
                ;
               
                - 滤片
                
               #79193B.
                ;
               
                }
               
                / *操作表界面:使用其按钮CSS变量设置动作表的颜色* /
               
                .my-custom-interface .select-interface-option
               
                {
               
                - 禁止颜色
                
               #971E49
                ;
               
                - 禁止颜色悬停
                
               #79193B.
                ;
               
                }
               
                / *警报界面:设置警报选项的颜色(单个选择)* /
               
                .my-custom-interface .select-interface-option .alert-radio-label
               
                {
               
                颜色
                
               #971E49
                ;
               
                }
               
                / *警报界面:设置警报选项的颜色(多选择)* /
               
                .my-custom-interface .select-interface-option .alert-checkbox-label
               
                {
               
                颜色
                
               #971E49
                ;
               
                }
               
                / *警报界面:为选中的警报选项设置颜色(单选)* /
               
                .my-custom-interface .select-interface-option [aria checked = true] .alert-radio-label
               
                {
               
                颜色
                
               #79193B.
                ;
               
                }
               
                / *警报界面:设置选中警报选项的颜色(多个选择)* /
               
                .my-custom-interface .select-interface-option [aria-checked = true] .alert-checkbox-label
               
                {
               
                颜色
                
               #79193B.
                ;
               
                }
复制 复制

                //将自定义类传递给每个选择界面以进行样式
               
                Const.
               选择
                =
               文档
                
                queryselectorall.
                
                '.custom-options'
                的)
                ;
               
                为了
               
                
                var.
               一世
                =
               
                0.
                ;
               一世
                <
               选择
                
               长度
                ;
               一世
                ++
                的)
               
                {
               选择
                [
               一世
                ]
                
               interfaceOptions.
                =
               
                {
               CSSCLASS.
                
               
                '我的自定义界面'
               
                }
                ;
               
                }
                ;
复制 复制

注意:在CSS示例中,某些选择器可以组合在一起,但分开,以便更好地解释每个选择器是什么。

自定义个人选项

要自定义单个选项,请在此处设置一个类 离子选择 - 选项


                  <
                 离子项目
                 >
               
                  <
                 离子标签
                 >
               选择
                  
                 离子标签
                 >
               
                  <
                 离子选择
                
                 班级
                  =
                  
                 自定义选项
                  
                
                 界面
                  =
                  
                 弹出组
                  
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 棕色的
                  
                
                 班级
                  =
                  
                 布朗选项
                  
                 >
               棕色的
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 金发女郎
                  
                 >
               金发女郎
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 黑色的
                  
                 >
               黑色的
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 红色的
                  
                 >
               红色的
                  
                 离子选择 - 选项
                 >
               
                  
                 离子选择
                 >
               
                  
                 离子项目
                 >
复制 复制

                / * popover界面:使用项目的CSS变量设置POLPOVER的颜色* /
               
                .my-custom-interface .brown-option
               
                {
               
                - 颜色
                
               #5e3e2c.
                ;
               
                - 滤片
                
               #362419
                ;
               
                }
复制 复制

                //将自定义类传递给每个选择界面以进行样式
               
                Const.
               选择
                =
               文档
                
                QuerySelector.
                
                '.custom-options'
                的)
                ;
               选择
                
               interfaceOptions.
                =
               
                {
               CSSCLASS.
                
               
                '我的自定义界面'
               
                }
                ;
复制 复制

                进口
               反应
                
               
                '反应'
                ;
               
                进口
               
                {
               离子联系
                
               IoniTem.
                
               Ionlabel.
                
               Ichersect.
                
               ICESELECTOPTION.
                
               离子页面
                }
               
                
               
                '@betway东盟体育app离子/反应'
                ;
               
                出口
               
                Const.
               SelectOptionExample.
                
               反应
                
                FC.
               
                =
               
                
                的)
               
                =>
               
                {
               
                返回
               
                
               
                  <
                  离子页面
                 >
                
                  <
                  离子联系
                 >
                
                  <
                  IoniTem.
                 >
                
                  <
                  Ionlabel.
                 >
                选择
                  
                  Ionlabel.
                 >
                
                  <
                  Ichersect.
                 >
                
                  <
                  ICESELECTOPTION.
                
                 价值
                  =
                  
                 棕色的
                  
                 >
                棕色的
                  
                  ICESELECTOPTION.
                 >
                
                  <
                  ICESELECTOPTION.
                
                 价值
                  =
                  
                 金发女郎
                  
                 >
                金发女郎
                  
                  ICESELECTOPTION.
                 >
                
                  <
                  ICESELECTOPTION.
                
                 价值
                  =
                  
                 黑色的
                  
                 >
                黑色的
                  
                  ICESELECTOPTION.
                 >
                
                  <
                  ICESELECTOPTION.
                
                 价值
                  =
                  
                 红色的
                  
                 >
                红色的
                  
                  ICESELECTOPTION.
                 >
                
                  
                  Ichersect.
                 >
                
                  
                  IoniTem.
                 >
                
                  
                  离子联系
                 >
                
                  
                  离子页面
                 >
               
                的)
                ;
               
                }
                ;
复制 复制

自定义选项


                进口
               反应
                
               
                '反应'
                ;
               
                进口
               
                {
               离子联系
                
               IoniTem.
                
               Ionlabel.
                
               Ichersect.
                
               ICESELECTOPTION.
                
               离子页面
                }
               
                
               
                '@betway东盟体育app离子/反应'
                ;
               
                Const.
               选项
                =
               
                {
               CSSCLASS.
                
               
                '我的自定义界面'
               
                }
                ;
               
                出口
               
                Const.
               SelectOptionExample.
                
               反应
                
                FC.
               
                =
               
                
                的)
               
                =>
               
                {
               
                返回
               
                
               
                  <
                  离子页面
                 >
                
                  <
                  离子联系
                 >
                
                  <
                  IoniTem.
                 >
                
                  <
                  Ionlabel.
                 >
                选择:警报界面
                  
                  Ionlabel.
                 >
                
                  <
                  Ichersect.
                
                 interfaceOptions.
                  =
                  {
                 选项
                  }
                 >
                
                  <
                  ICESELECTOPTION.
                
                 价值
                  =
                  
                 棕色的
                  
                 >
                棕色的
                  
                  ICESELECTOPTION.
                 >
                
                  <
                  ICESELECTOPTION.
                
                 价值
                  =
                  
                 金发女郎
                  
                 >
                金发女郎
                  
                  ICESELECTOPTION.
                 >
                
                  <
                  ICESELECTOPTION.
                
                 价值
                  =
                  
                 黑色的
                  
                 >
                黑色的
                  
                  ICESELECTOPTION.
                 >
                
                  <
                  ICESELECTOPTION.
                
                 价值
                  =
                  
                 红色的
                  
                 >
                红色的
                  
                  ICESELECTOPTION.
                 >
                
                  
                  Ichersect.
                 >
                
                  
                  IoniTem.
                 >
                
                  <
                  IoniTem.
                 >
                
                  <
                  Ionlabel.
                 >
                选择:警报界面(多个选择)
                  
                  Ionlabel.
                 >
                
                  <
                  Ichersect.
                
                 interfaceOptions.
                  =
                  {
                 选项
                  }
                
                 
                  =
                  {
                  真的
                  }
                 >
                
                  <
                  ICESELECTOPTION.
                
                 价值
                  =
                  
                 棕色的
                  
                 >
                棕色的
                  
                  ICESELECTOPTION.
                 >
                
                  <
                  ICESELECTOPTION.
                
                 价值
                  =
                  
                 金发女郎
                  
                 >
                金发女郎
                  
                  ICESELECTOPTION.
                 >
                
                  <
                  ICESELECTOPTION.
                
                 价值
                  =
                  
                 黑色的
                  
                 >
                黑色的
                  
                  ICESELECTOPTION.
                 >
                
                  <
                  ICESELECTOPTION.
                
                 价值
                  =
                  
                 红色的
                  
                 >
                红色的
                  
                  ICESELECTOPTION.
                 >
                
                  
                  Ichersect.
                 >
                
                  
                  IoniTem.
                 >
                
                  <
                  IoniTem.
                 >
                
                  <
                  Ionlabel.
                 >
                选择:弹出窗口
                  
                  Ionlabel.
                 >
                
                  <
                  Ichersect.
                
                 界面
                  =
                  
                 弹出组
                  
                
                 interfaceOptions.
                  =
                  {
                 选项
                  }
                 >
                
                  <
                  ICESELECTOPTION.
                
                 价值
                  =
                  
                 棕色的
                  
                 >
                棕色的
                  
                  ICESELECTOPTION.
                 >
                
                  <
                  ICESELECTOPTION.
                
                 价值
                  =
                  
                 金发女郎
                  
                 >
                金发女郎
                  
                  ICESELECTOPTION.
                 >
                
                  <
                  ICESELECTOPTION.
                
                 价值
                  =
                  
                 黑色的
                  
                 >
                黑色的
                  
                  ICESELECTOPTION.
                 >
                
                  <
                  ICESELECTOPTION.
                
                 价值
                  =
                  
                 红色的
                  
                 >
                红色的
                  
                  ICESELECTOPTION.
                 >
                
                  
                  Ichersect.
                 >
                
                  
                  IoniTem.
                 >
                
                  <
                  IoniTem.
                 >
                
                  <
                  Ionlabel.
                 >
                选择:操作表界面
                  
                  Ionlabel.
                 >
                
                  <
                  Ichersect.
                
                 界面
                  =
                  
                 行动表
                  
                
                 interfaceOptions.
                  =
                  {
                 选项
                  }
                 >
                
                  <
                  ICESELECTOPTION.
                
                 价值
                  =
                  
                 棕色的
                  
                 >
                棕色的
                  
                  ICESELECTOPTION.
                 >
                
                  <
                  ICESELECTOPTION.
                
                 价值
                  =
                  
                 金发女郎
                  
                 >
                金发女郎
                  
                  ICESELECTOPTION.
                 >
                
                  <
                  ICESELECTOPTION.
                
                 价值
                  =
                  
                 黑色的
                  
                 >
                黑色的
                  
                  ICESELECTOPTION.
                 >
                
                  <
                  ICESELECTOPTION.
                
                 价值
                  =
                  
                 红色的
                  
                 >
                红色的
                  
                  ICESELECTOPTION.
                 >
                
                  
                  Ichersect.
                 >
                
                  
                  IoniTem.
                 >
                
                  
                  离子联系
                 >
                
                  
                  离子页面
                 >
               
                的)
                ;
               
                }
                ;
复制 复制

                / * popover界面:使用项目的CSS变量设置POLPOVER的颜色* /
               
                .my-custom-interface .select-interface-option
               
                {
               
                - 颜色
                
               #971E49
                ;
               
                - 滤片
                
               #79193B.
                ;
               
                }
               
                / *操作表界面:使用其按钮CSS变量设置动作表的颜色* /
               
                .my-custom-interface .select-interface-option
               
                {
               
                - 禁止颜色
                
               #971E49
                ;
               
                - 禁止颜色悬停
                
               #79193B.
                ;
               
                }
               
                / *警报界面:设置警报选项的颜色(单个选择)* /
               
                .my-custom-interface .select-interface-option .alert-radio-label
               
                {
               
                颜色
                
               #971E49
                ;
               
                }
               
                / *警报界面:设置警报选项的颜色(多选择)* /
               
                .my-custom-interface .select-interface-option .alert-checkbox-label
               
                {
               
                颜色
                
               #971E49
                ;
               
                }
               
                / *警报界面:为选中的警报选项设置颜色(单选)* /
               
                .my-custom-interface .select-interface-option [aria checked = true] .alert-radio-label
               
                {
               
                颜色
                
               #79193B.
                ;
               
                }
               
                / *警报界面:设置选中警报选项的颜色(多个选择)* /
               
                .my-custom-interface .select-interface-option [aria-checked = true] .alert-checkbox-label
               
                {
               
                颜色
                
               #79193B.
                ;
               
                }
复制 复制

注意:在CSS示例中,某些选择器可以组合在一起,但分开,以便更好地解释每个选择器是什么。

自定义个人选项

要自定义单个选项,请在此处设置一个类 离子选择 - 选项


                进口
               反应
                
               
                '反应'
                ;
               
                进口
               
                {
               离子联系
                
               IoniTem.
                
               Ionlabel.
                
               Ichersect.
                
               ICESELECTOPTION.
                
               离子页面
                }
               
                
               
                '@betway东盟体育app离子/反应'
                ;
               
                Const.
               选项
                =
               
                {
               CSSCLASS.
                
               
                '我的自定义界面'
               
                }
                ;
               
                出口
               
                Const.
               SelectOptionExample.
                
               反应
                
                FC.
               
                =
               
                
                的)
               
                =>
               
                {
               
                返回
               
                
               
                  <
                  离子页面
                 >
                
                  <
                  离子联系
                 >
                
                  <
                  IoniTem.
                 >
                
                  <
                  Ionlabel.
                 >
                选择
                  
                  Ionlabel.
                 >
                
                  <
                  Ichersect.
                
                 界面
                  =
                  
                 弹出组
                  
                
                 interfaceOptions.
                  =
                  {
                 选项
                  }
                 >
                
                  <
                  ICESELECTOPTION.
                
                 价值
                  =
                  
                 棕色的
                  
                
                 班级
                  =
                  
                 布朗选项
                  
                 >
                棕色的
                  
                  ICESELECTOPTION.
                 >
                
                  <
                  ICESELECTOPTION.
                
                 价值
                  =
                  
                 金发女郎
                  
                 >
                金发女郎
                  
                  ICESELECTOPTION.
                 >
                
                  <
                  ICESELECTOPTION.
                
                 价值
                  =
                  
                 黑色的
                  
                 >
                黑色的
                  
                  ICESELECTOPTION.
                 >
                
                  <
                  ICESELECTOPTION.
                
                 价值
                  =
                  
                 红色的
                  
                 >
                红色的
                  
                  ICESELECTOPTION.
                 >
                
                  
                  Ichersect.
                 >
                
                  
                  IoniTem.
                 >
                
                  
                  离子联系
                 >
                
                  
                  离子页面
                 >
               
                的)
                ;
               
                }
                ;
复制 复制

                / * popover界面:使用项目的CSS变量设置POLPOVER的颜色* /
               
                .my-custom-interface .brown-option
               
                {
               
                - 颜色
                
               #5e3e2c.
                ;
               
                - 滤片
                
               #362419
                ;
               
                }
复制 复制

                进口
               
                {
               零件
                
               H
                }
               
                
               
                '@模板/核心'
                ;
               @
                零件
                
                {
               标签
                
               
                '选择 -  option-example'
                
               styleurl.
                
               
                '选择-option-example.css'
               
                }
                的)
               
                出口
               
                班级
               
                SelectOptionExample.
               
                {
               
                使成为
                
                的)
               
                {
               
                返回
               
                [
               
                  <
                 离子项目
                 >
                
                  <
                 离子标签
                 >
                选择
                  
                 离子标签
                 >
                
                  <
                 离子选择
                 >
                
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 棕色的
                  
                 >
                棕色的
                  
                 离子选择 - 选项
                 >
                
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 金发女郎
                  
                 >
                金发女郎
                  
                 离子选择 - 选项
                 >
                
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 黑色的
                  
                 >
                黑色的
                  
                 离子选择 - 选项
                 >
                
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 红色的
                  
                 >
                红色的
                  
                 离子选择 - 选项
                 >
                
                  
                 离子选择
                 >
                
                  
                 离子项目
                 >
               
                ]
                ;
               
                }
               
                }
复制 复制

自定义选项


                进口
               
                {
               零件
                
               H
                }
               
                
               
                '@模板/核心'
                ;
               @
                零件
                
                {
               标签
                
               
                '选择 -  option-example'
                
               styleurl.
                
               
                '选择-option-example.css'
               
                }
                的)
               
                出口
               
                班级
               
                SelectOptionExample.
               
                {
               选项
                =
               
                {
               CSSCLASS.
                
               
                '我的自定义界面'
               
                }
                ;
               
                使成为
                
                的)
               
                {
               
                返回
               
                [
               
                  <
                 离子项目
                 >
                
                  <
                 离子标签
                 >
                选择:警报界面
                  
                 离子标签
                 >
                
                  <
                 离子选择
                
                 interfaceOptions.
                  =
                  {
                 选项
                  }
                 >
                
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 棕色的
                  
                 >
                棕色的
                  
                 离子选择 - 选项
                 >
                
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 金发女郎
                  
                 >
                金发女郎
                  
                 离子选择 - 选项
                 >
                
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 黑色的
                  
                 >
                黑色的
                  
                 离子选择 - 选项
                 >
                
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 红色的
                  
                 >
                红色的
                  
                 离子选择 - 选项
                 >
                
                  
                 离子选择
                 >
                
                  
                 离子项目
                 >
                
               
                  <
                 离子项目
                 >
                
                  <
                 离子标签
                 >
                选择:警报界面(多个选择)
                  
                 离子标签
                 >
                
                  <
                 离子选择
                
                 interfaceOptions.
                  =
                  {
                 选项
                  }
                
                 
                  =
                  {
                  真的
                  }
                 >
                
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 棕色的
                  
                 >
                棕色的
                  
                 离子选择 - 选项
                 >
                
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 金发女郎
                  
                 >
                金发女郎
                  
                 离子选择 - 选项
                 >
                
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 黑色的
                  
                 >
                黑色的
                  
                 离子选择 - 选项
                 >
                
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 红色的
                  
                 >
                红色的
                  
                 离子选择 - 选项
                 >
                
                  
                 离子选择
                 >
                
                  
                 离子项目
                 >
                
               
                  <
                 离子项目
                 >
                
                  <
                 离子标签
                 >
                选择:弹出窗口
                  
                 离子标签
                 >
                
                  <
                 离子选择
                
                 界面
                  =
                  
                 弹出组
                  
                
                 interfaceOptions.
                  =
                  {
                 选项
                  }
                 >
                
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 棕色的
                  
                 >
                棕色的
                  
                 离子选择 - 选项
                 >
                
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 金发女郎
                  
                 >
                金发女郎
                  
                 离子选择 - 选项
                 >
                
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 黑色的
                  
                 >
                黑色的
                  
                 离子选择 - 选项
                 >
                
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 红色的
                  
                 >
                红色的
                  
                 离子选择 - 选项
                 >
                
                  
                 离子选择
                 >
                
                  
                 离子项目
                 >
                
               
                  <
                 离子项目
                 >
                
                  <
                 离子标签
                 >
                选择:操作表界面
                  
                 离子标签
                 >
                
                  <
                 离子选择
                
                 界面
                  =
                  
                 行动表
                  
                
                 interfaceOptions.
                  =
                  {
                 选项
                  }
                 >
                
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 棕色的
                  
                 >
                棕色的
                  
                 离子选择 - 选项
                 >
                
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 金发女郎
                  
                 >
                金发女郎
                  
                 离子选择 - 选项
                 >
                
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 黑色的
                  
                 >
                黑色的
                  
                 离子选择 - 选项
                 >
                
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 红色的
                  
                 >
                红色的
                  
                 离子选择 - 选项
                 >
                
                  
                 离子选择
                 >
                
                  
                 离子项目
                 >
               
                ]
                ;
               
                }
               
                }
复制 复制

                / * popover界面:使用项目的CSS变量设置POLPOVER的颜色* /
               
                .my-custom-interface .select-interface-option
               
                {
               
                - 颜色
                
               #971E49
                ;
               
                - 滤片
                
               #79193B.
                ;
               
                }
               
                / *操作表界面:使用其按钮CSS变量设置动作表的颜色* /
               
                .my-custom-interface .select-interface-option
               
                {
               
                - 禁止颜色
                
               #971E49
                ;
               
                - 禁止颜色悬停
                
               #79193B.
                ;
               
                }
               
                / *警报界面:设置警报选项的颜色(单个选择)* /
               
                .my-custom-interface .select-interface-option .alert-radio-label
               
                {
               
                颜色
                
               #971E49
                ;
               
                }
               
                / *警报界面:设置警报选项的颜色(多选择)* /
               
                .my-custom-interface .select-interface-option .alert-checkbox-label
               
                {
               
                颜色
                
               #971E49
                ;
               
                }
               
                / *警报界面:为选中的警报选项设置颜色(单选)* /
               
                .my-custom-interface .select-interface-option [aria checked = true] .alert-radio-label
               
                {
               
                颜色
                
               #79193B.
                ;
               
                }
               
                / *警报界面:设置选中警报选项的颜色(多个选择)* /
               
                .my-custom-interface .select-interface-option [aria-checked = true] .alert-checkbox-label
               
                {
               
                颜色
                
               #79193B.
                ;
               
                }
复制 复制

注意:在CSS示例中,某些选择器可以组合在一起,但分开,以便更好地解释每个选择器是什么。

自定义个人选项

要自定义单个选项,请在此处设置一个类 离子选择 - 选项


                进口
               
                {
               零件
                
               H
                }
               
                
               
                '@模板/核心'
                ;
               @
                零件
                
                {
               标签
                
               
                '选择 -  option-example'
                
               styleurl.
                
               
                '选择-option-example.css'
               
                }
                的)
               
                出口
               
                班级
               
                SelectOptionExample.
               
                {
               选项
                =
               
                {
               CSSCLASS.
                
               
                '我的自定义界面'
               
                }
                ;
               
                使成为
                
                的)
               
                {
               
                返回
               
                [
               
                  <
                 离子项目
                 >
                
                  <
                 离子标签
                 >
                选择
                  
                 离子标签
                 >
                
                  <
                 离子选择
                
                 界面
                  =
                  
                 弹出组
                  
                
                 interfaceOptions.
                  =
                  {
                 选项
                  }
                 >
                
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 棕色的
                  
                
                 班级
                  =
                  
                 布朗选项
                  
                 >
                棕色的
                  
                 离子选择 - 选项
                 >
                
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 金发女郎
                  
                 >
                金发女郎
                  
                 离子选择 - 选项
                 >
                
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 黑色的
                  
                 >
                黑色的
                  
                 离子选择 - 选项
                 >
                
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 红色的
                  
                 >
                红色的
                  
                 离子选择 - 选项
                 >
                
                  
                 离子选择
                 >
                
                  
                 离子项目
                 >
               
                ]
                ;
               
                }
               
                }
复制 复制

                / * popover界面:使用项目的CSS变量设置POLPOVER的颜色* /
               
                .my-custom-interface .brown-option
               
                {
               
                - 颜色
                
               #5e3e2c.
                ;
               
                - 滤片
                
               #362419
                ;
               
                }
复制 复制

                  <
                 模板
                 >
               
                  <
                 离子项目
                 >
               
                  <
                 离子标签
                 >
               选择
                  
                 离子标签
                 >
               
                  <
                 离子选择
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 棕色的
                  
                 >
               棕色的
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 金发女郎
                  
                 >
               金发女郎
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 黑色的
                  
                 >
               黑色的
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 红色的
                  
                 >
               红色的
                  
                 离子选择 - 选项
                 >
               
                  
                 离子选择
                 >
               
                  
                 离子项目
                 >
               
                  
                 模板
                 >
               
                  <
                 脚本
                 >
                 
                  进口
                 
                  {
                 IoniTem.
                  
                 Ionlabel.
                  
                 Ichersect.
                  
                 ICESELECTOPTION.
                  }
                 
                  
                 
                  '@betway东盟体育app ionic / vue'
                  ;
                 
                  进口
                 
                  {
                 绝缘组分
                  }
                 
                  
                 
                  'vue'
                  ;
                 
                  出口
                 
                  默认
                 
                  绝缘组分
                  
                  {
                 成分
                  
                 
                  {
                 IoniTem.
                  
                 Ionlabel.
                  
                 Ichersect.
                  
                 ICESELECTOPTION.
                  }
                 
                  }
                  的)
                  ;
                 
                  
                 脚本
                 >
复制 复制

自定义选项


                  <
                 模板
                 >
               
                  <
                 离子项目
                 >
               
                  <
                 离子标签
                 >
               选择:警报界面
                  
                 离子标签
                 >
               
                  <
                 离子选择
                
                 :接口选项
                  =
                  
                 选项
                  
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 棕色的
                  
                 >
               棕色的
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 金发女郎
                  
                 >
               金发女郎
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 黑色的
                  
                 >
               黑色的
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 红色的
                  
                 >
               红色的
                  
                 离子选择 - 选项
                 >
               
                  
                 离子选择
                 >
               
                  
                 离子项目
                 >
               
                  <
                 离子项目
                 >
               
                  <
                 离子标签
                 >
               选择:警报界面(多个选择)
                  
                 离子标签
                 >
               
                  <
                 离子选择
                
                 :接口选项
                  =
                  
                 选项
                  
                
                 
                  =
                  
                 真的
                  
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 棕色的
                  
                 >
               棕色的
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 金发女郎
                  
                 >
               金发女郎
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 黑色的
                  
                 >
               黑色的
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 红色的
                  
                 >
               红色的
                  
                 离子选择 - 选项
                 >
               
                  
                 离子选择
                 >
               
                  
                 离子项目
                 >
               
                  <
                 离子项目
                 >
               
                  <
                 离子标签
                 >
               选择:弹出窗口
                  
                 离子标签
                 >
               
                  <
                 离子选择
                
                 界面
                  =
                  
                 弹出组
                  
                
                 :接口选项
                  =
                  
                 选项
                  
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 棕色的
                  
                 >
               棕色的
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 金发女郎
                  
                 >
               金发女郎
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 黑色的
                  
                 >
               黑色的
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 红色的
                  
                 >
               红色的
                  
                 离子选择 - 选项
                 >
               
                  
                 离子选择
                 >
               
                  
                 离子项目
                 >
               
                  <
                 离子项目
                 >
               
                  <
                 离子标签
                 >
               选择:操作表界面
                  
                 离子标签
                 >
               
                  <
                 离子选择
                
                 界面
                  =
                  
                 行动表
                  
                
                 :接口选项
                  =
                  
                 选项
                  
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 棕色的
                  
                 >
               棕色的
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 金发女郎
                  
                 >
               金发女郎
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 黑色的
                  
                 >
               黑色的
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 红色的
                  
                 >
               红色的
                  
                 离子选择 - 选项
                 >
               
                  
                 离子选择
                 >
               
                  
                 离子项目
                 >
               
                  
                 模板
                 >
               
                  <
                 脚本
                 >
                 
                  进口
                 
                  {
                 IoniTem.
                  
                 Ionlabel.
                  
                 Ichersect.
                  
                 ICESELECTOPTION.
                  }
                 
                  
                 
                  '@betway东盟体育app ionic / vue'
                  ;
                 
                  进口
                 
                  {
                 绝缘组分
                  }
                 
                  
                 
                  'vue'
                  ;
                 
                  出口
                 
                  默认
                 
                  绝缘组分
                  
                  {
                 成分
                  
                 
                  {
                 IoniTem.
                  
                 Ionlabel.
                  
                 Ichersect.
                  
                 ICESELECTOPTION.
                  }
                  
                 
                  设置
                  
                  的)
                 
                  {
                 
                  Const.
                 选项
                  
                 任何
                  =
                 
                  {
                 CSSCLASS.
                  
                 
                  '我的自定义界面'
                 
                  }
                  ;
                 
                  返回
                 
                  {
                 选项
                  }
                 
                  }
                 
                  }
                  的)
                  ;
                 
                  
                 脚本
                 >
复制 复制

                / * popover界面:使用项目的CSS变量设置POLPOVER的颜色* /
               
                .my-custom-interface .select-interface-option
               
                {
               
                - 颜色
                
               #971E49
                ;
               
                - 滤片
                
               #79193B.
                ;
               
                }
               
                / *操作表界面:使用其按钮CSS变量设置动作表的颜色* /
               
                .my-custom-interface .select-interface-option
               
                {
               
                - 禁止颜色
                
               #971E49
                ;
               
                - 禁止颜色悬停
                
               #79193B.
                ;
               
                }
               
                / *警报界面:设置警报选项的颜色(单个选择)* /
               
                .my-custom-interface .select-interface-option .alert-radio-label
               
                {
               
                颜色
                
               #971E49
                ;
               
                }
               
                / *警报界面:设置警报选项的颜色(多选择)* /
               
                .my-custom-interface .select-interface-option .alert-checkbox-label
               
                {
               
                颜色
                
               #971E49
                ;
               
                }
               
                / *警报界面:为选中的警报选项设置颜色(单选)* /
               
                .my-custom-interface .select-interface-option [aria checked = true] .alert-radio-label
               
                {
               
                颜色
                
               #79193B.
                ;
               
                }
               
                / *警报界面:设置选中警报选项的颜色(多个选择)* /
               
                .my-custom-interface .select-interface-option [aria-checked = true] .alert-checkbox-label
               
                {
               
                颜色
                
               #79193B.
                ;
               
                }
复制 复制

注意:在CSS示例中,某些选择器可以组合在一起,但分开,以便更好地解释每个选择器是什么。

自定义个人选项

要自定义单个选项,请在此处设置一个类 离子选择 - 选项


                  <
                 模板
                 >
               
                  <
                 离子项目
                 >
               
                  <
                 离子标签
                 >
               选择
                  
                 离子标签
                 >
               
                  <
                 离子选择
                
                 界面
                  =
                  
                 弹出组
                  
                
                 :接口选项
                  =
                  
                 选项
                  
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 棕色的
                  
                
                 班级
                  =
                  
                 布朗选项
                  
                 >
               棕色的
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 金发女郎
                  
                 >
               金发女郎
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 黑色的
                  
                 >
               黑色的
                  
                 离子选择 - 选项
                 >
               
                  <
                 离子选择 - 选项
                
                 价值
                  =
                  
                 红色的
                  
                 >
               红色的
                  
                 离子选择 - 选项
                 >
               
                  
                 离子选择
                 >
               
                  
                 离子项目
                 >
               
                  
                 模板
                 >
               
                  <
                 脚本
                 >
                 
                  进口
                 
                  {
                 IoniTem.
                  
                 Ionlabel.
                  
                 Ichersect.
                  
                 ICESELECTOPTION.
                  }
                 
                  
                 
                  '@betway东盟体育app ionic / vue'
                  ;
                 
                  进口
                 
                  {
                 绝缘组分
                  }
                 
                  
                 
                  'vue'
                  ;
                 
                  出口
                 
                  默认
                 
                  绝缘组分
                  
                  {
                 成分
                  
                 
                  {
                 IoniTem.
                  
                 Ionlabel.
                  
                 Ichersect.
                  
                 ICESELECTOPTION.
                  }
                  
                 
                  设置
                  
                  的)
                 
                  {
                 
                  Const.
                 选项
                  
                 任何
                  =
                 
                  {
                 CSSCLASS.
                  
                 
                  '我的自定义界面'
                 
                  }
                  ;
                 
                  返回
                 
                  {
                 选项
                  }
                 
                  }
                 
                  }
                  的)
                  ;
                 
                  
                 脚本
                 >
复制 复制

                / * popover界面:使用项目的CSS变量设置POLPOVER的颜色* /
               
                .my-custom-interface .brown-option
               
                {
               
                - 颜色
                
               #5e3e2c.
                ;
               
                - 滤片
                
               #362419
                ;
               
                }
复制 复制

特性

禁用

描述

如果真的,用户无法与“选择”选项相互作用。此属性不适用于何时申请interface =“动作 - 纸张”作为离子动作板不允许禁用按钮。

属性 禁用
类型 布尔
默认 错误的

价值

描述

选项的文本值。

属性 价值
类型 任何
Baidu