asked 7年 ago
初めましてよろしくお願いします。メニューの紹介写真を掲載するの作業でアプリコットのタルトまでリンクと写真が出るんですが焼きりんごのタルトの写真が出ません。また下の大きな写真でバナナとキャラメルのタルトが出ません。一回本の手本のとうりになりましたが記録を忘れてしまいました。一応Ｐ１１５ までコードを書いたのですがどこが間違っていますか教えて下さい <!doctype html>
<html>
<head>
<meta charset=<“UTF-8″>
<title>バナナとキャラメルのタルト｜ＫＵＪＩＲＡｃａｆｅ</title>
</head>
<body>
<div class=”wrapper”>
<!– ヘッダ―–>
<h1 id=”logo”><a href=”index.html”><img src=”images/logo.png”width=”217″height=”89″alt=”KUJIRA cafe”></a></h1>
<ul id=”nav”>
<li><a href=”index.html”>ホーム</a></li>
<li><a href=”about.html”>店舗案内</a></li>
<li><a href=”access.html”>アクセス</a></li>
<li><a href=”menu.html”>メニュー</a></li>
<li><a href=”contact.html”>お問い合わせ</a></li>
</ul>
<!–ヘッダーここまで–>
<!–メイン–>
<h2>メニュー</h2>
<div class=”menu_block”>
<div class=”menu_left”>
<table class=”menu_all”>
<tr>
<td class=”photo”>
<a href=”menu.html”><img src=”images/menu-thumbnail1.jpg”width=”130″height=”130″alt=””></a>
</td>
<td>
<a href=”menu.html”> バナナとキャラメルのタルト</a><br>¥400-
</td>
</tr>
<tr>
<td class=”photo”>
<a href=”menu2.html”><img src=”images/menu-thumbnail2.jpg”width=”130″height=”130″alt=””></a>
</td>
<td>
<a href=”menu2.html”>アプリコットのタルト</a><br>¥400-
</td>
</tr>
<tr>
<td class=”photo”>
<a href=”menu3.html”> <img src=”images/menu-thumbnail3.jpg”width=”130″height=”130″alt=””></a>
</td>
<td>
<a href=”menu3.html>焼きりんごのタルト</a><br>¥400-
</td>
</tr>
</table>
</div>
<div class=”menu_right”>
<img src=”images/menu-photol.jpg”width=”600″height=”400″alt=””>
<h3> バナナとキャラメルのタルト ¥400-</h3>
<p>バナナのソテーをキャラメルクリームでからめたフィリングがたっぷり。</p>
</div>
</div>
<!–メイン ここまで–>
<!–フッター –>
<div id=”footer”>
<p>©Copyright KUJIRA cafe. All rights reerved.</p>
</div>
<!–フッター ここまで–>
．</body>
</html>
狩野 祐東 Staff answered 7年 ago
このBBSは、セキュリティ上の都合で、HTMLなどのソースコードをコピー＆ペーストすると一部が変更されるため、100%確実なことは言えませんが、おそらく、3行目を書き間違えています。「UTF-8」の前の<は不要です。
そのほかに、コメント文の書き方などがおそらく間違っていると思います。
直接的にはどこが原因なのかはよくわからないのですが、まずは、次のURLでお書きになったHTMLが正しいかどうか、チェックしてみることをおすすめします。英語のサイトですがなんとなくわかると思います。
HTMLの文法を直して、それでもまだ解決しなければ、もう一度ご連絡ください。
answered 7年 ago
教えて頂いたサイトでチェックをするとエラーが出ます。 ある程度戻りその状態でエラーを確認してからコードを書いたらいいでしょうか？
answered 7年 ago
今日は、狩野さんが教えて下さったサイトとは別のサイトで文法チェックをして
エラーが５個までに減らせましたエラーの種類は３個同じでものと２個同じもので
実質的に２個です。ひとつはよくわかりません。もう一つは何か入力してくれと書いてあるのですが、
狩野さんの著書では入力されて無いのでページが進めば入力を指示されるのかと思ってます。
よろしければアドバイスをお願いします。
狩野 祐東 Staff answered 7年 ago
直接答えをお教えするのは学習になりませんので避けますが、解決のためのアドバイスをします。
まず、「先に進めばエラーが解決する」ことはありません。現時点でエラーが起きているなら、いまの段階で直さないといけません。
具体的なエラーの内容ですが、高野さんの最初の投稿を見る限り、以下の点を重点的にチェックするとよいでしょう。参考になる本書のページ数も一緒に挙げておきます。
1文字でも間違えているとエラーになったり、うまく動かなかったりする可能性があるので、まずは本に書かれているとおり、一言一句間違わないように入力を確認してみてください。
- <img>タグのsrc属性に指定しているパスやファイル名が、本当に正しく入力されているか、1つひとつよく確認してみてください
- 上から4行目、
<meta charset=<"UTF=8">は書き間違いです（p.41） - すべてのコメント文の書き方が違います（p.82）
- タグ名や、タグの属性は、半角スペースで区切る必要があります（p.24）
answered 7年 ago
写真の問題と文字化けの問題は解決しました。ホームや店舗案内などのリンクの文字の間に隙間が出来る問題は入力しなおしたら直りましたが他のページは直ってませんヒントの様な物は頂けないでしょうかお願いします。
狩野 祐東 Staff answered 7年 ago
具体的にどのページのなにがうまくいっていないのかわかりませんので、ここではより一般的な「間違いを探す方法」をお伝えしたいと思います。
サンプルデータ（ダウンロード方法はp.viに記載）の「Site」フォルダに、完成品のHTMLとCSSのデータがあります。
うまくいっていない作業中のファイルと、完成品のファイルの両方をテキストエディタで開き、見比べて、ひたすら違うところを探します。心得としては「自分が書いたソースのどこかが絶対に間違っている」と思いながら探すことです。これをすれば、ほぼ100%間違いが見つかるはずです（ただし、新規ファイルの作成時に「UTF-8」にしたかどうかだけは、この方法ではわからないかもしれません）。
answered 7年 ago
今晩は何とか修正をして文法チェックでエラーが出なくなりましたCSSに進みました。
有難うございました。また質問なのですが、テキストだとクジラカフェのロゴに四角い枠線があるのですが
自分には枠線の様な物が出ませんCSSの最初のコードを始めたので見え辛くなったのが原因でしょうか
アドバイスお願いします。
狩野 祐東 Staff answered 7年 ago
p.120や、p.141、p.159などに出てくる、ロゴ画像の周囲の青い枠線のことですか？ この枠線はブラウザによって出るものと出ないものがあります。
ちょっと正確には記憶していませんが、IEバージョン10以前は枠線が出ていました（本に掲載している画像はIE10のものです）。IE11と、EdgeやChromeなど最近のブラウザではもともと枠線は出ないので、心配はいりません。いずれにせよ、p.160で紹介するCSSでこの枠線は消します。