Question

我正在尝试使表单元素适合具有其他DOM元素的视觉样式，包括使按钮和文本输入组合在一起，按钮和div作为单个视觉元素（如附加到某些内容div的表单按钮）背景色。）

为什么表单元素不遵循与其他DOM元素相同的规则？他们似乎有自己的想法，如何从每个其他DOM元素10px高。即使我给他们所有我能想到的css：

.mybutton, .mylink {
    display: block;
    float: left;
    height: 10px;
    width: 20px;
    margin: 0;
    padding: 0;
    line-height: 10px;
    border: none;
}

我将这两个元素直接相邻，我希望它们连接并显示为单个视觉元素。请不要建议将其全部放入具有正确样式的div中 - 我希望按钮和链接具有彼此不同的“悬停”样式。

到目前为止，我可以开始工作的唯一解决方案是只使用两个链接并使用javascript使用onClick事件提交表单。对于没有javascript的人来说，这根本不起作用，这很糟糕。

感谢您的帮助！我需要将这些表单元素鞭打成DOM服从形状！

PS - 在尝试按钮和文本输入以类似的方式对齐时，我也注意到了这种效果。也许它只是一般的按钮？我尝试使用<button>和<input type="button">无效。他们都是f ** ked

Answer 1

他们没有。这就是它的工作原理，我相信Safari比其他浏览器更多，但not everyone likes it

这是来自outdated specification，但我可以'发现它是最近的一个:(强调我的）

8.1样式表单控件

CSS工作组有望开发一种语言，其中包括高级样式的表单控件。与此同时，[HTC]和[XBL2]等技术可以作为预期的指南。

UA，如果没有这种高级样式信息，可以按照自己的意愿呈现本草案中描述的表单控件。 建议表单控件保持忠实于系统全局用户界面的外观。

CSS 2.1显式未定义 CSS如何应用于表单控件。 [CSS21]

Answer 2

这些按钮上是否有任何文本/值，因为您可能需要更改文本大小，否则会导致高度变大。如果你可以发布一些HTML，它会更容易回答。约什

Answer 3

是的，你做不到。我发现自己摆弄高度，填充，字体大小和显示属性很多，让他们看起来我想要的，甚至他们，它在每个浏览器中都不是完美的

Answer 4

没有办法用CSS描述大多数表单字段。由于这一点，很难改变他们的风格，因为没有一套标准的风格可以覆盖。

例如，请参阅how to make button elements look like links

的此示例

CSS3规范suggests ways of how it might work in the future

Answer 5

找到答案......这不是那些......抱歉的人:(

元素继承了3px的填充（因为样式是使用id设置的，而不是我用来使它们相同的类）

显然，当您增加按钮上的填充时，背景颜色不会变大，但链接上的填充会变大。

BOO

为什么html表单元素不服从我的CSS？

5 个答案: