以前レシピ紹介の記事をアップした際、「レシピ表が見やすい。真似したい❤」といっていただいたことがあって。。多少なりともレイアウトを工夫した甲斐があったことと、そして、そう言ってくれたのが、最も尊敬する料理上手のちまこさんだったので、天にも昇るほど・・・いや、木に登るほど嬉しいことでした。
で。どうやってお教えすればいいか、考えました。
ちまこさんがHTMLをご存知ないことも考えられますし。。。
ワタシのBlogとちまこさんのBlogの幅が違うこともありますし。。。
ワタシの wrapper は、contents幅を720と幅広く設定してあるので、表をゆったり作ることが出来ます。しかしちまこさんの wrapper は540位と思われ、そのままコピペするとはみ出してしまいます。
ついては、下表のようなサイズで作ってみました。
「見たまま編集」にコピペして、内容を書きこんでみてください。
但し表の行数を増減するには、HTML編集で、<tr>~</tr>を増減するしかないかも。。。なんですが。。。
作りやすい分量 |
ここに材料と分量を入れる。
作り方 |
1 | ここに画像1を入れる。サイズは width="200"にしてあります。 | 作り方1の内容を入れる。 |
2 | ここに画像2を入れる。 | 作り方2の内容を入れる。 |
3 | ここに画像3を入れる。 | 作り方3の内容を入れる。 |
4 | ここに画像4を入れる。 | 作り方4の内容を入れる。 |
5 | ここに画像5を入れる。 | 作り方5の内容を入れる。 |
6 | ここに画像6を入れる。 | 作り方6の内容を入れる。 |
7 | ここに画像7を入れる。 | 作り方7の内容を入れる。 |
8 | ここに画像8を入れる。 | 作り方8の内容を入れる。 |
9 | ここに画像9を入れる。 | 作り方9の内容を入れる。 |
10 | ここに画像10を入れる。 | 作り方10の内容を入れる。 |
11 | ここに画像11を入れる。 | 作り方11の内容を入れる。 |
12 | ここに画像12を入れる。 | 作り方12の内容を入れる。 |
13 | ここに画像13を入れる。 |
作り方13の内容を入れる。 |
もしHTMLについてお分かりにならないことがあれば、いつでもご連絡下さい。
ワタシがHTMLを覚えるのにお世話になったのが、「Skyline」さんでした。
大変丁寧に、判りやすく解説して下さっているサイトですので、ご参考まで。
ちなみに、おにぎりとフォーク&スプーンのカットはそのままで良ければ、
お使いください。
右クリで「画像を保存」され、ご自身の Fotolife に保管をし使うという手もありますが、このままでもワタシの Fotolifeから引っ張って表示されますので大丈夫です。
また、ご自身がお持ちのカットと差し替えてもいいと思います。
20×20位のサイズがいいと思います。
以上、雑な説明ですみません。
ご覧になっている皆さんの中には、もっとHTMLことをご存知の方もいらっしゃるハズ。「なんでぇ、こうやった方が、よくねっ?」と言ったアドバイスがありましたら、どうぞよろしくお願いいたします。