我需要您帮助处理表单字段的文本区域。我有下面的 CSS 来为texarea应用一般样式。但是现在我想对某些特定的文本区域进行一些内联更改,因为它们在容器之外重叠。
感谢您的帮助。
textarea[type=text]{
border: 2px solid #a9c6c9;
vertical-align: middle;
padding: 9px;
height: 129px;
border-collapse: collapse;
margin: 2px;
padding: 2px;
space: 2px;
width: 6.1in;
z-index: 1;
font-family: calibri;
}
尝试将类添加到单个文本区域
<!-- Original -->
textarea[type=text]{
border: 2px solid #a9c6c9;
vertical-align: middle;
padding: 9px;
height: 129px;
border-collapse: collapse;
margin: 2px;
padding: 2px;
space: 2px;
width: 6.1in;
z-index: 1;
font-family: calibri;
}
然后:
<!-- add this class to you individual textarea's -->
textarea[type=text].newclass{
width: 200px;
}
或者你可以像这样把它放在div 中:
<!-- add this class to the <div> your individual textareas are inside of -->
.newclass textarea[type=text]{
width: 200px;
}
或将其添加到 HTML 中的文本区域:
style="width:200px !important;"
希望这有帮助
您可以使用
:not
过滤掉您不想更改的内容。将 CSS 选择器更改为:
textarea[type=text]:not(#element1, #element2, ...)
如果只是为了确保没有任何东西延伸到容器之外,请尝试将max-width:100%;
添加到您的文本区域 CSS 中。这应该可以帮助您防止它超出容器,同时仍然使所有其他文本区域具有相同的宽度。