Seesaaブログの行間設定

質問

Seesaaブログを利用しております。過去の質問を参考にCSSで行間を変更したのですが、あるページのある部分だけ行間を変更するというようなことはできませんでしょうか？
例えば、ページの上方は大きな文字なので行間を広めに、ページの下方は小さな文字なので行間を狭めるというような感じです。
現在、行間を大きな文字で合わせているため、小さな文字の方は行間が空きすぎて非常に見にくい状況です。
御教示のほど宜しくお願い致します。

回答No.3

Muller3 · ベストアンサー

表なのですか？
表でしたら、下のように、行間は目には見えませんが区切りがあるはずですよね。（セルの中での改行なら別ですが）
---------
あいうえお　　←1行目
---------
かきくけこ
さしすせそ　　←2行目
---------
1行目と2行目のセルの行間を調整するのはline-heightの領域ではなく、セルのpaddingです。
<table width="100%" height="50" border="1" cellpadding="0" cellspacing="0">
としてみたらどうでしょう。
line-heightは、2行目のような、セルの中での改行には有効になると思います。

重ねてお聞きしますが、表ですよね？tableタグを表としてでなく、レイアウトやデザインの目的で用いるのは意味的に謝った使い方になりますので、ご注意を。

お礼

Muller3様
あ、ありがとうございました。御教示の通りcellpadding="0" cellspacing="0"として行いましたら、ギュッと縦方向が詰まりました！！
お陰様で、納得のいくきれいなものになりました。ありがとうございます。
ただ、ちょっと気になるのが「表ですよね？tableタグを表としてでなく、レイアウトやデザインの目的で用いるのは意味的に・・・」の部分です。私にはよく分からないのですが、seesaaブログの記事を投稿する画面の「内容」のところに、文章を入れています。そしてその文章の一部に罫線が見えない表を入れて縦方向の表示を揃えています。
御教示いただいた<table width・・・・="0">はこの表の設定部分に入れました。間違っていますでしょうか？デザインのCSSの方は今回のアドバイスではいじっておりません。

回答No.4

Muller3

「内容」のところに「表」の意味を持ったものをtableタグで入れるのは全然構わないと思います。seesaaの使い方というより、HTMLタグの使い方の方でして。

以下はちょっと難しい話かもしれません。（ていうか老婆心ですが～～）
昔はtableタグでレイアウトが主流でしたので、私もやってましたが、本来レイアウトを制御するために使うものではないので、他の意味的に間違いではないタグを使って同じ表現を目指した方がよい、というのが現在の流れになっています（もし「表」の意味がないなら、ですが）
タグは、例えば<p>は段落、<title>はタイトル、<blockquote>は引用、<h*>は見出し、とかとか、そのタグで囲んだものがどういった性質のものかを表します。
なぜそんなことをするかについては、下記を参照いただければと思います。

文書の構成要素とマークアップ
よいHTMLを書こう
http://www.kanzaki.com/docs/html/htminfo10.html#S3

もし表としての意味を持たず、記事（文章）の中で一部分の表現方法を変えたいだけなら、その部分の段落<p>に特別なスタイルを設ける方(#2の方法）がいい、ということになると思いますがわかりにくかったらすみません。

…と私がここに書いたことよりも、前述のサイトの方が正しい知識が得られると思いますのでよろしければどうぞご一読を～～

お礼

Muller3様
何度も何度もご親切にどうもありがとうございました。
「内容」のところにtableタグを入れることは何ら問題ないと言うことでホッとしました。何か間違ったことをしているのかとドキドキしました。
参考URLは私にとってちょっと難しいのですが、せっかく御紹介下さったのですから目を通してみます。
このたびは本当にありがとうございました。感謝しております。

回答No.2

Muller3

line-heightは例えば150%としたい場合、1.5とすればよいようです。

ただ、
＞罫線非表示の表
というのが…
これは記事として投稿されている本文に、tableタグを使われているということですか？？cの部分は表なのでしょうか？

もし表としての使用ではないなら、tableではなく、p（もしくはdiv）をお使いになり、それにセレクタ（例<p class="notes">※notes部分は英数字任意）を付け、スタイルシートにこのセレクタ部分のline-height指示を追加した方がよろしいかと。。。
さらに文字サイズも一緒に指定するなら
.notes{
line-height: 1.5;
font-size: **%;
}
このような感じでできると思うのですが…（数値は適宜）

お礼

Muller3様
再度の御回答ありがとうございました。
今確認作業をしておりました。確かに1.5にするといいような感じもするのですが、罫線非表示の表の部分がやはり間延びをしてしまいます。
この罫線非表示の表の部分は、tableタグを使っています。
もしかしたら、<table width="100%" height="100">という部分のheightの値をもっと小さくすればよいのかと思い、50とか30とかにしてみたのですが、変化がありませんでした。
何か他の指定の仕方があるのでしょうか？御教示のほど宜しくお願い致します。

回答No.1

Muller3

「ページの上方、下方」というのがどこのことかわからないので具体的には言えないのですが、スタイルシートで、「あるページ」の「ある部分」に対応するセレクタにそれぞれline-heightの値を与えます。
セレクタが設定されていなければ、HTMLに追加します。

ただ、
＞行間を大きな文字で合わせているため、小さな文字の方は行間が空きすぎて非常に見にくい
過去の質問を参考にCSSで行間を変更したとのことですがどう設定されたでしょうか？
参考：line-height の値には単位なしが良いとされる理由
http://www.lucky-bag.com/archives/2006/04/unitless-line-heights.html
こういった話もありますので、参考まで。

お礼

Muller3様、御回答ありがとうございます。
回答は頂けない、そのようなことは所詮無理なのかと思い始めておりました。
「ページの上方、下方」についてですが、すみません説明が下手で。例えば次のようになります。
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
cccccccccccccccccccccccccccccc
cccccccccccccccccccccccccccccc
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAA

上で、文字列「A」の部分は通常より1まわり大きい文字です。行の高さを広くしないと文字が重なってしまうため、高さを広くしてあります。
文字列「c」の部分は通常よりも1まわり小さい文字です。行の高さが「A」の高さとなってしまっているため、間延びしてしまっています。この「c」の部分の高さだけを狭めることができればありがたいと考えています。基本は「A」の大きさですが、所々「c」もあるような感じです。
どうぞよろしくお願い致します。
参考URLはこれから見させていただきます。

補足

参考URLを元にline-heightを「1」にしてやってみましたが、字が重なってしまいダメでした。
blogbodyのline-heightは現在150%、textのfont sizeは105%としてあります。
なお、「c」の部分は罫線非表示の表の中に1まわり小さい文字を入れてあります。
見よう見まねでブログのカスタマイズに挑戦しているため、よく分かりません。何卒宜しくお願い致します。