garadanikki

日々のことつれづれ 駄目駄目さんのガラクタ日記

レシピの表

 

以前レシピ紹介の記事をアップした際、「レシピ表が見やすい。真似したい❤」といっていただいたことがあって。。多少なりともレイアウトを工夫した甲斐があったことと、そして、そう言ってくれたのが、最も尊敬する料理上手のちまこさんだったので、天にも昇るほど・・・いや、木に登るほど嬉しいことでした。

 

で。どうやってお教えすればいいか、考えました。

ちまこさんがHTMLをご存知ないことも考えられますし。。。

ワタシのBlogとちまこさんのBlogの幅が違うこともありますし。。。

 

ワタシの wrapper は、contents幅を720と幅広く設定してあるので、表をゆったり作ることが出来ます。しかしちまこさんの wrapper は540位と思われ、そのままコピペするとはみ出してしまいます。

ついては、下表のようなサイズで作ってみました。

「見たまま編集」にコピペして、内容を書きこんでみてください。

但し表の行数を増減するには、HTML編集で、<tr>~</tr>を増減するしかないかも。。。なんですが。。。

 

 

f:id:garadanikki:20140914094311j:plain  作りやすい分量

ここに材料と分量を入れる。

 

f:id:garadanikki:20140914094300j:plain  作り方
ここに画像1を入れる。サイズは width="200"にしてあります。 作り方1の内容を入れる。
ここに画像2を入れる。 作り方2の内容を入れる。
ここに画像3を入れる。 作り方3の内容を入れる。
ここに画像4を入れる。 作り方4の内容を入れる。
ここに画像5を入れる。 作り方5の内容を入れる。
ここに画像6を入れる。 作り方6の内容を入れる。
ここに画像7を入れる。 作り方7の内容を入れる。
ここに画像8を入れる。 作り方8の内容を入れる。
ここに画像9を入れる。 作り方9の内容を入れる。
10 ここに画像10を入れる。 作り方10の内容を入れる。
11 ここに画像11を入れる。 作り方11の内容を入れる。
12 ここに画像12を入れる。 作り方12の内容を入れる。
13 ここに画像13を入れる。

作り方13の内容を入れる。

 

もしHTMLについてお分かりにならないことがあれば、いつでもご連絡下さい。

ワタシがHTMLを覚えるのにお世話になったのが、「Skyline」さんでした。

大変丁寧に、判りやすく解説して下さっているサイトですので、ご参考まで。

 

ちなみに、おにぎりとフォーク&スプーンのカットはそのままで良ければ、

お使いください。

右クリで「画像を保存」され、ご自身の  Fotolife に保管をし使うという手もありますが、このままでもワタシの Fotolifeから引っ張って表示されますので大丈夫です。

また、ご自身がお持ちのカットと差し替えてもいいと思います。

20×20位のサイズがいいと思います。

 

以上、雑な説明ですみません。

ご覧になっている皆さんの中には、もっとHTMLことをご存知の方もいらっしゃるハズ。「なんでぇ、こうやった方が、よくねっ?」と言ったアドバイスがありましたら、どうぞよろしくお願いいたします。

 

id:chimako-tsushin