我有一些HTML代码，我需要到被自动由Web服务生成的风格。 我给出的部分代码看起来是这样的：
<input type='text' id='txtField001' class='txtField150'>foo</input>
<input type='text' id='txtField002' class='txtField10'>bar</input>
<input type='text' id='txtField001' class='txtField142'>sum</input>
现在，这里来了“怪异”的一部分：下面的类名称中的数字（即：150，10和142），事实上，最大。 字符数的文本字段接受，SLO它给我“暗示”以文本字段应该如何呈现宽：宽为150，更短的为10; 因为这个数字变化很大（这是由何人所为调用Web服务定义的用户），它是不实际的“n”类遵守所有可能的值。
所以：有没有办法有一个“远程类”或类似的东西 - 牢记的是，从理论上说，我不能改变任何网络服务提供，而且我真的不希望评估与JavaScript的东西呢？
具体而言，有没有什么办法来声明这样的事（我知道这是有点野）：
.txtField1 ... .txtField50 {
width: 50px;
}
.txtField50 ... .txtField100 {
width: 80px;
}
.txtField100 ... .txtField150 {
width: 120px;
}
（我怎么在我的脑海阅读本：“对任何类txtField范围从1到50，使用50像素宽度...等）
谢谢你的帮助。 我知道这是一个长镜头，那我最好的选择是使用JavaScript，但嘿，我不得不问;-)
是的，有限制
我一直在思考一个解决方案，类似于cimmanon的，只是我知道这需要远远比这更精致的（这就是为什么它已经采取了一些时间来回答）。
让我预先声明，这可能需要一个实际的限制 （我不知道是否有上，它可以在你的情况的字符数限制）。 正如你可以在我的例子小提琴看 ，什么都300+未能解决，以更大的尺寸。 如果有一个高的或未知的上限，那么JavaScript是真的会是你最好的解决方案。 我的例子适用于小于300，或许多达999可以用不太多的更多的代码进行。 不过1000+，我认为是不合理的。
CSS
/* set default as small size */
[class ^= "txtField"] {
width: 50px;
}
/* weed out 50-99, making sure not to get 5-9 */
[class *= "d5"]:not([class $= "d5"]),
[class *= "d6"]:not([class $= "d6"]),
[class *= "d7"]:not([class $= "d7"]),
[class *= "d8"]:not([class $= "d8"]),
[class *= "d9"]:not([class $= "d9"])
{
width: 80px;
}
/* weed out 100-199, making sure not to get 1 or 10-19
NOTE: this becomes a highly specific selector
*/
[class *= "d1"]:not([class $= "d1"]):not([class $= "d10"]):not([class $= "d11"]):not([class $= "d12"]):not([class $= "d13"]):not([class $= "d14"]):not([class $= "d15"]):not([class $= "d16"]):not([class $= "d17"]):not([class $= "d18"]):not([class $= "d19"])
{
width: 120px;
}
/* weed out 150-199, making sure not to get 15-19
NOTE: because the previous selector is so specific, this one
needed the !important flag (which I hate to use, but here
seemed to be the best and only solution)
*/
[class *= "d15"]:not([class $= "d15"]),
[class *= "d16"]:not([class $= "d16"]),
[class *= "d17"]:not([class $= "d17"]),
[class *= "d18"]:not([class $= "d18"]),
[class *= "d19"]:not([class $= "d19"])
{
width: 150px !important;
}
/* weed out 200-299, making sure not to get 2 or 20-29
NOTE: again high specificity
*/
[class *= "d2"]:not([class $= "d2"]):not([class $= "d20"]):not([class $= "d21"]):not([class $= "d22"]):not([class $= "d23"]):not([class $= "d24"]):not([class $= "d25"]):not([class $= "d26"]):not([class $= "d27"]):not([class $= "d28"]):not([class $= "d29"])
{
width: 180px;
}
/* weed out 250-299, making sure not to get 25-29
NOTE: !important needed again;
also, anything 300+ reverts back to smallest size unless
one keeps going... maybe 999 could be reached "reasonably"
*/
[class *= "d25"]:not([class $= "d25"]),
[class *= "d26"]:not([class $= "d26"]),
[class *= "d27"]:not([class $= "d27"]),
[class *= "d28"]:not([class $= "d28"]),
[class *= "d29"]:not([class $= "d29"])
{
width: 210px !important;
}
如果你不能以任何方式修改类，你可以做通过CSS属性选择部分匹配：
input[class^="txtField10"] /* catch txtField10, txtField100, txtField1000, etc */
input[class^="txtField150"] /* catch txtField150, txtField15064, txtField150829, etc */
：我选择的语法“开头”的例子，你可以在这里看到其他类型的http://css-tricks.com/attribute-selectors/
该字段的最大长度确实应该通过maxlength属性（你也可以匹配像我之前所做的那样）来设定。 但如果是自动生成的，有没有真的什么可以做。
另一种方法是对你的对象不止一个类：
<input type='text' id='txtField001' class='txtField width150'>foo</input>
或者更好的东西不依赖于绝对的实现（这是我在内部开发框架在那里我有窄，宽，等作为标准字段宽度做）：
<input type='text' id='txtField001' class='txtField wide'>foo</input>
这样，如果您调整实施的细节，你不会觉得有必要调整每一个类。
此方法与脚本技术结合非常好，或与所生成的CSS文件，或一些其他的效率或一致性的机制。
要效仿的榜样，从以前的答案，使用道场，因为我不是一个jQuery的家伙，你可以再做格式是这样的：
var widths = {
narrow: '10em';
wide: '30em';
}
for (m : widths) {
if widths.hasOwnProperty(m) {
dojo.query('.' + m).style('width', widths[m]));
}
}
如果你绝对必须在各种风格的具体宽度编码，具有单额外类别选择节点上的脚本仍然会帮助你。 你会基于共享类的选择，然后检查所有类为一个使用参数。
如果你不是一个附着于刚性的符合性，你也可以嵌入到自定义属性，而不是一类这个信息，然后解析为在你的JavaScript。
有许多方法。
