- 締切済み
Contact Form7で文字サイズを変更したい
WordPressでホームページを作っています。 プラグインのContact Form7を使ってお問い合わせページを作成していますが、問い合わせフォームの入力する部分の文字サイズを大きくしたいと思います。 どこをどう調整したらいいかよく分からないので、ご存知の方いらっしゃればアドバイスお願いいたします。 htmlとcssは以下になります。 参考に画像も添付いたします。 ■html <table class="table table-bordered table-striped table-contactform7"> <tr> <th><span class="required-contactform7">必須</span><span class="title-contactform7">お名前</span></th> <td>[text* your-name akismet:author watermark"例:山田 太郎"] </td> </tr> <tr> <th><span class="required-contactform7">必須</span><span class="title-contactform7">メールアドレス</span></th> <td>[email* your-email akismet:author_email watermark"例:×××@×××.com"]</td> </tr> <tr> <th><span class="required-contactform7">必須</span><span class="title-contactform7">郵便番号</span></th> <td>[text* zip id:zip watermark"例:840-0015"] </td> </tr> <tr> <th><span class="required-contactform7">必須</span><span class="title-contactform7">都道府県</span></th> <td>[text* pref id:pref watermark"例:佐賀県"]</td> </tr> <tr> <th><span class="required-contactform7">必須</span><span class="title-contactform7">ご住所</span></th> <td class="address-100">[text* addr id:addr watermark"例:佐賀市木原2丁目25-10 UTビル2F東号室"]</td> </tr> <tr> <th><span class="required-contactform7">必須</span><span class="title-contactform7">お電話番号</span></th> <td>[text* text-17 watermark"例:0952-60-6240"]</td> </tr> <tr> <th><span class="required-contactform7">必須</span><span class="title-contactform7">ご相談内容</span></th> <td>[radio radio-256 use_label_element "月額3,000円HP" "月額9,800円HP" "ウェブ広告代行" "その他のご相談"]</td> </tr> <tr> <th><span class="required-contactform7">必須</span><span class="title-contactform7">メッセージ本文</span></th> <td class="message-100">[textarea* your-message watermark"業種・目的・デザインイメージなど"]</td> </tr> </table> <p class="text-xs-center">[submit class:btn class:btn-success class:btn-lg "送信する"]</p> ■css /***** コンタクトフォーム *****/ .table-contactform7{ overflow: hidden; table-layout: fixed; } .required-contactform7{ padding: 5px; background: #DE8686; color: #fff; border-radius: 3px; margin-right: 3px; } .unrequired-contactform7{ padding: 5px; background: #BDBDBD; color: #fff; border-radius: 3px; margin-right: 3px; } .table-contactform7 th{ font-weight:bold; } .table-contactform7 input, .table-contactform7 textarea{ max-width: 90% !important; height: 30px; margin: 5px 10px 10px 5px; } .address-100 input{ max-width: 90% !important; margin: 5px 10px 10px 5px; } .message-100 textarea{ width: 100%; height: 100px; margin: 5px 10px 10px 5px; } @media screen and (min-width: 900px){ .table-contactform7 th{ width:28%; } } @media screen and (max-width: 900px){ .table-contactform7{ display:block; } .table-contactform7 tbody, .table-contactform7 tr{ display: block; width: 100%; } .table-contactform7 th{ width:100%; display:block; margin: 0 auto; border:none; } .table-contactform7 td{ display: list-item; list-style-type:none; margin:0; padding:0; width: 100%; border-top: none !important; } }
- みんなの回答 (1)
- 専門家の回答
みんなの回答
- outbrave
- ベストアンサー率60% (231/380)
.message-100 textarea{ width: 100%; height: 100px; margin: 5px 10px 10px 5px; font-size: 2em; } 大きくしたい箇所に、font-size でいいんじゃないでしょうか。 ソースを書いておられますが、展開されたソースのほうが確認しやすいです。