FC2メールフォームをCSSでカスタマイズする方法

idとかclassを調べる方法

Chromeの場合は、ブラウザ上で表示させて、右クリックメニューの「検証」を選択します。


そうすると、javascriptで生成されたHTMLがそのまま表示されます。これで、idとかclassが判明するので、これを使ってCSSを書くだけになります。

※を（必須）に書き換える方法

<style>
#coution2:after{
  content:"(必須)";
  visibility:visible;
  font-weight:500;
}
#coution2{
  visibility:hidden;
}
</style>

たとえば、※がわかりにくいので、必須という文字に置き換えたい場合は上記のようなCSSをついかすれば可能です。

以前の記事

idとかclassとかわからないからと悩んでいる人向けの記事です。
HTMLのソースを見るとJavascriptなので分からないです。そこでブラウザー上で範囲を指定してホームページ作成ツールに貼り付けします。すると、出力されているHTML形式で貼りついてHTMLソースをみれば、idとかclassなどがわかるようになります。

私が設置しているメールフォームだと以下のようになります。
fc2mailform20110527.html
※ファイルを保存して、ソースをみれば判明します。

私は、ホームページビルダしか持ってないのでわかりませんが、Windowsの標準機能のコピー＆ペーストだと思うので、たいていのホームページ（WEB）作成ツールでもそうだろうと思います。

ホームページ・ビルダー16　体験版　(Vector)もありますので、試用がてらに使ってみてもよいでしょう。（試用期間：30日）