いり江の福岡生活マップ　※マップ上のアイコンをクリックして下さい

2009年04月03日

html記述の注意点

ブログに表などhtml記述を入れる場合には、
ちょっとした注意点があります。まず表を書いてみましょう。

▼ブログの本文に表を表示しましょう
1A
2B
3C

特に問題なく、表示されていると思います。
(ここでは、html記述の説明は省略します)

それはあることに注意しているからです。

興味がある人だけ続きをご覧下さい！
ブログの本文は改行コードを自動挿入する機能があります。
他のブログでも殆んどそうだと思います。簡単な例で説明します。

▼ブログ本文の改行コードの自動挿入
html記述の注意点
普通は、改行[Enterキー]を使って改行していると思います。
しかし、これではhtmlとしては不完全なので、改行コードを
ブログ側で自動で挿入しているのです。これは便利な機能ですよね。

但し、html記述をダイレクトに書く場合、
又は、他からペーストする場合には改行コードが挿入されないように
注意する必要があります。これを配慮しないと想定していない改行が
生じてしまい、間延びした感じになってしまいますよね？

▼最初に書いた表のhtml記述
html記述の注意点
見易くする為、普通はこういう風に、htmlで書いていきますが、
この場合、うまく表示されない、ということはもう分かると思います。

▼こんな感じで改行せず1行で書いていきます(途中まで表示してます)
html記述の注意点

『改行せずに、1行で全て書き切る！』
これが、うまくhtmlを表示させる秘訣ではないでしょうか？
※配給されているブログパーツなどは、全てそうなってますよね

うまく、表示できないで困っている人は試してみてください。

タグ ：ブログhtmlbr自動挿入改行

同じカテゴリー（他）の記事画像
愛国から幸福へ
急須洗浄サービス(#2)
ハウステンボス(#4)
オランダ村
ドラえもん実写版
日米修好通商条約
同じカテゴリー（他）の記事
 愛国から幸福へ (2011-12-14 21:55)
 急須洗浄サービス(#2) (2011-12-05 21:59)
 ハウステンボス(#4) (2011-11-26 16:17)
 オランダ村 (2011-11-26 12:56)
 ドラえもん実写版 (2011-11-18 15:09)
 日米修好通商条約 (2011-11-11 22:19)

Posted by iriek at 13:00│Comments(13) │他
このBlogのトップへ
この記事へのコメント
なぜか何行もあいてしまって表示される時がありますが、こういうことが起こっているのですね・・・

こんな感じで一行で・・・といともたやすくiriekさんは書かれてますが、私には試してみることすら出来そうもないです・・・（涙）♪
Posted by チャーガ健康園チャーガ健康園 at 2009年04月03日 14:14
iriek先生へ
html・・・・・難解です・・・見てると拒絶反応起こしちゃいます（笑）
とりあえず、htmlは改行せずに・・ってことですね（汗）

話は飛びますが、
もしかして先生、わたしと同年齢くらい・・・・・・？
Posted by kiyomikiyomi at 2009年04月03日 14:40
>チャーガ健康園さん
何故か何行もあいて・・・多分、そうだと思います！
これだけがブログの注意点で、あとはホームページと同じで良いと思います。

最近、やっぱり困っている人がいたんですよね(笑)
自分が困っている時にこの記事を読むと、意味が分かると思いますよ！
チャーガさんも、その時まで・・・(笑)
Posted by iriek at 2009年04月03日 14:42
>kiyomiさん
そうで～す！htmlは改行せずに・・ということです。
これは本文の中だけの話なので、サイドバーとかは気にしなくても良いです。
(そもそも、改行コードの自動挿入は本文だけですから)

今までの話から推測すると、kiyomiさんと年齢は近いと思いますよ！
細かいハナシは、オフ会でのお楽しみに・・・(笑)
Posted by iriek at 2009年04月03日 14:52
同じ年代…むふふうふふふふっふふ(>ｍ<)


テーブル表記は
ボーダーラインが
ブラウザによって
IN・OUTの判定が違うので
今回の表なんかはいいですけど
一般サイトの記述では
難しいっすよね(>_<)
Posted by 式式 at 2009年04月03日 16:43
>式さん
意味深な笑い？？　kiyomiさんの歳は本当に分からないんですよね。


ブラウザによって・・・一応、各ブラウザで確認しなくちゃいけないのですね。
これだけブラウザの種類が多いと、仕事はn倍化されるから、大変ですよね。

ところで、この改行コードの自動挿入ですが、
各ブログ(例えばLivedoorブログ)によっても違うでしょう？
この例の場合、13行改行されるか？というとLivedoorはそうですが、
よかよかはそうでもない。ハッキリ言って、良く分からないし、分かりたくも無い。
ということで・・・全部1行でベタで書くのが間違いないとの経験論なんです(笑)
Posted by iriek at 2009年04月03日 17:15
式は＜を打つと…
良く使うタグが一覧ででてくるようにしてますｗｗｗ
（単純に辞書登録ですｗ）
増えすぎると選択がめんどいという欠点はありますが…
サイトはエディター使ってるから
ブログだとそんな使わないからいーかな？と☆
ブログで違うかは検証したの昔だから忘れちゃいました(>_<)
まあ多分違うでしょうね～。。

開発サイドの勝手でできますから
サービスごとに検証しるしかないですよね。。。

そういえばTABLEタグもサイト制作では今はほとんど使わない…
（式ちゃんちはDIV組みメイン…）

そーいえばgooブログとか
スクリプトすら入れられませんからなぁ。。。

まぁ
分かんなくても
自分の範疇でおもしろけりゃいーんじゃないかと☆☆
こんなとこがクリエイターに向かない理由なんですが…
Posted by 式式 at 2009年04月03日 18:22
>式さん
長文でコメント有難うございます！
(珍しく携帯ではなく、PCからのカキコかな？)

サービスごとに検証・・・面倒だし、きっと自分もしないですよ(笑)
gooは、スクリプトもダメなんですか、そういうブログもありますよね。
熊本の何とかというブログは、有料になって、バナーを自分で変更しても
追加で2,000円徴収されるみたいです。ビックリしました。
よかよかは、ちょっと比較しても良いサイトだと思います。ラッキー☆

最近はTABLEタグも使わないんだ～！こりゃ、また一から勉強しないと(泣)

『オモシロければ良い！』　・・これは経営者的発想ですよね！さすが！
Posted by iriek at 2009年04月03日 20:19
iriekさん＆皆さんへ

「最近困っている人がいた」・・・・それは僕です。
３月２７日・２８日の僕のブログで初めて表を入れて見たのです。
只、ＥＸＣＥＬで表を作りコピペしただけなんですが上部が何行も
空いてしまって、表自体も右側の罫線や左側の斜め罫線が
消えてしまっていたんです。
iriekさんから上のようなコメントを頂き、何度もチャレンジして
みたのですがhtml表記に慣れてない僕にとってとても難しかったです。
僕みたいな初心者が考えつく方法は「ＥＸＣＥＬで表をつくり、
画像としてとり込む」ことくらいでした。(画質は多少粗くなりますが・・・）
まぁ、地道に勉強します。
iriekさん、本当に有難うございました。
Posted by やっちゃんやっちゃん at 2009年04月04日 00:25
>やっちゃんさん
「上部が何行も空いてしまって、・・・」というのが、
今回説明した改行コードが自動で挿入されることによるものなんです。
詰めて書けば改行されないので、うまく表示されると思います。

ただ、Webのプロの式さんも言ってますが、やり方は無数にあって、
どのやり方でも結果同じように表示されれば、それで良いと思います。
プロではないので、オモシロければそれで良いかと。

何事も地道に・・・ですね！焦らずお互い頑張りましょう！
Posted by iriek at 2009年04月04日 08:51
iriek先生へ
　わかったような　わからないような。でも実際に記事に表を書き入れた時
わかるでしょう！！！こういう講習会は今後も是非お願いします。
わからないなりにフミフムと考えながら、ある日「この事だったかー」に
なります。（なってほしいです）

式さんとのやりとりは全然わかりませんでしたが、それはプロの話ってことに
します（笑）
Posted by みやちゃんみやちゃん at 2009年04月04日 23:46
iriek先生！

え…

式はコメントはほとんど…

PCからですよ(^_^;)


記事は文書が短くて
画像がサムネイルになってないときは
携帯からです☆
まあ後から書き直してますけど☆
Posted by 式式 at 2009年04月06日 00:31
>式さん
あっ、ホントですね！IP=118.240.0.120
なんか、そんな車の移動中とか、
仕事の合間に携帯でちゃちゃとしているイメージだったので。
Posted by iriekiriek at 2009年04月06日 04:37
※会員のみコメントを受け付けております、ログインが必要です。
上の画像に書かれている文字を入力して下さい
 
＜ご注意＞
書き込まれた内容は公開され、ブログの持ち主だけが削除できます。
このページの上へ▲