css 如何像输入字段一样设置文本区域的样式

i2byvkas  于 2023-06-25  发布在  其他
关注(0)|答案(2)|浏览(139)

我有一个问题与样式的textarea,我用bootstrap 4css
我试图通过我自己的风格,但如果我使用填充或保证金,它的使textarea高度大

.comment-box {
  padding: 0.8rem 1rem;
  border-radius: 30px;
}
<textarea class="form-control comment-box" rows="1"></textarea>

我希望这个文本区域看起来像输入字段与按钮在里面就像这个图像
textarea input

1l5u6lss

1l5u6lss1#

Here是关于覆盖引导样式的完整解释。我相信你可以遵循这个规则并解决这个问题。
编辑:你也不需要执行他的第一步和第二步。您可以只遵循3,并创建新的样式,覆盖引导样式

vkc1a9a2

vkc1a9a22#

https://www.w3schools.com/howto/howto_css_contact_form.asp“>这里有一个链接到你的答案
这应该可以解决你的问题,看看他们使用的css,然后玩一下。

input[type="text"],
select,
textarea {
  width: 100%;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  margin-top: 6px;
  margin-bottom: 10px;
}

input[type="submit"] {
  border: none;
  background: #4aaaa5;
  padding: 12px 20px;
  border-radius: 4px;
  cursor: pointer;
  color: #ffffff;
  font-size: 16px;
}

相关问题