从文本输入中删除边框

Question

我已按照说明逐字使用border：none和background：transparent，但边框仍显示在我的文本区域中。我正在使用背景图像来自定义外观，但似乎无法移除边框。

网站有问题 http://www.officeyoganyc.com/

标记

  <div class="fieldHolder">
  <div class="attributeinput1"><input type=text name=email value="email" size="16"> 
  <script language="Javascript" type="text/javascript">addFieldToCheck("email","Email");</script></div> 
  </div>

CSS

  .fieldHolder
{
    width: 137x;
    height: 24px;
    background: url(http://www.officeyoganyc.com/themes/zen/zen/images/textarea.png) no-repeat;
    margin-left: 209px;
        margin-top: 162px;
}



  .attributeinput1
{

    border: none;
    color: #000000;
    background: none repeat scroll 0 0 transparent;
    color: #000000;
    height: 22px;
    margin-left: 5px;
    margin-top: 5px;
    width: 170px;

}

Answer 1

这个选择器：

.attributeinput1 {

仅对<div>设置样式。您希望<input /> 里面的<div> .attributeinput1 input { ：

input

---

顺便说一下，<input ... /> 标签是自动关闭的：

/>

如果省略language=，您的网站在IE中可能看起来很时髦，因为它可能被视为块元素的开头。

---

此外，还有一件事（只是HTML中的细微差别），<script>标记中的language="Javascript" 属性已被折旧（即不受支持和旧版）。您可以安全地省略：

<script>

在您的{{1}}代码中。

---

如果您使用谷歌浏览器或Firefox，您可以使用一个非常有用的工具。在Firefox中，它被称为Firebug。在Google Chrome中，它的名称类似于 Inspector 。

它们都允许您“检查”网页的布局，并查看哪些CSS属性会影响哪些元素。

这就是我的意思。看右边：

我用它确认你的CSS没有正确应用。要激活它，请右键点击网页的任意部分，然后点击“检查”。

希望这有帮助！

Answer 2

您的背景和边框定义属性太多。

这应该有用。

.attributeinput1 input {     边界：0;     背景：无; }

如果没有，请尝试

.attributeinput1 input {     边框：0重要;     ！背景：无重要; }