Contact Form 7 ワードプレス・プラグイン スタイルの設定@ホームページビルダー教室

ホームページビルダー教室では、WordPressテーマを直接使ってのサイト作成の生徒さんがだんだん増えてきました。生徒さんのために、こちらも勉強を進めています。Contact Form 7のスタイルを変更します。

デフォルトでは

スタイルを変更して、

スタイルの変更には拡張CSS(Enhancing CSS)というワードプレス・プラグインを利用しています。

[html]</p>
<p><span class="css-select-op">.</span><span class="css-selector">myform </span><span class="css-punctuation">{</span><br /><span class="whitespace">  </span><span class="css-identifier">width</span><span class="css-punctuation">: </span><span class="css-unit">47%</span><span class="css-punctuation">;</span><br /><span class="css-punctuation">}</span><br /><span class="css-selector">textarea</span><span class="css-select-op">.</span><span class="css-selector">wpcf7-form-control</span><span class="css-select-op">.</span><span class="css-selector">wpcf7-textarea</span><span class="css-select-op">.</span><span class="css-selector">myform </span><span class="css-punctuation">{</span><br /><span class="whitespace">  </span><span class="css-identifier">background-color</span><span class="css-punctuation">: </span><span class="css-value">black</span><span class="css-punctuation">;</span><br /><span class="css-punctuation">}</span><br /><span class="css-selector">input</span><span class="css-select-op">.</span><span class="css-selector">wpcf7-form-control</span><span class="css-select-op">.</span><span class="css-selector">wpcf7-text</span><span class="css-select-op">.</span><span class="css-selector">wpcf7-validates-as-required </span><span class="css-punctuation">{</span><br /><span class="whitespace">  </span><span class="css-identifier">background-color</span><span class="css-punctuation">: </span><span class="css-value">black</span><span class="css-punctuation">;</span><br /><span class="whitespace">  </span><span class="css-identifier">border</span><span class="css-punctuation">: </span><span class="css-unit">1px </span><span class="css-value">solid</span><span class="css-punctuation">;</span><br /><span class="css-punctuation">}</span></p>
<p>[/html]