Question

我是html的新手，我有两个问题，我在google上找不到（所有属性必须在一行）;

1）我想用它的边距“拉伸”一个元素;例如从左到右10px。

2）我想设置background-，foregound-和borderbrush颜色。

这是我尝试过的（不起作用）：

<p style="margin-left: 10px; margin-right: 10px; margin-top: 10px; position:absolute; background-color:#E0E0E0;"><input type="button" name="bt" value="Button" style="width: 50px; height: 50px;"><br>

Answer 1

这是您第一个问题的便宜解决方案。每个屏幕都会有所不同。

<p style="padding: 10px; width:97%; height:95%; position:absolute; background-color:#E0E0E0;"><input type="button" name="bt" value="Button" style="width: 50px; height: 50px;"></p>

Answer 2

首先，我建议将样式放在样式表中，然后放在HTML文档中。

我想做全宽度的方法是在我的样式表中做这样的事情：

input {
    display: block;
    width: 95%;
    left: 0;
    right: 0;
    margin: 0 auto;
}

您可以将宽度更改为您想要的宽度（80％，25％）。左，右和边距使其在屏幕上居中。这是完全响应，所以它无论大小屏幕都可以工作。

因为你的内联样式是内联的样子：

<input style="display: block; width: 95%; left: 0; right: 0; margin: 0 auto; type="button" name="bt" value="Button" >

响应注意：

在某些情况下，您还需要考虑最大屏幕尺寸，并为大屏幕上的用户添加max-width。像这样：

input {
    display: block;
    width: 95%;
    max-width: 56rem;
    right: 0;
    left: 0;
    margin: 0 auto;
;

这将使它达到95％，直到它达到56rem宽度然后它保持那么大。

HTML背景（在一行中）

2 个答案: