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

追記:2020/01/25
いまだに、アクセスがあるようなので、書き直しました。

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日)


スポンサーリンク

コメント一覧
  • 名前:管理人 :

    コメントは、まだありません。