使用CSS来指向具有特定属性的元素的样式标签

我在ASP.Net MVC3应用程序中使用了不显眼的验证。我想以某种方式设计与所需元素相关联的标签元素。使用CSS来指向具有特定属性的元素的样式标签

我担心的是不调整周围的必填字段本身的视觉指标，但修改的基础上这个元素属性的不同元素的外观。

现在，我相信只要使用CSS规则，就可以使用CSS来自定义元素的样式，该规则的选择器适用于所有具有[data-val-required]属性的元素。它看起来像这样：

input[data-val-required] { color: red; }

但是是否有可能风格的标签？要说（使用CSS选择器）CSS规则适用于所有标签元素其for属性指向具有[data-val-required]属性的input元素？

我目前正在使用一点jQuery的样式，它很好地工作。但是如果我能够建立一个CSS规则并且完成它就更好了。

来源

2011-12-16 Ann L.

什么是你的jQuery选择器的样子？ – 2011-12-16 23:08:37

当然可以对标签进行样式设计，但您必须向我们展示一些代码... – ptriek 2011-12-16 23:30:14

你不能从这里到达那里。正如@vlgalik所说，唯一的CSS选项是1）在某些浏览器上不受支持的选择器，以及2）找到其他元素的能力有限，迫使您构建符合标准的标记。

因此，您当前的解决方案 - 使用JQuery来查找标签及其相应的输入 - 是您最好的选择。

不过，我会在接近方向相反的jQuery的解决方案：先找到所有匹配的input[data-val-required]的投入，并为每个那些，获得其ID，然后选择相应的标签：label[for="<id-from-input>"] - 这似乎是它会少工作。但这是一个优化;如果页面上没有大量标签和输入，则任何方向都可以正常工作。

来源

2011-12-19 19:00:33 Val

这jsfiddle example is using CSS3 selectors，但有一个缺点，标签必须遵循HTML中的输入元素后（可以像在例子中使用添加CSS之前放置）。

更加简单和有效的将是给像标签元素类属性：

<label class="required">

或以放置标签输入对在div元素：

<div class="required"> 
    <label for="input1">Label 1</label> 
    <input id="input1" ... /> 
</div>

和由应用所需的CSS样式简单地使用：

.required label { 
    ... 
}

来源

2011-12-17 00:52:04 vlgalik

你给的例子应该非常接近你需要做什么。尝试使用：

input[for=data-val-required]{}

此选择器基于给定标记的属性。这应该会给你你正在寻找的东西。

来源

2011-12-19 14:39:36

使用CSS来指向具有特定属性的元素的样式标签

回答

相关问题