如何禁用其他div的继承样式?

时间:2013-09-06 09:34:49

标签: html css

我有三个输入字段,当我单独使用这些字段时,我看到一个正常的输入字段。这是

<div id="test">
<ul>
    <li> field1 <input type="text" name="n1"  value=""></li>
    <li> field2 <input type="text" name="n2"   value=""></li> 
    <li> field3 <textarea name="mes" rows="4" cols="25"></textarea></li> 
    <li><input type="submit" name="s" value="submit"></li>
</ul>
</div>

当我在其他div中使用这些东西时,我遇到了非常大的输入字段和名称(文本)。我猜这是从其他div继承大小。我不知道这里发生了什么。 我希望它是正常的,因为它是单独使用时,即使我把它放在另一个div。我应该为此做什么。感谢

2 个答案:

答案 0 :(得分:5)

您现在无法禁用继承样式,您可以做的是覆盖这些样式..

<div id="test" class="override">
   <ul>
      <li> field1 <input type="text" name="n1" value=""></li>
      <li> field2 <input type="text" name="n2" value=""></li> 
      <li> field3 <textarea name="mes" rows="4" cols="25"></textarea></li> 
      <li><input type="submit" name="s" value="submit"></li>
   </ul>
</div>

CSS

#test.override input[type=text] {
  /* Override here */
}

使用#test.override以便特异性更高..

Demo

Demo 2(覆盖正在行动)

答案 1 :(得分:1)

只需输入width:auto;属性为css中的输入,这将阻止继承。