HTML/ＣＳＳをやさしく教えてくれるスレ

▼ページ最下部

001 2009/03/18(水) 01:18:46 ID:MvOMoiBc

質問です。
スタイルシートが使えない環境で、

テキストのインデントとその下にくる余白のおおきさを
ある程度指定したい場合、テーブルで空のセルを作って
数値を指定するのは文法的に有りなのでしょうか？？
例：
<table width="400" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="50"></td>
<td>テキストＡ</td>
</tr>
<tr height="2">
<td colspan="2" height="2"></td>
</tr>
<tr>
<td></td>
<td>テキストＢ</td>
</tr>
</table>

※省略されてますすべて表示...

003 2009/03/18(水) 02:22:35 ID:c5MFbZ/Q

テーブルでやってもいいけど
テキストにインデント付けたいだけなら
全角空白とか＆ｎｂｓｐ；とかで埋めるのが簡単。
行間のスペースは＜ｂｒ＞で。
フォントサイズを変えれば微調整も可能。

004 2009/03/18(水) 02:23:17 ID:bhgVf2wk

なんでCSS厨は互換性の高いテーブルよりCSSを使いたがるんかね？
ハックとかまでしてデータとデザインの分離とかHTMLでアホでしょ。
リストを横に並べるのが主流とかもうバカかと。
土台がhtmlなんだからデータのみのファイルをサーバー側でhtmlに加工したほうが分離できるのに。
そんなに分離したかったらXMLとXSL使えよ。

と、テーブルを全部CSSに変換するのに非常に苦労した人が申しております。

005 2009/03/18(水) 08:32:15 ID:pP8jykAM

いっそ画像にしてしまう、という方法はダメ？

006 2009/03/18(水) 12:37:34 ID:NbFMY.rU

＞文法的に有りなのでしょうか

標準化という意味では完全になしです

＞なんでCSS厨は互換性の高いテーブルよりCSSを使いたがるんかね？

セマンテックとユーザビリティが理由でしょ
他の用途で使う時に分離されてた方がデータを取り出しやすいし
作る側のことだけ考えたらテーブルが楽なんだろうけど

007 2009/03/18(水) 23:40:06 ID:u92Hq4yY

>余白のおおきさをある程度指定したい場合〜
→厳格に指定するならセル幅調整するしかないでしょう。

>文法的に有りなのでしょうか？？
>>6に同意。

CSSが使えない環境って具体的にどんな環境だ？古いとか？

008 2009/03/18(水) 23:50:06 ID:MvOMoiBc

>>3
ありがとうございます。
でも
全角スペースですと、改行したときリンクが分離してしまうのですがどうしたら良いでしょうか？
かといってリンクとして一文にすると全角スペース空白の部分にも下線がくるのでおかしいし。

例↓こんな場合
　　リンクテキストＡ〜〜〜〜〜
　　リンクテキストＡ続き
　　
あと、下側のスペースなんですが、例えば次の要素との間に２pxだけ空けたい場合とかだと
<br>だとフォントサイズいじっても空きすぎてしまいますがこれいかに？

>>5ありがとうございます。
でもspacerとかスライスで作成とかは最後の手段にしたいんです。
（めんどいのと重くなるのと正しい書き方を知りたいのという理由で）

>>6
ちなみにやはり標準化という意味ではspacerとかにするのがスマートなやり方なのでしょうか？

009 2009/03/19(木) 00:04:24 ID:QnjyacDo

>>7
ありがとうございます。
セル幅でＯＫと聞いて安心しました。（ＯＫというのは誤解があるかもしれませんが）
ＣＳＳ使えない環境は、ＨＴＭＬで送るメールマガジンです。
あと、テンプレートみたいなショッピングサイトのページとかです。

010 2009/03/24(火) 12:53:43 ID:KR79ql9.

メルマガならHTMLの中にCSSを埋め込んでしまえばいいんじゃないの？
<style>...</style>
とか
<p style="...">...</p>
とか。

011 2009/03/24(火) 23:42:18 ID:hgXlVT1Q

>>10
ありがとございます。
そのやり方、あまり使ったことなく、
正しくないイメージもなんとなくあって
避けてました。

ちょっと勉強してみます。

012 2009/04/01(水) 02:59:25 ID:.gaQIoYo

すいません、質問です。

画像の周りに余白を5px空けてﾎﾞｰﾀﾞｰ線をひきたいのですが、
firefoxだとＯＫでＩＥ７だと余白が空きません。
この記述は誤りでしょうか？

ヘッダ記述-------------------------------------
<style type="text/css" media="screen"></style>

HTML部分---------------------------------------
<img src="画像.jpg" alt="" width="200" height="200" border="0">

誰か解答おながいします

013 2009/04/01(水) 03:39:43 ID:UeZUjblE

削除（by投稿者）

014 2009/04/01(水) 07:33:09 ID:LGyq8v9Q

>>12
IEはDOCTYPE宣言を書かないとCSSが正しく解釈されないよ。
それから<img>のborderは要らない。

015 2009/04/01(水) 22:23:07 ID:.gaQIoYo

>>14
すいません、それやってもＩＥ7　ダメみたすよ？

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=shift_jis">
<title>タイトル</title>
<style type="text/css" media="screen"></style>
</head>

<body>
<img src="画像.jpg" alt="" width="489" height="337">
</body>

</html>

ちゃんと答えてくださーい＞＜

016 2009/04/02(木) 04:28:40 ID:2rrG8NpA

>>15
DOCTYPE宣言の最後の部分を省略するとダメらしい。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">...
にしてみ。
それと
<meta http-equiv="Content-Style-Type" content="text/css">
を書いておいた方が良いんじゃないかな。よく分からんけど。

017 2009/04/02(木) 07:16:57 ID:2CdRyQOU

>>15
インライン要素をそのままbodyに書いてる時点でだめだと思う
IE標準モードで書くならなおさら
そもそもpaddingはボックス要素とインライン要素との間の余白に使うものじゃないの？

018 2009/04/02(木) 23:50:25 ID:42HwoSkE

>>16
うおっ！！　　
ＩＥ7で効いた！！！
まさかDOCTYPE宣言の最後の部分を省略が原因なんて全く考えませんでした。
凄く勉強になりました。ありがとうござます！

>>17
自分もそんな気がしてました。でも画像のサイズが手軽に変えられるような
作りで一番シンプルな書き方にしたくてこうなってしまいました。
同じ効果を得るための正しい書き方とかあれば教えてほしいです。
（一応、>>16さんの言うとうりにやったら何故かこの作りのままでできちゃいましたが。）

019 2009/04/03(金) 05:46:30 ID:6MgaFYgw

>>18
古い解釈をする「互換モード」と正しい解釈をする「標準モード」があって
DOCTYPE宣言の有り無しや書き方によって切り替わるんだよ。
これから勉強しようと思ってるなら「互換モード」は無視でいい。

>>17さんが言ってるのはHTML4.01のTransitionalとStrictの違いだね。
できれば規格にきっちり準拠したStrictで書いた方が良い。
その場合は<body>直下に<img>は書けないので<p><img></p>とする。
<img>のようなインライン要素でもpaddingは指定できるよ。

020 2009/06/19(金) 07:54:30 ID:or6kqpIY

IEは世界の癌のくせにシェアだけは多いから困る
CSSの仕様通りに実装しろよ

021 2009/06/19(金) 11:59:21 ID:z0F0s.as

同意。

022 2009/06/21(日) 06:37:05 ID:9mOrO3wk

PINKのとらでググれ

023 2009/07/11(土) 06:39:51 ID:swTkPM7s

俺馬鹿だからクロスブラウザを考慮しても
テーブルつかうよりCSSの方が楽だわ

024 2009/07/26(日) 07:29:26 ID:ek7KLuOc

今更フレームとか透過GIFを使ったテーブルレイアウトなんて覚える必要ないですかね？
あとa要素のtarget属性の使用は極力控えたほうが良いですか？

025 2009/07/27(月) 18:05:49 ID:6FX.V.Dg

>>24
断言する
必要ない

026 2009/09/16(水) 16:45:11 ID:3abl5j.c

聞きたいのですが
メタの<meta http-equiv="Content-Language" content="ja" />の指定は必要ですか？
bAやミツエーは記述してるみたいですが・・。
後、パンくずリストやコピーライトのマークアップにどういったタグを用いていますか？
参考までに教えてください。

027 2009/09/18(金) 03:00:51 ID:MvOMoiBc

>>26
どのレベルでの話かはわからないが適当に答えてみる↓

言語の指定は推奨。
<html lang="ja">が入ってれば別にいいよ。
metaに入れたところでSEOに差が出るほどの影響はなし。

パンくずリスト：jsとかで出力させるなら別に意味付けいらないんじゃない？
HTMLで書くならh1にしちゃってもいんじゃない？（ TOP > ここ　→　<h1>ここ</h1> )

コピーライト：<adress>とかでやるとこ多いけど<p>でもなんでもいいよ。
そんぐらい、あんま何も影響ないよ。

SEO考えるならもっとでかい事やらなきゃいかん。そんなチマチマしたことでは
さして影響なし。

以上、半素人が頑張って答えました。

028 2009/09/18(金) 16:17:56 ID:pdzp96jA

パンくずリストにh1はさすがに
構造的におかしい気が・・。

029 2009/09/19(土) 01:44:43 ID:QnjyacDo

>>28
ビジュアル化が進んでFLASHはもちろん、サイトロゴやページの見出しを画像にしたり
するデザインが多くなってきているんだから、
物理・倫理マークアップとは別にgoogle検索用マークアップをしても
いいと思うのさ。（画像altのｈ1はgoogleは無視だからね。）
構造化よりも狙い撃ちキーワードの方が効果高いよ。
そりゃ、普通に倫理マークアップできるならするさ。
ちなみに某有名企業のサイトはパンくずh1でやってるよ。
効果は知らんがね。

030 2009/09/19(土) 02:55:01 ID:x4O3Om0E

えと、倫理(rin-ri)マークアップじゃなくて論理(ron-ri)マークアップじゃないでしょうか・・・

▲ページ最上部

ログサイズ：18 KB 有効レス数：50 削除レス数：0

不適切な書き込みやモラルに反する投稿を見つけた時は、書き込み右のマークをクリックしてサイト運営者までご連絡をお願いします。確認しだい削除いたします。

情報技術・IT掲示板に戻る全部前100 次100 最新50

スレッドタイトル：HTML/ＣＳＳをやさしく教えてくれるスレ

レス投稿