【问题标题】:CSS custom style not taking effectCSS自定义样式不生效
【发布时间】:2017-09-14 23:17:54
【问题描述】:

我有以下 HTML

<label class="item formulario item-input item-floating-label" ng-class="{'has-error': registroForm.nombre.$invalid && registroForm.nombre.$dirty, 'valid-lr': registroForm.nombre.$valid && registroForm.nombre.$dirty}">
                        <span class="input-label">Nombre</span>
                        <input type="text" placeholder="Nombre" name="nombre" ng-model="vm.nombre" 
                               pattern="[A-Za-z'áéíóú ]+"
                               ng-minlength="2"                                 
                               ng-maxlength="30"
                               required>
                    </label>

我需要设置如下样式:

label.item.formulario {
    border-style: none none solid none;
    border-color: darkblue; 
}

但是自定义样式没有生效。如果我从我的 CSS 选择器和我的 HTML 中的类列表中删除我的自定义名称“.formulario”,则该样式可以完美运行 BUT 它使用项目类修改整体标签。我只需要修改一个特定的标签,这就是我尝试创建自定义类的原因。

怎么了?

感谢您的帮助!

【问题讨论】:

  • “如果我删除了我的自定义名称“.formulario”,那么样式就完美了”如果你从 CSS 选择器或 HTML 中的类列表中删除它?跨度>
  • 我刚刚编辑了我的问题
  • 听起来你有其他的 .formulario 的 CSS 覆盖。您是否查看过您的开发工具以查看是否有任何 CSS 覆盖它?
  • 没有。为了避免这种问题,我也改了名字
  • 你能在某处复制这个并链接我看看吗?

标签: css html ionic-framework sass


【解决方案1】:

我刚刚在这里测试过,样式确实生效了: https://jsfiddle.net/8eo8crz1/

label.item.formulario {
    border-style: none none solid none;
    border-color: darkblue; 
}

如果您想为每个标签设置独特的自定义样式,则需要使用 id 而不是类(或除了您正在使用的类之外​​)。

【讨论】:

  • 你也可以使用一个类来获得一个独特的风格,而不仅仅是id
  • 如果样式不会重复,只会应用到一个元素,你最好使用ID而不是类。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2022-01-26
  • 2017-12-23
  • 2012-10-21
  • 2011-04-06
  • 2014-06-16
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多