如何更改css中文本框的宽度

本文关键字：文本 何更改 css 中文 | 更新日期: 2023-09-27 18:29:09

我在网页中添加了一个asp.net文本框，并用如下所示的css覆盖它

<tr>           
   <td id="policeprofileachievement" colspan="2" align="center">
            <b>Achievement :
            <asp:TextBox ID="txtAchievement" runat="server" ReadOnly="True" TextMode="MultiLine"></asp:TextBox>
            <br />
   </td>
</tr>

在我的源代码中，我为文本框添加了一个宽度。但在我的css中，我添加了这个，但它没有调整我的文本框宽度

#policeprofileachievement [type="text"] {
    position:absolute;
    margin-top:250%;
    left:0%;
    width:150px;
}

和/或

我从CSS中删除了policeproleacement，并添加了这个（许多人推荐）

#txtAchievement{
 position:absolute;
 margin-top:250%;
 left:0%;
 width:150px;
}

但我的文本框大小似乎也没有任何变化

有其他方法可以调整我的文本框大小吗？

问候

如何更改css中文本框的宽度

.txtbox
{
    position:absolute;
    margin-top:250%;
    left:0%;
    width:150px;
}

  #txtAchievement{
 position:absolute;
margin-top:250%;
left:0%;
width:150px;
 }

为什么不简单地创建一个css类并将其添加到文本框的cssclass属性中，比如…

.tb_style
{
    position:absolute;
    margin-top:250%;
    left:0%;
    width:150px;
}

然后将其添加到您的文本框中，如SO

<asp:TextBox ID="txtAchievement" runat="server" ReadOnly="True" TextMode="MultiLine" Height="150px" Width="500px" CssClass="tb_style"></asp:TextBox>

这也将允许您向其他TextBox添加相同的样式，并以最小的工作量为网页创建恒定的外观

确保你没有在cssclass中的文本框中写一些规则。。。因为内联规则将覆盖类中的规则。

CSS选择器#policeprofileachievement[type="text"]的意思是"具有ID policeproleacement和type=text的标签"，它不选择任何内容，因为具有id=policeprofileachievement的td没有type属性。

您可以使用#txtAchievement来选择文本框，因为它具有id（无需指定[type="text"]）。

或者，如果出于某种原因，您需要在policeprofileachievement下选择多个text输入字段，则可以执行

#policeprofileachievement input[type="text"]
CSS的意思是级联样式表。因此，您的css代码块呈现第二个，但您编写的文本框已经有一个宽度组件，该组件将由您编写的css"级联"。删除css宽度属性，代码就可以工作了。

使用您现在的代码，尝试给出低于150px的宽度。这可能奏效。

试试这个：

将空格放在#policeprofileachievement和[type="text"]之间

表示#policeproleachievement 中内部all的样式[type="text"]

#policeprofileachievement [type="text"] {
    position:absolute;
    top:250%;
    left:0%;
    width:150px;
}

试试这个。它应该起作用。。对我来说，这很有效。。

.aspx

 <asp:TextBox ID="txtAchievement" runat="server" ReadOnly="True" TextMode="MultiLine">  </asp:TextBox>

CSS

<style>
    #txtAchievement
    {
        width:50px;
    }
</style>
相关文章：