Question

我的页面中有几个Textbox控件。有些是多线的，有些是单线的。我注意到多行和单行文本框之间的默认字体是不同的。谁知道为什么？如何使它们成为相同的字体？感谢。

以下是样本：

   <asp:TextBox ID="TextBox1" runat="server">hello</asp:TextBox>
   <asp:TextBox ID="TextBox2" runat="server" TextMode="MultiLine">hello</asp:TextBox>

TextBox1的字体是MS Shell Dlg，TextBox2的字体是等宽字体。

Answer 1

CSS的样式选择器

<style type="text/css" media="screen">

    /* match all single/multiline textboxes (IE 7+ for the attribute selector) */
    TEXTAREA, INPUT[type="text"]
    {
        /* font size, line height, face */
        font: 11px/1.5 "Trebuchet MS", Arial, Verdana, sans-serif;

        /* useful for supporting 100% width inclusive of padding and border */
        box-sizing: border-box; 
    }

</style>

请注意，media属性不是必需的，但输入字段的行为可能会因渲染目标（例如打印机与屏幕）而有很大差异。对于屏幕媒体，风格应该鼓励输入;对于打印，样式可能不同，因为打印页面（显然）不可编辑。

至于“为什么”默认字体不同，TEXTAREAs在历史上使用列和行来调整大小。固定宽度的字体（如等宽字体）可以控制一行中的字符数，这可能是大多数浏览器默认使用TEXTAREA的固定宽度字体的原因。

通过主题分配CSS类（仅限ASP.NET）

在您的主题文件中，按以下方式添加条目：

<asp:TextBox runat="server" CssClass="myClassName"></asp:TextBox>

这会将“myClassName”类应用于主题适用的所有文本框。

Answer 2

为其设置字体样式： CSS：

<style type="text/css">
    .text
    {
        font-family:Verdana;
        font-weight:bold;
    }
</style>

HTML：

<asp:TextBox  CssClass="text" ID="TextBox1" runat="server" Height="196px" TextMode="MultiLine" 
    Width="271px"></asp:TextBox>

祝你好运！

Answer 3

如果您使用的是样式表，则需要确保没有为文本区域设置的特定字体与单行文本框不同。它看起来类似于以下内容，

text area
{
   font-size:10px;
}

Multiline Textbox的默认字体与单行Textbox不同？

3 个答案: