如何更改输入框的宽度？

我想改变我的网站标题中的inout框的宽度，但我无法。我曾尝试使用style= "width: Xpx"，但它不起作用。如何更改输入框的宽度？

有人能帮助我吗？

<div class="input-group"> 
    <label for="Email" class="visually-hidden">{{ 'contact.form.email' | t }}</label> 
     <input type="email" style="margin: 0" style="width:250px;" value="{% if customer %}{{ customer.email }}{% endif %}" placeholder="{{ 'general.newsletter_form.newsletter_email' | t }}" name="contact[email]" id="Email" class="input-group-field" aria-label="{{ 'layout.footer.newsletter_email_placeholder' | t }}" autocorrect="off" autocapitalize="off"> 
    <span class="input-group-btn"> 
     <button type="submit" class="btn" name="commit" id="subscribe" style="font-size: 16px;">{{ 'general.newsletter_form.submit' | t }}</button> 
     </span> 
    </div>

来源

2017-10-08 Maximus000

在HTML，SGML和XML，属性不能重复，且应只能在一个元素定义一次。

在HTML你有2个样式属性书面..见下面

<input type="email" style="margin: 0" style="width:250px;"

这是不符合标准的HTML标准，并会导致不确定的行为，并因此将受到不同的呈现由不同的浏览器。

在HTML中，当您多次使用相同的属性时，只有第一个将在大多数浏览器中生效。因此，为了您的样式能够正常工作，您应该如下更改HTML：

<input type="email" style="margin: 0;width:250px;"

来源

2017-10-08 16:20:08 Lal

说明答案是正确的。或者，将宽度设置移动到CSS类，并从HTML完全丢失样式。你不需要添加一个类到元素，你可以参考它，因为它里面的div标记为class="input-group"。像这样：

<input type="email" value="{% if customer %}....

在CSS样式表

（.css文件）地址：

.input-group input[type="email"]{ 
    margin:0; 
    width:100%; 
    max-width:300px; 
}

这将风格类型 “电子邮件” 任何输入，这似乎带有class =“输入 - 一个div内组”。您不必每次都设置宽度。要更改输入组中的所有输入框，它将是：

.input-group input{ 
    margin:0; 
    width:100%; 
    max-width:300px; 
}

来源

2017-10-08 16:45:44 Leon

如何更改输入框的宽度？

回答

相关问题