メモ帳でホームページ作成

質問

<br><br>
<p align="center">
<font face="江戸勘亭流"> <font color=green><font size="10">
<table border="5"bgcolor=yellow width="700" height="200"><tr><td>大学のサークル"わいえあい"<br>
このメンバーの楽しい活動風景を<br>
ギャラリーにしてみました。。</td></tr></table>
</font></font></font></p>

でホームページを作りたいのですが、フォントサイズと文字の色が変わりません・・字体は江戸勘亭流になります。初心者なのでわかりません、教えてください。

回答No.5

tkmojo

初心者なのでしょうがないと思いますが、
はっきり言って何もかもムチャクチャですね…。
しかし、この場で「正しいhtmlとcssを勉強しましょう」と言っても難しいと思いますので、
すでに有るソースのフォントの部分だけ直したものを記述します。

<br><br>
<p align="center">
<table border="5"bgcolor=yellow width="700" height="200"><tr><td><font face="江戸勘亭流" color="green" size="7">大学のサークル"わいえあい"<br>
このメンバーの楽しい活動風景を<br>
ギャラリーにしてみました。。</font></td></tr></table>
</p>

簡単に解説します。
まず、fontタグは文字の周りにのみ使用可能で、tableの周りには使用できません。
なので今回はtdの中に入れます。
もしtableにセルが複数有る場合は、それぞれのtdの中にfontタグを入れる必要があります。
面倒だからといってtableをfontタグで囲んでしまっても適用されません。
書体だけ変わっていた理由はバグだと思ってください。

次に、書体や色、サイズなどフォントに関わる複数の要素を変えたい場合にも、何度もfontタグを連続させる必要はありません。
してはいけない事は無いですが、管理がめんどくさくなるだけなのでfontタグはひとつにまとめましょう。

もうひとつ。
<font size="">で指定できるのは1～7までで、10はありません。
10を指定すると多分大体のブラウザは7の大きさで表示されると思いますが、
それなら7と書きましょう。

ここまではフォントの部分のみを直したものの解説をしましたが、
他の方が指摘してくださっているように、他の部分にも気になる点が多いです。
特に全体をpで囲んでいるのはおかしいのでdivか何かにしましょう。

それと、江戸勘亭流はPCに最初から入っているフォントではありません。
htmlやcssでのフォント指定は、ページを閲覧しているPCに指定のフォントがインストールされていないと当然指定どおりには見えません。
別に何のフォントで見てもらってもいいのなら構いませんが、
どうしても江戸勘亭流で見せたい場合は文字を画像で作る必要があります。

他にも廃れてしまって現在使われない手法が多く使われていますが（fontタグやalign="center"など）、
これは趣味の範囲ならいいと思います。
本来はcssでやるのですが、機会があったら覚えてみてください。

回答No.4

ORUKA1951

補足です。
<p>内には一切のブロック要素は入りません。
ってきっとわからない。pは段落を示す・・
<p></p>内は一つの段落ですから、ブロック要素は一切入れることができません。
たとえば<table>はむろん、<ul><ol>とか<div>も入りません。
【引用】＿＿＿＿＿＿＿＿＿＿＿＿ここから
9.3.1 段落: P要素
<!ELEMENT P - O (%inline;)* -- paragraph -->
￣￣￣￣￣￣￣￣￣￣￣￣￣ここまで
［Paragraphs, Lines, and Phrases (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/text.html#edef-P )］より

意味は、<!要素 P には、inline要素のみ入る>ということ。
The W3C Markup Validation Service ( http://validator.w3.org/#validate_by_input )
でも、
Another HTML-lint gateway ( http://openlab.ring.gr.jp/k16/htmllint/htmllint.html )
でも最初にはじかれる重大な誤りです。

　それ以外は、エラーではないが、非推奨として減点される。

回答No.3

machua

基本的な箇所が間違っているのですが、それはそれで。
HTML入門のサイトなどのサンプルを真似すると参考になりますよ。

■変更点
・fontタグの属性(faceとかsizeなど)を１つにまとめた。
・fontタグの位置をテーブル内に移動した

<br><br>
<p align="center">
<table border="5"bgcolor=yellow width="700" height="200">
<tr>
<td>
<font face="江戸勘亭流" color=green size="20">
大学のサークル"わいえあい"<br>
このメンバーの楽しい活動風景を<br>
ギャラリーにしてみました。。
</font>
</td>
</tr>
</table>
</p>

回答No.2

ORUKA1951

修正すると・・
<!-- BRを連続して間隔を空けるのはダメ-スタイルシートで行う-->
<h1 style="text-arign:center;font-family:'江戸勘亭流';color:green;font-size:10px;>
<!-- p(段落要素)内には一切のブロック要素(tableなどは入れられない -->
大学のサークル"わいえあい"このメンバーの楽しい活動風景をギャラリーにしてみました。。</h2>
かな。
　根本的にというか、参考にされている参考書が悪いのか、本当にむちゃくちゃです。
<br>を連続して余白を作ってはならない。
<br>は一行中の強制改行です。この場合は使わない。
<p>内には一切のブロック要素は入りません。
<font>要素は、非推奨です。使わないように
font-familyを使うときは、必ず最終的な選択肢として総称ファミリ名を記述します。
font-family:"江戸勘亭流","ＤＦＧ勘亭流","ＤＦＰ勘亭流",fantasy;
とか。↑スタイルシートで指定。

下記に、HTML4.01仕様書の翻訳メンバー代表の内田さんがお子さんのために書かれた初心者向きのマニュアルをあげておきます。
　まずここから・・・。
【参考サイト】
はじめてのWebドキュメントづくり
　 http://www.asahi-net.or.jp/%7Esd5a-ucd/www/

なお、メモ帳ではなくHTMLエディタとして有名なEMEditorのフリー版を紹介しておきます。テキストエディタでページを作成するのにはとても便利です。
　私はPro版を使ってます。
テキストエディター EmEditor - EmEditor Free ( http://jp.emeditor.com/modules/download2/rewrite/tc_5.html )

回答No.1

uriboar

フォントサイズと色の問題以前に、根本的な部分が間違っていますので、まずは何故ホームページを作るためにHTMLが必要で、どういう風に使うのが正しいのか。多くの人に楽しんでもらえるのか。
そこから理解を始めましょう。
それが一番の近道です。

http://www.kanzaki.com/docs/htminfo.html