Html 如何从文本区域中删除边距_Html_Css

Html 如何从文本区域中删除边距

html css

Html 如何从文本区域中删除边距,html,css,Html,Css,我有一个文本区和一个按钮。我希望将它们从底部放置在同一水平线上。但当我将它们放置在没有应用样式的内联线上时，显示如下：我只是无法理解是什么导致了这些事情的发生？文本区域底部的额外边距在哪里？当我对表单输入做同样的事情时，它们是正常的，如图2所示：那么是什么导致了textarea的这种行为呢 <!DOCTYPE html> <html> <head> <title></title> <style type

我有一个

文本区

和一个

按钮

。我希望将它们从底部放置在同一水平线上。但当我将它们放置在没有应用样式的内联线上时，显示如下：

我只是无法理解是什么导致了这些事情的发生？文本区域底部的额外边距在哪里？当我对表单输入做同样的事情时，它们是正常的，如图2所示：

那么是什么导致了

textarea

的这种行为呢

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <style type="text/css">
        textarea,button
        {
            margin:0;
        }
    </style>
</head>
<body>
    <div>

<textarea>textarea</textarea>
<button>Button</button>
    </div>
</body>
</html>


文本区，按钮
{
保证金：0；
}
文本区
按钮

添加

垂直对齐：底部到您的样式：
<style type="text/css">
    textarea,button
    {
      vertical-align: bottom;
    }
</style>


文本区，按钮
{
垂直对齐：底部对齐；
}

问题是将它们设置为inline
元素会扰乱它们的垂直对齐。样式将解决此问题。
将两者的CSS设置为0。text区域，按钮{margin:0；}默认情况下，浏览器使用默认的填充、边距和其他值呈现元素。您必须手动将它们初始化为0。添加工作代码。从图像调试代码太难了。这发生在Chrome中，顺便说一句，不是在Firefox中，也不是元素的边距…很抱歉，我添加了代码，@Highdef margin 0东西不起作用了。这是以前所谓的CSS重置。正如@Highdef所说，将边距设置为0；您可能还需要将padding设置为0问题不是如何修复它，而是导致它的原因：那么是什么导致textarea出现这种行为？