标题重写为：如何在CSS中调整所有输入区域的文本大小（包括电子邮件注册、评论框和菜谱索引页面下拉菜单）？

Question

网站：https://olivesfordinner.com/

寻找能实现以下效果的CSS代码：

1. 在主页上输入电子邮件以注册时，使文本变大。它太小了。

2. 在菜谱帖子上留下评论时（例如：https://olivesfordinner.com/toasted-muesli-recipe/），如何使读者在输入时文本变大。同样，这个文本太小了。

3. 如何使左侧栏的下拉文本框中的文本变大。它们太小了！https://olivesfordinner.com/recipe-index/

谢谢！

我已经搜索了很多CSS代码，但是我找到的没有一个能影响这些区域的文本大小。

Answer 1

字体大小设置如下

input, select, textarea {
    ....
    font-size: 11px;
    font-style: italic;
    ....
}

这将把 input、select 和 textarea 元素的字体大小设置为 11px。

修复方法

1 - 您可以将 font-size 更新为所需的大小

input, select, textarea {
    ....
    font-size: 20px;
    ....
}

但请注意，这会影响网站中所有的 input、select 和 textarea 元素

2 - 您可以创建一个具有所需 font-size 的新类

.font-size-20 {
    font-size: 20px;
}

将此类添加到需要更大字体大小的元素中，例如

<input class="font-size-20" id="email" name="email" type="email">

Answer 2

问题1

这将增加您的通过电子邮件获取新食谱的注册元素的字体大小

.enews-form > #subbox {
    font-size: 12pt !important;
}

.enews-form > input[type=submit] {
    font-size: 12pt !important;
}

问题2

这将修复此问题

#commentform textarea#comment, #commentform input#author, #commentform input#url {
    font-size: 13pt !important;
}

问题3

这将修复下拉列表

select#cat, select#archives-dropdown-2 {
    font-size: 12pt;
}

注意

您可以将每个问题的自定义CSS添加到每个页面或全局中，如下所示

/* 问题1的解决方案 */
.enews-form > #subbox {
    font-size: 12pt !important;
}
.enews-form > input[type=submit] {
    font-size: 12pt !important;
}

/* 问题2的解决方案 */
#commentform textarea#comment, #commentform input#author, #commentform input#url {
    font-size: 13pt !important;
}

/* 问题3的解决方案 */
select#cat, select#archives-dropdown-2 {
    font-size: 12pt;
}

请注意，此CSS代码仅对各自的元素起作用，不同于其他答案中的CSS代码。