Titel umgeschrieben als: Wie ändere ich die Textgröße in allen Eingabebereichen (einschließlich E-Mail-Anmeldung, Kommentarfeld und Dropdown-Liste für die Rezeptindexseite) in CSS?

Question

Website: https://olivesfordinner.com/

Suchen Sie nach CSS-Code, der Folgendes erreicht:

1. Vergrößern Sie den Text, wenn Sie Ihre E-Mail-Adresse eingeben, um sich auf der Startseite anzumelden. Es ist zu klein.

2. Wenn Sie einen Kommentar zu einem Rezeptbeitrag hinterlassen (z. B.: https://olivesfordinner.com/toasted-muesli-recipe/), wie Sie den Text vergrößern, während der Leser tippt. Auch dieser Text ist zu klein.

3. So vergrößern Sie den Text im Dropdown-Textfeld in der linken Spalte. Sie sind so klein! https://olivesfordinner.com/recipe-index/

Danke!

Ich habe viel nach CSS-Code gesucht, aber keiner, den ich gefunden habe, wirkt sich auf die Textgröße dieser Bereiche aus.

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代码。