標題重寫為：如何在CSS中調整所有輸入區域的文字大小（包括電子郵件註冊、評論框和食譜索引頁面下拉選單）？

Question

網址：https://olivesfordinner.com/

尋找能實現以下效果的CSS程式碼：

1. 在主頁上輸入電子郵件以註冊時，使文字變大。它太小了。

2. 在食譜貼文上留下評論時（例如：https://olivesfordinner.com/toasted-muesli-recipe/），如何使讀者在輸入時文字變大。同樣，這個文本太小了。

3. 如何使左側欄的下拉文字方塊中的文字變大。它們太小了！ https://olivesfordinner.com/recipe-in​​dex/

謝謝！

我已經搜尋了很多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程式碼。