/* CSS・スタイルシート質問スレッド【18】 */

このエントリーをはてなブックマークに追加
1気の早い1
CSSに関する質問はこちらへどうぞ。 ※ 議論はよそで ※
■■■■■ 質問のしかた ■■■■■
・基礎は解説サイト(>>4・かなりわかりやすい)で勉強してください。
・質問の前に【FAQ】(>>5-7)を参照して、既出の再掲を避けて下さい。
・【FAQ】でもわからなかった場合、過去ログを検索すると載ってるかも。
 WinIEの場合は、[Ctrl+F]で検索できます。
・ブラウザによって対応していないプロパティーやバグがありますので、
 【解説など】(>>4)の対応表や「CSSバグリスト」に目を通しておきませう。
・土台のHTMLが間違ってるとCSS指定も意図通りに効きません。
 正当(valid)なHTMLを心がけて下さい。

初心者の疑問は大抵ここまでで解決します。

・OSやブラウザの種類とヴァージョンについては必ず明記してください。
 特にNetscapeは、ver.4までと6以降でまったく別物です。
・「環境を書け」とか「ソースは?」と求められたら応じませう。
 その方が回答が早く得られます。

過去スレや関連リンクは>>2-10
【過去ログ】【関聯スレ】>>2
【仕様書】【CSS検証】>>3
【解説など】>>4
【FAQ】>>5-7

http://fake_lint.tripod.co.jp/css.html
【FAQ】 http://fake_lint.tripod.co.jp/css.html#faq
【過去ログ】 http://fake_lint.tripod.co.jp/css.html#log
【関連リンク】 http://fake_lint.tripod.co.jp/css.html#related
2Name_Not_Found:03/04/12 03:36 ID:???
【過去ログ】
 http://mentai.2ch.net/hp/kako/974/974934062.html
 http://natto.2ch.net/hp/kako/984/984113434.html
 http://natto.2ch.net/hp/kako/992/992992981.html
 http://pc.2ch.net/hp/kako/996/996828258.html
 http://pc.2ch.net/hp/kako/1005/10050/1005047493.html
 http://pc.2ch.net/hp/kako/1011/10113/1011358982.html
 http://pc.2ch.net/hp/kako/1015/10154/1015474859.html
 http://pc.2ch.net/hp/kako/1019/10198/1019881572.html
 http://pc3.2ch.net/hp/kako/1025/10253/1025346520.html
 http://pc3.2ch.net/hp/kako/1028/10286/1028646616.html
 http://pc3.2ch.net/hp/kako/1031/10317/1031773943.html
 http://pc3.2ch.net/hp/kako/1034/10349/1034922586.html
 http://pc3.2ch.net/hp/kako/1038/10384/1038437758.html
 http://pc2.2ch.net/hp/kako/1041/10416/1041641395.html
 http://pc2.2ch.net/test/read.cgi/hp/1045124732/
 http://pc2.2ch.net/test/read.cgi/hp/1047154499/
【前スレッド】
 http://pc2.2ch.net/test/read.cgi/hp/1048775997/l50

【関聯スレッド】
・CSS/DHTMLバグ辞典スレッド ver2.0
 http://pc2.2ch.net/test/read.cgi/hp/991666454/l50
・CSSでイケてるデザインサイト 10
 http://pc2.2ch.net/test/read.cgi/hp/1048475227/l50
・* CSS[適用="2ch"]{ イケてるスタイルを:"作れ"}
 http://pc2.2ch.net/test/read.cgi/hp/1038678267/l50
・代替スタイルシートに萌え〜
 http://pc2.2ch.net/test/read.cgi/hp/991400015/l50
・独自拡張、草案段階のCSSについて語れ
 http://pc2.2ch.net/test/read.cgi/hp/1019912046/l50
3Name_Not_Found:03/04/12 03:37 ID:???
【仕様書】
・CSS1の仕様書の原文(英語)
 http://www.w3.org/TR/REC-CSS1/
・CSS2の仕様書の原文(英語)
 http://www.w3.org/TR/REC-CSS2/
・CSS1の仕様書の邦訳(日本規格協会訳/個人訳)
 http://www.y-adagio.com/public/standards/css1/toc.htm
 http://www.swlab.csce.kyushu-u.ac.jp/man/rec-css1/rec-css1.html
・CSS2の仕様書の邦訳(日本規格協会訳/個人訳)
 http://www.y-adagio.com/public/standards/tr_css2/toc.html
 http://www.swlab.csce.kyushu-u.ac.jp/man/rec-css2/cover.html

【CSS検証】
・W3C CSS 検証サービス
 http://jigsaw.w3.org/css-validator/
4Name_Not_Found:03/04/12 03:41 ID:???
【解説など】
・ごく簡単なHTMLの説明
 http://www.kanzaki.com/docs/htminfo.html
・ZSPC - Style Sheets Reference
 http://www.zspc.com/stylesheets/
・K@tsukun's PAGE! > CSS Reference
 http://hp.vector.co.jp/authors/VA022006/css/index.html
・とほほのスタイルシート入門
 http://tohoho.wakusei.ne.jp/wwwcss.htm
・ばけらの CSS リファレンス
 http://www.ne.jp/asahi/minazuki/bakera/html/css/reference
・Academic HTML::CSS2
 http://www.tg.rim.or.jp/~hexane/ach/
・ZSPC - CSS2対応状況ガイド
 http://www.zspc.com/documents/css2/
・CSS対応状況表
 http://hp.vector.co.jp/authors/VA022006/css/corrbrwser.html
・CSS1テストスイート http://www.doraneko.org/css1test/
・ブラウザのHTML4/CSS対応度テスト
 http://homepage1.nifty.com/emk/moz/browsertest.html
・CSS Laboratory対応表・一覧
 http://is.vis.ne.jp/charts/index.xhtml
・CSSバグリスト@CSSバグ辞典スレッド
 http://cssbug.tripod.co.jp/index.html
・Web標準普及プロジェクト (特に「HTML/CSSのよくある誤解・ミス」)
 http://www.mozilla.gr.jp/standards/index.html
・ブラウザによる振り分け (JavaScriptを使用しない方法)
 http://east.portland.ne.jp/~sigekazu/css/boxm.htm#ua
・( ´∀`)< CSS でイケてるデザインサイトリンク集2
 http://www.geocities.co.jp/SiliconValley-SantaClara/1308/
・* CSS { イケてるスタイルを:"作れ";} 発表所
 http://strict.jp/~sappari/2ch/css.php
5Name_Not_Found:03/04/12 03:41 ID:???
【FAQ】
Q1: IEでは大丈夫なのに、Netscape6 以降で見ると横スクロールバーが出たりするが?
A1: Windows版 Internet Explorerのボックス・モデルが間違った実装だからです。
「width と height の計算方法の実装の違いについて」参照。
http://hp.vector.co.jp/authors/VA022006/css/visualren.html#ref-width-height
width(height)は、要素の内容領域の幅(高さ)を指定するプロパティですが、
WinIE等では、ボーダー領域 + パディング領域 + 内容領域 の寸法で計算されます。
Netscape 6以降やMacintosh版 Internet Explorer 5 の計算が正しい。
WinIEもver.6 からは標準準拠モードにすると仕様通りに計算してくれます。
http://www.microsoft.com/japan/msdn/ie/ie60/cssenhancements.asp#cssenhancements_topic3
参考「IEとNNのBOXの計測方法の違いについて」
http://www.fromdfj.net/html/border2.html

Q2: text-align:center;を指定しても Netscape6(or7)ではtableなどブロック要素がセンタリングできません。IEでは中央寄せになるのに……
A2: IEの実装の誤りです。詳しくは下記(特に4.)をご覧ください。

1.'text-align'に関する考察
http://anslasax.net/css-make/t-a/index.html
2.IE5.5とNetscape6のCSS - 中央寄せ
http://tancro.stp-1.com/stylesheet/n6_center.html
3.Internet Explorer 6におけるCSSの拡張
http://www.microsoft.com/japan/msdn/ie/ie60/cssenhancements.asp#cssenhancements_topic6
4.ブロックレベル要素をセンタリングする方法
http://www.mozilla.gr.jp/standards/webtips0004.html
6Name_Not_Found:03/04/12 03:44 ID:???
【FAQ】
Q3: CSSで擬似フレームってどうやるの?
A3: 次のページを参考にして下さい。
overflow プロパティは擬似フレームも作成できる
 http://www.geocities.co.jp/SiliconValley-PaloAlto/6736/overflow.html
 http://www.geocities.co.jp/SiliconValley-PaloAlto/6736/files/frame.html
overflowを用いた擬似フレーム
 http://www.fromdfj.net/html/overflow.html

Q4: CSSで段組するには?
A4: 下記などを参照して下さい。
CSSを用いた段組の作成のコツ
 http://www.fromdfj.net/html/column.html
CSS段組レイアウトデザ委員会
 http://www.skipup.com/~l-_-l/web/
スタイルシートでマルチカラム・デザインを実現する方法
 http://www.motchie.com/article/multicolumn.html
tableを使はない段組:CSSによるマルチカラムデザインについての考察
 http://members.jcom.home.ne.jp/pctips/www/faq/Dangumi.html
 http://members.jcom.home.ne.jp/pctips/www/test/positiondangumi.html
スタイルシートでマルチカラムデザインの実現
 http://shiten.s9.xrea.com/etc/stylesheet/multi_column.htm
段組れいあうとてすと (floatによる段組の例)
 http://www.remus.dti.ne.jp/~a-satomi/nikki/tmp/dangumi.html
なかよしぱれっと (ネスケ4でも崩れない段組みの実例)
 http://village.infoweb.ne.jp/~fores/
7Name_Not_Found:03/04/12 03:45 ID:???
【FAQ】
Q5: なんかフロートの表示が崩れるみたいなんですけど?
A5: floatさせる要素にはwidth指定が必須(img要素以外)。抜かすとMacIEやOperaでの表示は保証できません。WinIEは勝手に補ってくれるだけです。
http://www.remus.dti.ne.jp/~a-satomi/nikki/tmp/floattest/float_not-specified-width.html
これに当て嵌まらなかったら「浮動要素の高さもheightに含めさせる方法」などを参考に。
 http://www.mozilla.gr.jp/standards/webtips0021.html#c1_2
  http://cssbug.tripod.co.jp/detail/winie/b079.html
   http://pc2.2ch.net/test/read.cgi/hp/991666454/683n

Q6:画面中央に配置するにはどうすれば?
A6:左右(水平方向)のセンタリングは既出。垂直には色々な方法があります。
 「スタイルシート 縦中央(垂直中央)」参照のこと。
 http://www.parkcity.ne.jp/~chaichan/qanda/qa3558.htm

Q7:背景画像を二つ指定するにはどうするか。
A7:できません。background-imageは一要素に一つだけ。要素を重ねるなど工夫しませう。

Q8.いままでHTMLでやってた××をCSSでやるにはどうすればいい?
A8.下記に書いてあります。テーブル・レイアウトは段組のFAQ(A4・>>6)をご覧あれ。
「いままでの HTML との対照」
 http://www.tg.rim.or.jp/~hexane/ach/fscs/fscsa1.htm
 http://www.tg.rim.or.jp/~hexane/ach/sfcs/sfcsa1.htm
 http://www.tg.rim.or.jp/~hexane/ach/tocs/tocsa1.htm
8Name_Not_Found:03/04/12 03:55 ID:???
ちんぽ
9Name_Not_Found:03/04/12 03:56 ID:???
胸毛おじさん
10Name_Not_Found:03/04/12 04:00 ID:???
Web Site 作成支援 - CSS とはなんだろうか
 http://msugai.fc2web.com/web/CSS/
11Name_Not_Found:03/04/12 04:17 ID:???
 女の子はアホな方がカワイイと思う



結局まだまだレイアウトを自在に表現できないCSSじゃあ
validじゃなくてもしかたないよね。
ちょっと凝ったことやろうとするとやっぱり既存の方法に頼るしかない
って寂しいね。
12Name_Not_Found:03/04/12 04:20 ID:???
>>11 ※ 議論はよそで ※
ここは質問スレッドです。
13Name_Not_Found:03/04/12 05:19 ID:pU13ygGl
>>7のQ7なんですが、
2つの画像を右下と左上にそれぞれ位置指定する事は可能ですか?
要素を重ねるってのが理解できないんですが。

14Name_Not_Found:03/04/12 05:38 ID:???
>>13
<div class="hage">
<div class="sage">
</div>
</div>
hageに右下、sageに左上を指定
15Name_Not_Found:03/04/12 05:46 ID:???
背景画像だったら不可能。
要素を重ねるってのは
<div><p>hoge</p></div>
みたいな感じ。
1613:03/04/12 05:46 ID:pU13ygGl
>14
やってみます。
17Name_Not_Found:03/04/12 05:55 ID:q6lVsLru
1813:03/04/12 06:06 ID:pU13ygGl
>14-15
ありがとうございました。

  ∧_∧   / ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄
 ( ´・ωメ) < ふ・・不可能・・ショボーン
 (つ旦と)  \__________
 と_)_)
19Name_Not_Found:03/04/12 06:17 ID:???
sageろ
20Name_Not_Found:03/04/12 07:16 ID:???
え?むりなの?
21Name_Not_Found:03/04/12 10:04 ID:???
ん?できるの?
22Name_Not_Found:03/04/12 10:58 ID:???
は?どっちなの?
23Name_Not_Found:03/04/12 11:32 ID:Grrv8eF+
前スレの911ですが、まだ問題を解決できていません。 ページに背景色つきの上枠を作りたいのですが、
常套手段ではIE5.0で致命的な表示不良が起こり、 これを回避する方法を考えています。

htmlのソースはこうです。

<div id="uewaku">

<div id="hidariue">
<a href="index.html" class="kirikae"><img src=".画像.gif" alt="画像" width="100" height="40" class="画像" /></a>
</div>

<div id="migiue">
<div class="annai"><a href="../index.html" class="kurozi">扉</a> > 目次</div>
</div>

</div>

スタイルシートはこれで問題はありません(ie5.5-6/ns7/op7)。

#uewaku { width: 100%; height: 40px; background-color: #333000; color: #b7a800; }
#hidariue { float: left; width: 40%; }
#migiue { float: right; text-align: right; width: 40%; }

質問はつづく。
24Name_Not_Found:03/04/12 11:35 ID:Grrv8eF+
しかしこれだとie5で見るに絶えない空恐ろしい状態になります。原因は
#uewakuのwidthとheightで、これさえのければよいのですが、
そうするとn7/op7などでは#uewakuが0行と認知されて背景色がつきません。
そこでwidthとheightを指定せず、#uewakuの閉じタグ</div>の前に
<br style="clear:both">と入れると無事、ie5/n7/op7で同じ
表示が得られるのですが、今度はie6がheightを40pxプラス<br>と
認知して表示します。

そこでやっぱり<br style="clear:both">はやめにして、
スタイルシートを変更、

#uewaku { background-color: #333000; color: #b7a800; }
#hidariue { float: left; width: 50%; height: 41px; background-color: #333000; color: #b7a800; }
#migiue { float: right; text-align: right; width: 50%; height: 41px; background-color: #333000; color: #b7a800; }

として、要するに#uewaku不要にしてみたのですが、これだど
n7/op7でなぜか#migiueと#hidariueの間に隙間が生じます。
margin,padding,borderを加えて全部0にしてもだめです。

width,heightを使わず、同じ表示を得るよい手はないでしょうか。
25Name_Not_Found:03/04/12 12:00 ID:???
>>24
あのさ、そのバグの解決法は俺のスキルじゃちょっとわからないんだけど、
IE5.0わかってるだけでも相当なバグがあるから、IE5.0でもきっちり同じ見栄えを、
と思うならJavascriptで振り分けたほうがいいと思う。
26Name_Not_Found:03/04/12 12:03 ID:???
>>23-24
それはFAQのA4に既出。>>7見て。
>これに当て嵌まらなかったら「浮動要素の高さもheightに含めさせる方法」などを参考に。
> http://www.mozilla.gr.jp/standards/webtips0021.html#c1_2
>  http://cssbug.tripod.co.jp/detail/winie/b079.html
>   http://pc2.2ch.net/test/read.cgi/hp/991666454/683n
2726:03/04/12 12:10 ID:???
ごめん、A4でなくてA5だな。
要するに、<br style="clear:both">を入れて、且つ#uewakuにwidthを指定すること。
2824:03/04/12 12:26 ID:Grrv8eF+
皆さん、ありがとう。レスがついて幸せです。ようやく解決しました。
多少のバクなら目をつぶったのですが、かなりシェアのあるIE5で
heightが1000pxにされるような恐ろしいバグはさすがに見逃せません。
>>27さん、widthとheightは使わずに、という条件なので
貫徹してまで悩みぬいたのです(泣)

解決はこう。
<br style="clear:both">の変わりに、
<div> </div>に書き換え。
スタイルシートは、
div { clear: both; line-height: 0px; }

brでクリアするとIE6でheightの幅が大きくなります。そこで
空白文字を入れて、それをline-height:0pxで消したわけです。
あまりに悲しい解決法だったので、divのクラス名は「悲しい」にしました。
いままで安易に<br style="clear:both">していた方、
悲しいけど、こちらのほうが安全です。。。
29Name_Not_Found:03/04/12 12:32 ID:???
>>28
<hr style="clear:left;margin:0;height:0;"> の方がいいのでは。
但し互換(Quirks)モードだと、Mozillaに限り効かないけどね。

で、いままでのこと「バグ辞典スレッド」に登録しておいてくれない?
30Name_Not_Found:03/04/12 12:33 ID:???
あまりにアレな解決法なんで口出ししてみる
同じ結果を得るのに必要なプロパティだけに絞ってみた
これでぶっ壊れるようなバグはIE5にはなかったと思うんだが・・・

#uewaku { height:41px; background-color: #333000; color: #b7a800; }
#hidariue { float: left; width: 40%; } /*widthは画像に合わせてもいい*/
#migiue { text-align: right; }
3126:03/04/12 12:39 ID:???
>>30の指摘する通り、#migiueのfloat:rightは不要だな。これでいいはずだが。
#uewaku { width: 100%; background-color: #333000; color: #b7a800; }
#hidariue { float: left; width: 50%; height: 41px; background-color: #333000; color: #b7a800; }
#migiue { margin-left: 51%; text-align: right; height: 41px; background-color: #333000; color: #b7a800; }
<div id="uewaku">
<div id="hidariue">
<a href="index.html" class="kirikae"><img src=".画像.gif" alt="画像" width="100" height="40" class="画像" /></a>
</div>
<div id="migiue">
<div class="annai"><a href="../index.html" class="kurozi">扉</a> > 目次</div>
</div>
<br style="clear:both">
</div>
3224:03/04/12 14:15 ID:Grrv8eF+
>>29
<hr style="clear:left;margin:0;height:0;">が通用するのは
オペラ7だけのようです。

>>30さん、>>31さん、#uewakuにはwidthとheightのどちらか片方だけ
でもIE5.0でむごい障害が発生します。となると、clearするしか
方法はなさそうです。
ちなみに#migiwakuは簡略化しています。そこにはフォーム部品などが
ごてごて入っているのでfloatにしました。怪しんで消してみましたが、
floatは無関係でした。

<br style="clear:both">は曲者で、IE5とIE5.5−6で解釈が異なります。
NS7/OP7はすなおにクリアするだけですが、IE6でそれをすると
heightの下にプラスbrの1em分の余白が生じます。
33Name_Not_Found:03/04/12 14:22 ID:???
>>31−32
widthが使えないなら、#migiwakuにfloat:rightは必須。
で、ブロック要素内では左揃いだからtext-align:rightも必須。
34Name_Not_Found:03/04/12 14:25 ID:???
>>32
>#uewakuにはwidthとheightのどちらか片方だけ
>でもIE5.0でむごい障害が発生します。

具体的には? 再現条件は本当にwidthの所為だけなのか? 下記へどうぞ。

・CSS/DHTMLバグ辞典スレッド ver2.0
 http://pc2.2ch.net/test/read.cgi/hp/991666454/l50
35Name_Not_Found:03/04/12 14:28 ID:???
>>32
><br style="clear:both">は曲者で、IE5とIE5.5−6で解釈が異なります。
>NS7/OP7はすなおにクリアするだけですが、IE6でそれをすると
>heightの下にプラスbrの1em分の余白が生じます。

それは、#uewakuにheightを指定してるからだろ。
cf. http://cssbug.tripod.co.jp/detail/winie/b079.html
36Name_Not_Found:03/04/12 14:50 ID:???
>>23-24
#hidariueの中に高さ40pxのimg要素があるなら、height指定なんか要らないのでは?
#uewaku { background-color: #333000; color: #b7a800; }
#migiue { float:right; width:50%; text-align: right;}
#hidariue {height: 41px;}
<div id="uewaku">
<div id="migiue">
<div class="annai"><a href="../index.html" class="kurozi">扉</a> > 目次</div>
</div>
<div id="hidariue">
<a href="index.html" class="kirikae"><img src=".画像.gif" alt="画像" width="100" height="40" class="画像" /></a>
</div>
</div>
3724:03/04/12 14:53 ID:???
>>35
いいえ。
heightの下にプラスbrの1em分の余白、というのは、
画像の縦幅プラスbr1行分の余白のことです。
でも、ここでの大前提はwidthとheightを指定しないという
一種の異常事態でのことですから。

DHMLバク辞典のほうに移ってソースをアップします。
38Name_Not_Found:03/04/12 15:05 ID:???
>>37 >>36の通りにしてもうまくゆかない? 
ポイントは右左の記述順序を逆にしてfloat:right;にすることと、
#hidariueにはfloatを指定しないこと。
3924:03/04/12 15:24 ID:???
>>36
おっしゃるとおりにhtmlソースの#migiueと#hidariueを入れ替えて、
cssも36さんが書いた通りに書き換えましたが、だめでした。
#uewakuにwidthもheightもないのに、もう訳がわかりません。
もちろんIE5意外ではきちんと表示されます。
40質問バカ:03/04/12 16:31 ID:???
いきなり質問なんですけど
「"red" style="background-image:url(JAVASCRIPT:」
  ↑この状態でJSを自動的に(強制的に)切らす方法はどうやってやればいいんですか?
41質問バカ:03/04/12 16:34 ID:???
↑の"red"は必要ないです^^;ごめんなさい。
42Name_Not_Found:03/04/12 17:36 ID:???
>>39
今ソース見てきたけどこれだけレイアウト目的のdiv入れていいなら
positionでやったほうがいいんじゃないの?
43Name_Not_Found:03/04/12 17:40 ID:???
>>40
環境くらい書けよ。
44Name_Not_Found:03/04/12 17:58 ID:???
>>42
だれがレイアウト目的のDIVだめっていったの?何のためのスタイルシートなんだよ。
45Name_Not_Found:03/04/12 18:19 ID:???
>>44
誰もレイアウト目的のdivが駄目とは言ってないだろうが。馬鹿か?
strictなHTMLにこだわらないなら、バグの出るfloatよりも
positionとか他の方法を試したほうがいいんじゃねーの?
と言ってるだけだが。
46Name_Not_Found:03/04/12 18:41 ID:???
>>24
ネスケ4対策してるようには思えないけどfloatにこだわる理由は?
47Name_Not_Found:03/04/12 19:55 ID:???
<hr size="n">ではなく、
CSSでhrに太さを定義することってできるんですか?
48Name_Not_Found:03/04/12 19:57 ID:???
>>47
自分で試せばすぐわかることを訊くなって。できるよ。
49Name_Not_Found:03/04/12 19:59 ID:???
自己解決。heightでできるね。
>>48
スマソ
50Name_Not_Found:03/04/12 20:12 ID:???
>>39
君のIEだけが狂ってるんだったりして。
だって「ウインドウズごとアボーン」したりしたんでしょ?
誰か他のIE5の人の追試が欲しいところだな。
5124:03/04/12 20:12 ID:???
>>44 >>45
positionは一番に試しました。IE5.0ではもうぐちゃぐちゃで、
目を覆いました。わたしがヘボいからですが。。。
positionはrelativeでもtop/bottom/left/rightの指定が神経質で、
どのブラウザでも崩さないようにするのは熟練の技が必要でしょう。
もちろん、文章のフローを無視してレイアウト順にhtmlを再構成するのなら
floatでもpositionでもらくらくレイアウトできます。雛型自体はごく簡単ですから。

>>46 ネスケ4は対策しています。ネスケ4とその他一般で分けています。
アップしたソースは問題を分かりやすくするために、超簡単に省きました。
あれをIE5.0/WINで見ると、ぞっとするようなことになります。
結論としては、

<div style="clear:both; font-size: 1px; line-height: 1%;">&nbsp;</div>

で、IE5.0/5.5/6.0 NS7 OP7 のすべてで完全に同じ見栄えになることが分かりました。
ちなみにインライン要素に指定してもダメでした。また、値に0を入れると、
ブラウザによっては無視するものもあり、やはりよくないようです。
<br style="clear: both;">でうまく行かなかった場合は、
これを試してみると、たいていはオッケーだろうと思います。見苦しいですが。
52Name_Not_Found:03/04/12 20:15 ID:???
>>46
CSS Laboratory > 研究室・目次 > html:hrエレメント・研究室
http://is.vis.ne.jp/lab/html_hr_element/index.xhtml
53Name_Not_Found:03/04/13 01:18 ID:???
.paragraph {
line-height: 140%;
font-weight: normal;
text-decoration: none;
line-break: strict;
padding-right: 20px;
padding-left: 20px;
font-family: 11pt "MS Pゴシック", "Osaka";
color: #333333;
}
p.paragraph:first-letter {
font: bold 2em "MS Pゴシック", "Osaka";
color: #FF0000;
float: left;
margin: 0px;
padding: 0px;
}
上ですが、
<p class="paragraph">次回の計画に向けて....
</p>
と適用したところ,二文字目以降の文にスタイルが適用されていません。
つまり色サイズ等の指定が無視されています。
対処法を教えていただけませんか。
54Name_Not_Found:03/04/13 01:33 ID:???
>>53
font-family: 11pt "MS Pゴシック", "Osaka";
これおかしいよ。
55Name_Not_Found:03/04/13 02:17 ID:???
>>54
<(´Д`)> ヒェエエ!
56Name_Not_Found:03/04/13 02:29 ID:???
最近オンラインカジノでよく遊んでるよ!
30ドルのチップを始めに貰えるのでよかったらやってみて♪
無料でできるプレーもあるし、結構楽しめるよ(^.^)
おすすめはルーレット!!赤か黒にかけるだけで、
50%の確率で2倍になるよ♪
http://white.sakura.ne.jp/~marchen/
57Name_Not_Found:03/04/13 03:50 ID:???
質問させてください。
台本のマークアップは<dt><dd>タグでと聞き、試してみたのですが、
実際の台本のように表示させようと思うと、なかなか上手く行きません。

<dt>長い長い長い長い名前</dt><dd>セリフは短め</dd>
<dt>名前</dt><dd>セリフが2行以上<br>セリフが2行以上</dd>

↑この例を

長い長い 「セリフは短め」
長い長い
名前
名前   「セリフが2行以上(略)
      セリフが2行以上」

という風に表示させようとすると、

長い長い「セリフは短め」
長い長い
名前  「セリフが2行以上(略)
名前   セリフが2行以上」

のように表示が崩れてしまいます。現在のCSSソースは以下の通りです。

dt { width : 4em ; float : left ; clear : left ; }
dd { margin-bottom : 1em ; }

段組みの指定が参考になるかと思い、>>6に載っていたサイトも
見てソースを試してみたりしたのですが、どうにも上手く行きません。
よろしくお願いします。
58Name_Not_Found:03/04/13 04:08 ID:???
>>57
dt { display : run-in; margin-right : 1em; }
これだけでOK。
ただし、display : run-inに対応してるブラウザは、現時点では少ない。
(Operaだけ?)
59Name_Not_Found:03/04/13 04:29 ID:???
>>57
ブラウザは? Moz系だと思うけど
60Name_Not_Found:03/04/13 05:02 ID:???
>>57

tableを使った方が楽じゃない?
登場人物と台詞からなる表だと考えれば、マークアップとしてもおかしくはないし。

th {
text-align : right;
vertical-align : top;
padding-right : 1em; /* 人物と台詞の間の余白(A) */
width : 4em; /* もっとも長い人物の名前+(B) */
}

thead {
display : none; /* 縦列の見出しは自明なので表示せず */
}

td p {
margin : 0; /* 人物名と台詞がずれないようにpのマージンを消す */
}

<table summary="第一場第一幕の台本。登場人物、台詞の順に記載。">
<caption>第一場第一幕 復活! レッツゴー三匹</caption>
<thead>
<tr><th scope="col" abbr="人物">登場人物</th><th scope="col" abbr="台詞">台詞</th></tr>
</thead>
<tbody>
<tr><th scope="row" abbr="じゅん">じゅん</th><td><p>じゅんでーす。</p></td></tr>
<tr><th scope="row" abbr="長">長作</th><td><p>ちょうさくでーす。</p></td></tr>
<tr><th scope="row" abbr="正">正児</th><td><p>三波春夫でございます。</p></td></tr>
</tbody>
</table>
6160:03/04/13 05:05 ID:???
>>60
失礼。「もっとも長い人物の名前+(B)」の(B)は、(A)の間違い。
62Name_Not_Found:03/04/13 05:31 ID:???
「レッツゴー三匹」ではなく「レツゴー三匹」が正しいとは思うが、
脊髄反射で「TABLEレイアウトは糞」という輩が登場することを期待してsage。
63Name_Not_Found:03/04/13 06:12 ID:???
>62
一行目はげしく同意

>57
tableでいいんでない? 線形だし。
64 ◆9plK6jko/k :03/04/13 06:40 ID:???
最近cssを使い始めたのですが、行き詰まってしまいましたので
質問させていただきます。
(cssファイル)
a:link,a:visited{〜}
a:hover,a:active{〜}

(htmlファイル)

<LINK REL="stylesheet" href="○○.css">


とりあえず教科書通りのこの形でハイパーリンクにカーソルを持っていった
状態に変化をつけることは出来たのですが、これを
「ページの上半分だけにスタイルを適用する」状態にしたいのです。
classやIDで指定する方法も考えたのですが、記載方法が独特なので
どうしたら良いのか皆目見当がつきません。
どなたかアドバイスお願いします。
65Name_Not_Found:03/04/13 06:46 ID:???
>>64
a:link { 〜 } /* 普通の*/
a:visited { 〜 }
a:active { 〜 }
a:hover { 〜 }
a.ue:link { 〜 } /* 上半分用*/
a.ue:visited { 〜 }
a.ue:active { 〜 }
a.ue:hover { 〜 }
66 ◆9plK6jko/k :03/04/13 06:49 ID:???
>>65
あ、なるほど……
ありがとうございました。これから試してみます。
67Name_Not_Found:03/04/13 06:52 ID:???
こういう手もある

a:link { 〜 } /* 普通の*/
a:visited { 〜 }
a:active { 〜 }
a:hover { 〜 }
ue { 〜 } /* 上半分用*/
.ue a:link { 〜 }
.ue a:visited { 〜 }
.ue a:active { 〜 }
.ue a:hover { 〜 }

HTML 上半分をspanなどでくくる
<span class="ue">
<a href ・・・
<a href ・・・
<a href ・・・
</span>
68Name_Not_Found:03/04/13 06:58 ID:???
>>67
.ue { 〜 } /* 上半分用*/  の間違い
69Name_Not_Found:03/04/13 07:03 ID:???
>>57
dd のブロックボックスは float ボックスである dt を無視して
レンダリングされるから、そうなるのが正しいはず

dt の行数が dd より多くならないようにするしかないんじゃ

>>67
そこで span が出てきますか
70 ◆9plK6jko/k :03/04/13 07:19 ID:???
みなさんありがとうございました。
おかげで問題は一通り解決しました。
71Name_Not_Found:03/04/13 07:50 ID:vw4pwcRq
お尋ねします。
body要素に
{border:solid #F0A8A8 15px}
と指定したところIE6.0ではページ全体に枠が表示されるのですが、
Opera7.03では下に空白が表示されます。
どうにかしてOperaでも空白が表示されないようにできないでしょうか?
72Name_Not_Found:03/04/13 07:53 ID:???
>>57-61
定義リストの段組は前スレッドでも既出。floatで十分できますよ。
http://pc2.2ch.net/test/read.cgi/hp/1048775997/655-680
dt { width:4em ; float:left ; clear:left ; }
dd { margin-left : 4.5em ; }

cf.「<dl> の整形」
http://www.remus.dti.ne.jp/~a-satomi/nikki/2001/12b.html#d18n03
>dd の margin-left を dt の width と同値にすれば、dd の内容が画面右端で
>折り返されても見た目がヘンにはならないとゆー特典もありまふ、
73Name_Not_Found:03/04/13 07:59 ID:???
>>71
それはIEが間違ってます。

Internet Explorer (Windows) CSSバグリスト
body要素に設定したボーダーが閲覧領域全体を囲むように表示される(IE5)
http://cssbug.tripod.co.jp/detail/winie/b036.html
74Name_Not_Found:03/04/13 08:00 ID:???
>>71
html { border: 〜; } とすれ
75Name_Not_Found:03/04/13 08:06 ID:???
>>69
>>>57
>dd のブロックボックスは float ボックスである dt を無視して
>レンダリングされるから、そうなるのが正しいはず

いいえ、正しくありません。下記参照。

CSSバグリスト
先行するフロートの上方に後続のフロートが置かれる
http://cssbug.tripod.co.jp/detail/winie/b093.html
http://cssbug.tripod.co.jp/detail/opera/b044.html
7671:03/04/13 08:11 ID:???
>>73
回答ありがとうございます
IEのバグだったんですが。
どうおりで片方だけ表示が違うわけですね。

>>74
教えていただきありがとうございます!
Operaでも正しく表示されるようになりました。
本当にありがとうございました。
7760-61:03/04/13 08:51 ID:???
>>62
知らなかった……今までずっと間違えてました。
ご教示、ありがとうございました!

と、質問者の感謝レスのふりをしてみる。
78Name_Not_Found:03/04/13 10:06 ID:???
>>75
>>57を良く見れ
79Name_Not_Found:03/04/13 11:47 ID:???
>>78 >>75のリンク先をよく見て。
>Cのフロートはclearプロパティにより回り込みが抑制されています。
80Name_Not_Found:03/04/13 14:36 ID:???
すみません教えてください。
テキストの「デザインだけ」を
アンカータグで囲った場合と同じにするには、どう書けばよいのでしょうか?
81Name_Not_Found:03/04/13 14:42 ID:???
>>80
曖昧すぎ。もっと具体的に。
82Name_Not_Found:03/04/13 14:43 ID:???
>>80
<body>
<a href="">
〜〜〜
</a>
</body>
83Name_Not_Found:03/04/13 14:47 ID:???
>>80
多分、こういう事だと思うけど
span.design:hover{
 color:#ff0000;
 text-decoration:underline;
}

<span class="design">ココのデザイン</span>
84Name_Not_Found:03/04/13 14:55 ID:???
a { display: block; } のことですか?
85Name_Not_Found:03/04/13 15:02 ID:???
下線を引きたいの?
86Name_Not_Found:03/04/13 15:07 ID:???
質問です。
<!DOCTYPEIE 〜に"http://www.w3.org/TR/html4/loose.dtd"を入れたIE6やOp6、NN7だと
<a href="http://2ch.net/" style="border-width: 1px;border-style: solid;width: 200px;">2ch</a>
のようにaにwidthを指定しても無効になってしまうのですが、
うまく表示させる方法はあるのでしょうか?
8757:03/04/13 15:09 ID:???
お答えくださった皆様、ありがとうございます。
テーブルを使っても良かったんですね。
台本は表じゃないよなぁと一人で悩んでおりました。

72さんの
dt { width:4em ; float:left ; clear:left ; }
dd { margin-left : 4.5em ; }
の方法を試してみましたが、名前の方が行数が多くなってしまう場合に
やはり前述のような表示の崩れがみられました(ネスケ7.0でテスト)
ただ、75さんのリンク先を見るとバグのようですので、
名前の行数の方が多くならない方向で調整するか
テーブルにマークアップし直すということでやってみます。
ありがとうございました。
88Name_Not_Found:03/04/13 15:41 ID:???
>>86
一部を除いてa要素のようなインライン要素にwidthは適用できませんよ。
styleにdisplay: blockと追加すればwidthが適用されますよ。
8986:03/04/13 16:29 ID:???
>>88
ありがとうございました。
90Name_Not_Found:03/04/13 17:14 ID:???
何でも文字が大きければいいような
こと言うやつっているけど、反対にあんまり文字が大きいと読みにくかったりする
場合もあるし、一概に文字サイズだけで言えないよな。だいたい、IEの中で字が
読めない奴はユーザースタイルシートでも使えばいいんだよ。
ここのスレの奴はvalidであればデザインなんかどうでもいいと思ってるような
奴らばっかりだから理想論しかでてこないんだよ。

あんまりここのスレのこと鵜呑みにするとダサイサイトしか出来ないよ。

9186:03/04/13 17:17 ID:???
>>90
参考にします。ありがとうございました。
92Name_Not_Found:03/04/13 17:29 ID:???
>>90は誤爆か。
93Name_Not_Found:03/04/13 18:38 ID:???
>>92
     §ノヽ§
     ( ・e・ ) うるせーばか
      (   )
      ∪∪
94Name_Not_Found:03/04/13 18:41 ID:???
>>93
     §ノヽ§
     ( ・e・ ) うるせーばか
      (   )
      ∪∪
95Name_Not_Found:03/04/13 19:47 ID:???
>>87
69が正しい。
そのバグは、float対floatについてのバグだから。
96Name_Not_Found:03/04/13 22:13 ID:???
誘導のためage
97Name_Not_Found:03/04/13 22:16 ID:???
>>96
     §ノヽ§
     ( ・e・ ) うるせーばか
      (   )      ∪∪
98Name_Not_Found:03/04/13 22:18 ID:???
>>57>>95
つまり、これでもいいわけだろ? IE6・NN7で確認。
<dl>
<dt style="float:left; width:4em; clear:left;background:aqua;">長い長い長い長い長い長い名前</dt>
<dd style="/*float:left;*/ margin-left:4.5em; background:lime;">短いセリフ</dd>
<dt style="clear:left;float:left; width:4em; background:fuchsia;">短い名前</dt>
<dd style="float:left;min-width:1em; margin-left:0.5em; background:red;">セリフが2行セリフが2行セリフが……</dd>
</dl>

……と思ったら、Opera 7だけうまくゆかないや。
99セルン ◆LUr2ERYJL6 :03/04/13 23:45 ID:???
>>57

dt { width : 4em;float:left;clear:both;}
dd {padding-bottom:2em;padding-left:2em;}/*IE相当強引*/

一応三大ブラウザぐらいなら大幅に同じだけど強引だね。。
そもそもその名前と台詞の関係配列強引じゃない?下の名前二ついるのかな?
一言に対しては一つの台詞でいいんじゃないの?
連続台詞なら二つに別けて書くのが普通と思われ。
100セルン ◆LUr2ERYJL6 :03/04/13 23:59 ID:???
>>57
すまん。洩れが勘違いしてた。
101セルン ◆LUr2ERYJL6 :03/04/14 00:02 ID:???
だとしたら
ddのbrを取って幅を指定する方(ddにwidth加える)が自然と言える
102Name_Not_Found:03/04/14 00:36 ID:???
◆LUr2ERYJL6 をNGワードに指定、と……
10357:03/04/14 01:35 ID:???
すみません、皆さんの意見をずっと読んで来たら混乱してきてしまいました。
とりあえずバグ辞典のスレも参考に、自分が試してみたソースです。

dl { width : 40em ;} /* 任意の幅 */
dt { width : 4em ; float : left ; clear : left ; margin : 0 ; } /* 名前の幅指定 */
dd { width : 34em ; float:left ; margin : 0 ; } /* 大枠の幅ー名前の幅未満を指定 */

これでネスケおよびSafariでは正しく表示されるようになりましたが、
Mac版IE5.2では以下のような表示になってしまいました。

長い長い「セリフは短め」
長い長い
名前
名前
「セリフが2行以上(略)
 セリフが2行以上」

>>98さんの例もコピペして試してみましたが、どのブラウザでも表示が崩れました。
104Name_Not_Found:03/04/14 01:40 ID:???
>>103
Note that in some browsers, the float property is not implemented or not properly,
which means that the layout won't be in columns in the rendering they'll make of the home page.
For sake of simplicity, we'll still refer to the different parts of the layout as left, middle and right columns,
even if it's not universally true.
105Name_Not_Found:03/04/14 01:41 ID:XNLxB9zu
>>103
もうテーブルでいーじゃーん。
10657:03/04/14 01:45 ID:???
103のソースで正しいのか正しくないのか、
>>75のバグがWindows版IEでも発生して表示が崩れるものなのか、
103のMac版IEでの表示の崩れはMac版IE独自のものなのか、
Windows版IEで確認できないので心配です。如何でしょうか。
素直にテーブルにした方が良いとは思うのですが、
情報の整理だけはしておきたくて。よろしくお願いします。

>>99
すみません、言わんとしていることがよくわからないのですが…。
107Name_Not_Found:03/04/14 01:45 ID:???
>>103
発言した人、発言の内容、でてーぶるでも問題ないと思うんだけどな。
108Name_Not_Found:03/04/14 01:53 ID:FmsBR48v
109セルン ◆LUr2ERYJL6 :03/04/14 01:56 ID:???
上の文章例

長い長い 「セリフは短め」
長い長い
名前
名前   「セリフが2行以上(略)
      セリフが2行以上」



dt {width : 4em;float:left;clear:both;}
dd {padding-bottom:2em;padding-left:2em;width : 10em }

で正常に表示される。三大ブラウザ問題なし。

強制改行のBRを入れているが文章的には不必要だと判断した。
ただし、DDのpaddingに関してはある程度バランスが必要と言う面で
相当強引なことは確か。とりあえず弄ってみればわかると思うけど。
110セルン ◆LUr2ERYJL6 :03/04/14 02:05 ID:???

余計なの付いてる・・・padding-left:2emは特に要らない。

padding-bottomの値が一番のポイントになるのかな。
111Name_Not_Found:03/04/14 02:28 ID:???
>セルン ◆LUr2ERYJL6

お前な、解答するならレスまとめろよ。固定がスレ占拠してんじゃねーよ

「ふ」みたいな香具師だな。いや、お前「ふ」だろ?
112Name_Not_Found:03/04/14 02:30 ID:???
>>106
dt の高さ > dd の高さ
dt の高さ < dd の高さ
これが混在する場合、floatを使ってうまくやる方法は(現時点では)ない

まず、dd を通常フローで流し込むと dt と dd の上辺が揃わなくなる(揃ったらバグ)
dd を float にすればいいのだけどIE等が馬鹿なので使えない

名前が折り返されないように、一番長いのに合わせてwidthを指定すれば
前者の方法が使えるんだけど、そうもいかないのかな
でなきゃ省略形で書くとか
<dt><abbr title="長い長い長い長い名前">長い人</abbr></dt>

これ以上は何ともいえないので後はそちらの判断で
113Name_Not_Found:03/04/14 03:27 ID:???
114Name_Not_Found:03/04/14 03:48 ID:???
115 ◆1w8jmuVPSI :03/04/14 15:04 ID:???
私はWin使いなのですが、図書館のMacのMacIE5.16で自分のサイトを見てみたら、
以下の記述でのサイト内リンクが、「最後の一つだけしかアンカーが見えない」
状態になっていました(サイト内全ページ)。
HTML4.01Strictでも、XHTML1.1でも同様でした。DOCTYPEは両方とも
公開識別子 + システム識別子を記述しています。
───────────────────────────
ul.navigate{
border-style : solid none solid none;
border-width : thin;
margin : 2em 0em 0em 0em;
padding : 0.5em 0em 0.5em 0em;
text-align : center;
border-color : #000099;
background-color : #e6e6fa;
color : #000000;
}
ul.navigate li {margin : 0em 0em 0em 0em;display : inline;background-color : #e6e6fa;color : #000000;}
ul.navigate li:before {content : "[ ";}
ul.navigate li:after {content : " ]";}
a:link {color : #0000ff;}
a:visited {color : #004080;}

<ul class="navigate">
<li><a href="../hoge/index.html">hogeコーナーへ</a></li>
<li><a href="../sitemap.html">サイトマップ</a></li>
<li><a href="../index.html">トップに戻る</a></li>
</ul>
116 ◆1w8jmuVPSI :03/04/14 15:04 ID:???
>115の続き
この例ですと、「トップに戻る」だけが表示されて、前の2つは
透明アンカーになっていました。一応マウスを持っていけば
ステータスバーにリンク先URIが表示されてリンクとして利くこと
は利くのですが非常に分かりづらくなっているので対処したいです。

テンプレートのバグ辞典の方とバグ辞典スレッドの方も調べて
みたのですが、該当するものが見つかりませんでした。
Googleで、「mac IE css display inline」「mac IE css before」
で調べている最中なのですが、見つからないですしMac使いの方が
おられましたら、フォローしていただけると助かります。

私はMacを持っていないですし、図書館は17時に閉まるので平日は
利用出来ないのです。

before, afterはWinIE6でも非対応なのですが、ただcontentの内容が
付加されないだけど、アンカー文字列自体に影響を与えることは
なかったのですが、そこが原因なのでしょうか。
それとも別のことなのでしょうか。
117Name_Not_Found:03/04/14 17:31 ID:???
>>115
原因はtext-align : center;とul.navigate liのbackground-color : #e6e6fa;。
ul.navigate liのbackground-color : #e6e6fa;を外せば解決。
118Name_Not_Found:03/04/14 17:32 ID:???
>>115-116
1. ul.navigate の text-align : center; を取る
2. ul.navigate li の background-color : #e6e6fa; を取る
のどちらかで、表示されるようになりました。
原因は不明ですが。
119115-116 ◆1w8jmuVPSI :03/04/14 17:57 ID:???
>>117 >>118
ありがとうございます。
前記したように、こちらはMacで確認するのが困難な状況
ですので、たいへん助かりました。

修正後、この土日に確認し報告させていただこうと思います。
重ね重ねありがとうございました。
120Name_Not_Found:03/04/14 18:05 ID:???
>>117-118
あんたらすごいな。俺どこに問題あるか全然わからんかった。
121Name_Not_Found:03/04/14 19:07 ID:???
>>115-119
こちらに登録しておいて下さいませんか。

CSS/DHTMLバグ辞典スレッド ver2.0
http://pc2.2ch.net/test/read.cgi/hp/991666454/l50
122119 ◆1w8jmuVPSI :03/04/14 19:55 ID:???
>>121
現在の時点でこちらが分かっていることについて報告させていただきました。
よろしくお願いします。
123Name_Not_Found:03/04/14 20:44 ID:???
<i style="font-style: italic;">斜め</i>
124Name_Not_Found:03/04/14 22:22 ID:???
スタイルシートで透過して背景を見えるように半透明にしたいのですが、これはwin2000とwinxpでしか見れないのでしょうか?
win9Xは透過に対応していなくて使えないフリーソフトがあったりしたのでどうなのかな?と思ったのですが、当方9Xの環境がなく試せません。
教えたください。
125Name_Not_Found:03/04/14 23:09 ID:???
>>124
>スタイルシートで透過して背景を見えるように半透明にしたい

できるとしたら、それは正式のCSSではなくWinIEの独自拡張です。
ですからOSは関係ありません、IEのヴァージョンが問題になります。
NetscapeやOperaで閲覽すると半透明にはなりませんよ。
126Name_Not_Found:03/04/14 23:19 ID:???
>>125
レス有難うございます
OS云々かと思っていましたが違うのですね、(´∀` )サンキュスコ!!!
127Name_Not_Found:03/04/14 23:21 ID:???
透過pngのことならスタイルシートと關係ないぞよ。
12857:03/04/14 23:25 ID:???
>>112
詳しい説明をありがとうございました。自分にも理解できました。
とりあえず現時点では素直にテーブルで行こうと思います。
長々とご迷惑をおかけしました。
129Name_Not_Found:03/04/14 23:30 ID:???
CSSと関係有り
背景色透過(background:transparent;)→OS・ブラウザに関係なく適用
背景半透明(filter:alpha();)→IEの独自拡張

CSSと関係無し
PNGの透過(αチャンネル)→ブラウザ・環境によってできない
130Name_Not_Found:03/04/14 23:43 ID:???
CSSと関係有り
背景半透明(-moz-opacity:***;)→Mozilla/NS6〜7の独自拡張

cf. http://www.openspc2.org/reibun/css/filter/004/
131Name_Not_Found:03/04/15 02:29 ID:???
132Name_Not_Found:03/04/15 04:36 ID:q3xu5Rs9
画面中央に配置するやり方がFAQのURL読んでもイマイチ解らない。
詳しく教えて。
133Name_Not_Found:03/04/15 04:54 ID:???
>>132
小学生レベルの質問だな。
まずどこがどのようにわからないのか教えてくれ。
そして何を中央に配置したいのか書け。
134Name_Not_Found:03/04/15 05:24 ID:q3xu5Rs9
いいから早く教えろよ。
135あぼーん:03/04/15 05:48 ID:???
あぼーん
136Name_Not_Found:03/04/15 06:04 ID:???
>>134
朝っぱらから釣りか。
何をどう配置したいのか書いてないのに答えられるはずがないだろう。

引き篭もりはコミュニケーション能力に欠けるっていうのは本当だな(藁
137Name_Not_Found:03/04/15 06:17 ID:q3xu5Rs9
わかったから早く教えろよ
138Name_Not_Found:03/04/15 06:42 ID:???
>>136
いちいち相手にすな。親切な香具師だな
139Name_Not_Found:03/04/15 06:44 ID:q3xu5Rs9
て言うか早く教えろよ
140Name_Not_Found:03/04/15 06:50 ID:???
画面中央に配置するやり方がFAQのURL読んでもイマイチ解らない。
詳しく教えて。
141Name_Not_Found:03/04/15 06:58 ID:q3xu5Rs9
何でもいいから早く教えろよ。
142Name_Not_Found:03/04/15 07:02 ID:???
質問です。
ページの先頭にサイトのロゴを入れたいので、見出しの
背景画像として指定してやることにしました。
また、見出しと本文の間に仕切りの線があると見やすい
と思い、下部だけに罫線を指定しました。

h1 {
background : transparent url(logo.png) no-repeat left;
height : 120px; /* 背景画像(logo.png)の高さ */
text-align : right;
border-bottom : thin solid black;
}

ところがこれだと、見出しの文字列と、下部の罫線の間に
隙間が空いてしまいます。
できれば、見出しの文字列と罫線の間に隙間が空かない
ようにしたいのです。
つまり、

■■■□□□□見出し
■■■□□□□□□□
■■■□□□□□□□
−−−−−−−−−−

これを、

■■■□□□□□□□
■■■□□□□□□□
■■■□□□□見出し
−−−−−−−−−

このようにする方法がありましたら、どなたか教えてください。
143Name_Not_Found:03/04/15 07:05 ID:???
>>142
絵の上に文字を描く
144Name_Not_Found:03/04/15 07:50 ID:???
画面中央に配置するやり方がFAQのURL読んでもイマイチ解らない。
詳しく教えて。
145Name_Not_Found:03/04/15 08:17 ID:???
>>142
vertical-align:bottom;
146Name_Not_Found:03/04/15 08:22 ID:???
>>132
読んでも分からへんねんて。アホやわ。
147Name_Not_Found:03/04/15 08:39 ID:???
画面中央に配置するやり方がFAQのURL読んでもイマイチ解らない。
詳しく教えて。
148Name_Not_Found:03/04/15 08:40 ID:???
>>142
height値にこだわらなければ height の代わりに padding-top で可能

こだわるなら・・・
<h1><span>見出し</span></h1>

h1 { position: relative; }
h1 span { position: absolute; right: 0; bottom: 0; }

とするしかないかね
149Name_Not_Found:03/04/15 09:16 ID:???
画面中央に配置するやり方がFAQのURL読んでもイマイチ解らない。
詳しく教えて。
150Name_Not_Found:03/04/15 09:40 ID:???
小学生レベルの質問だな。
まずどこがどのようにわからないのか教えてくれ。
そして何を中央に配置したいのか書け。
151Name_Not_Found:03/04/15 09:59 ID:???
画面中央に配置するやり方がFAQのURL読んでもイマイチ解らない。
詳しく教えて。
152Name_Not_Found:03/04/15 10:07 ID:???
http://www.parkcity.ne.jp/~chaichan/qanda/qa3558.htm
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=Shift_JIS">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>天地中央</title>
<style type="text/css"><!--
body {
margin:0;
padding:0;
}
div {
position:absolute;
top:50%; /* 内容に応じて調整 */
right:auto;
bottom:auto;
left:50%; /* 内容に応じて調整 */
}
--></style>
</head>
<body>
<div>■</div>
</body>
</html>
153Name_Not_Found:03/04/15 10:21 ID:???
画面中央に配置するやり方がFAQのURL読んでもイマイチ解らない。
を、NGWordに設定。
154Name_Not_Found:03/04/15 10:34 ID:???
画面中央に配置するやり方がFAQのURL読んでもイマイチ解らない。
詳しく教えて。
155Name_Not_Found:03/04/15 11:29 ID:???
画面中央に配置するやり方がFAQのURL読んでもイマイチ解らない。
詳しく教えて。
156Name_Not_Found:03/04/15 12:46 ID:???
しかし4時からよくやるな
157142:03/04/15 13:46 ID:???
>>145
自分も最初はそれを考えたのですが、vertical-alignはブロック要素には
適用されないので、無理です。

>>148
ありがとうございます。
padding-topを指定するやり方でなんとかしてみます。
158Name_Not_Found:03/04/15 13:54 ID:???
FAQの"URL"読んでやり方がわかったらすげーよな
159Name_Not_Found:03/04/15 15:50 ID:???
↑ヴァカ
160Name_Not_Found:03/04/15 17:11 ID:C/DVFtap
すみません、質問させて下さい。
ttp://kazuki.s18.xrea.com/help.html
このページの様にページの縦幅が短くても常にスクロールバーを表示させるには
どのようにしたら良いでしょうか?
161Name_Not_Found:03/04/15 17:14 ID:???
>>160
意味わかんない
162Name_Not_Found:03/04/15 17:20 ID:???
>160
スクロールバーでませんが……
163Name_Not_Found:03/04/15 17:30 ID:C/DVFtap
>>161
意味分からないですか…
スクロールバーって言い方が悪いのかな。
スクロールバーの土台って言うんですか?あれを出したいんです。

というのも、>>160のページの様に
どのページもページのセンターにテーブル(四角の箱)を置きたいんですが、
縦にスクロールするページがあると、右側にスクロールバーがでて、
センターがずれて嫌なのです。

で、常にスクロールバーの土台(?)を出しておきたいんです。
この説明で分かるかどうか分かりませんが、どうか宜しくお願いします。
164160=163:03/04/15 17:34 ID:???
ごめんなさい。
どうやらものすごい勘違いをしてました。
なんか自分の作ったページだけそれが出ない様になってました。
普通は出ますよね。

と、いうことでスルーしてください。

逝ってきます。
165Name_Not_Found:03/04/15 17:35 ID:hGq7DJWV
逆に、横スクロールバーだけ消せばいいんじゃねー?
166Name_Not_Found:03/04/15 18:28 ID:???
今日は釣り人が多いなぁ
167Name_Not_Found:03/04/15 19:14 ID:???
スクロールバーの土台っ消せるの?
168改定・追加:03/04/15 19:39 ID:???
このスレに書き込める資格のある人
★日本語で会話できる人
★釣り・ネタでしたといわない人>スレ違
169Name_Not_Found:03/04/15 19:49 ID:???
>>167
消せるよ
17040:03/04/15 21:49 ID:???
>>40
いまだにわからない。教えてください。
171Name_Not_Found:03/04/15 23:28 ID:???
>>170
質問文が意味不明。
他人にわかってもらえるような文章を書きましょう。

引き篭もりはコミュニケーション能力に欠けるっていうのは本当だな(藁
172Name_Not_Found:03/04/16 00:05 ID:???
最後の一文は自分の価値を下げてるよ>171
173Name_Not_Found:03/04/16 00:50 ID:UFFbsFyM
>>152
それの通りにやったらfloat:left;が効かなくなった。
画面中央に置く方法を教えろ。
174Name_Not_Found:03/04/16 01:11 ID:???
>>173
何を画面の中央に置きたいのか、それが問題です。
つーか、>>5読め。
175Name_Not_Found:03/04/16 01:29 ID:UFFbsFyM
'text-align'じゃねえよアフォ
176Name_Not_Found:03/04/16 02:27 ID:???
          /           \
          /             ヽ
         /   ,----、   __    ヽ
         !   /_    `'''''''´  `ヽ   i
          |  /               }  |
        _⊥< ,,,,,,,,__           |  !
        /r\f‐┴─-<_  ≦二ヽ__レ'!
       !ノ!. ヽ 厂二二┐ ̄r─‐-、 /⌒!
       l ヽ   !ヽ__//^ヽ!  ̄` ノ/iヽ /  / ̄ ̄ ̄ ̄ ̄ ̄ ̄
       \__! `ー--/!  \ヽ--'/├'/ < ばーか
         |   / L _ __)ヽ ̄  /‐'   \_______
         ,┤ i〈 、_____, 〉 /
        /  !  ヽ\+┼┼+/  /
      __/   ヽ    `ー‐‐'´ /
  , -‐''" i    \       人
-''~     |    \`ー----‐'´! iヽ、
177Name_Not_Found:03/04/16 02:41 ID:???
引き篭もりはコミュニケーション能力に欠けるっていうのは本当だな
178174:03/04/16 03:10 ID:???
>>175
text-alignじゃないのも載ってるんですが。
text-alignじゃない物がほしいのであれば、>>5のA2の4番目なんて如何でしょうか。
179Name_Not_Found:03/04/16 04:23 ID:???
>>173  >>1読め。
>・「環境を書け」とか「ソースは?」と求められたら応じませう。
> その方が回答が早く得られます。
180Name_Not_Found:03/04/16 16:52 ID:???
以前失敗して止めていた擬似フレームに再度挑戦してます。
>>6を見て何とか形にする事は出来たのですが、フレームというよりも
インラインフレームのようにしているのでOperaやMacIEだと擬似フレーム
になっている要素とその下の要素が重なってしまい、しかも一緒にスクロール
されてしまいます。何とか意図通りに表示させる事は出来ないでしょうか。
ソースは長くなるので鯖にそのままUPしておきました。
http://shinjuku.cool.ne.jp/drug_spider/
181Name_Not_Found:03/04/16 17:05 ID:???
>>180
OperaはOpera6のこと?だったらoverflow:autoに対応してないから仕方がない。
Opera7は対応してるから気にしなくてもいいと思う。
Macはちとわからん。すまん。
182Name_Not_Found:03/04/16 17:20 ID:???
>180
IEでJavaScript切ってたら広告とテキストが重なってえらいことになりますた…
183180:03/04/16 22:18 ID:???
>>181
確認したのは6.05でした。7では確認してないので見てみる事にします。

>>182
捨て鯖なので広告付きなのは許して下さい。
184Name_Not_Found:03/04/17 11:57 ID:???
メディアタイプにhandheldっていうのがあるけど
これに対応している情報端末ってあるの?
185Name_Not_Found:03/04/17 16:32 ID:???
携帶は、下手にCSS対応するよりスタイルシート・オフであって欲しい。
186Name_Not_Found:03/04/17 22:24 ID:???
>>185
AUのことか!
背景画像まで読み込もうとするからな。
携帯サイズで両端に5%もマージンいらねえだろ、って感じだ。
187厨房:03/04/18 00:23 ID:qJ7X4D0t
質問させて下さい。
書き込みフォームの背景を透明にしようとして、
そのフォームのあるテーブルに

style="filter: Choroma(color=#FFFFFF);"

と書いたら、背景も透けてカコイくなったのですが、
書き込み中の動作が重くなりますた。
サーバーにもかなりの負荷がかかってるのでしょうか??
188Name_Not_Found:03/04/18 00:27 ID:???
>>187
filterプロパティはブラウザの処理が重くなる
189厨房:03/04/18 00:31 ID:???
>>188
ということは、自分で使う分には問題無しってことですかね・・・
本当はAlphaタグで指定して、テーブルもうっすら残したかったのですが、
文字まで透けちゃって・・・(´Д`;)
190Name_Not_Found:03/04/18 00:51 ID:???
>>189
IE以外じゃ透過しないけどね。
191Name_Not_Found:03/04/18 14:09 ID:???
divとかの高さをウインドウの大きさに合わせるのはやっぱ無理ですか?

heightって%は使えないですよね?
192Name_Not_Found:03/04/18 14:13 ID:???
>>191
>heightって%は使えないですよね?
なんでそんなこと思ったのかな。
仕様書に書いてありますよ。>>3-4でお勉強しませう。
http://hp.vector.co.jp/authors/VA022006/css/visualren.html#height
193Name_Not_Found:03/04/18 14:26 ID:???
>>192
div{height:70%;}
とかやっても何も起こらない(指定しないときと全く同じ)んですが・・・
div{height:300px;}
とかだったらちゃんとなるのに・・・
194Name_Not_Found:03/04/18 14:38 ID:???
>>193
body { height: 100% }
って指定しとかないとダメだと思う。
195Name_Not_Found:03/04/18 15:00 ID:???
>>194
出来ますた。ありがとうす。
196Name_Not_Found:03/04/18 22:12 ID:???
スタイルシートでJavaScriptを無理矢理 無効 にする方法ってどうやるんですか?
197Name_Not_Found:03/04/19 00:35 ID:???
>>196
逆じゃないの?
JavaScriptでスタイルシートを無効にするでは?
198Name_Not_Found:03/04/19 00:40 ID:???
ネタでないとして
script {display: none;}
script[type="text/javascript"] {display: none;}
とか?試してないから有効なのかどうかは知らないけど
199Name_Not_Found:03/04/19 08:12 ID:???
cssを貼ればおかしい所、直してくれるの?
200Name_Not_Found:03/04/19 09:35 ID:???
>>199
「こういうスタイルを実現したいけど、うまくいかない(やり方がわからない)」
という場合はここで訊くといいけど、
「おかしい所があったら直してください」
という場合は、下記のスレで訊く方がいいと思うよ。
http://pc2.2ch.net/test/read.cgi/hp/1040377672/l50
201199:03/04/19 09:38 ID:???
>>200
誘導ありがとうございます。
202196:03/04/19 10:18 ID:???
>>197
いや、違うんですよ。
>>198
ありがとうございます。試してみます。
203Name_Not_Found:03/04/19 10:31 ID:???
「スタイルシートでJavaScriptを無理矢理 無効 にする方法」なんて無いよ。
204Name_Not_Found:03/04/19 13:57 ID:???
じゃあどうやればJavaScriptを無理矢理 無効 にする方法を実現できるんでしょうか?
色々と捜したんですが・・・。
205Name_Not_Found:03/04/19 14:07 ID:???
>>204
ブラウザの設定でできる。
206Name_Not_Found:03/04/19 14:10 ID:???
>>204
あなたはどの立場でJavaScriptを無効にしたいの?
製作者の立場で言ってるなら、そもそもJavaScript使わなければいいじゃん。
自分でJavaScript入れてて、それを無効にしたいってわけわかんないよ…。
閲覧者の立場で言ってるなら、ブラウザの設定でJavaScriptの機能をOFFにすればいい。
これはCSSとはなんの関係もない。Webサイト制作初心者スレというよりもPC初心者板行き。
207Name_Not_Found:03/04/19 14:13 ID:???
広告をあぼ〜んしたいんだと見た。

通報しておいた。
208山崎渉:03/04/20 03:10 ID:???
   ∧_∧
  (  ^^ )< ぬるぽ(^^)
209山崎渉:03/04/20 03:44 ID:???
   ∧_∧
  (  ^^ )< ぬるぽ(^^)
210Name_Not_Found:03/04/20 16:31 ID:???
WinのIE6は、contentプロパティを正確に解釈できまつか?
211Name_Not_Found:03/04/20 17:07 ID:???
>>210 いいえ
212210:03/04/20 17:12 ID:???
>>211
ありがとうございます。
|∇≦)うひ
213Name_Not_Found:03/04/20 17:36 ID:???
>>210-212
……なんのために>>4に対応表が挙げてあるのか。
214Name_Not_Found:03/04/20 19:07 ID:???
質問ですが、
リンクにマウスポインタを合わせると、文字に背景が付くタグってどうするのでしょうか?
お願いします。
215Name_Not_Found:03/04/20 19:11 ID:???
>>214

a:hover { background-image : url(xxx.png); }

これでわかんない場合は>>4に挙げられている解説ページで勉強してください。
216Name_Not_Found:03/04/20 19:12 ID:???
>>214
とりあえず>>4で挙げられているサイトで勉強してみてください。
それでもわからなければお答えします。
217Name_Not_Found:03/04/20 19:12 ID:???
>>214
どこかそんなことをやってるサイトがあるの?
なら、そこのソースを見て真似すればわかるでしょ。
たぶん、マウスオーバー効果はa:hoverセレクターで、
背景をつけるのはbackground-imageプロパティー。
>>4読めばあなたにも出来ますよ。
218216:03/04/20 19:14 ID:???
重コーン
219Name_Not_Found:03/04/20 19:24 ID:???
>>214
>文字に背景が付くタグってどうするのでしょうか

……「タグ」とか言ってる時点で既に全然理解できてないな、こりゃ。
基礎から勉強しておいてほしい。
220119 ◆1w8jmuVPSI :03/04/20 20:33 ID:???
>>117 >>118
教えていただいた方法のうちの一つ「li要素のbackground-color
指定をなくす」で、図書館のMacIE5.16で問題ないことを確認
いたしました。ありがとうございました。
221Name_Not_Found:03/04/20 21:19 ID:???
<div>とあるブロック要素</div>
<h1>見出しキター(・∀・)ー</h1>
<div>いくない</div>

コレを
―――――
見出しキタ(・∀・)ー
―――――
とあるぶろっく
イクナイ

と位置を指定できますか?
222Name_Not_Found:03/04/20 21:29 ID:???
>>221
position使ってできるだろ。でも不自然なのでお獎めできない。
223:03/04/21 12:46 ID:aaXU9/AQ
css-validatorで検証したら、検証結果云々以前の段階で、
「スタイルシートが見つかりませんでした。」
と表示が出てしまう....

先週は全く同じページでも検証結果が表示されたのになんでだろ?
もしかしてDOCTYPEをきちんと書いていないと読み込んでくれなくなった?
今朝の5:00頃updateしたみたいだけど...
224:03/04/21 14:05 ID:???
今検証してみたら、ちゃんと結果が出るようになった....
原因がわからないけど、何はともあれ一件落着。
お騒がせしました。
225Name_Not_Found:03/04/21 14:55 ID:???
独り言は余所でやらんかい
226:03/04/21 16:48 ID:???
バグっぽい状況だったので報告のつもりだったのが結果的には独り言のようになってしまった。
もうしわけない。
227Name_Not_Found:03/04/21 21:37 ID:???
font style="background-image:url(javascript:document.body.
これで壁紙を貼りたいんですが続きはどうしたらいいんでしょうか?教えてください・・・。
228Name_Not_Found:03/04/21 22:10 ID:???
ワケ ワカ ラン(AA略
229Name_Not_Found:03/04/21 22:51 ID:???
>>227
もっとわかりやすく書いていただけると、解答しやすくなります。
230226:03/04/21 22:57 ID:???
>>229
そこをインテリジェントに解釈して回答してくださいよ。
回答できないのなら黙ってろ。
231Name_Not_Found:03/04/21 23:01 ID:???
騙りシパーイか。惨めだな。
232Name_Not_Found:03/04/22 00:21 ID:???
以下のようなソースで複数の画像を一つの画像のように見せたいのですが
Opera7だときちんとmargin無しで表示されるのですが
IE6だと各リストの間に隙間があいてしまいます。
IEもしくはOperaのバグでしょうか?

どうすればIEでも隙間が開かないようにできますか?

<ul class="edit">
<li><img src="img/edit01.png" width="230" height="16" alt="edit01.png" /></li>
<li><img src="img/edit02.png" width="230" height="16" alt="edit02.png" /></li>
<li><img src="img/edit03.png" width="230" height="16" alt="edit03.png" /></li>
<li><img src="img/edit04.png" width="230" height="16" alt="edit04.png" /></li>
</ul>

.edit li {
margin: 0;
list-style-type: none;
}
233Name_Not_Found:03/04/22 00:26 ID:???
>>232
不思議マークアップの匂いがぷんぷんするが……

line-height : 1; padding: 0; でもだめ?
234Name_Not_Found:03/04/22 00:39 ID:???
>>232
なぜにリスト???
235232:03/04/22 01:00 ID:???
>>233
.edit li {
line-height: 1;
margin: 0;
padding: 0;
list-style-type: none;
}

でやってみましたが、だめでした。

>>234
ソフトウェアの説明しているページを作っているのですが、
ドロップダウンリストの説明をしようと思ってまして
リストを画像で説明したかったので、各リストを画像に分けて
画像にリンクを貼って<dt><dd>を使って説明している部分に
ジャンプさせたいと思っています。
236Name_Not_Found:03/04/22 01:15 ID:???
>>235
そうじゃなく、なんでリストなんか使って並べるのってこと
237Name_Not_Found:03/04/22 01:19 ID:???
>>235
それならば、<li>使わなくても<div>とかのブロック要素に
marginをとって、display:list-item;でリストboxを生成したら?
こんな感じで
div {
margin-left:20px;
display:list-item;
list-style-type:square;
}
238Name_Not_Found:03/04/22 01:20 ID:???
>>235
それだったら普通に1つの画像&クリッカブルマップの方が良いような
239Name_Not_Found:03/04/22 01:23 ID:???
>>232
font-size: 1px (ピクセル数はてきとう)
を追加するとくっつくね
240Name_Not_Found:03/04/22 03:55 ID:???
日本語で書いてある CSS のリファレンス本で、
最高の奴を教えてクリ。
ぶっちゃけ、疲れ目の時は紙で読みたい。
241Name_Not_Found:03/04/22 04:17 ID:???
>>240
明興堂 「3日で覚えるスタイルシート・マスター!」¥1700
242Name_Not_Found:03/04/22 06:33 ID:???
>>240
液晶ディスプレイに変えれ
243Name_Not_Found:03/04/22 09:08 ID:???
>>242
人による
244Name_Not_Found:03/04/22 21:33 ID:???
>>240
すみけんさんの『スタイルシートWebデザイン CSS2完全解説』、とマジレスしてみる。

http://www.amazon.co.jp/exec/obidos/ASIN/4774106224/qid=1051014730/sr=1-3/ref=sr_1_2_3/249-9147780-5855508

5年前の本だけどな。
245Name_Not_Found:03/04/22 21:41 ID:???
>>244
5年経ってもどうだ?
CSS2を100%を解釈できるブラウザなんて存在しないのが現状だね(w


246Name_Not_Found:03/04/22 21:51 ID:???
>>240
プリント・アウトして読めば?
出来のいいサイトの解説は印刷本に優るよ。

>>244
[スタイルシートWebデザイン]原稿配布
http://www.asahi-net.or.jp/~jy3k-sm/css1/index.html
247Name_Not_Found:03/04/22 22:47 ID:???
本が売れなくなる
248Name_Not_Found:03/04/22 22:54 ID:???
>>240
>246とどうよう、
プリントアウトして読めば?
と言う意見。

プリントアウトするのはもち仕様書。
249240:03/04/22 23:23 ID:???
優れた編集の書籍ってやっぱり存在するでそ。
リファレンスとかだと、そういうの顕著じゃん。
基本はだいたいわかってるから、とにかく辞書的に使えるのを探してマス。
250Name_Not_Found:03/04/22 23:30 ID:???
私の見た限り、Web上のより優れた紙のCSSリファレンス・解説書は無かった。
本屋であれこれ探してみたが、どれもWeb上の優良サイトには及ばなかったので、
金出してまで購入しなくてもいいやと思った。これが三年前。
251Name_Not_Found:03/04/22 23:45 ID:???
>>250
優れた編集の書籍ってやっぱり存在するでそ。
252Name_Not_Found:03/04/22 23:55 ID:???
>>251
例を出しておくれ。
>>250は少なくとも「三年前」は「CSSリファレンス・解説」の分野では無かった、
ってことだろ。
その後の刊行書やその他の分野では勿論優れた書籍もあるかもしれんがな。
253Name_Not_Found:03/04/23 00:02 ID:???
254Name_Not_Found:03/04/23 03:23 ID:???
すみません、初歩的な質問なのですが、
CSSレイヤーを使ってレイアウトする場合、<body>〜</body>間には
ボックス要素化していない従来のテーブルレイアウトと組み合わせるのはタブーですか?
ブラウザのサイズに合わせて可変するレイアウトにしたいのですが、メニューだけドロップダウン型にしたいのです・・・
255Name_Not_Found:03/04/23 03:33 ID:???
>>254
>ボックス要素化していない
すべての要素にはボックスがあるんだが……意味がわからない。

メニューをドロップダウン型にしたいというのはselect要素を使うということ?
それだったらJavaScriptなので誘導することになるよ。
256254:03/04/23 03:40 ID:???
変な言い方ですみません。
例えれば、従来のテーブルを使ったレイアウトのHTMLに
CSSレイヤーを混在させるのは問題ないのか、ということです。
私の場合、普通だとCSSレイヤーを使う場合は全てレイヤーだけでレイアウトするのですが、
ブラウザのサイズに追従する可変型のデザインだとテーブルの方がシンプルに
出来そうな気がして・・・ただ、メニューだけレイヤーを使って階層化できるものに
したかったのです。
以前、NN4で混在させようとして、うまくいかなかった記憶があるので、
根本的にタブーなのかな、と思ったもので・・・
257Name_Not_Found:03/04/23 07:15 ID:???
CSSレイヤーって何?
258Name_Not_Found:03/04/23 07:55 ID:???
>>256
あんまり変な用語を作られても困るが。
基本的にtableでレイアウトして部分的にposition:absoluteで絶対配置にしたいということだと推測すると、
それ自体は問題ない。好きにしてくれ。
管理が面倒になるのでお勧めはしないが。
259Name_Not_Found:03/04/23 09:31 ID:???
>>256 >NN4で混在させようとして、うまくいかなかった
NN4はCSSをまともに解釈しないバグだらけの駄目ブラウザです。
特にpositionは相性が悪い。CSSを読み込ませない方がいい。

z-indexのことならレイヤーなんて言っては通じません。
layerなんてものはNN4だけの独自拡張タグでしたから。
>>4で勉強するとよいことでせう。
260Name_Not_Found:03/04/23 12:44 ID:???
>>257
http://www.google.co.jp/search?q=CSS%83%8C%83C%83%84%81%5B&ie=Shift_JIS&hl=ja&lr=
CSSレイヤーってのは、どーもMacromedia Dreamweaver系での呼称らしい。
261254=256:03/04/23 16:31 ID:???
>>257>>260
ありがとうございます。スッキリしました。
260さんの言うとおり、CSSレイヤーという呼び名はDreamweaver系では
割とフツーに使われちゃっているんで気にしてませんでした…。
(NN4のlayerタグと同じような働きをCSSでさせるということでそういう呼称っぽいです)
まともな用語も使えなくてお恥ずかしい。
>>4で勉強してきます。
262Name_Not_Found:03/04/23 22:30 ID:???
横に広がったリスト(・×× ・○○ ・……)ってのを作りたいのですが

CSS2で、
ul要素の改行を無くすタグってありますか?
263Name_Not_Found:03/04/23 22:31 ID:???
タグってなあにー
264Name_Not_Found:03/04/23 22:39 ID:???
>>262
CSS2にはul要素の改行を無くすタグはありません。
265262:03/04/23 22:43 ID:???
うげ。
HTMLと混同してた。
えーと、CSSの場合はプロパティーか。

>>264
さんくす。
ずらずらと並べるしかない訳ですね……。
266Name_Not_Found:03/04/23 22:46 ID:???
>>4は見たの?
267Name_Not_Found:03/04/23 22:46 ID:???
>>265
いや、CSS2にタグはない、と言ったんだけど。
flortで回りこませるか、インラインにするか、どっちでもいけるんじゃないの?
268262:03/04/23 23:03 ID:???
>>267
>flortで回りこませるか、インラインにするか

成る程。そう云う手もありましたね。
float使って回り込ませてみます。
ありがとうございます。
……ちょっと意地悪された気分ですが(笑。
269Name_Not_Found:03/04/23 23:03 ID:???
>>262
display:inline;を使うと、リストの前に付く"・"がなくなってしまいます。
付けたい時はli:brefore{content:"・"}等としなければなりません。

一方floatを使った場合はブラウザによって"・"が見えなくなりますが、
これはpaddingを指定してやることで出てきます。

ちなみに、HTMLであっても
タグは<li>や<body>と言った記号の事であって、liやbodyなどは要素と呼ばれるものです。
270Name_Not_Found:03/04/23 23:05 ID:???
liやbodyなどは要素*名*
271Name_Not_Found:03/04/23 23:14 ID:???
すみません。
marginというプロパティがよくわからないんです。

たとえば、pにmarginで上側に4em下側に2emの余白を設定すると、
段落間の余白は結局2emになるんでしょうか、4emになるんでしょうか、
それとも2em+4emで6emになるんでしょうか。

あと、それはブラウザの種類に左右されますか?
IEを使っている限りだと、4emっぽいんですが・・・

あまりに基本的なことなんでしょうか、
いろんなCSSの説明サイトを回ってみたんですけど、
書いてないんです。

どうか教えてください。よろしくお願いします。
272Name_Not_Found:03/04/23 23:20 ID:???
>>270
ププッ
273Name_Not_Found:03/04/23 23:24 ID:???
>>271
http://www.w3.org/TR/REC-CSS2/box.html#box-dimensions
をご覧になってくださればわかると思います。
274Name_Not_Found:03/04/23 23:28 ID:???
マジレスしてくれる燃料ってなんか可愛いね。
275271:03/04/23 23:42 ID:???
>>273
ありがとうございます。
ああ、やっぱりちゃんと規則があったんだ。
どこ見てたんだろ、私。

えっと・・・うわ、英語・・・
んと・・・大雑把にfloatやpositionが関わる場合か
marginの値の一方が0より小さいときが、合計値
それ以外の場合は、最大値
ってことでいいのかな・・・
276Name_Not_Found:03/04/23 23:44 ID:???
>>275
上下のmarginは相殺される。
左右のmarginは相殺されない。
とりあえず、それだけでいいんじゃない?
277Name_Not_Found:03/04/23 23:47 ID:???
278Name_Not_Found:03/04/23 23:56 ID:ChAtJs6g
名無しさん<TAB>sage<TAB>1036857268<TAB><style type="text/css"><!-- strong { color: red; font-size: 1.5em; } --></style><strong>テスト</strong>かきこ
279271:03/04/23 23:59 ID:???
>>276
>In CSS2, horizontal margins never collapse.
あ、ほんとだ・・・
ありがとうございます。
>>277
うわ、教えてくれて、どうもです!

皆様、どうもありがとうございました!
280Name_Not_Found:03/04/24 00:43 ID:???
目の周りが被れ目の回りに化粧をしなくなりました。少し前に買った
アイリムーバーが必要でなくなりました。クレンジングはせっけんになり
クレンジングとしても必要でなくなりました。何か化粧品として以外の
方法で使いたいのですが、何かありませんか?(ヤフオク以外の方法で)
貧乏だし勿体ない気がするもので。よろしくお願いします。
281Name_Not_Found:03/04/24 00:54 ID:???
271が誤爆か?
282Name_Not_Found:03/04/24 12:23 ID:???
>>281
     \○/
       ∞
       (Y)
283Name_Not_Found:03/04/24 22:14 ID:???
Validatorで

font-family: 一般フォントファミリー名(generic font family)を最後の選択肢として付け加えておく事を推奨します

これってどういうことですか?
どのようにすればよいのですか?
284Name_Not_Found:03/04/24 22:23 ID:???
>>283
font-family: Osaka, "MS Pゴシック", sans-serif; のようにする。
一般〜つーのはsans-serifとかmonospaceとか。
285283:03/04/24 22:29 ID:???
>>284
なるほど。
ありd
286Name_Not_Found:03/04/25 03:42 ID:???
外部CSSの符号化の優先順序は

1. HTTPヘッダにあるContent-Typeフィールドのcharsetパラメータ
2. @charsetによる指定
3. 参照元文書の構造化言語による指定(たとえばHTMLならLINK要素のcharset属性)

とのことですが

<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">

は、どの順序になるんでしょう?
1. と同等なのか?  3. に当てはまるのか? 無視されるのか?
287Name_Not_Found:03/04/25 10:54 ID:???
>>286
><meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
HTML文書のコンテントタイプを指定するのと、
外部スタイルの符号化方法は関係ないでしょう。

<meta http-equiv="Content-Style-Type" content="text/css; charset=Shift_JIS">
これだったら質問の意味分かるけど、どっちにしろ、
構造化言語で指定してるんだから、「1. と同等な」訳ないでしょう。
三つ目の項目に該当するだろうけど、この指定を活用できるブラウザ無いよ。

というか、本来ならば符号化方法はHTTPヘッダで設定するもの。
http://www.kanzaki.com/docs/sw/http-header.html
http://www.fxis.co.jp/DMS/sgml/xml/saloon/html_correct_charset.html
http://www.mozilla.gr.jp/standards/webtips0022.html#c1_3
288Name_Not_Found:03/04/25 11:13 ID:???
痛いスレにこれまた痛いヤシが臨降されました・・
 http://pc2.2ch.net/test/read.cgi/hp/1046070538/l58
289Name_Not_Found:03/04/25 17:33 ID:???
ふと、思ったんだけど
※ margin:2em 5em 3em 2em;
※ margin-top:2em;
  margin-right:5em;
  margin-bottom:3em;
  margin-left:2em;
果たして、ハード的にはどっちの方が解釈するのが無理なく速いのか?

※ border:red thin solid;
※ border-width:1px; /*細いということで仮に*/
  border-color:#ff0000;
  border-style:solid;
これもどうだろうか?

誰かしらんか?

290Name_Not_Found:03/04/25 18:04 ID:???
そんなこと考えるなんてヒマだね
291Name_Not_Found:03/04/25 19:01 ID:???
解釈も何もソース自体のサイズが大きくなるからまとめた方がいいに決まってる
292Name_Not_Found:03/04/25 19:52 ID:???
>>289-291
ただ、marginなんかはブラウザによっては分けないとバグになる場合もあるから
分けたほうが無難ともいえる。
293Name_Not_Found:03/04/25 20:13 ID:???
>>291
たまに見かける、body内よりもはるかに長いスタイルとか?
294Name_Not_Found:03/04/25 21:29 ID:???
>>290
ふと、思っただけなんだが悪いか?
>>291
それもあるだろうけど実際どうなのか?
やはり、どっちかが速いはず
>>292
基本的にはそうだと思うね

他のソースコードでも実際速くなることがあるんだから絶対にあると思う。
詳しいひといないのかな?
295Name_Not_Found:03/04/25 22:13 ID:???
内部でどんな処理してるかはブラウザによって違うだろ
296Name_Not_Found:03/04/25 23:52 ID:???
ブロックレベル要素のセンタリングはFAQに載ってますが、
右寄せや左寄せにするにはどうすればいいんでしょうか…?
297Name_Not_Found:03/04/25 23:59 ID:???
>>296 float:right/left;とかmargin-right/margin-left;とか。
298286:03/04/26 03:50 ID:???
>>287
レスありがとうございます。どうやら、私が勘違いをしていたようです。
charsetパラメータとあるので、*.html のことかと思って
<meta http-equiv="Content-Type" …> との競合を気にしたのですが
*.css のContent-Typeのことだったようですね。

Content-Type: text/css; charset=Shift_JIS

と、charset付で吐き出す鯖は見たことがないので
実質 @charsetの指定が最優先されるということでしょう。
失礼しました。
299Name_Not_Found:03/04/26 03:59 ID:???
>>298
>と、charset付で吐き出す鯖は見たことがないので
そお?たまに見かけるよ
300286:03/04/26 04:10 ID:???
>>299
そうですか。不勉強で申し訳ありません。
text/html で charset付はよく見かけるのですが…
まあ、「よく見かける」というほど
いちいちチェックしているわけでもないので。

スレ汚し失礼しました。
301Name_Not_Found:03/04/26 04:26 ID:???
ここで聞くべきかどうか微妙だけど。お願いします。

Mac OS XでGoLive つかってて
cssでフォントセットを作ろうかと思ってるんですが

<p>または.classに
ヒラギノ角ゴW3,Osaka,MSゴシック,MS Pゴシック
<strong>または.classに
ヒラギノ角ゴW6,Osakaを当ててます。

ヒラギノはOSXで、OsakaはOS9やOSXでバンドルされてるフォントです。
Win側のMSゴシックの太字に相当するフォントとして汎用性のある
フォントはどんなでしょう?

まあ単に<strong>か、.classに太さを加えても良いのですが。。。一応
302Name_Not_Found:03/04/26 10:40 ID:???
>>301
<strong>自体、ブラウザによって違うが擬似的に太さを描画している
だけなのでほとんど無意味。Safariなんかは<strong>で包囲すると、
ヒラギノ角ゴW3→ヒラギノ角ゴW6に置き換えるので
あと、 @font-faseもあるが対応がイマイチ。

htmlダグの<font fase=" ** ">とはまた意味が違う訳



303Name_Not_Found:03/04/26 10:43 ID:???
>301
うちの環境だと対応できるフォントはありません。
日本語フォントは「MS 〜」しかないです…
「どの環境でもそれなりに意図通りに表示する」のなら
font-weightプロパティを指定するのが無難だと思います。
OSもMac、Winだけじゃないですしね。
304Name_Not_Found:03/04/26 14:38 ID:4CQw2I/v
WYSIWYGで編集出来て、かつ編集画面でCSSの表示が崩れにくい
ソフトを探しています。

今はホームページビルダー7を使っているのですが、
DIVをフロートさせて段組を作ったりすると編集画面で表示が崩れたり、
別途手書きで書かなければならないプロパティが多かったりと
CSSに関しては使いづらいので、他によいソフトを探しています。
(その他のことについてはほぼ満足なのですが・・・)

CSSをフルに使うことを前提にお勧めのWIN2kで使えるソフトを
教えて頂けたらと思います。宜しくお願いします。

エディタで書いても良いのですが、作っている各ページのサイズが
大きいので編集したい場所を探すのに手間がかかったり、
リンクやファイルの管理も一度に出来るソフトが使いやすいと
思っています。スレ違いでしたら済みません。




305Name_Not_Found:03/04/26 14:56 ID:???
>>301
世の中にはヒラギノもMSも入れてない人もいる・・・
あと、MacのIEはFontのfamilyを無視したと思う。
>>302>>303のいうように
strongを用いたり、weightとsizeの組み合わせで対応したほうが、
結果的に安定したデザインになると思う。
306301:03/04/26 15:11 ID:???
やってるうちにそうだと思いはじめてきた。皆ありがと。
つかOS9環境での確認もOsakaで想定すると他に割り振るフォントなんか
ないわ。<strong>でフォント(ヒラギノw6とか)けられたら
Boldになる。みたいになったらなー。なーンて思った。
アポの配付しとるcssでできないこともないけどテーブルまで絡んでくるし
Javascript(これでfontfaceを制御?)で飛ばないと行けなそうだから
やっぱ断念。OSX(なめらか文字)だとボールドって濁るよなぁ
307Name_Not_Found:03/04/26 15:26 ID:???
>>306
CSSの仕様通りに解釈すると本当は
font-family:"ヒラギノ角ゴ";
と指定しておけば
font-weight:normalでW3あたり、
font-weight:boldでW6あたりが表示されるはずなんだけどね。

今のブラウザはboldと指定されると無理やり太くして表示する罠。
308Name_Not_Found:03/04/26 18:26 ID:hY+BOoaJ
<style type="text/css">
<!--
A { text-decoration : none ; }
A:hover { text-decoration : underline ; }
#a { font-family: HG正楷書体-PRO; font-size: 40px; }
#b { font-size: 12px; }
-->
</style>
これで#bのところで何度もid属性を使うことになってしまうのですがどうすれば解決できますか?
309Name_Not_Found:03/04/26 18:33 ID:???
>>308
アンカーに対する指定と#aおよび#bに対する指定の関連がよくわからない。
どういう風に表示したいの?
310Name_Not_Found:03/04/26 18:35 ID:???
>>308
idの使い方を激しくまちがっとる予感。classを使うべし。
ていうか、まず>>4で勉強した方がいい。
311Name_Not_Found:03/04/26 18:51 ID:???
dt,ddを横並びにしたいのだけどいい方法ない?

dt { width:10em; float:left; }
dd { width:70%; float:left; clear:right; }

とりあえずこんなのでごまかしてるけど、dtのほうが10文字超えると
2行になってしまい、その段のddが1行だと次のdtが回り込みを
起こしてしまいます。
というわけでこの方法だと、dtの最大長にあわせてデザインを修正
しなければならずあんまり楽しくないので、良い方法あったら教えてください。
312308:03/04/26 18:52 ID:hY+BOoaJ
>>310
idの使い方激しく間違ってました。>>4で勉強してきます。
313Name_Not_Found:03/04/26 20:23 ID:???
>>311
display:inline
314Name_Not_Found:03/04/26 20:34 ID:???
>>311
dt{float:left;clear:left;width:10em;}
dd{width:70%;}
じゃだめ?
絶対にdtを改行させたくなければwhite-space:nowrap;とか。
315Name_Not_Found:03/04/26 20:58 ID:???
316Name_Not_Found:03/04/27 22:16 ID:???
一番左上に空白まったくとらずに配置するにはどうすればいいですか?
317Name_Not_Found:03/04/27 23:05 ID:???
>>316
何を?
ブロック要素ならmargin-left:0;margin-top:0;padding-left:0;padding-top:0;で出来ますが。
318Name_Not_Found:03/04/27 23:17 ID:???
>>317
あ、何かclass名を勘違いしてたせいでできなかったみたいです。
ちゃんと設定したらできました。ありがとうございました。
319Name_Not_Found:03/04/27 23:21 ID:???
>>318
アハハ、ドジだなあ
320Name_Not_Found:03/04/28 10:33 ID:???
lintの結果で出るtableのsummary?属性ってなんですか?
321Name_Not_Found:03/04/28 11:36 ID:???
>>320
>>4

Googleで調べた方が早いかも。
322Name_Not_Found:03/04/28 11:54 ID:???
>>320
表の要約、説明

つーか、下がり過ぎ
323Name_Not_Found:03/04/28 12:30 ID:GroE9npd
textarea内のテキストの特定の文字だけ背景色を変えいることはできますか?
324Name_Not_Found:03/04/28 12:32 ID:???
>>323
無理
325Name_Not_Found:03/04/28 21:56 ID:???
なんでそんなことしたいんだろう
326Name_Not_Found:03/04/28 22:24 ID:???
デザインにいちいち理由聞いてケチつけるのはウェブ板ぐらいダヨな。
327Name_Not_Found:03/04/28 22:39 ID:???
>>326
今のうちから注意してやらないと白い布を巻いて歩くようになっちゃうよ
328Name_Not_Found:03/04/28 23:46 ID:???
ちんちん腐っちゃうヨ
329Name_Not_Found:03/04/29 03:51 ID:???
>>324
spanとかでできるんちゃうん?
330Name_Not_Found:03/04/29 06:45 ID:???
暇なんで誰か遊びに来てください。
http://www4.rocketbbs.com/14/bbs.cgi?id=support
331Name_Not_Found:03/04/29 14:27 ID:???
ああ、textarea内の元から書いてある文字のことか。
332Name_Not_Found:03/04/29 20:58 ID:???
body { background: #000000 url( "top/logo1.gif" ) bottom right no-repeat; }
という指定をして、右下の隅っこに100×100pxの画像を背景指定してるのですが、

画面がウィンドウサイズより縦長になるとき、
opera7で見るとスクロールしても背景が表示されてません。
IE6で見た場合は、少々挙動が怪しいですが背景自体は表示されます。
N7では問題なく表示されてます。

operaでの背景表示きちんとできる方法あったら教えてください。
333Name_Not_Found:03/04/29 22:07 ID:???
>>332
background-attachment:fixed;
334Name_Not_Found:03/04/29 23:58 ID:aO53M+u0
A:LINK, A:HOVER, A:ACTIVE, A:VISITED
{ text-decoration:none; border-bottom: 1px dotted blue;}
としてリンクに疑似下線をつけているのですが、
IMG A:LINK, IMG A:HOVER(以下略)
{ border-bottom-width:0px;}
としてやっても下線が消えません。
不格好なので何とかしたいのですが。。

IE6.0で発生。Opera6.02では起こらず、です。
335Name_Not_Found:03/04/30 00:14 ID:???
>>334
a.img { border-bottom-width:0; }

<p><a href="**">***</a></p>
<p><a href="**" class="img"><img src="***.gif"></a></p>

classつけるしかないんじゃないの?
336Name_Not_Found:03/04/30 00:49 ID:???
>>335
レスどうも。
おっしゃるとおりにしたらできました。

しかし謎な現象が。。
<a href="http://www2s.biglobe.ne.jp/~geoph/" class="img">
とすると、下線付きになる。。
全く持って意味不明なので、この件はどうでもイイですが。。

ともかくありがとうございました。
337332:03/04/30 01:51 ID:???
>>333
レスありがとうございます。fixedだと、表示されるんですね。

でも、scrollだと一番下までスクロールしても表示されないって言うのは、何なんでしょうか。
338Name_Not_Found:03/04/30 02:05 ID:???
>>334
a要素の中にimg要素があるのなら、IMG A:LINKなんて指定しても効くわけないがな。

しかし>>336は何を言ってるのかがわからん。
href属性の値によって下線が出たり出なかったりするってことなのか?

もう少し他人にも判る書き方にして下記へ報告して下さい。

CSS/DHTMLバグ辞典スレッド 第3版
http://pc2.2ch.net/test/read.cgi/hp/1050844510/l50
339Name_Not_Found:03/04/30 02:12 ID:???
>>337
Opera 7でなくて6にはバグがあるみたいだけどね。
http://cssbug.tripod.co.jp/detail/opera/b030.html
>固定配置(background-attachment: fixed;)した背景画像が、ページを表示さ
>せた段階で表示されている部分しか表示されない。そのため、ページをスクロール
>すると背景画像が消えてしまう。
http://cssbug.tripod.co.jp/detail/opera/b031.html
340337:03/04/30 02:45 ID:???
>>339
そこも、読んではありますが、
opera7では、fixedのバグは直ってるようです。で、変わりにscrollがおかしいです。

って、バグなのかな。opera7の。

ページを表示さ せた段階で表示されている部分しか表示されない。
そのため、ページをスクロールしても見えない。

ためしに、縦長の画像(100×1000px)をつかってみたら、
ページを表示さ せた段階で表示されている部分しかまともに表示されない。
隠れている部分はページをスクロールして出すと、画像がゆがんでいる。

バグ辞典スレッドに持ってくべきかな?
341334:03/04/30 03:13 ID:???
>>338
よく考えてみれば、当たり前なのですが気づきませんでした。
誘導どうもです。そちらの方へ報告させていただきました。
342Name_Not_Found:03/04/30 10:16 ID:???
>>340
>バグ辞典スレッドに持ってくべきかな?

お願ひします。
症状としては、Opera6でbackground-attachment: fixed;にしたのと同じなのかな?
343Name_Not_Found:03/04/30 20:42 ID:???
text-alignって、文字にしか効かないの?
子要素には影響しない?

NetscapeやOperaでは文字だけで子要素には効かず、
IEだと文字も子要素も影響する。

本当はどちらの動作が正しいのですか?
344Name_Not_Found:03/04/30 21:00 ID:???
>>343
ブロックレベル要素にのみ指定できて、継承されます。
効果は、指定した要素内にある、各行(行ボックス)のそろえ方の指定です。

詳しくは>>5のQ2参照
345Name_Not_Found:03/04/30 21:05 ID:???
>>344
スレのFAQにあったんですか。すみません。
しかも親切にお教えいただいて、感謝。
346Name_Not_Found:03/04/30 22:01 ID:???
要素を縦いっぱいに引き伸ばすにはどうすればよいのでしょうか。
height: 100%;としても、
IE5 Opera6ではウィンドウの下まで届くのですが、
N7ではautoと同じような表示になります。
347346:03/04/30 22:11 ID:???
すみません、解決しました。
348Name_Not_Found:03/05/01 00:25 ID:???
ユーザースタイルシートで
background-image : none !important;
としても背景画像が表示されてしまうのですが…
349348:03/05/01 00:28 ID:???
失礼、IE6での話です。Opera7.02では画像が表示されずに済みます。
350Name_Not_Found:03/05/01 00:47 ID:???
>>348-349
それだけだとなあ……。ソース出してくれんと何が原因かもわからないって。
351Name_Not_Found:03/05/01 01:14 ID:???
親要素の横幅に合わせて、
子要素の文字を自動で改行するにはどうすればいいのでしょうか。

親要素からはみ出たり(Opera6、N7)、
親要素が引き伸ばされたり(IE5、NN478)してしまいます。
352Name_Not_Found:03/05/01 01:21 ID:???
>>350
IEはその辺りが未熟。例えば、
input[type="text"] {
display:none;
}
のように要素、属性、値のレベルまで指定できないようにね
353Name_Not_Found:03/05/01 01:39 ID:???
>>351
IE5とNN4.78は多分にバグを含んでいるわけで。
354351:03/05/01 02:14 ID:???
>>353
しょぼーん

たとえば幅400pxに指定している親要素の中に、
改行なしの文字を書いていき、幅400pxに達した時点で
<br>とかなくても強制的に改行したいんだけど。。。
355Name_Not_Found:03/05/01 02:53 ID:???
子要素が親要素の中に座標的に内包するとは限らないと
思えばいい。
したがって子要素にも正しく幅を指定しる。
ちなみにIE6も引き伸ばし派だった。
356Name_Not_Found:03/05/01 06:39 ID:???
なんとかNN6でチェックボックスの背景色とチェックの文字色は変えられないもんでしょうか。
357Name_Not_Found:03/05/01 07:29 ID:???
フォーム関連のCSS実装ってかなりまちまちなんだよな。
チェックボックスの背景・文字色(・ボーダー)についてはOpera7の実装が
いちばん真っ当に見えるけどどうなんだろう。
358348:03/05/01 07:34 ID:???
解決しました。
いちいち設定を変えるのが面倒でツールを使って
ユーザースタイルシートを適用していたのが問題だったようです。
普通にインターネットオプション>ユーザー補助からCSSを適用したら
背景画像は表示されませんでした。

>350
お手数おかけしました。
359Name_Not_Found:03/05/01 08:51 ID:???
CSSでテキストに影をつける、っていうのはまだ実装されてないんですか?
360Name_Not_Found:03/05/01 08:55 ID:???
>359
CSSレベル2だけど、どのブラウザもまだ実装してないみたいね。
361Name_Not_Found:03/05/01 09:02 ID:???
確かCSS2.1では消えたんじゃなかった?>text-shadow
362Name_Not_Found:03/05/01 11:44 ID:???
>>354
word-break:break-all; でできる。
日本語や漢字と同じくラテン・アルファベットでもどこでも改行可にする指定だ。
但し草案段階のCSSなので、WinIE5以降しか実装してない。独自拡張みたいなもの。
下記参照。
http://east.portland.ne.jp/~sigekazu/css/international.htm
http://www.doraneko.org/misc/i18n-format/WD990127.html#a4-3
363351:03/05/01 12:56 ID:???
>>362
どうもありがとうございます。
参考にさせていただきます。
364Name_Not_Found:03/05/01 12:59 ID:???
>>363
むしろ>>355を參考にしたまへ。
365351:03/05/01 14:17 ID:???
>>364
はい、そうします。
いろいろと試行錯誤してみます。
366Name_Not_Found:03/05/01 17:37 ID:???
<a>にwidthを指定しても、反映されないのですが、
幅を指定するにはどうすればよいのでしょうか。

Netscape4x、6x、7x、mozilla1x、Opera6xで効きません。
IE50は効きます。

たぶんIEの解釈が間違っていると思うのですが、
IEで表示されているように、他のブラウザでも表示したいです。
367Name_Not_Found:03/05/01 17:46 ID:???
>>366
幅を指定できたとして、どうしたいんだ?
リンク文字列以降も下線を長く伸ばしたいってことか?
368Name_Not_Found:03/05/01 17:55 ID:???
>>366
a を display : block でブロック要素にするかなぁ
mozilla ならこれでできる。N4は期待しないで
369366:03/05/01 17:57 ID:???
>>367
widthと書きましたが、hightもです。
クリックできる範囲を大きくしたい…みたいな。
フォントサイズはそのままで。

┌──────┐
│            │
│  クリック    │
│            │
└──────┘

罫線の中すべてがクリックできる範囲にしたいです。
わたしはこのほうが押しやすいと思っています。
~~~~~~~~
370Name_Not_Found:03/05/01 17:59 ID:???
371Name_Not_Found:03/05/01 18:04 ID:???
いろんなこと考える人がいるものだなぁ
やれやれ・・・
372Name_Not_Found:03/05/01 18:05 ID:???
>>369
a {
 padding: ;
}
373366:03/05/01 18:09 ID:???
>>368
>>370
>>372

たくさんの方からのレス、どうもありがとうございます。
>>368さんの方法で、うまくできました。
各ブラウザで微妙に大きさが違ってしまいますが。

こっちを立てればアッチが立たず、みたいです。なんとなく。
374366:03/05/01 18:20 ID:???
特に問題ではないのですが、
>>368さんの方法だと、Opera(6)では
text-decoration: underlin;がなぜかoverlineになっちゃいました。

問題ではないといいつつ、少し気になって。
375Name_Not_Found:03/05/01 18:21 ID:???
おまえスペルミス多すぎ
376366:03/05/01 18:29 ID:???
>>375
すみません。タグ入力タイプのエディタに頼っているので、
自分で手打ちすることはあまりないのです。

そして、英語が苦手です。
377Name_Not_Found:03/05/01 19:05 ID:???
>>374
どっかに記述ミスがあるか他のスタイルが影響してるのだと思われ
というかOpera6はa要素にdisplay:blockしてもwidthが効かなかった気がする
378Name_Not_Found:03/05/01 21:56 ID:???
Mozilla 系って css で col 要素を指定しても
何にも反映されないのだけれど、これはバグ?
それとも漏れの書き方が悪いのか?
379Name_Not_Found:03/05/01 22:05 ID:???
>>378
バグというより、サポートしていない。
380Name_Not_Found:03/05/01 22:16 ID:???
>>378
backgroundは確かに未サポートだが、
colに対してのtext-alignとかはIEの独自拡張だよ。
381378:03/05/01 22:20 ID:???
>>379
なるほど。さんくす。しかし、なぜ?

XHTML 1.0 にもあるんだし、
CSSバグリストにその旨載っててもいい
(例えば『Gecko が col要素をサポートしていないのは仕様です』とか)
気がするのは漏れだけか?
382Name_Not_Found:03/05/01 23:19 ID:???
CSSのバグというより、HTMLのバグなんじゃないかなあ。
バグだとすれば。
383Name_Not_Found:03/05/02 00:12 ID:???
基本的なことかもしらないがcssのclassで文字を
class="xx1"(10px、行130%)
class="xx1b"(10px、行130%、Bold)
class="xx2"(12px、行130%)
class="xx2b"(12px、行130%、Bold)
class="xx3"(14px、行130%)
class="xx3b"(14px、行130%、Bold)
などと設定(ややこしい?から全部spanで)してるマカーだが、

Winで見ると欧文はサイズ相応に見えるが
和文が12pxとほとんど変わんないきがするんだけど
気のせいかなぁ?こうゆう仕様?Winはほとんど使わないんで
なんつうか常識の範囲のことかもしれないけどわかんない。
ディスプレイによって印象が違うのかもだが
ぬるい漏れに一喝してくれませんか?
384Name_Not_Found:03/05/02 00:15 ID:???
>>383
とりあえずわかりやすく書いてくれないか
385Name_Not_Found:03/05/02 00:17 ID:???
>>383
気のせいかどうかくらい自分で検証せいや!
386Name_Not_Found:03/05/02 00:26 ID:???
>>384
うぐ。GWと言うことで勘弁。どこが分かりずらいのかわからないけど
とりあえず補足。

Macでみると、12pxの文字と10pxの文字のサイズは明らかに違うのに
Winでみると、ほとんど変わってないように見える。
欧文(oubun)の場合はMacで見た時に近い印象。
もうひとつゆうと、10pxBoldも小さく見える。ただ10px(ウエイトなし)が
12pxとほとんど変わらなく見えてしまう。こうゆうもの!といってくれれば
安心するなぁ。みたいな。
こんな説明でいいだろうか?
387Name_Not_Found:03/05/02 00:31 ID:???
>>386
WinMac関係なくpx指定してもモニタによって違って見えるはずだから
一概にこうだ!とは言えないと思う
388Name_Not_Found:03/05/02 00:37 ID:???
>>383
>ややこしい?から全部spanで
span使わなくていいところでspan使ってたらショック。

で、ソース出せ。
389Name_Not_Found:03/05/02 00:37 ID:???
>>386
同じ文を上下にでも並べてみれば、
そんなあやふやな言い方じゃなくはっきり分かるのに。
390383=386:03/05/02 00:40 ID:???
>>387
お。その一言でちょっぴり安心だ。うすうすそうだとは思っていたが。
1機のWin(ディスプレイも)でしか見てないし今は手元にないから
ちょっと不安でさぁ。Macだとその辺は慣れてるせいか自身もてるんだけど。Winはまだ慣れてないし常に触れる環境になくて。
391Name_Not_Found:03/05/02 00:47 ID:???
>>386
なんつーか、環境とフォントに依存かと思ふ。
マクでも、OSXヒラギノと棺桶OSアンチエイリアスなしの
Osakaとでは、表示結果違うし。

ビットマップ表示する場合は、持っていないサイズの
フォントは近似のサイズで表示するので、
サイズ指定が違っても、画面表示は同じサイズだったり。

マカ的には、ウィソも綺麗なアンチエイリアスする
和文フォントを持ってほしかったりするが、
高望みはすまい。

4pxあたりから70pxくらいまでスタイル一覧作って
確認してみるとおもしろかったり。
392Name_Not_Found:03/05/02 00:52 ID:???
┏━━┓
┃┌┐┃
┃││┃
┃││┃
┃└┘┃
┗━━┛
太線…divの枠
細線…本文

IEでは上記のようになるんですが、Operaでは
┏━━┓
┃┌┐┃
┗││┛
 ││
 └┘
となってしまいます。
本文に画像を使わなければこんな風にはならないんですが、
画像を使っても、こうならないように回避する方法を教えて下さい。お願いします。
393392:03/05/02 00:55 ID:???
自己解決しました。
なぜか高さを指定してたみたいです。
394Name_Not_Found:03/05/02 01:03 ID:???
>>383
文字サイズ固定するのよくない。
395Name_Not_Found:03/05/02 01:09 ID:???
>>394
文字サイズは固定してもいくらでも観覧時に変更できますが何か?
396383=386:03/05/02 01:11 ID:???
あ。自身じゃなくて自信だ。
それから実は手打ちじゃなくてGoLive。このスレでは反則かなぁ?
span使わなくてもいいところでも使ってる。なにせ全文字だから。
たぶんpやdivでごっそり行けるところもあると思うけど
<font size>や<b>も併用したら、spanの挙動が一番安心出来た気がしたから
どうせ手打ちじゃないから汚いし。手間的にもそんなに変わんないし
spanでいいや。とかテキトーに考えて。(順を追ってキチンとしていきたいけど)
こんどwinで見る時はそう(>>389)やって見てみる。
どうせぬるい漏れだし。ソースは勘弁ね。upする時は書き出すし
(Golive属性やコメント、スペース程度は書き出し機能で削除)

>>391
そうそう。ぼんやりだけどそんな高望みなことも考えてた。

サイズ固定良くないのも分かってはいたけど。うーん悩む。
やっぱりwin買うか。(金ねー)皆レスありがと。と、ぬる長文ごめん。
397Name_Not_Found:03/05/02 01:11 ID:???
>395
出来る人はそりゃ出来る。
アクセシビリティという言葉をご存知かね。
398Name_Not_Found:03/05/02 01:13 ID:???
>>395
現在一番のシェアを誇るブラウザでは簡単には変更できないけど?
というかほぼ寡占状態にあるブラウザに「合わせて」作る必要はないけど、
「考慮」しないことは製作者として怠慢だと思いますが何か?
399Name_Not_Found:03/05/02 01:16 ID:???
>>397
馬鹿な事を聞くなよ。
ご存知だったら>>395みたいな発言できるわけないだろ。
わかってやれよ。
400Name_Not_Found:03/05/02 01:32 ID:???
>>397,399
( ´,_ゝ`)プッ
そんなこといってたらデザインレイアウトなんかできんよ
12px,14pxぐらいがそんなに小さいサイズか?
401Name_Not_Found:03/05/02 01:34 ID:???
>>400
( ´,_ゝ`)プッ
そんなことぐらいでデザインレイアウトできない腕なのね
12px,14pxなんかをそんなに使わないと無理か?
402Name_Not_Found:03/05/02 01:45 ID:???
>>401
腕だけでは無理なレイアウトやデザインって解らないですか?
画像の場合はどうでしょう?拡大されて表示されますか?
それとブラウザの標準フォントはおいくつぐらいで設定されていますか?
また、平均的にどれぐらいのフォントサイズで観覧されているかご存じですか?
アクセシビリティを忠実に守られているようですがいかがですか?

同じように屁理屈を述べてみましたが(w
403Name_Not_Found:03/05/02 01:49 ID:???
>>402
いや、腕だけでいける。
404Name_Not_Found:03/05/02 01:53 ID:???
>>403
その前に、CSS切ってたら意味ないだろ
405Name_Not_Found:03/05/02 01:54 ID:???
>>402
> 腕だけでは無理なレイアウトやデザインって解らないですか?
 わからない。腕が足りないだけだとしか思わない。

> 画像の場合はどうでしょう?拡大されて表示されますか?
 画像と文章を同列に語るのはどうかと。画像も%指定できるし。

> それとブラウザの標準フォントはおいくつぐらいで設定されていますか?
 IEの中。

> また、平均的にどれぐらいのフォントサイズで観覧されているかご存じですか?
 IEの中。

> アクセシビリティを忠実に守られているようですがいかがですか?
 良好。

> 同じように屁理屈を述べてみましたが(w
 まったくだめ。箸にも棒にもかからない。
406Name_Not_Found:03/05/02 01:55 ID:???
>>404
切ってる人はデザイン不要な人なんだろ?なにが「その前に」だ。
407Name_Not_Found:03/05/02 01:58 ID:???
ハハハ、もまえら釣りに掛かりすぎ(*´∀`)
今時こういうスレ見てて、px指定使わないとデザイン出来ないヤシなんて居るわけないじゃん。
408Name_Not_Found:03/05/02 01:58 ID:???
おまいらふぉんとに(本当に)フォントの話が好きですね
409Name_Not_Found:03/05/02 02:04 ID:???
アクセシビリティて言ってるけどさ
文字はいいけど画像はどうよ、写真とさ

ふぉんとうに
410Name_Not_Found:03/05/02 02:07 ID:???
>409
そのためにALT属性があるし、
写真の展示等のコンテンツは視覚系ブラウザでの閲覧を目的に作ってあるわけで。
それはアクセシビリティとは違う。
聴覚が不自由な人がコンサートに出かけるのか、という事。
411Name_Not_Found:03/05/02 02:11 ID:???
>>410
そうなら、ふぉんとも同じことだろ
大きさによって読み上げの音量でも変わるとでも言いたいのかよ(w


412Name_Not_Found:03/05/02 02:16 ID:???
>>411
は?
413Name_Not_Found:03/05/02 02:19 ID:???
>>409
比類なき馬鹿だな。
デフォルトサイズってのがあるフォントと
デフォルトサイズってのがない画像を一緒くたに語れると思うの?
414Name_Not_Found:03/05/02 02:19 ID:???
>411
えーと、弱視とか老眼の人…良いや、なんか疲れた。
まあフォントサイズ固定で喜んでるのは大抵当人だけだよ、とアドバイスしとくよ。
じゃ、快適なGWを。
415Name_Not_Found:03/05/02 02:25 ID:???
>>412
上の方を読めば解るけど、フォントサイズ(12〜14px程度)の指定が
そんなにアクセシビリティに反しているかってことなんだ
411でいったのは冗談だけど、視覚の面でアクセシビリティを考えた場合
画像も何かも比例して大きくなるかってこと、装飾イメージは別として。
その辺なんだよ
416Name_Not_Found:03/05/02 02:28 ID:???
フォントサイズについて考えよう
http://pc2.2ch.net/test/read.cgi/hp/1042293757/

以後こっちでよろ
417Name_Not_Found:03/05/02 02:35 ID:???
厨房が厨っぷり露呈して必死に「釣りだ釣り」って言ってるみたいだな。

とりあえずお前の言ってることはさっぱりわからん。
418Name_Not_Found:03/05/02 02:39 ID:???
>>415
> 上の方を読めば解るけど、フォントサイズ(12〜14px程度)の指定が
> そんなにアクセシビリティに反しているかってことなんだ
 そんなにデカい字にする必要ってあるの?
419Name_Not_Found:03/05/02 02:44 ID:???
黄金厨ども議論はスレ違いですよ
420394:03/05/02 02:45 ID:???
なんか急にレスが伸びてると思ったら……。イヤ、俺が悪かった。
ここは質問スレッドですもんね。議論は下記でしませう。

フォントサイズについて考えよう
http://pc2.2ch.net/test/read.cgi/hp/1042293757/l50
421Name_Not_Found:03/05/02 02:47 ID:???
>>419
好ましくなくても聞かれたら答えるだけ

好ましくないならその旨を伝える

の選択は必要な気が。
422Name_Not_Found:03/05/02 03:04 ID:???
(´-`).。oO(どうしてスレ違いの議論は盛り上がるのに誘導された先には行かないんだろう…)
423Name_Not_Found:03/05/02 03:13 ID:???
厨ばっかりだから
424Name_Not_Found:03/05/02 03:20 ID:???
>>422
ネタだからだよ。こんな話題今更本気で話すやつなんていないでしょ。
425Name_Not_Found:03/05/02 03:30 ID:???
>>422
バーベキューでならピーマン食べれるけど食卓に並んだら食べれないのと同じ
426Name_Not_Found:03/05/02 06:40 ID:???
>>425
おれ、バーベキューでもピーマン食えね。
427Name_Not_Found:03/05/02 09:30 ID:???
ピーマン食えない時点で子供
428Name_Not_Found:03/05/02 09:32 ID:???
苦いものを美味いと感じるかどうかは、
子供の頃に苦いものを食べて慣れていたかどうか、による。
と聞いた覚えがある。気がする。
429Name_Not_Found:03/05/02 11:14 ID:???
バーベキューのピーマンについて語れ
http://pc2.2ch.net/test/read.cgi/hp/1043828241/

以後こっちでよろ
430Name_Not_Found:03/05/02 11:18 ID:???
>>429
それ便利だな
431Name_Not_Found:03/05/02 11:26 ID:???
アニヲタは迫害されて当然だと思う
432Name_Not_Found:03/05/02 15:42 ID:???
>>381
これかい?

Bug 1561 - [INVA] COL要素、COLGROUP要素からtext-alignが継承されない
http://bugzilla.mozilla.gr.jp/show_bug.cgi?id=1561
433Name_Not_Found:03/05/02 16:16 ID:???
あのさ、
a:hover[id="zzz"]{}
みたいなことってできないの?

できるわけねぇだろ、別のやり方があっから教えてやる。
って人求ム
434Name_Not_Found:03/05/02 16:19 ID:???
>>433
#zzz a:hover
435Name_Not_Found:03/05/02 16:28 ID:???
floatとpositionって併用できないの?
436Name_Not_Found:03/05/02 16:29 ID:???
>>434
できないよ
437Name_Not_Found:03/05/02 16:34 ID:???
>>435
positionした中でfloatとか、浮動した中で相対配置とかならできるよ。
438Name_Not_Found:03/05/02 16:35 ID:UT5gAFW5
win、macのいくつかのブラウザで試したのですが。

 div {font-size:50%;}
 span {font-size:50%;}
とすると、
 <div><span>この部分のフォントサイズは、</span></div>
親要素の指定が継承されて、25%のフォントサイズになりました。

 td {font-size:50%;}
として、
<table>(<td>)を2重の入れ子にした場合、
tdの中のフォントサイズは50%のままでした。

これって正しいんですか?
tableを入れ子にしたら親要素、つまり親tableの指定は引き継がないのでしょうか?
439Name_Not_Found:03/05/02 16:36 ID:???
>>433-434
いや、a#zzz:hover だろが。
440433:03/05/02 16:40 ID:???
>>439
ありがとう!!
でもなんで
a[id="link"]:hover{}
じゃできないんだろうか・・・・
441Name_Not_Found:03/05/02 16:43 ID:???
>>438
Internet Explorer (Windows) CSSバグリスト
フォントサイズの指定が表要素に継承されない(IE5)
http://cssbug.tripod.co.jp/detail/winie/b023.html

WinIE互換モード以外でもなるのか?
具体的なブラウザの名とヴァージョン、それにDOCTYPE宣言を記してくれ。
442Name_Not_Found:03/05/02 16:46 ID:???
>>440
Internet Explorerは属性セレクタ([id="link"])に対応してないけど、
それのことかい?
443Name_Not_Found:03/05/02 16:47 ID:???
>>440
できないブラウザの名とヴァージョンを記してくれんと判斷できん。
WinIEだったら属性セレクタは未対応だ。
444438:03/05/02 16:58 ID:UT5gAFW5
>>441
HTML 4.01 Transitionalです。

win IE5
mac IE5、N6、iCabあたりで確認したのですが…。

だんだんわけがわからなくなってきました…。
とりあえず、親要素の指定は継承するのが正しいんですよね。
445Name_Not_Found:03/05/02 17:03 ID:???
>444
> 補足
>
> Mozilla5.0系互換モードやOperaでも子供要素としての表要素に継承されない現象は発生します。

互換モードだと表要素に親要素の指定が継承されない。
TransitionalはDOCTYPE宣言次第で互換にも標準にもなるはず。
URI部分を省略すると互換モード。
446Name_Not_Found:03/05/02 17:04 ID:???
>>444
Transitionalでもシステム識別子を入れると入れないとでモードはstandard/quirkと異なる。
quirk(互換)モードなら、Netscape6でも継承しないよ。

DOCTYPE 宣言による「解釈モード」の切り替え
 http://www.remus.dti.ne.jp/~a-satomi/bunsyorou/Doctype-Switch_situation.html
「DOCTYPE スイッチ」 CSS 解釈実例編
 http://www.remus.dti.ne.jp/~a-satomi/bunsyorou/Doctype-Switch_example.html
mozilla / Netscape 6 の standard mode と quirk mode
 http://www.ash.ne.jp/~mal/mozilla/mozdtd/
447Name_Not_Found:03/05/02 17:06 ID:???
>>443
「判断」の「断」字が変?
448Name_Not_Found:03/05/02 17:07 ID:???
>>447
旧字でしょ。
449433:03/05/02 17:22 ID:???
>>442-443
IE対応してないんですね。
ありがとうございます。
450Name_Not_Found:03/05/02 17:23 ID:???
>>449
これからは質問する前に>>4のサイトで調べてね。
質問するときはブラウザ名とヴァージョンを書いてね。
451Name_Not_Found:03/05/02 17:26 ID:???
>>439.449
a#zzz:hoverはではダメポ
<a>要素はぺージ内に複数使用する可能性のあるものなので、
  a.zzz:hover
「id」を使用するなら>>434のように特定のidに指定する。


452Name_Not_Found:03/05/02 17:30 ID:???
>451
ん? 特定のa要素にだけ指定したいならidでも良いと思うが。
idでDOM操作してるかもしらんし。
453Name_Not_Found:03/05/02 17:43 ID:???
>>452
全般的に考えて判断する。
まれに特定のケースやDOM操作はあると思うが、複数存在
するケースの方が一般的なわけで言ったんだけど?
>>449はどういうケースかは分かりませんが



454Name_Not_Found:03/05/02 17:54 ID:???
>453
433がidで質問してるんだから、idの指定の仕方で答えるのが普通じゃね?
普通はnameで指定するだろうし、もしかしたら433がidとnameを混同してるのかも知らんが
とりあえずは聞かれた事に答えとけば良いのでは。
455Name_Not_Found:03/05/02 18:09 ID:???
>>454
普通はnameか?(w
何を頭にきているのか知れないが、もう少しHTMLやCSSの動向を勉強してから答えてくれないかな?
a#zzz:hover を見ただけで普通はピンとくるもんだけどね

456Name_Not_Found:03/05/02 18:28 ID:???
>455
あ、スマン、classの間違い。
頭に来ては居ないんだけど、433の質問に対する答えなら439で良いのでは、と思っただけよ。
457暇なので:03/05/02 19:05 ID:???
◆セレクタ プチ講座
※ id
 一つの文書内に同一のid名を使用することは出来ない。
 CSSのセレクタに限らず、link、scriptの参照にも利用される。
※ class
 一つの文書内に同一のclass名を複数使用することが出来ます。
 スペースで区切ることで、同一要素の中に複数のclass名使用できる。
 おもにCSSのセレクタとして利用します。

注意)両方ともhtmlとは違って、名前に使用する文字の、
   大文字・小文字は区別されます。
458Name_Not_Found:03/05/02 19:20 ID:???
>>457
へ? idもclassもCase-Sensitiveですが?
459暇なので:03/05/02 19:39 ID:???
ただ、暇だったので書き込んだだけなんだけど
>>458のような、アフォが居てビックリ ((((;゚Д゚)))


460Name_Not_Found:03/05/02 19:44 ID:???
>>458のブラウザか、パソコンがぶっ壊れていると思われ
461Name_Not_Found:03/05/02 20:19 ID:???
>>451
わけわからん。 既出だけど、そこまでおせっかいになる必要もないだろう。

つーことで、余計なおせっかい。
a[class="ZZZ"]は a.ZZZ では完全に代替できない。
前者はclass="YYY ZZZ"にはマッチしない。
462438:03/05/02 20:48 ID:???
>>445-446

なるほど。互換モードで書いてました。
ありがとうございます。

バグや諸々考えていたら結構大変…
463Name_Not_Found:03/05/02 21:14 ID:???
>>461
オマエのほうが訳ワカラン
464Name_Not_Found:03/05/02 21:16 ID:???
>>459
> 両方ともhtmlとは違って、名前に使用する文字の、
> 大文字・小文字は区別されます。

だからHTMLでもidやclassの大文字小文字は
区別されるだろうって言ってるの。
465暇な人:03/05/02 21:47 ID:???
なんかちょっと飯食ってる間にレスが
>>458
Case-Sensitiveを詳しく調べた方が今後のためにいいでしょう
>>464
勿論そうだよ。
疑問を抱く前に、質問する前に試したほうがいいよ
iframeでも2つ作って、id="main" id="MAIN" 個別に名前付けて
<a href="***.html" target="MAIN">どっちかな?</a>
でクリックしてみ?
466Name_Not_Found:03/05/02 21:58 ID:???
> 両方ともhtmlとは違って

意味がわからん。
あんたの脳内で言う“html”って何なんだ?
467暇な人:03/05/02 22:04 ID:???
>>466
ああ、書き方悪かったかな? htmlのタグ類だよ
それぐらい解釈してほしいな(w
468Name_Not_Found:03/05/02 22:26 ID:???
idをつかう意味がよくわからん。
一個使うときも複数使うときも、全部classでいい気がする。
なんでidを使うの?
469Name_Not_Found:03/05/02 22:30 ID:???
classじゃ名前付けられないから
470Name_Not_Found:03/05/02 22:36 ID:???
NN4.78ってbackground-color: transparent;の解釈ができないの?
真っ黒になる。
471Name_Not_Found:03/05/02 22:48 ID:???
>>470
>4のリンク先は見たか?
472Name_Not_Found:03/05/02 22:52 ID:???
あぁ、何だ、「HTMLの」って要素名のことか。
473Name_Not_Found:03/05/02 23:32 ID:???
足りない日本語で書いといて
「解釈してほしいな(w」ですか
おめでてぇな
474Name_Not_Found:03/05/02 23:37 ID:???
いちいちクソミソな物言いしてただけに、カコワルイ。
475Name_Not_Found:03/05/02 23:46 ID:???
>>474
禿同
476暇な人:03/05/02 23:51 ID:???
>>473,474,475
暇だから相手してやっただけだよ
言葉尻とることより、css 勉強したほうがいいよ
それに釣られているオマイラって面白いね?
ありがとう、いい暇つぶしになったよ(w
477Name_Not_Found:03/05/02 23:57 ID:???
とりあえず何で自分上位な喋り方なの?
478Name_Not_Found:03/05/03 00:01 ID:???
476 名前:暇な人[sage] 投稿日:03/05/02 23:51 ID:???
>>473,474,475
暇だから相手してやっただけだよ
言葉尻とることより、css 勉強したほうがいいよ
それに釣られているオマイラって面白いね?
ありがとう、いい暇つぶしになったよ(w
479Name_Not_Found:03/05/03 00:05 ID:???
>>478はあまりに見事に厨の負け惜しみレスを再現してしまったため、
逆に釣れなかった好例。
480Name_Not_Found:03/05/03 00:09 ID:???
はいはい、CSS 勉強しとくから日本語勉強してくださいね、と
481Name_Not_Found:03/05/03 01:11 ID:???
釣られたお魚くん達がビクの中でもがいています
482Name_Not_Found:03/05/03 01:19 ID:???
つまらん
483Name_Not_Found:03/05/03 11:01 ID:TO1mBV/M
IDセレクタとCLASSセレクタの違いが分かりません。

#aaa { font-size:12pt }
#bbb { font-color:red: font-size:12pt }

これはダメでだけど、

.aaa { font-size:12pt }
.bbb { font-color:red: font-size:12pt }

これはいいってこと?
484Name_Not_Found:03/05/03 11:09 ID:???
>>4
485bloom:03/05/03 11:11 ID:tEYOWoFm
486Name_Not_Found:03/05/03 11:19 ID:???
>483
HTMLの事をもう少し勉強した方が良い。
まあそれだけじゃ何のための質問スレなんだかって事で…

IDはそれぞれの要素に固有の識別子をつける属性。
スクリプトなんかでアクセスする時に使ったりする。
固有だから、一つの文書内で別々の要素に同じIDは登場しない。

CLASSは、スタイルを指定するための属性。
スタイルのためにある属性なんで普通はこっちを使う。


ってか、なんでIDセレクタは特別扱いされてるんだろ?
と書いてて疑問に思いますた。
487Name_Not_Found:03/05/03 11:28 ID:???
(たまたま)ページ内で一回しか使われていないclassは
替わりにidを使っても良い(使うべきだ)。

などと勘違いしてる人が案外いるんだよなあ。
488Name_Not_Found:03/05/03 11:28 ID:???
なんかIDに過剰反応しすぎ。特にGW入ってから。
散々既出なんだって、IDとclassは。

idを使わざるを得ない場面だってあるんだしさ。
489Name_Not_Found:03/05/03 11:44 ID:TO1mBV/M
>>486
ごめん、やっぱり違いが分からん。
とりあえず、CLASSだけ使っときます。
490Name_Not_Found:03/05/03 11:52 ID:???
向学心ゼロだな
491Name_Not_Found:03/05/03 12:00 ID:TO1mBV/M
>>490
だって、わかんないんだもん!
492Name_Not_Found:03/05/03 12:59 ID:???
あーそうか。
CSSのためにしか使うつもりが無ければ、1個だろうが複数だろうがclassでいいわけだね。
493Name_Not_Found:03/05/03 13:14 ID:???
んー。別にCSSのためにclassがあるわけじゃないんだけど。まあいいか。
494Name_Not_Found:03/05/03 13:44 ID:78R2klUz
FAQだと思うんですがちょっと教えて。
今気がついたんだけど、俺のHTMLファイルに class=vhs と class="vhs"
ってのが混在してるんだけど、"マークあり、なし、のどちらが正式
でしょうか?
495Name_Not_Found:03/05/03 13:45 ID:???
>>487
うわ、あかんの?
一回しか使わんから、
まさに「使うべきだ」とか思って使ってた。
XHTMLの場合も?
496Name_Not_Found:03/05/03 13:47 ID:???
>>494
なぜ仕樣書を讀まない? 屬性は" "で括るのが正式に決まってるだろ。
497Name_Not_Found:03/05/03 13:49 ID:???
すげー旧字体だな
498Name_Not_Found:03/05/03 13:54 ID:???
>>4の「ブラウザによる振り分け」をみたのですが、
「IE5だけを除く」方法がわかりません。
>>4で紹介されているサイトの方法をうまく組み合わせると
できるのかもしれませんが、そういった思考回路が発達していないのでわかりません。
先ほどもいろいろと試してみたのですが、頭が熱くなるだけです。

CGIやJavascriptによる振り分けを使うべきでしょうか。
499483:03/05/03 14:12 ID:TO1mBV/M
分かった! 下でいいの?

#aaa { font-size:12pt }
.bbb { font-color:red: font-size:12pt }
         ・
         ・
         ・
<div id="aaa">これはOKです。</div>
<div id="aaa">2回目の呼び出しはダメです。</div>

<div class="bbb">これはOKです。</div>
<div class="bbb">これもOKです。</div>
500494です:03/05/03 14:17 ID:78R2klUz
>>496 ありがとうございます!

でも混乱してきちゃった ・・・・

属性が英数字のみの時は ”は省略できるっていうのはHTML4.0のルールであって、
スタイルシートの仕様書ではそうゆう記述は無い、っていうことですか?
理屈っぽくてスマソ
501Name_Not_Found:03/05/03 14:25 ID:???
>>498
除 IE3 & IE4 & IE5/6 & NC4
@import "N6+Opera.css" all;

で、IE5.5〜6向けには
<!--[if gte IE 5.5000 ]>
<LINK rel="stylesheet" type="text/css" href="ie5_5+.css">
<![endif]-->

IE3や4は相手にしなくてよいはず。
バグだらけのNC4にもCSSを適用させたいってことなら、もうJavaScript振分けしかない。
もともとネスケ4はJavaScriptを切るとスタイルシートも効かなくなるからいいだろ?
<script type="text/javascript" charset="Shift_JIS" src="javascript/nn4css.js"></script>
var StyleRt = Rt+'stylesheets/'; // 基準ディレクトリ
var ua = navigator.userAgent;
var NN4=(ua.indexOf("MSIE")==-1 && ua.indexOf("Mozilla/4")==0)?1:0;
var tag = '<LINK REL="stylesheet" TYPE="text/css" charset="Shift_jis" HREF="';
if( ua.indexOf("Opera")!=-1 || ua.indexOf("OmniWeb")!=-1){NN4 = false;};
/* Operaの偽称対策。またOmniWebもdocument.layersに対応してるので。*/
if(NN4)
{
var cssFile = "nn4.css";
/*ページ読込み後、ステイタス・バーに「ドキュメント:完了。」に代って注意書きを表示する*/
window.defaultStatus = "!表示が妙な場合スタイルシートを無効にしてご覧下さい!";
}
else var cssFile = "kara.css";/*中身の無い外部cssファイル*/
document.write(tag+StyleRt+cssFile+'">')
502Name_Not_Found:03/05/03 14:30 ID:???
>>500
スタイルシートの仕様書は関係ない。
HTML4なら英数字だけなら省略可能ではあるが、省略は推奨されない。
XHTMLなら省略不可。
503Name_Not_Found:03/05/03 14:32 ID:???
>>499
単純に考えてそういうこと
・id ---1ページに同じ名前は1回しか使えない。
・class --- 1ページに同じクラス名を何度でも使える。

id名とは、id属性の識別子
 div#abc {・・・}
class名とは、class属性の値
 div.abc {・・・} → div[class="abc"] と同様のこと
504Name_Not_Found:03/05/03 14:35 ID:???
>>500
HTML4でも" "で括るのが正式。属性値の記述方法はHTMLの仕樣書が定めたもの。
http://openlab.ring.gr.jp/k16/htmllint/explain.html#recommend-quote-attribute-value

CSSはHTMLの土台の上に適用されるのです。
505483:03/05/03 14:38 ID:TO1mBV/M
>>503
サンクス。
506Name_Not_Found:03/05/03 14:44 ID:???
>>501-504
お前ら奇跡的に親切ですね
めんどくせー質問と思って放置した自分が恥ずかしい
507Name_Not_Found:03/05/03 14:44 ID:???
>>500
HTML4.xとは、〜HTML3.2からXHTMLに移行する段階の暫定バージョン
なので、Strict以外は、以前の互換性もやむおえず考慮されている部分もある。
そのことを理解すること。
508Name_Not_Found:03/05/03 14:45 ID:???
>>499
私なら次のやうにするね。

.aaa, .bbb { font-size:110%;}/*文字サイズは絶対指定で固定しないこと*/
.bbb {font-color:red:}
#ccc {font-weight:bold;}

<div class="aaa">font-sizeは大きめ</div>
<div class="bbb">font-sizeは大きめで文字色は赤</div>
<div class="aaa" id="ccc">font-sizeは大きめでここだけ太字</div>
509Name_Not_Found:03/05/03 14:46 ID:???
>>507
誤>やむおえず
正>やむをえず(止むを得ず)
510483:03/05/03 14:51 ID:TO1mBV/M
>>508
>/*文字サイズは絶対指定で固定しないこと*/

これはどういうことですか?
511494・500です:03/05/03 14:53 ID:78R2klUz
>>502 >>504 たびたびありがとうございます!
" "でくくるのが正式、だが英数字のみであれば省略可、ということで了解
しますた。

いずれにしても、同一クラスで ""付きと""なしが混在してるのは寝覚めが
良くないので、TextSSでも使って""付きに一括置き換えることにします。
512508じゃないけど:03/05/03 14:57 ID:???
>>510
君が例に挙げてるフォントサイズの指定だと
一番利用者数の多いIEで文字サイズの変更ができない(やり方がとても大変)
ので避けたほうがよいという一般的な注意だと思われ
513483:03/05/03 15:01 ID:TO1mBV/M
>>512
そういうことか、サンクス。
早速、自分のホムペも直してきます。
514Name_Not_Found:03/05/03 15:02 ID:???
>>510 下記でお訊ね下さい。
フォントサイズについて考えよう
 http://pc2.2ch.net/test/read.cgi/hp/1042293757/l50

フォントサイズ指定の落とし穴
 http://www.fromdfj.net/html/fontsize.html
なんで字が小さいんだ?
 http://pc.2ch.net/hp/kako/1004/10041/1004167821.html
http://www.remus.dti.ne.jp/~a-satomi/nikki/2001/07a.html#day10num01
515Name_Not_Found:03/05/03 15:02 ID:???
フォントサイズを割合で指定するのは、一見親切のようで不親切
ブラウザやフォント等の環境の違いによって大きさがまちまちになる。
フォントサイズを実数値で指定していする場合は極端に小さなサイズに
しないように心がければ問題はない。
516Name_Not_Found:03/05/03 15:07 ID:???
>>515
見やすいサイズは人それぞれ。小さいだけでなく大きいのも嫌がる人は嫌。
「ブラウザやフォント等の環境の違いによって大きさがまちまちになる」のは当然。
それを各人が自分の好みに合せて調節できるのが一番。
これ以上は下記で。

フォントサイズについて考えよう
 http://pc2.2ch.net/test/read.cgi/hp/1042293757/l50
517498:03/05/03 15:09 ID:???
>>501

>>506さんのおっしゃるとおり、
親切すぎます。感謝。愛。
518Name_Not_Found:03/05/03 15:19 ID:???
>>503
嘘教えるな
>div.abc {・・・} → div[class="abc"] と同様
div[class~="abc"]
519Name_Not_Found:03/05/03 15:21 ID:???
>>501 >>517
ちなみに複数メディアが指定された@importだとOpera6は認識しない。
@import "MOZILLAonly.css" screen,print;
cf. http://cssbug.tripod.co.jp/detail/opera/b004.html
Opera7は読み込むが。
520503:03/05/03 15:28 ID:???
>>518
ああ、ごめんね ~ 漏れてたね(w

521Name_Not_Found:03/05/03 15:32 ID:???
>>518
いや、div.abc ←→ div[class~=abc] だと思ふ。
つまりclass屬性値が複數併記の場合を考慮して「=」ではなく「~=」である譯でせう?
522Name_Not_Found:03/05/03 15:43 ID:???
なんか旧仮名遣いな感じのヤシがいるな。
523Name_Not_Found:03/05/03 15:59 ID:???
きっと昔の人なんだよ。
524Name_Not_Found:03/05/03 16:09 ID:???
昔の人にしては最近の文化に詳しそうだな。
中の人も大変ですね。
525Name_Not_Found:03/05/03 16:29 ID:???
なかのひとなぢいない
526Name_Not_Found:03/05/03 16:33 ID:???
×なかのひとなぢいない
○なかのひとなどゐない
527Name_Not_Found:03/05/03 16:41 ID:???
二番煎じはつまらん
528Name_Not_Found:03/05/03 17:10 ID:???
旧字体ごときでがたがた騒ぐな。前からいただろうが。
古文でも漢文でもないんだからな。

GWは大変だなぁ。
529Name_Not_Found:03/05/03 17:16 ID:???
GWの人などいない
530Name_Not_Found:03/05/03 17:24 ID:???
そもそも>>1からして歴史的仮名遣でしたからね。
531Name_Not_Found:03/05/03 18:06 ID:???
>>518
嘘ではない、このシッタカ野郎
>div.abc {・・・} → div[class="abc"]

div.abc .xxx {・・・} のような場合を想定して、[class~="値"]と表す
532Name_Not_Found:03/05/03 18:19 ID:???
>>531 
>[class~="値"]と表す
しかし>>503は[class="値"]になってたが? 「~=」でなくて「=」でよいと?
それと、属性値を括る「"」は要るのか?
 cf. http://www.swlab.csce.kyushu-u.ac.jp/man/rec-css2/selector.html#class-html
533Name_Not_Found:03/05/03 18:27 ID:???
IE無視で話が進められているのが素晴らしい
534Name_Not_Found:03/05/03 18:29 ID:???
質問者にはお前のブラウザーを書け、と言うわりにはな
535Name_Not_Found:03/05/03 18:42 ID:???
IEが属性セレクターに未対応ってのは既出だろ。
今の話の流れでわざわざ附記する必要あるかい? >>534
536Name_Not_Found:03/05/03 18:56 ID:???
CSS語るのに、糞IEなど関係ない
537Name_Not_Found:03/05/03 20:07 ID:???
>>531
""は
識別子に適合する属性値ならいらないし、
識別子に使えない文字が含まれてたらいる。
いつでも付けとけば間違いはない。
538Name_Not_Found:03/05/03 20:12 ID:???
>>537>>531宛てでなくて>>532宛ての誤記かな。
だとしたら、>>532前半部への返事はどうした?
539Name_Not_Found:03/05/03 20:32 ID:???
>>538
あー、>>532の間違い。ありがと。
前半部はおれ531じゃねーから知らんよ。
540Name_Not_Found:03/05/03 22:29 ID:???
[class="foo"]はfooの完全一致だから、
<span class="foo bar">なんて指定の時に使えないんじゃなかったっけ?
541Name_Not_Found:03/05/03 22:51 ID:???
漏れはそれより、>>458の弁解が聞きたい
542Name_Not_Found:03/05/03 23:12 ID:???
>>463もな。
543Name_Not_Found:03/05/03 23:22 ID:???
生理中の女はお参りに行くものじゃない、
どうしても行かねばならないなら、正面からお参りするな、脇道から行け、
鳥居もくぐるなと明治生まれのばーちゃんはうるさかったです。
544Name_Not_Found:03/05/03 23:47 ID:???
>>543
(´ι _`  ) 誤爆か
545Name_Not_Found:03/05/04 00:12 ID:???
   ☆ チン     マチクタビレタ〜
                        マチクタビレタ〜
       ☆ チン  〃  ∧_∧   / ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄
        ヽ  ___\(\・∀・) < >>458まだ〜?
            \_/⊂ ⊂_ )   \_____________
          / ̄ ̄ ̄ ̄ ̄ ̄ /|
       | ̄ ̄ ̄ ̄ ̄ ̄ ̄|  |
       |  愛媛みかん  |/
546Name_Not_Found:03/05/04 03:59 ID:???
もしちがってたら誘導していただけるとありがたいです

scrollbarのスタイルシートが反映されないんですが
同じバージョンのIEでもmeだとOKで2000マシンだと
だめなようです(たぶん)
何が考えられますでしょうか?
547Name_Not_Found:03/05/04 04:14 ID:???
>>546
書き方を間違っているとしか思えないな
548Name_Not_Found:03/05/04 07:35 ID:???
>>546
OSよりもIEのバージョンとDOCTYPEだと。
549Name_Not_Found:03/05/04 10:44 ID:???
html{}とbody{}の違い。

IEの独自拡張だから、もちろんNS/Moz/Operaじゃダメですよん。
550Name_Not_Found:03/05/04 11:43 ID:???
>>546ではないけど便乗質問。
html要素にscrollbar-face-color等を指定すればIE6で効くのはわかりますが(標準/互換モードとも)、
IE5.5以前のヴァージョンではどうなりますか。
古いヴァージョン向けにはやはりbodyをセレクターとして指定しないと効きませんか。
551Name_Not_Found:03/05/04 11:46 ID:???
独自拡張はウケ悪いよ
552昔の人:03/05/04 12:08 ID:???
>>546
Win2000はIE5、WinMeはIE5.5がデフォルトではなかったっけ?
scrollbar關係の獨自擴張はver.5.5からで、それ以前は未對應。
553Name_Not_Found:03/05/04 12:09 ID:???
ウケ悪いっていうか、CSSじゃないだろ(w
554Name_Not_Found:03/05/04 12:15 ID:???
>>553 
ん? 独自拡張ではあっても、CascadingするStyleSheetですよ?
まあ見分けにくい色指定とかしなければ害のあるもんではないんだから、
規格外だからって目くぢら立てなさんな。
555553:03/05/04 12:27 ID:???
>>554
目くぢら立てなんて立ててないよ (´∀`)
Cascading StyleSheetのを利用したIEの機能と認識しているよ
556Name_Not_Found:03/05/04 13:29 ID:???
誰かIE5.5持ってる人、>>550の質問に返答してやって下され。
557Name_Not_Found:03/05/04 13:40 ID:???
htmlでもbodyでも効くよ(IE5.5)
558Name_Not_Found:03/05/04 14:17 ID:???
たとえば

p {
color: #000000
text-align: center;
}

p.hoge {
color: #ff0000
}

としたばあい、
<p class="hoge">は色が赤で位置が真ん中になるのが正常な動きでしょうか。
559Name_Not_Found:03/05/04 14:45 ID:???
文字の大きさは自己満足したい以外の場合は
サイズを固定すべきではないんですよね?
%で指定?

各フォームの大きさも、指定してはいけないの?
テキストエリアとか、一行テキストとか。
560Name_Not_Found:03/05/04 15:01 ID:???
>>558
正常。<p>が全て黒文字の横位置は中央寄せで
その中の class="hoge" に赤文字が追加される。
561Name_Not_Found:03/05/04 15:04 ID:???
>>558
正確に言うと色が#FF0000で<p>の中のテキストが真中にくるのが正常な動き。
基本なので>>4のサイトで確認すべし。
>>559
一般的に文字サイズは相対指定したほうがユーザーに優しいしそれを勧めるけど、
最終的には自分で決めることだと思う。
フォーム自体の大きさはCSSじゃなくてHTML側で指定するものじゃないかな?
562558:03/05/04 15:22 ID:???
>>560-561

基本的なことはタグレベル(?)で指定して、
あとは個別にclassで指定しるってことですね。
わかりました。ありがとうございます。
563Name_Not_Found:03/05/04 17:56 ID:???
>>562
>基本的なことはタグレベル(?)で

「タイプ・セレクター」と呼びます。
http://www.swlab.csce.kyushu-u.ac.jp/man/rec-css2/selector.html#type-selectors
564Name_Not_Found:03/05/04 18:52 ID:???
>>549
実はOpera7は対応しちゃってる罠…
デフォルトでは効かないようになってるけど。
565Name_Not_Found:03/05/04 19:11 ID:???
http://www.onyx.dti.ne.jp/~saitone/today/opera7.htm#colourscroll
MS IE 5.5 以降で独自拡張されたスクロールバーの色付けですが、Opera7 は賛否はともかく対応しています。使いたい方は opera6.ini の [User Prefs] 以下に Enable Scrollbar Colors=1 と書き加えて下さい。(Thanks Rijk)
566Name_Not_Found:03/05/04 19:35 ID:???
>>565
やったけど、スクロールバーの色は変化しなかったぞ。
C:\WINDOWS\Application Data\Opera\OPERA7\profile\opera6.ini だよな?
567Name_Not_Found:03/05/04 19:48 ID:???
>>565を実施しただけでは駄目。
どうやらOpera7ではIE6とは違ってhtmlではなくbodyをセレクタにしないと
scrollbar関係のスタイル指定は効かない模樣。
これってバグかなあ?
568Name_Not_Found:03/05/05 12:22 ID:cgu0oOWB
二つのクラス

p.size { font-size: 120% }
p.red { font-color: red }

を組合せて表現することはできますか?
要するに

<p class="size"class="red">赤くて大きなフォント</p>

こんな感じにして、サイズ120%、色・赤にできないかということです。
569Name_Not_Found:03/05/05 12:33 ID:???
<p class="aaa bbb"></p>
570Name_Not_Found:03/05/05 12:33 ID:???
>>568
できるよ。
571Name_Not_Found:03/05/05 12:38 ID:cgu0oOWB
>>569
サンクス。

>>570
>>569が答えですね?
572Name_Not_Found:03/05/05 12:38 ID:???
>>568
やり方は>>569だが、プロパティがおかしいぞ。
573Name_Not_Found:03/05/05 12:39 ID:???
>568
HTMLで一つの要素に同じ属性を二回指定するのは間違い。
複数のクラスを指定したいなら>569のように半角スペースで区切って列記する。
ただIEが対応してなかったような…?
Mozillaなら出来る。
574568:03/05/05 12:47 ID:cgu0oOWB
今試したら、>>569さんの記述でIEでもできました。
レスしてくださった人、サンクス。

>>572
font-color → color
ですね。
スマソ。
575Name_Not_Found:03/05/05 13:34 ID:???
>568
もう来るなよ。
576Name_Not_Found:03/05/05 14:30 ID:???
>>573
あんまりIEをあなどってくれるなよな。
複数classに未対応なのはNetscape4.xやIE4みたいな骨董品だけだろ。
577Name_Not_Found:03/05/05 14:44 ID:???
>576
そうか、未対応なのはオレの頭の方だったらしい。
W3C逝って最新仕様に準拠してくる
578Name_Not_Found:03/05/05 18:45 ID:???
なんか知らんが>>577が素敵に思えてきた
579Name_Not_Found:03/05/05 22:32 ID:???
IE5.0 Opera7 Netscape7でOKなんですけど
XP+SP1のIE6で表示おかしいって感じで困ってるんですが
そういうケースでも
ここにソース書いて解決方法お尋ねしてもよいですか?
a:HOVERのときに問題がおきるのです。
580Name_Not_Found:03/05/05 22:35 ID:???
>>579
とりあえず書かないと誰にもわからないわな
581579:03/05/05 22:40 ID:???
すみません。ではソース貼らせていただきます。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head>
<style type="text/css">
<!--
BODY{
color: #000000;
background-color:#ffffff;
}
a{
background:url("01.gif");
background-repeat:no-repeat;
color:#0055ff;
}
a:HOVER{
background:url("02.gif");
background-repeat:no-repeat;
color:#8800FF;
background-color:#FFFFFF;
}
.ch1{
width:100px;
}
.ch2{
background:url("03.gif");
background-repeat:repeat;
border-style:solid;
}
582579:03/05/05 22:40 ID:???
.ch3{
margin:10px;
padding:10px;
}
--></style></head>
<body>

<div class="ch1"><div class="ch2"><div class="ch3">
<a href="1.htm">ここにマウスをあわせると</a>
</div></div></div>

<p>移動しちゃう</p>
</body></html>

ここから適当にCSS設定を省くと動作okなのですが
各CSS設定は必要なので困っています。
583579:03/05/05 22:46 ID:???
すいません、追記です。
各gif画像はなくても問題(マウスをあわせると下の<p>が移動してしまう)は
起きますのでそのままで問題動作の確認はできます。
.ch1{} とか .ch3{} を消すとOKだったりしますが
各要素は必要なんでどうしたらよいのかなぁ・・・と。
込みいった状況ですみません。
584Name_Not_Found:03/05/05 23:59 ID:???
>>581-583 下記と似てるな。

アンカーにマウスポインタを乗せると親要素が動く(IE5.5)
http://cssbug.tripod.co.jp/detail/winie/b038.html

バグ辞典スレッド向きの話題ではないか?
CSS/DHTMLバグ辞典スレッド 第3版
http://pc2.2ch.net/test/read.cgi/hp/1050844510/l50
585579:03/05/06 00:23 ID:???
>584
ありがとうございます。
もうなんかIEがダメみたいですね。
スレ違いもどうもすみませんでした。
586Name_Not_Found:03/05/06 00:28 ID:???
>>585
IE使うのやめれば幸せになれる予感
587Name_Not_Found:03/05/06 00:48 ID:???
>>581-585
再現条件を絞り込んだよ。↓
http://pc2.2ch.net/test/read.cgi/hp/1050844510/57n

>>586
自分だけよくなっても閲覧者が不幸せだろが。
588579:03/05/06 08:42 ID:???
>>587
ありがとうございます。ちゃんとまとまっててすごいです。

余談ですが、cssで凝ったレイアウトを始めるとかなりの確率で
各ブラウザのバグに突き当たり嫌になってきました。
外枠だけでもテーブルレイアウト使いたくなります。
floatそのものも使いづらいし、float widthあたりはずいぶんバグが山積しているみたいですし。(´Д`;)
はやくMulti-column layoutが普及してほしいものです。

>IE使うのやめれば幸せになれる予感
うちの訪問者の9割はIEで、6割がIE6なんです。・゚・(ノД`)・゚・。
589Name_Not_Found:03/05/06 11:48 ID:???
>>588
じゃあ他を切れ。
590Name_Not_Found:03/05/06 13:21 ID:???
>>588
浮動要素にはwidth指定が必須だって、わかってるのかな? FAQを見よう。 
 http://pc2.2ch.net/test/read.cgi/hp/1050086156/7n
591Name_Not_Found:03/05/07 04:02 ID:???
text-align を justify に指定したのですが、うまく効果が表れません。
text-justify も同時に指定するべきなのですか?
IE の独自拡張だという文を読んだ気がするのですが……。
592844:03/05/07 06:35 ID:???
質問です。ブロック要素2つを並べて、回り込み解除から文章を続けたい時、
(↓こんな風に)
■■
文章

<div style="float:left">■</div>
<div style="float:left">■</div>
<br style="clear:both">
文章

で、あっていますか?それとも br..の部分は、

<div style="clear:both"></div>
文章

と、しなければならないのでしょうか?宜しくお願いします。
593Name_Not_Found:03/05/07 06:58 ID:t7o3cWMN
>>592
問題なし。ただしIE5.01で(状況が悪ければ)問題を起こすかもしれない。
各ブラウザで完全に確認が取れないのなら、<div>を使ったほうが安全ではある。
594__:03/05/07 07:03 ID:???
595Name_Not_Found:03/05/07 07:19 ID:???
スタイルシート切り替えスクリプトを利用しているのですが、
alternate stylesheetにCSSを追加した場合と、スクリプト内にCSSを追加した場合のMozillaの挙動の違いは何なのでしょうか。

要は、alternate stylesheetにCSSを追加したら、表示がバグりました。スクリプト内で追加すれば問題ないのですが・・・。
個人的には、Java Scriptを実行しないようにしている人にも変えられるようにしたいのですが・・・。
596Name_Not_Found:03/05/07 08:14 ID:???
スタイルシート切り替えなんてただのウザいオナニー。
スタイルシートを扱うサイトなら別だが。
どうせ切り替えたってサイト全体のスタイルが切り替わるわけではなく、
そのページだけだろ? いちいちそんなめんどいことするか。
スクリプト切るやつ、あるいはおれのようにクッキー切るやつには
代替スタイルシートなんて文句なしに用なしだよ。ベストで勝負しろ。

と、苦情を申し立てた上でいえば、ネスケでは
代替スタイルシートは、表示>スタイルで切り替えられるんじゃ?
おれは一度も切り替えたことはないが。
597Name_Not_Found:03/05/07 08:16 ID:???
>>591
二つ使用する必要がある。IEの独自拡張だよ。

text-align: justify;
text-justify: inter-ideograph;
598Name_Not_Found:03/05/07 08:30 ID:???
>596
敢えて漏れの意見を言わせてもらうならば、代替スタイルシートは
内容のためにサイトデザインを変更せざるを得ないページで使うものだと思う。
例えばデータ一覧表のページなんかで、一部環境ではサイトデザインが可読性を損ねる場合
そのページだけは代替スタイルでデータを見やすく出来るように、と。

こんな事考えながら作ってもIEじゃ簡単には切り替えられないんだがナー(´・ω・`)
599Name_Not_Found:03/05/07 09:04 ID:???
>どうせ切り替えたってサイト全体のスタイルが切り替わるわけではなく、
>そのページだけだろ? 
>あるいはおれのようにクッキー切るやつには

よくある「切り替えスクリプト」は「サイト全体のスタイルが切り替わる」。
そうでないのはお前がクッキー切ってるから。
「スタイルシート切り替え」の是非はともかく、
前提条件すらおかしい厨房はどっかいけ。
600Name_Not_Found:03/05/07 09:32 ID:???
>>599
だからクッキー切ったりスクリプト切ったりする人間に
代替スタイルシートなんてのは文句なしに用なしだつーてんだろ?
日本語のわからんやつだな。いや、代替スタイルシートで恍惚と
自慰行為にふけってたのに邪魔されたんで逆鱗に触れたか。
まあ、悪かったよ。

>>598 それが本来の代替スタイルシートってもんだな。
601Name_Not_Found:03/05/07 10:00 ID:???
…?

>>596
>どうせ切り替えたってサイト全体のスタイルが切り替わるわけではなく、
>そのページだけだろ?
この部分の説明キボンヌ
602Name_Not_Found:03/05/07 10:26 ID:???
>601
a.htmlでスタイルを代替スタイルの方に切り替え

b.htmlに移動する

スタイルはデフォルトの方

ハァ?

って事だと思われ。
確かに代替スタイルシートはあくまで補助的なもので
サイトデザインを複数用意するためのものじゃないんだがな。
603Name_Not_Found:03/05/07 10:37 ID:???
>>596

--------------------------------------------------------
a.htmlでスタイルを代替スタイルの方に切り替え

b.htmlに移動する

スタイルはデフォルトの方

ハァ?
------------------------------------------
で、「スタイルシート切り替えスクリプト」ってムカツク
と思いました。
それで
>どうせ切り替えたってサイト全体のスタイルが切り替わるわけではなく、
>そのページだけだろ? いちいちそんなめんどいことするか。
>スクリプト切るやつ、あるいはおれのようにクッキー切るやつには
>代替スタイルシートなんて文句なしに用なしだよ。ベストで勝負しろ。
という発言になりました。
スクリプト切ってればスタイル変更できないだけだし、
べつにあるからといって邪魔するわけでもありません。

ただ、スクリプトONクッキーOFFの>>596
切り替えたのにb.htmlに移動すると元に戻ってしまったので
頭にきたわけです。
604Name_Not_Found:03/05/07 10:43 ID:???
馬の前に食べられないニンジンということか。
そりゃ馬もいらいらする罠w
605Name_Not_Found:03/05/07 11:33 ID:???
つまり切り替え用意することに何も問題はないってことね
606Name_Not_Found:03/05/07 11:57 ID:???
>605
切り替え用意するのは良いけど、
切り替えスクリプトだとスクリプトoffやクッキーoffの人が取り残され、
AlternateStyleSheetだとページ毎に切り替え作業が必要に、
と、あんまり良い事は無いと思いますた。
>>596じゃないけど、漏れも自己満足の領域だと思いまつ。
607Name_Not_Found:03/05/07 15:20 ID:???
うちのサイトからして自己満足だからなあ
608Name_Not_Found:03/05/07 15:20 ID:???
http://www.w3.org/TR/REC-CSS2/conform.html#replaced-element
"replaced element"の例として画像やフォーム要素などが挙がっていますが,
JavaScript でテキストを変更した div/span エレメントなども"replaced element"
として扱われることになるのでしょうか?
609Name_Not_Found:03/05/07 15:42 ID:???
>>608
違います。
通常の要素が <tag>内容</tag> という形で記述され、「内容」の部分が表示されるのに対し、
置換要素(replaced element)は、 「内容」の部分が表示されないで別のもの(画像や入力フォームなど)が表示されます。
img, object, inputなどがその代表です。
610Name_Not_Found:03/05/07 16:32 ID:???
切り替えスクリプトは置いといて
代替スタイルいくつもあるところはHTML+CSSのいい手本になるはずだ
しっかり分離が出来てるってことで

でも例外も多そうだな。よく知らん
611Name_Not_Found:03/05/07 17:46 ID:???
通常スタイルでフォントサイズを12px、代替スタイルに14pxのようにしているサイト見たことあるけど、
そこまでするくらいなら最初から相対指定にすればいいのにと思った。
ところで代替スタイルはそもそもユーザビリティ上げるためってのは同意だけど、
スタイルの見本市のようにいろんなデザイン用意してあるのもいいと思う。
サイトに遊びの要素があってもいいと思うし。
612Name_Not_Found:03/05/07 17:47 ID:???
>>600
phpでやればクライアント側の設定(接続方法は除く)に関わらず、
代替のスタイルシートを選択する機構を構築する事は可能でつ。

>>610
島根県のサイトがいい感じだよな。
613 :03/05/07 18:09 ID:CPR2AsS1
http://web-ranking.net/
トップページはまだマシなんですが、総合得点ランキングなどのページでは、
右部の方が長いために、左側メニュー部の背景色が途中で切れてしまいます。
右部に合わせて、左部の背景も下にのばす方法ってないのでしょうか?
また、ページ最下部に、<HR>で区切り線を入れたいのですが、どのようにすれば
いいでしょうか?

よろしくお願いします。
614Name_Not_Found:03/05/07 18:46 ID:???
>>613
一番はやいのが、縦数px程度のイメージ作って
body{
background-image:url("xxx.gif");
background-attachment:repeat-x;
}
のように縦リピートで貼付けて、<div class="top">はbackground-colorで色を
付けて背景を隠す。
615614:03/05/07 18:59 ID:???
>>613
それと同じCSS使うなら全部外部読み込みにしたほうがいよ
あと、こんなスレもあるよ、一応
http://pc2.2ch.net/test/read.cgi/hp/1040377672
616Name_Not_Found:03/05/07 19:26 ID:???
代替スタイルシートの恩恵が受けられないのは
ス切リボなどをつかうか、Moz等を使わないから悪いのだ。
617613:03/05/07 19:46 ID:CPR2AsS1
>>614
ども、ありがとうございます。試してみます。
618Name_Not_Found:03/05/07 23:04 ID:???
代替スタイルシートに萌え〜
http://pc2.2ch.net/test/read.cgi/hp/991400015/l50
619Name_Not_Found:03/05/07 23:05 ID:???
div などのブロック要素の幅は,普通はコンテナブロックの幅と
同一になりますが,これを内部の文字列等の幅に合わせて縮めることは
できないでしょうか.とりあえず

・ { white-space: nowrap; width: 1px; } のような指定をする.
・ table を使う.
・ width 指定なしの float を使う.

ぐらいは考えたのですが,もっとスマートな方法は存在しないのでしょうか.
620Name_Not_Found:03/05/07 23:20 ID:???
>>619
>・ { white-space: nowrap; width: 1px; } のような指定をする.
これは駄目。IE以外ではひどいことになります。IEの表示の仕方は間違ひ。
 ボックスサイズが内容物に合わせた大きさへ強制的に調整される(IE6)
 http://cssbug.tripod.co.jp/detail/winie/b052.html

私だったら
min-width:1em; とします。
>・ width 指定なしの float を使う.
 これも仕樣に反します。img以外では浮動要素には幅指定が必須。
 http://www.remus.dti.ne.jp/~a-satomi/nikki/tmp/floattest/float_not-specified-width.html

621Name_Not_Found:03/05/07 23:24 ID:???
バカ
622619:03/05/08 00:07 ID:???
>>620 とすると,安全にやるとなれば table 使うより仕方ないんでしょうかね......

>私だったら
>min-width:1em; とします。

これはやってみると,何も指定しない時同様に横幅いっぱいになってしまうようです.

ネスケ7だと { display: table-cell } で一応意図したような表示になるのですが,
IEでは全然ダメなようですし.
623Name_Not_Found:03/05/08 00:58 ID:???
float使わずにwidth指定なしでposition使う
624Name_Not_Found:03/05/08 01:37 ID:???
インラインにすれば解決。
625Name_Not_Found:03/05/08 01:55 ID:???
width:autoで出来なかったっけか
626Name_Not_Found:03/05/08 02:22 ID:???
>>619
当該要素が内容にブロック要素を含まない場合、display : inline;で
意図通りの見た目を実現できると思いますが。
627Name_Not_Found:03/05/08 02:49 ID:f50gscAv
質問。謎だ。IE5ではOKだったが、NN7で確認したら驚いた。

divで囲んだ要素を2つ並べた。普通に縦に。それだけ。
<div>文字</div>
<div>文字</div>

横幅を100%指定。IE5ではちゃんと画面一杯一杯の幅でborderの枠が表示。
サイズ変えても、それに応じて。なのに、NNではスクロールバーが出る。激しく横に伸びた枠…

そこで>>5な訳だが、文字数を「3文字」とかにしても、現象が変わらん。
計算方法の実装の違いを激しく超えてるような…。

ウィンドウサイズを変えてみると、スクロールバーの【余白部分】が一定なのも
激しく不気味なのだが…

スタイルは全て外部CSS<div class...>と関係ありますか?宜しく。
628Name_Not_Found:03/05/08 02:56 ID:???
>>627
それだけじゃよくわからん。
せめて、そのdivに関するところだけでも、ソースさらせ。
629Name_Not_Found:03/05/08 02:58 ID:???
>627
それだけじゃ判らん、該当するスタイルを書いてくれ。
あとWinかMacかも。

想像するに、
<div style="border:solid 1px #000;width:100%;">文字</div>
<div style="border:solid 1px #000;width:100%;">文字</div>
で横幅が変になるのか?
630627:03/05/08 03:44 ID:???
>>627 ソース。>>628 違う。
Win98である。

<div class="box">短い文</div>
<div class="box">短い文</div>

で、CSSの方に
.box{width:100%;border:2px solid #cc33ff;color:#ffffff;
background-color:transparent;padding:2em;margin-bottom:60px;}

html-lint減点無し、CSS検証もエラー無しだったが。激しい勘違いをしてるのか俺は。
631Name_Not_Found:03/05/08 04:22 ID:???
>630
width100%+左右のpadding4em+border4pxだからはみ出て当然。
632630:03/05/08 04:40 ID:???
>>631 え?当然?なぜに
633Name_Not_Found:03/05/08 04:51 ID:???
>632
>>5のQ1を理解してこいやモルァ!!

簡単にいえばwidthで指定する幅がborderやpadding(あとmargin)を含んでるWinIEが間違い。
widthの周りにpaddingが、その周りにborderが、さらにその周りにmarginがつくのが正しい。

上記ソースではbody要素の100%(表示域一杯)の幅+4emつくんだからはみ出て当然。
常に4emはみ出る事になる。
634630:03/05/08 05:49 ID:???
>>633 >モルア!!  (((( ;゚Д゚)))ガクガクブルブル
素晴らしい説明だ633よ。
>>5は何かドツボにはまり、全く解らなかった。何故だろう。

paddingではまってたのね。NNの実装が正しいのか…
問題解決(90%とか、全部の合計で考える)&動作確認OK。ありがとう633
635Name_Not_Found:03/05/08 06:39 ID:???
黄金厨はいなくなったはずなのに・・・
636Name_Not_Found:03/05/08 09:29 ID:FjGUpOsa
質問です。
「WEB標準普及プロジェクト」等を参考にしながら、
メニュー要素を<div class="menu">でfloat:leftに、
テキスト要素を<div class="main">でfloat:rightに、
幅はいずれも%指定で表示しました。
IE5.5、IE6、NN4.x、opela6いずれもだいたい意図どおり表示されました。

で、これをさらに<div class="all"></div>でくくり、
{
margin-left:auto;
margin-right:auto;
width: 600px;
}
として画面左右中央に持ってきました。
IEでは意図どおり全体が中央に配置されますが、
NN4.xやopela6では中央に来てくれません。

<div class="all">の親要素はbodyでmarginは0指定しています。
もしかして根本から間違っているのでしょうか?
637Name_Not_Found:03/05/08 10:35 ID:???
>>636
.all { position: relative; }
でどう?
638Name_Not_Found:03/05/08 13:06 ID:???
>636
とりあえず、NN4.xはどうなんだろう…
NN6以降ではどうなの?
あと、Ope"r"aね。

で、NN7ではちゃんと真ん中に表示されたよ。
ソースはっとく。
<html><head>
<style>
.left{float:left;width:40%;background:#0ff;}
.right{float:right;width:60%;background:#ff0;}
.all{margin-left:auto;margin-right:auto;width:600px;border:solid 1px #000;}
</style>
</head><body>
<div class="all">
<div class="left">左</div>
<div class="right">右</div>
<br style="clear:both">
</div>
</body></html>
639636:03/05/08 15:09 ID:???
>637
ありがとう。やってみましたが同じでした。
bodyのmarginが0なのでNN、Operaともぴったり左上寄せになるのです。

>638
ソースそのままで試すとOpera(スペルミスすいません)でも
きちんと中央に来ました!
<br style="clear:both">が抜けていたせいのようです。
floatした場合はこれで必ず解除しないとダメなんですね。

NNの入っているマシンが今日はもう使えないので、
NNでの確認はまだですが、何とかなりそうです。
ありがとうございました!
640Name_Not_Found:03/05/08 17:50 ID:???
>>639
浮動させた要素は通常のフローから除外されるってことを理解して下さい。
div#allの中にフロートさせた要素しか入ってなければ、それは何も入ってないのと同じなのです。
だから<br style="clear:both">なり何なり他の浮動しない要素を含ませるわけで。
641Name_Not_Found:03/05/08 21:24 ID:???
widthの解釈って、Opera7もIE6と同じですよね。>>633のように、Operaも間違ってるの?
今まで幅を%で指定したい場合は、width:80%;と指定し、さらにmax-width:60%;などと併記して
IE6とN7で同じような幅で表示されるようにしてました。
ところが、Opera7はmax-widthにも対応してるので、この方法だと縮みすぎてしまうのです。
何かうまい方法ないかな、と思うのですが、もうこのやり方自体が駄目駄目ですか?
要は、widthを%で指定する場合、paddingなどがあっても
IE6、N7、Opera7で見た目同じ幅で表示させたい、ということです。
paddingがせまければ、FAQの中央寄せのやり方でも、たいした差はないので気にならないのですが、
デザイン上paddingを大きくとった時、やっぱり幅の差が出てしまうので。
642Name_Not_Found:03/05/08 21:30 ID:???
>>641
>widthの解釈って、Opera7もIE6と同じですよね
いいえ、ちがひます。

>要は、widthを%で指定する場合、paddingなどがあっても
>IE6、N7、Opera7で見た目同じ幅で表示させたい、ということです。
ならばIE6を標準モードで解釈させなさい。
643Name_Not_Found:03/05/08 21:34 ID:F5r4R1P0
<div class="width:100px; height:100px;">
<p>2ちゃん</p>
</div>

で、ブロックのど真ん中に表示させるもっとも簡単な方法はなによ?
vertical-align使えないとなると面倒この上ないな。
やれやれ、
W3Cは融通が利かないからいつまでたっても相手にされないんだな。
644Name_Not_Found:03/05/08 21:40 ID:???
>>643
vertical-alignのことをわかってない人、発見。
valign属性の代りではないんだよ。

いや、釣りですか? スゴイclass名ですねえ。
>class="width:100px; height:100px;">

645641:03/05/08 21:45 ID:???
>>642
あー、互換モードでやってました。
互換モードだと、Opera7とIE6のwidthの表示が同じになるんですけど。
(widthがpadding込みになる)

>ならばIE6を標準モードで解釈させなさい。
ソレダ!
なんでだか分からんけど、標準モードって難しいような気がしてたので、
標準モード使うなんて考えもしなかったです。
さっそくソースの見直しだ。ありがとん>>642
646Name_Not_Found:03/05/08 21:46 ID:???
>>643
すごい!そんなCSSって何処で学んだの?
647Name_Not_Found:03/05/08 21:48 ID:F5r4R1P0
>>644
つまらん揚げ足取りしか言えんのか。おまえは。
vertical-alignが使えりゃ、体感的に分かりやすいのにと
嘆いているんだろうが。テーブルレイアウトならさくっとできることも
満足にできないような仕様だから、いつまで経ってもオタク以外は
だれも支持してくれないのよ。
648Name_Not_Found:03/05/08 21:51 ID:???
>>647
>vertical-alignが使えりゃ、

使用できますよ? でもvalignとは別の機能を果すものなんだけど。
vertical-alignは行ボックス内における、インラインボックスの垂直方向の位置を指定するプロパティです。
649Name_Not_Found:03/05/08 21:52 ID:???
>>647
>テーブルレイアウトならさくっとできることも満足にできない
CSSでもさくっとできますよ。
IEがそれに対応していない(する気がない)だけの話です。
650Name_Not_Found:03/05/08 21:56 ID:???
>>643
div p {
text-align:center;
margin-top:50%;/*50px*/
}
でええやんけ。
651Name_Not_Found:03/05/08 21:57 ID:???
>>647
>いつまで経ってもオタク以外はだれも支持してくれないのよ。
( ´,_ゝ`)プッ 史ね�
652Name_Not_Found:03/05/08 21:59 ID:F5r4R1P0
>>648
おぉ、揚げ足取りじゃないまともな反応が。。

インラインボックスの垂直方向は分かるが、
ブロック要素で縦中央にしたいわけよ。heightを指定してりゃ
中央なんて簡単に出せるんだからインラインに限らなくてもよさそうなもの。
結局むりやりインラインにするしかないのか。結局それが一番簡単なのか。
653644=648:03/05/08 22:03 ID:???
ID:F5r4R1P0よ、言葉は正確に使ってくれたまへ。 
あれではvertical-alignとvalignの差もわからぬ馬鹿としか見えない。
654Name_Not_Found:03/05/08 22:05 ID:???
>>652
上下に、paddingとればいいだけだろ
655Name_Not_Found:03/05/08 22:07 ID:F5r4R1P0
>>650
まあそうだな。できれば
垂直中央をひとまとめに指定できればうれしかったのだが、
あきらめてひとつひとつ指定することにするよ。
656Name_Not_Found:03/05/08 22:11 ID:???
なぜFAQ(>>7)を見ない?
Q6:画面中央に配置するにはどうすれば?
A6:左右(水平方向)のセンタリングは既出。垂直には色々な方法があります。
 「スタイルシート 縦中央(垂直中央)」参照のこと。
 http://www.parkcity.ne.jp/~chaichan/qanda/qa3558.htm
657Name_Not_Found:03/05/08 22:45 ID:???
W3C厨もうざいが、
それにもまして
コイツ ID:F5r4R1P0 は最悪。
人間のカス。氏んでいいよ。
658Name_Not_Found:03/05/09 00:18 ID:???
画像画像画像 文章
画像画像画像 文章
画像画像画像 文章
画像画像画像 文章
          文章
          文章

画像にfloat:left;を指定して文章を回り込みさせているのですが,
画像の下端が来た時点で回り込みが終了してしまいます。
上の図のように回りこませる文章の左端が揃うようにしたいのですが,
どうすればいいのでしょうか?
659Name_Not_Found:03/05/09 00:20 ID:???
>>658
右側のもdivで括ってflortを指定すればできるよ
660658:03/05/09 00:28 ID:???
>>659
盲点でした…
ありがとうございました。
661Name_Not_Found:03/05/09 01:18 ID:???
自分たちが正しいと信じ込んでいますね。
662Name_Not_Found:03/05/09 01:24 ID:???
そのようです。
663Name_Not_Found:03/05/09 01:49 ID:???
>661=>662=F5r4R1P0
664Name_Not_Found:03/05/09 01:52 ID:zMQHPqPW
>>663
あほか。
665Name_Not_Found:03/05/09 01:53 ID:???
>661=>662=F5r4R1P0 =>664

しつこいな
666Name_Not_Found:03/05/09 02:08 ID:???
つか656まででいいんだよな。
657以下は無駄。
667Name_Not_Found:03/05/09 02:10 ID:???
>>666
以下って、質問とその回答と自演デムパしかないぞ?どれを指してるの?
668Name_Not_Found:03/05/09 06:30 ID:???
ID:F5r4R1P0 は最悪。
669Name_Not_Found:03/05/09 15:45 ID:ftTrsNwc
フォームのドロップダウンリストボックスに表示する件数を制御する方法はありますか?
<SELECT>〜</SELECT>です。最大で11件しか表示されません。
よろしくお願いします。
670Name_Not_Found:03/05/09 16:42 ID:???
ID:F5r4R1P0みたいな、自分が無知な(スキルがない)ことを
CSSのせいにする香具師が一番 最悪。
671Name_Not_Found:03/05/09 18:47 ID:???
>>669
マルチ
672Name_Not_Found:03/05/09 22:05 ID:???
昼間は雰囲気悪いな。
673Name_Not_Found:03/05/10 14:30 ID:???
hn や p タグの最初の文字だけに装飾を施す、などはできますか?
文字色を変えたりサイズを多少大きくするようなことができればよいのですが。
674Name_Not_Found:03/05/10 15:06 ID:???
>>673
できるから調べてみな
675Name_Not_Found:03/05/10 15:15 ID:???
>>674
hn:first-letter などでよいのでしょうか。
676Name_Not_Found:03/05/10 15:22 ID:???
>>675
よい

基本解説サイトくらいは舐めるように見とくとよろし
677Name_Not_Found:03/05/10 16:06 ID:???
>>674,676
偉そうに・・・
それぐらい、すんなりとでないのか?(蛸
678Name_Not_Found:03/05/10 17:35 ID:???
煽っても何も出んよ
679Name_Not_Found:03/05/10 17:40 ID:???
ちょっと調べたらすぐわかるじゃん
680Name_Not_Found:03/05/10 17:44 ID:???
「できる?」と聞かれて「できる」と答えるのは正しい。
681Name_Not_Found:03/05/11 01:51 ID:5vQM/Zdq
質問です。
1.外部CSSを用いていますが、属性によってはbody内に記述したほうが
良いものがあったりする場合があるらしいんですけど、
(UAの実装上の理由で)どんなものがあるのでしょうか?
2.黄金厨って、なんですか?
宜しく。
682Name_Not_Found:03/05/11 02:15 ID:???
>2.黄金厨って、なんですか?

おまえみたいなやつのこと
683Name_Not_Found:03/05/11 02:47 ID:???
インラインフレームやフレームはありですか?なしですか?
684Name_Not_Found:03/05/11 02:58 ID:???
>>683
さあ?
そういう質問の仕方はなしってのはわかりますけどね
685Name_Not_Found:03/05/11 03:10 ID:???
>>684
つまんない奴だな。
お前には用はないよ。
686Name_Not_Found:03/05/11 03:12 ID:???
>>684ではないけど
おまえおもしろいやつだなw
687Name_Not_Found:03/05/11 03:14 ID:???
CSSに関する質問はこちらへどうぞ。 ※ 議論はよそで ※
■■■■■ 質問のしかた ■■■■■
・基礎は解説サイト(>>4・かなりわかりやすい)で勉強してください。
・質問の前に【FAQ】(>>5-7)を参照して、既出の再掲を避けて下さい。
・【FAQ】でもわからなかった場合、過去ログを検索すると載ってるかも。
 WinIEの場合は、[Ctrl+F]で検索できます。
・ブラウザによって対応していないプロパティーやバグがありますので、
 【解説など】(>>4)の対応表や「CSSバグリスト」に目を通しておきませう。
・土台のHTMLが間違ってるとCSS指定も意図通りに効きません。
 正当(valid)なHTMLを心がけて下さい。

初心者の疑問は大抵ここまでで解決します。

・OSやブラウザの種類とヴァージョンについては必ず明記してください。
 特にNetscapeは、ver.4までと6以降でまったく別物です。
・「環境を書け」とか「ソースは?」と求められたら応じませう。
 その方が回答が早く得られます。
688昔の人:03/05/11 09:53 ID:???
>>681
>属性によってはbody内に記述したほうが
>良いものがあったりする

初耳ですな。そんなのがあったらこちらが教へて貰ひたいものです。
689Name_Not_Found:03/05/11 14:24 ID:???
昔の人も大変だな。
690Name_Not_Found:03/05/11 20:28 ID:???
IE3でbackgroundは文書内に書いておかないとダメだった気がする。
つーかそんなことまで気にするならCSSなんて使わない方が。
691Name_Not_Found:03/05/11 22:21 ID:???
>>690
そんなことまでして、IE3を使うことをやめて下さい。
頭悪いんか?
692Name_Not_Found:03/05/11 22:24 ID:???
すみません。ちょいと質問っす。
CSSがオフでは文字列のみが表示されて、
オンの時にはその文字列の代わりに、
画像のみが表示されるようにするのは可能ですか?
可能なら、どのように書けばいいんでしょうか?


693Name_Not_Found:03/05/11 22:40 ID:???
>>691
日本語の意味がわからん。
694Name_Not_Found:03/05/11 23:28 ID:???
>>692
たとえば、CSSがオンの環境では画像でロゴを表示したいが、
オフの環境では文字列を表示したい、というような場合ならば、

h1 {
width : 100px; /* 画像の幅 */
height : 200px; /* 画像の高さ */
background-image : url(xxx.png); /* 使いたい画像 */
background-repeat : no-repeat;
font-size : small; /* 目立ちにくいように小さめのサイズを指定 */
color : white; /* 画像全体の色調に近い色 */
background-color : black;
/* 画像オフの環境でも読めるように、文字色とは異なる色を指定 */
}

とかで、どうだろう。
文字サイズは、xx-smallとか0.1emなどといった風に、極端に小さくした方が
目立ちにくく、CSS有効な環境では画像の邪魔にならないが、「CSSは有効だが
画像は非表示」という環境のことも考慮して、あまり小さくしすぎない方が
よいと思う。
695Name_Not_Found:03/05/11 23:37 ID:???
>>692
こんなのとかどうでしょう。

div { background-image: url"画像のパス"; height: 50px; width: 100px; }
h1 { display: none;}

<div><h1>たいとる</h1></div>
696695:03/05/11 23:40 ID:???
"画像のパス"にカッコが抜けてた。
697Name_Not_Found:03/05/11 23:49 ID:???
>>692
表示したくない文字列をspanとかで括って
visibilityプロパティで操作するのもありかもね
ちなみにこの場合だと非表示分も空間が空けられる
>>695の場合だと非表示分の空間は詰められる)ので
使い分ければいいよ。
他にもいろいろやりようはありそう。
698Name_Not_Found:03/05/11 23:56 ID:???
某ブラウザが対応してさえいれば擬似要素で決まりなのだけどな。
699Name_Not_Found:03/05/11 23:58 ID:???
>>692
画像オフのことも考えといたほうがいい
700692:03/05/11 23:59 ID:???
>>694-697
おかげで解決しますた。
いくら感謝しても感謝し足りないくらいっす。
ホント、ありがとう(涙
701Name_Not_Found:03/05/12 00:31 ID:???
>>695-697
display : noneやvisibility : hiddenを使うと、「CSSは有効だが画像は
非表示」の環境で情報が伝わらなくなる(文字列も画像も表示されない)
ので、あまりおすすめできない。
702Name_Not_Found:03/05/12 01:09 ID:F77kHtUs
質問です。
画像を非表示に設定する人のことも考えて設計すべきなんですか?
非表示にする理由が解らないのですけど、何故でしょうか?
703動画直リン:03/05/12 01:11 ID:vHELmxKt
704Name_Not_Found:03/05/12 01:16 ID:???
>>702
1回線が細いから。
2テキスト情報のみ求めてるから。
3うっかり精神的ブラクラ踏むのが怖いから。
1と2は割といそう。
CSSを使う気があるなら代替スタイルで画像あまりつかわないスタイルも用意するとか。
レベルの高いサイトは画像切ってもそれなりになるように設計されてたりするけどね。
705Name_Not_Found:03/05/12 01:38 ID:???
>「CSSは有効だが画像は非表示」の環境

そんなアタマおかしいヤシは虫。
706Name_Not_Found:03/05/12 01:44 ID:???
漏れのサイト画像切っても全然問題ないけど、
CSS 切ると結構ヤバイかもなぁ。
707Name_Not_Found:03/05/12 01:44 ID:???
>>705
んなこたーない
708Name_Not_Found:03/05/12 01:51 ID:???
>>702
テキストブラウザ等だけでなく、IEやネスケ等の「ふつうのブラウザ」を
使っている人の中にも、>>704のような理由で画像をオフにしといて、解説や
代替テキストによって興味をひかれたものだけ手動で表示してる人もいる。
(ブロードバンドが普及してきたから、減少傾向にはあると思うけど)
だから、HTMLだけでなく、CSSも、画像非表示の環境を考慮した方が無難。
709Name_Not_Found:03/05/12 01:52 ID:???
>>706
論理マークアップすれば問題ない筈です。
710Name_Not_Found:03/05/12 01:54 ID:???
漏れのサイトはそもそもが写真サイトなんで画像切ってるヤシのことなんて考えない。
テキストサイトだったら考えてもいいのだろうが。
711Name_Not_Found:03/05/12 01:57 ID:???
ええと、「画像オフの環境を考慮すべきか否か」とか、そういう議論はよそで
やってね。
ここは質問スレなので。
712Name_Not_Found:03/05/12 02:52 ID:???
>>708
そういう人がいることを考慮するのが必要なのかはさておき
そんなのは1万人に1人もいない。
しかもそれはブラウザの設定の問題で、それを考慮するのと
携帯などで見る人も考慮するのでは
意味合いが全くちがう。
W3C的にはおなじなんだろうけどさ。

713Name_Not_Found:03/05/12 03:27 ID:???
>712
統計でも取ったの? そうでなきゃ「一万人に一人」なんて断言しないで欲しい。
714Name_Not_Found:03/05/12 03:54 ID:???
>>712 一例ですが、私はADSLだけど画像オフ。自サイトはCSS使用しまくり。
715Name_Not_Found:03/05/12 03:54 ID:???
ダイヤルアップの頃はそこそこいた気もするけどね。
716Name_Not_Found:03/05/12 04:14 ID:???
717Name_Not_Found:03/05/12 04:46 ID:???
テーブルの枠線について質問です。


body{background-color:#fff;color:#f00}
table{background-color:#f00}
td{background-color:#fff}


<table cellspacing="1">
<tr>
<td>品名</td><td>価格</td><td>説明</td>
</tr>
<tr>
<td>品名</td><td>価格</td><td>説明</td>
</tr>
</table>

通常テーブルはそれぞれのセルが枠で囲われるため二重線のようになってしまうのですが
これを一本の線で表示させるために、このような方法を取っています。
これは適当でしょうか?もっと適切な方法があったら、ご指導をお願いします。
718Name_Not_Found:03/05/12 05:23 ID:???
>>717
<table cellspacing="0">でいいのでは?
CSSでやりたいなら、
border-collapse:collapse;/*MacIE5とNN6とが未対応。NN7は対応*/
 http://hp.vector.co.jp/authors/VA022006/css/tables.html#border-collapse
 http://msugai.fc2web.com/web/CSS/tables.html#coll
719Name_Not_Found:03/05/12 08:44 ID:???
オペラも対応してる
720Name_Not_Found:03/05/12 08:49 ID:???
>717
NN6相手なら
border-spacing:0px;
で見た目は同じに出来る。
ピンポイントな対応だけど両方書いとけば良いかと
721Name_Not_Found:03/05/12 21:32 ID:WSwvyp6t
<html>
<head>
<title>photo</title>
<style TYPE="text/css">
<!--
a:link{color:ffffff}
a:visited{color:ffffff}
a:hover{color:ffffff}
a:sctive{color:ffffff}
-->
</style>
</head>
<body>
<a HREF="javascript:window.close()" title="ウィンドウを閉じます"><img SRC="close.png"></a>
</body>
</html>

リンクの色を指定しているのに画像だとリンクの色がデフォルトのままです。
どうしたら変わりますか?
722Name_Not_Found:03/05/12 21:53 ID:???
>>721
色がついているのは何か、それを考えてみましょう。

そう、色がついているのは画像のボーダーです。
したがって、
a img{
border-color : ffffff;
}
でOKです。
723Name_Not_Found:03/05/12 22:00 ID:???
a img{
border-color : #ffffff;
}
724722:03/05/12 22:12 ID:???
>>723
サンクス。
つられてしまった。鬱だ。
725717:03/05/13 10:36 ID:???
>>718-720
あ、だいたい思い通りになりました。
ちょっと手直しして使えそうです。
ありがとうございました。
726Name_Not_Found:03/05/13 14:40 ID:???
>>705 img {display:none;}
727Name_Not_Found:03/05/14 15:53 ID:???
>>726で思い出したけど、Sleipnirとか使ってるとよくやる<CSS有効で画像非表示
728Name_Not_Found:03/05/14 16:09 ID:???
プニル?
('A`)イラネ
729Name_Not_Found:03/05/14 16:41 ID:???
大抵のタブブラウザはワンクリックで画像のON/OFFできるだろ
730Name_Not_Found:03/05/14 19:09 ID:???
>722
border:none;で良いような。
731Name_Not_Found:03/05/14 22:41 ID:???
>>730
言うか言うまいか迷ってた。
でも質問者はボーダーなくしたいとは言ってないしなぁ、とか。
732Name_Not_Found:03/05/14 22:54 ID:???
それ以前に既読も未読も同じ色ってのは糞
733Name_Not_Found:03/05/14 23:02 ID:???
それ以前に糞って言い始める奴が糞
734Name_Not_Found:03/05/14 23:03 ID:???
それ以前に糞って言い始める奴が糞って言い始める奴が糞
735Name_Not_Found:03/05/14 23:09 ID:???
それでも既読も未読も同じ色ってのは糞
736bloom:03/05/14 23:11 ID:DZwRSDjG
737Name_Not_Found:03/05/14 23:32 ID:???
まぁ正直どっちでもいいんだけどね
738Name_Not_Found:03/05/15 00:33 ID:???
よくねえよっ
739Name_Not_Found:03/05/15 02:23 ID:???
なんか粘着がいるな。
既読も未読も同じ色って不便そうかもしれんが
それもサイトによるだろ。
740Name_Not_Found:03/05/15 02:27 ID:???
まぁそれぞれやりたいようにやってくれ。次ドゾ。
741Name_Not_Found:03/05/15 02:30 ID:???
↑自分ではなにもしないヤシ
742Name_Not_Found:03/05/15 02:44 ID:eAe/KMBQ
{border-width: 5px 1px; border-color: black gray; border-style: solid;}
を、borderの重複を避けて一括表示ってできないのですか?
743Name_Not_Found:03/05/15 02:52 ID:???
>>742
http://pc2.2ch.net/test/read.cgi/hp/1052372765/488

誘導されたときはどちらかに一言断りを入れよう。
744Name_Not_Found:03/05/15 05:34 ID:nba0rtaQ
border:1px solid #000;
    サイズ スタイル 色
745Name_Not_Found:03/05/15 07:29 ID:???
>>739
> それもサイトによるだろ。
よらねえよばか
746Name_Not_Found:03/05/15 07:34 ID:???
>>745
うっせ馬鹿
747Name_Not_Found:03/05/15 07:37 ID:???
>>746
馬鹿
748Name_Not_Found:03/05/15 08:21 ID:???
スレの流れにもにょりーた
749Name_Not_Found:03/05/15 08:37 ID:???
>>747
うっせ馬鹿
750Name_Not_Found:03/05/15 08:43 ID:???
>>732
しね
751Name_Not_Found:03/05/15 11:11 ID:???
だから既読も何も同じでいいよ
そんなとこ誰も行かねーからよ
752Name_Not_Found:03/05/15 11:35 ID:???
このスレは我々【死ぬ死ぬ団】が制圧した。
団員に加わりたい者は死ぬ気で戦え。

                   総指揮官プセ淫。
753Name_Not_Found:03/05/15 11:48 ID:???
↓山崎で大いに和んでスレ沈静化
754Name_Not_Found:03/05/15 14:14 ID:???
hr 水平線の縦位置を上端にする方法教えて

──── これを

 ̄ ̄ ̄ ̄ こんなふうに
755Name_Not_Found:03/05/15 14:56 ID:???
>>754
<hr>使わずにborderを使う
756754:03/05/15 15:04 ID:???
>>755
できた!ありがとう
757Name_Not_Found:03/05/15 16:38 ID:???
リンクのtarget属性をCSSで設定するにはどうすればよいのでしょうか(TT)
758Name_Not_Found:03/05/15 16:44 ID:???
age
759Name_Not_Found:03/05/15 16:44 ID:???
>>757
できません。JavaScriptでやって下さい。
老婆心ながら、窓を無闇に開かせると嫌がられることがありますよ。
760757:03/05/15 16:48 ID:???
>>759
java使わないと無理なんですね、ありがとうございます。
画像は別窓で開いたほうがいいかなとおもいまして
761Name_Not_Found:03/05/15 16:54 ID:???
>>760
X java使わないと無理なんですね
○java script 使わないと無理なんですね
Javaと、JavaScriptは別物
762757:03/05/15 16:57 ID:???
>>761
間違えました、吸いませんでしたm(_)m
763Name_Not_Found:03/05/15 16:58 ID:???
>>760
JavaScriptを使ってもいいが、「謎のアンカー」にしないでね。
http://www.ne.jp/asahi/minazuki/bakera/html/opinion/zannen2
まあ初心者はTransitionalを宣言してtarget屬性でやっておくのが無難。
764Name_Not_Found:03/05/15 17:09 ID:aOJm2fAs
tableのalignをCSSで書くとどうなるのですか?

table< align = "center" >

これをCSSで。
765Name_Not_Found:03/05/15 17:12 ID:???
1クリック10円!
仕事あがりに2ちゃんねるにリンクを貼り付けるだけで・・・
先月分126620円入金されました。
リンクスタッフの登録はメアドと任意のパスワード
を入力すれば完了。メアドは無料メールでも可。
http://accessplus.jp/staff/in.cgi?id=11014
直リンクできないのでアドレス貼り付けて、ジャンプしてください
766Name_Not_Found:03/05/15 17:14 ID:aOJm2fAs
ミスった。

<table align = "center" >
767Name_Not_Found:03/05/15 17:18 ID:???
768Name_Not_Found:03/05/15 17:24 ID:???
>>766 慌てるでない。なぜFAQを見ぬのか。
table {
margin-left:auto;margin-right:auto;
text-align:center;/*WinIE互換モード対策*/
}
td {text-align:left;}/WinIE互換モード対策*/
769Name_Not_Found:03/05/15 17:40 ID:aOJm2fAs
>>767
>>768
サンクス。
770_:03/05/15 17:43 ID:???
771Name_Not_Found:03/05/15 22:07 ID:???
>JavaScriptを使ってもいいが、「謎のアンカー」にしないでね。
>http://www.ne.jp/asahi/minazuki/bakera/html/opinion/zannen2

>onclick だけ指定して onkeypress を指定しないと、マウス操作とキーボード操作で動作が違ってきてしまいますので注意が必要です。まあ、狙ってそうするならそれはそれで良いとも思いますが。

んなめんどくせーことやってられっかボケ
って感じでした。
全体的にそのページ、こうあるべきだ!ってのがうざ。
人それぞれなんだから他人に強要すんな。
772Name_Not_Found:03/05/15 22:20 ID:???
>>771
少なくともそれは人それぞれの問題じゃないと思うぞ
773Name_Not_Found:03/05/15 22:41 ID:???
javascript無しでは見られないのは致命的だと思うぞ
774Name_Not_Found:03/05/15 22:50 ID:???
タブで移動しキープレスでリンク移動する香具師なんて
知ったことではないということ。

>>javascript無しでは見られないのは致命的
というのは同感。
775Name_Not_Found:03/05/15 23:00 ID:???
>>774
俺はそれすげー不便。ちったぁ見る人のことを考慮してくれ。
てめぇの自分勝手な都合で直感に反する動作(マウスとキーボードで動作が違う)が
起こる記述をしないでくれ。

窓が開く時点でウザいんだけどな。


スレ違いスマソ
776Name_Not_Found:03/05/16 00:18 ID:???
>タブで移動しキープレスでリンク移動する香具師なんて
>知ったことではないということ。

( ´,_ゝ`)プ
777Name_Not_Found:03/05/16 00:24 ID:???
いいんじゃないの
自分の常識に当てはまらない奴なんかシラネーヨってスタンスなんでしょう
人それぞれってのはそういう意味かと
まあ糞ガキの理屈だがナー
778Name_Not_Found:03/05/16 00:25 ID:???
contentで、「/*」「*/」をつけたいときに、
どう記述すればよいんでしょうか

hoge:before{content:"/*";}
hoge:after{content:"*/"}

ではマズイですよね・・・?
779Name_Not_Found:03/05/16 00:29 ID:???
>>778
まずくないぞ
780Name_Not_Found:03/05/16 00:31 ID:???
>>778
""で括ってるから大丈夫だろ
つか聞く前にやってみんかい
781778:03/05/16 01:18 ID:???
>>779-780
ありがとうございます。

以前やってみたときに、Operaは普通に表示されて、
Mozillaでは無視されたことがあって、
駄目なのかなと思ってたんですが、
今やったらMozillaでも表示されてました・・・

どうもすみません、ありがとうございました。
782Name_Not_Found:03/05/16 08:30 ID:???
IE5.0以降で見てくださいね。

というページがよくあります。
するとお前らは文句たらたらいうわけです。毒電波満載で。

別に個人の自由だろ。だったら見るな!

もちろんいろんな環境でみれるようにValid+CSSでやるのもいいだろうし
それもまた自由。
783Name_Not_Found:03/05/16 08:52 ID:???
IE5以降なんかで見たらスカラー波の餌食ですよ
784Name_Not_Found:03/05/16 10:02 ID:???
>>782
藻前の理屈でいうと、駄目サイトに対して文句を言うのも
個人の自由だろ。ばーか。
785Name_Not_Found:03/05/16 11:07 ID:???
昨夜あたりから香ばしいのが一人紛れ込んでるな
786Name_Not_Found:03/05/16 12:56 ID:???
いや、いい香りだよ。
787Name_Not_Found:03/05/16 14:18 ID:???
まーあれだ
2chでほえてろ馬鹿が。
どーせこんなとこでしか吠えられねーんだからなw
788Name_Not_Found:03/05/16 14:18 ID:???
>>784
まーあれだ
2chでほえてろ馬鹿が。
どーせこんなとこでしか吠えられねーんだからなw
789Name_Not_Found:03/05/16 14:19 ID:???
>>784
まーあれだ
2chでほえてろ馬鹿が。
どーせこんなとこでしか吠えられねーんだからなw

790Name_Not_Found:03/05/16 14:23 ID:???
>>787-789
自分への叫びでつか?
791Name_Not_Found:03/05/16 14:30 ID:???
自由だかなんだか知らんが、NN4.xやIE4ならいざ知らず
それ以降のブラウザ全てで意図した表示に出来ないのははっきり言って未熟。
オーサリングツール使ってIE対象のヘチョいページ作って満足してろってこった。
792Name_Not_Found:03/05/16 17:00 ID:???
>>791
WinIEは5.5以降でないと真価を発揮できない。
5.0まではインライン要素へのborder指定に対応してくれないから。
5.5以降ならそんなに不足を感じない。
793Name_Not_Found:03/05/16 17:06 ID:???
IE5.5なんてダメダメもいいとこじゃん
794Name_Not_Found:03/05/16 17:22 ID:???
>>792,793
WinIEなんて6でも、ダメダメじゃん
CSS語るなよ
795Name_Not_Found:03/05/16 17:25 ID:???
そもそもCSSを語るスレではないわけだが
796Name_Not_Found:03/05/16 18:03 ID:???
お前ら、ここは質問スレです。
797初心者:03/05/16 18:33 ID:wEF+SSgr
結局IEとNNとモジラとオペラに対応してれいいんでつか?
798初心者:03/05/16 18:34 ID:/KWm9G6R
あ、最新の、です
799Name_Not_Found:03/05/16 18:36 ID:???
何が、が抜けてるわけだが。
800Name_Not_Found:03/05/16 18:40 ID:???
801Name_Not_Found:03/05/16 18:46 ID:???
802Name_Not_Found:03/05/16 18:48 ID:???
MozillaとOpera(最近の)はかなり高い互換性があるから
トリッキーなことをあまりしなければ、実際のところほとんど
仕様に促した記述 と IEでの表示 の折り合いをつける作業になると思ふ。
803Name_Not_Found:03/05/16 19:15 ID:???
>>802
互換性というか、CSS2を素直に解釈しているだけ。
IEのようなシェアを翳しあげて好き放題にやっているブラウザは
使用しない方がいい。








と思うんだけど
804Name_Not_Found:03/05/16 19:25 ID:LeOeqJaX
インラインフレームで中に表示するHTMLファイルの
HEAD内にインラインフレームのスクロールバーの色を変えようと
下記を記述したのですが適用されません(スクロールバーの部分のみ)

<style type="text/css">
<!--
div.box{
position:absolute;
}
-->
<!--
body {
scrollbar-arrow-color:#000000;
scrollbar-3dlight-color:#605CA8;
scrollbar-shadow-color:#000000;
scrollbar-darkshadow-color:#1B1464;
scrollbar-face-color:#342E8B;
scrollbar-track-color:#070250;
scrollbar-highlight-color:#8D89D3;
}
-->
<!--
body {
background:#605CA8;
font-size:12px;
margin: 0px;
padding: 0px;
}
-->
</style>

他のスクロールバーは変わるんですが・・・・。
805Name_Not_Found:03/05/16 19:31 ID:???
>>804
IEのみでしか解釈されない、scrollbar-....などは
使用しない方がいい
806Name_Not_Found:03/05/16 19:34 ID:???
>>804
iflame{scrollbar:unko;}
807Name_Not_Found:03/05/16 19:34 ID:???
iframeか。
808804:03/05/16 19:38 ID:???
>>806
ワロタ・・・・。

色変えは使わない方がいいんですね。
わかりました。やめておきます。
ありがとうございました。
809Name_Not_Found:03/05/16 19:40 ID:???
>>808
見づらい色でなければ別に使ってもいいんだけど。
IE以外では適用されないだけで害は無いし。
810806-807:03/05/16 19:41 ID:???
( ゚Д゚)ハァ?まいっか。
811Name_Not_Found:03/05/16 19:46 ID:???
>>803
はげど。
IEはwidthなんかもバグがあるし、Opera/Mozあたりで
チェックしとけばいいよな。
Opera/Mozあたりでうまくできていれば、大抵IEでもそこそこうまくいっている。
812Name_Not_Found:03/05/16 19:48 ID:???
>>804
scrollbar関係の独自拡張プロパティーは、bodyではなくhtmlに指定した方がいい。
でないと標準準拠モードで効かなくなるよ。これ既出。
overflow等でブロック要素にスクロール・バーを出す場合などは、
そのブロックに対して指定する。継承しないからね。
813Name_Not_Found:03/05/16 19:49 ID:???
>>809
Operaも設定次第で、スクロールバーの色は変わります。
しかしながら、そんな人は殆どいないのではないでしょうか。
http://www.onyx.dti.ne.jp/~saitone/today/opera7.htm
814Name_Not_Found:03/05/16 19:51 ID:???
>>811
>Opera/Mozあたりでうまくできていれば、大抵IEでもそこそこうまくいっている。
但し、条件がつくけどね。
子供セレクタ、隣接セレクタ、属性セレクタを使用しないこと。
contentプロパティに頼らないこと。
815Name_Not_Found:03/05/16 21:22 ID:???
大体、Win IEなんてWebアプリの粗大ゴミ & 寄生虫
使うな
816Name_Not_Found:03/05/16 21:24 ID:???
いくら吠えても無駄
817Name_Not_Found:03/05/16 21:38 ID:???
>>816
「赤信号、みんなで渡れば怖くない」
そんな、アフォ連中ってことですか?

818Name_Not_Found:03/05/16 21:41 ID:???
赤信号ですか。頭大丈夫?
819Name_Not_Found:03/05/16 21:47 ID:???
ハイ質問を、どうぞ。
820Name_Not_Found:03/05/16 23:08 ID:???
代々木上原から武蔵野台まで行きたいのですがどうやっていくのが一番早いですか?
821Name_Not_Found:03/05/16 23:10 ID:???
>>820
どこでもドア

次どうぞ
822Name_Not_Found:03/05/16 23:10 ID:???
>>821
やべっ被るところだったヨ
823Name_Not_Found:03/05/17 00:02 ID:elUgOg9W
質問ですが、ボックスを表示さすときに、テキストの周りにボックスを表示させるのではなくて、
ボックスの中に自由にテキストを表示したいんですが、CSSでそのようなレイアウトにするには
どうしたらよいでしょうか。テーブルは使いたくありません。どなたか教えてください。
824Name_Not_Found:03/05/17 00:04 ID:???
ボックスって何のこと言ってるの?
825Name_Not_Found:03/05/17 00:41 ID:???
>>823
うまく言葉で表現できないなら、AAで示すか、
テーブルレイアウトだとこうやってできるやつって言ってくれると解決しやすいです。
826Name_Not_Found:03/05/17 01:04 ID:???
blockとinlineの違いのことなのだろうか
827Name_Not_Found:03/05/17 01:17 ID:???
borderとテキストの距離ならpaddingで調節する。>>823
828Name_Not_Found:03/05/17 02:56 ID:???
>>823
ボーダーの幅と高さを指定。
829Name_Not_Found:03/05/17 03:03 ID:???
>>828
borderの幅と高さってどうやって指定するんですか?
830Name_Not_Found:03/05/17 03:26 ID:???
>>829
すまん。divかなんかでボーダーでくくって、そのサイズを指定、だな。ボケてたわ。
831Name_Not_Found:03/05/17 07:23 ID:???
<table >
<tr><td style="font-size:10px">
ほげ
</td></tr>
</table>

とか、

<table style="font-size:10px">
<tr><td>
ほげ
</td></tr>
</table>

は、CSS効くのに、

<div style="font-size:10px">
<table >
<tr><td>
ほげ
</td></tr>
</table>
</div>

が効かないのなんででしょう
832Name_Not_Found:03/05/17 07:50 ID:???
>>831
ボックス内に指定した内容は、テーブル内に継承しないから。
833Name_Not_Found:03/05/17 08:08 ID:fqk9w9au
834831:03/05/17 08:13 ID:???
>>832-833
あれ?じゃ、>>833のリンク先ではバグって書いてあるけど、仕様ってことですか?
835Name_Not_Found:03/05/17 09:51 ID:???
>831のような現象を回避する方法として、
テーブル外のテキストとテーブル内のテキストのサイズをあわせるために
以下のように指定することは規格に反しますか?
<table >
<tr><td><p style="font-size:10px">
ほげ</p>
</td></tr>
</table>

<p>のstyleはhead内、あるいは外部cssで指定済み
836Name_Not_Found:03/05/17 10:29 ID:???
>>835
構わないよ。
HTMLの話はスレ違いだけどな。
837Name_Not_Found:03/05/17 10:55 ID:???
>>834
バグだってば。仕様書には継承されるって書いてある。

>>835
pとtableに同じスタイルを指定すればtd内をpで囲む必要はないんじゃない?
838Name_Not_Found:03/05/17 11:49 ID:???
>>831,832,835
どこの糞ブラウザ使ってんのよ(w
839Name_Not_Found:03/05/17 12:12 ID:???
>>837
ブラウザのスタイルシートでtd{font-size:small}
がデフォルトスタイルになってるだけだろ。
なんでもかんでもバグにするな。
840Name_Not_Found:03/05/17 12:46 ID:???
>>839
マジで? そういう解釈もできるとかじゃなく?
841Name_Not_Found:03/05/17 12:57 ID:???
>>839
まさしく糞ブラウザだな(w
842Name_Not_Found:03/05/17 15:44 ID:???
>>839
だから、User agentのデフォルトスタイルがauthorスタイル
よりも優先順位が高くなってしまっているんだから「明確にバグ」。
843Name_Not_Found:03/05/17 17:14 ID:???
定義リストでよくある
 ○○………コメント
 ●●●……コメント
    ↑
この可変のリードを実現したいんです。
一応<dt><span>●●●</span></dt>でdtにwidthおよびfloatを指定した上で
背景画像としてリードの『…』を設定、
spanで囲まれている部分だけ画像が隠れるように背景色を設定して
実現できたことはできたんですが、もっとスマートにやれる方法はないでしょうか。
:afterとかでできそうな気もするんですが……。
844Name_Not_Found:03/05/17 17:29 ID:???
>843
最初何言ってるのか判らなかった…

うーん、無いんじゃない?
positionで重ね、z-indexで隠し、くらいしか思いつかない。
expression(だっけ?)使えばスマートになるのかも知れないけど。
845Name_Not_Found:03/05/17 17:39 ID:???
<dt>●●●……</dt>ではあかんのか
846839:03/05/17 17:43 ID:???
>>842
ハァ?継承の概念わかってますか?
あんたの言ってることは
「body{font-style:normal}にしたのに
iとかemでデフォルトスタイルが優先されて斜体になってしまうのでバグだ」
と言う事と同じだ。
847Name_Not_Found:03/05/17 17:54 ID:???
>>843
dd {
margin-left:hoge;
display:list-item;
list-style-image:url("hoge.gif");
}
は?


848Name_Not_Found:03/05/17 19:57 ID:???
なんにしてもIEが糞ってことに変わりない。

M$信者(839=846)は必死になっているが。
849Name_Not_Found:03/05/17 20:34 ID:???
IEがどうとかはさておいて、>>839の説は面白いな。

ひょっとしたらbody要素にもfont-size:smallが指定してあるのかも、と思って
html要素にfont-sizeを指定したらしっかり継承されちゃいますた
850Name_Not_Found:03/05/17 21:20 ID:???
>>849
禿道、糞なIEしか知らないが為、間違ったモノが身に付いて
しまっているようですね?
851Name_Not_Found:03/05/17 23:23 ID:1tyqJGgo
>>849
> ひょっとしたらbody要素にもfont-size:smallが指定してあるのかも、と思って
バッカじゃねーの
低脳すぎ
852Name_Not_Found:03/05/18 00:15 ID:???
>>831
そもそもpx単位でfont-sizeを指定しなければよいのだ。そしたらバグも起こらない。
emと%だよ、やっぱり。
853Name_Not_Found:03/05/18 05:01 ID:???
ul{list-style-image:url(URI);}
li{text-align:right;}
Opera7.10なんかでマークがついてこないのはバグでしょうか
既出ならスマソ
854Name_Not_Found:03/05/18 05:33 ID:???
>>853
バグっぽいですね。
ちなみにOpera6では再現しません。
855Name_Not_Found:03/05/18 12:03 ID:???
>>853
スレ違い
・CSS/DHTMLバグ辞典スレッド ver2.0
 http://pc2.2ch.net/test/read.cgi/hp/991666454/l50
856Name_Not_Found:03/05/18 13:27 ID:???
>>853,854,855
って、いうか各リストに表示したいなら、
li {
list-style-image:url(URI);
text-align:right;
}
もしくは<ul>のみ表示されるには
ul{
display:list-item;
list-style-image:url(URI);
}
li{
text-align:right;
list-style:none;
}
こうだけどな
バグ以前の問題だけどな(w
857Name_Not_Found:03/05/18 15:25 ID:???
>>855 それ、お倉入りですよ。新スレッドへどうぞ。
CSS/DHTMLバグ辞典スレッド 第3版
http://pc2.2ch.net/test/read.cgi/hp/1050844510/l50

>>857
「もしくは<ul>のみ表示されるには」で、
なんでli{list-style:none;}なのか。
これではulのリストマークは何も表示されなくなるぞ。
858Name_Not_Found:03/05/18 15:41 ID:???
>>853
「マークがついてこない」とは、MacIEの次のバグと同じかな。

リストをセンタリングしたときにリストマーカーがセンタリングされない(5.0)
http://cssbug.tripod.co.jp/detail/macie/b048.html

Opera7で>>853をtext-align:center;にしても再現するね。
でも、これはこれで「仕樣通りの動作」らしいよ。
但しOperaはMacIEと違って、list-style-imageを指定した場合だけなるわけで、
問題ですね。
859Name_Not_Found:03/05/18 17:47 ID:???
独自拡張を使うと、W3CのValidatorではエラーが出るんでしょうか?
860Name_Not_Found:03/05/18 18:08 ID:???
>>859
試せばすぐわかることをなぜ訊くの? 出るよ。
861856:03/05/18 18:25 ID:???
>>857
自分への問いかけ?(w
<li>表示したければlist-style:noneを消せば良い。
つまり、<ul>にはリスト用のボックスがないので、display:list-item;で
リスト用のボックスを生成させてlist-style-imageを指定するってこと。
<ul>に何も表示されないのではなくて隠れているのでmargin付ければでる。
意味分かるか?
862Name_Not_Found:03/05/18 18:41 ID:???
言ってる意味がよくわからないのは僕だけでしょうか?
863Name_Not_Found:03/05/18 18:45 ID:???
>>856
何でそんな面倒臭いことするの?
ul li {
list-style-image:url(URI);
text-align:right;
}
で充分じゃん(w
864856:03/05/18 18:54 ID:???
>>862.863
20pxぐらいの mark_ul.gif・mark_li.gifを用意してやってみな

ul {
border:red thin solid;
display:list-item;
list-style-image:url(mark_ul.gif);
margin-left:30px;
}
li {
list-style-image:url(mark_li.gif);
border:blue thin solid;
margin-left:30px;
}
<ul>
<li>リスト1</li>
<li>リスト2</li>
<li>リスト3</li>
</ul>
865856:03/05/18 18:59 ID:???
>>863
一見それでいいようだけど、<ul><dl><ol>はブラウザによって
初期値が違うんだよね、バグじゃないよ
866Name_Not_Found:03/05/18 19:13 ID:???
初期値違ってもmarginとpadding指定してやればそんな面倒なことする必要ないんじゃ?
867Name_Not_Found:03/05/18 19:18 ID:???
>>866
まったく意味がわかってない香具師
アフォだな
868昔の人:03/05/18 21:29 ID:???
>>856は根本的に勘違ひをしてゐませんか。

>つまり、<ul>にはリスト用のボックスがないので、display:list-item;で
>リスト用のボックスを生成させてlist-style-imageを指定するってこと。

そんな「<ul>のみ表示される」なんてこと、
質問者(>>853)が求めてゐたとは思へないんですが。
869Name_Not_Found:03/05/18 21:29 ID:???
tableタグにfilter:alpha をつけて表を半透明化させたのですが、
その表の中の画像だけ透明化をきりたいので、IMGタグの中にfilter:alpha(opacity=100)と記述したのですが半透明なままです。
画像のみ半透明をきることは不可能なのでしょうか?
870Name_Not_Found:03/05/18 21:41 ID:???
んなもんMSに聞け
871856:03/05/18 21:53 ID:???
>>868
オマエも解ってないな?
<ul>のみに表示させるっていうより、基本的にいえば<ul>にlist-style-image
を指定することは、Strictじゃないわけで、あえて表示させるなら...
ってことで説明してやたんだけど?
<ul>にlist-style-imageしたところで継承の関係で<li>のマーカーとして
表示されているだけで、実際のところは、>>853はどういう風に要素に対して
マーカーを表示させたいのかは知らないし、どうでもいいことなんだけどな。

872Name_Not_Found:03/05/18 22:01 ID:???
>>869
そんなモノ使用するのやめる
最近は糞なWinIEのせいで勘違いしている香具師が増えてきたね?
873昔の人:03/05/18 22:04 ID:???
>基本的にいえば<ul>にlist-style-image
>を指定することは、Strictじゃないわけで、

ハテ? CSS2の仕樣書に例が載ってゐましたが、あれは間違ひなのでしたか。
http://www.w3.org/TR/REC-CSS2/generate.html#lists
>The following example sets the marker at the beginning of each list
>item to be the image "ellipse.png".
>
>UL { list-style-image: url("http://png.com/ellipse.png") }
874Name_Not_Found:03/05/18 22:09 ID:???
>>871 偉ぶってウソ説かれたら、困りますな。
>>872 独自拡張位で目くじら立てなさんな。ええやん、どうせIEで見てないんでしょ?
875Name_Not_Found:03/05/18 22:16 ID:???
>869とは違うんだけど
IEのfilter: Alpha みたいなのって
CSSではでけへん?
876Name_Not_Found:03/05/18 22:19 ID:???
>>875
alpha関係はCSS3だね。
877Name_Not_Found:03/05/18 22:19 ID:???
>>875
正式には、できない。
でもMozilla/NN6なら、独自拡張のmoz-opacityでできるから、検索してごらん。
878Name_Not_Found:03/05/18 22:30 ID:???
>869
tableに50、imgに100を指定してたとすると
imgは結局50% * 100% = 50%だから半透明のまま。
200にすれば解決



するかどうかは知らんけどな、IE使ってないから
879Name_Not_Found:03/05/18 22:31 ID:???
つかimg{filter:none;}で良いんじゃないかって気もするが
880853:03/05/18 22:51 ID:???
質問者です。多数のご意見有り難うございました。
えと、CSSの例文については疑義もあると思いますが、
質問点は以下で取り上げていただいた通りで、大変参考になりました。

> 「CSS/DHTMLバグ辞典スレッド 第3版」
> 112 :Name_Not_Found :03/05/18 15:54 ID:???

# スレ違いスマソ
881875:03/05/18 22:58 ID:???
>>876,877
ありがd。参考になりました。
882Name_Not_Found:03/05/19 03:45 ID:???
結局>>856>>871は、知ったかぶっておいて誤りだったのか。逃げたかな?
883Name_Not_Found:03/05/19 12:06 ID:???
>>882
>>864の例からして、単純にULのマーカーではなくて、
ULと、LIのブロックの配置について語っていると思われ
884Name_Not_Found:03/05/19 14:01 ID:???
なんかよくわからんけど<ul><ol>にわざわざdisplay:list-itemする必要ないし、
list-style-imageプロパティはli要素だけじゃなくてdisplayプロパティが
list-itemの要素にも適用できるってことでいいのかな。
885Name_Not_Found:03/05/20 00:14 ID:MzEdboz8
テキストに重ねて色付きの横棒を表示させるデザインにしたいんですが、どうしたらいいんでしょうか。
886Name_Not_Found:03/05/20 00:20 ID:???
>>885
その色付きの横棒とやらを何処にどういう風に付けたいのかが問題
887Name_Not_Found:03/05/20 00:26 ID:???
>885
打消し線の色は変えられなかったような希ガス
888Name_Not_Found:03/05/20 00:27 ID:MzEdboz8
>>886

打ち消し線のように重ねて表示です。で、テキストの色とは別の色でテキストを強調させるような
効果をだしたいんですが。
889Name_Not_Found:03/05/20 00:51 ID:???
>>888
spanでくくって背景指定、とか。
890Name_Not_Found:03/05/20 00:57 ID:???
で、>>856は結局なんだったの?電波?
891Name_Not_Found:03/05/20 00:59 ID:???
>888
positionとz-indexで「─」を文字の上に重ねる、かな。
あんまりお手軽には出来ないね。
892Name_Not_Found:03/05/20 01:35 ID:???
ちょっとすれ違い気味かもしれないけど、、
CSS切り替えスクリプトでBBSの外観までコントロール
しているページって知ってます?
893Name_Not_Found:03/05/20 01:48 ID:???
どういうこと?
サイト全体の外観が変わることでBBSの外観も変わるという所なら、いくつかあるだろうけど。
894Name_Not_Found:03/05/20 01:58 ID:???
>>888
こんなんどう?

.ui{color:blue;text-decoration:line-through}
.wi{color:red}

<div class="ui">
<span class="wi">うぃうぃ</span>
<div>
895Name_Not_Found:03/05/20 02:08 ID:???
スマソ。

.ui{color:blue;text-decoration:line-through}
.wi{color:red}
<span class="ui"><span class="wi">あうあう</span></span>

こっちのほうがスマートかも。
しかしspanって入れ子にしてよかったっけ?
ちゃんと動作するみたいだけど。
896Name_Not_Found:03/05/20 02:18 ID:???
>>893
レスども。
切り替えスクリプトを使ってCGIまでいじってるとこあるのかな、と思ったんですけど。
よくよく考えるとその道のサイトでは結構ばんばんやってましたね。
しょうもないことに時間とらせてスマソ
897Name_Not_Found:03/05/20 02:26 ID:???
>>895
回答するなら仕様書ぐらい読め。間違った事教えたらどうするんだ。

で、spanをネストするのはinvalidではないが、
むやみやたらとネストすることはお勧めできない。
898Name_Not_Found:03/05/20 02:48 ID:???
895>>897
いや、すみませんでした(汗
フォロー、サンクスです。
899Name_Not_Found:03/05/20 06:29 ID:???
テーブルの幅をウィンドウ幅に合わせて伸縮させ、かつ左右の余白は常に一定…とするには、どうすれば良いでしょう?

こんな感じ

   テーブル
┌―│―┐
│┌↓┐│
││  │←余白
│└―┘│
└―――┘

    テーブル横幅はウィンドウにあわせて伸縮
┌――│――┐
│┌―↓―┐│
││      │←左右の余白は一定
│└―――┘│
└―――――┘

どうも、すごい基本的なことのような気がするのですが、どうぞよろしくお願いします。
900Name_Not_Found:03/05/20 07:39 ID:???
width=100%
margin=適当。
901899:03/05/20 09:01 ID:???
>>900

やってみました。
右のほうが画面外にはみ出してしまいます…。
902proxy125.docomo.ne.jp:03/05/20 09:39 ID:???
100%じゃなくてautoとかにしないと実装がアレだったような…。資料出せなくてスマ。
903Name_Not_Found:03/05/20 10:01 ID:???
5 :Name_Not_Found :03/04/12 03:41 ID:???
【FAQ】
Q1: IEでは大丈夫なのに、Netscape6 以降で見ると横スクロールバーが出たりするが?
A1: Windows版 Internet Explorerのボックス・モデルが間違った実装だからです。
「width と height の計算方法の実装の違いについて」参照。
http://hp.vector.co.jp/authors/VA022006/css/visualren.html#ref-width-height
width(height)は、要素の内容領域の幅(高さ)を指定するプロパティですが、
WinIE等では、ボーダー領域 + パディング領域 + 内容領域 の寸法で計算されます。
Netscape 6以降やMacintosh版 Internet Explorer 5 の計算が正しい。
WinIEもver.6 からは標準準拠モードにすると仕様通りに計算してくれます。
http://www.microsoft.com/japan/msdn/ie/ie60/cssenhancements.asp#cssenhancements_topic3
参考「IEとNNのBOXの計測方法の違いについて」
http://www.fromdfj.net/html/border2.html
904Name_Not_Found:03/05/20 10:45 ID:???
>>899
div厨かもしれないけど、こんなん駄目?

.hako{margin:1em 3em 1em}
.hyou{width:100%;margin:0}

<div class="hako">
<table class="hyou" border="1">
<tr>
<td>あ</td><td>ん</td>
</tr>
</table>
</div>
905Name_Not_Found:03/05/20 10:54 ID:???
あ、スマソ。>>904の.hyouのmargin:0は消し忘れです。
906Name_Not_Found:03/05/20 11:06 ID:???

次スレッド立てる人、テンプレートが移転してるから宜しく。

CSS・スタイルシート質問スレッドのテンプレ
http://web2ch.s31.xrea.com:8080/index.php?CSS
 FAQ(よくある質問と回答)
  http://web2ch.s31.xrea.com:8080/index.php?CSSFAQ
 過去ログ
  http://web2ch.s31.xrea.com:8080/index.php?CSSLog
 関連リンク
  http://web2ch.s31.xrea.com:8080/index.php?CSSRelated
907899:03/05/20 11:30 ID:???
レスありがとうございます。
うーん、いずれの方法でもうまく表示されません。
環境はIE6.0で確認しているのですが、やはり>>903のような事情なのでしょうか。
少し考えてみます。
908Name_Not_Found:03/05/20 11:34 ID:???
>906
不思議マークアップで笑タ。
おまけにうざくてオナニーサイト化してきたな。
909Name_Not_Found:03/05/20 11:49 ID:???
>>908 
不思議って……広告の部分は仕方ないのでは。ケチつけることばかりうまくなって。
910Name_Not_Found:03/05/20 12:05 ID:???
>>909
今見てきたら不思議というよりあまりにも酷過ぎだったけど。
でもwikiってのよく知らないんだけど、
これが吐くソースがひどいのではないだろうかと推測。
あと関係ないけどxreaなら広告を手動で挿入すれば正しいHTMLソースでいける。
911Name_Not_Found:03/05/20 12:17 ID:???
>>909
移転前はちゃんとしたマークアップだったのにねえ……(広告除く)
http://fake_lint.tripod.co.jp/css.html
912Name_Not_Found:03/05/20 13:05 ID:???
で、>>856は結局なんだったのでしょうか?
913Name_Not_Found:03/05/20 13:08 ID:???
>>899
marginのサイズに合わせてwidth:95%くらいに加減すればハミデナーイ
914Name_Not_Found:03/05/20 13:38 ID:???
>>912
113 :Name_Not_Found :03/05/18 18:31 ID:???
>>112
基本的には、<li>にlist-style-image:url(URI);
を指定するもんだけどね?(w

115 :Name_Not_Found :03/05/18 22:16 ID:???
>>113
http://pc2.2ch.net/test/read.cgi/hp/1050086156/873n
>ハテ? CSS2の仕樣書に例が載ってゐましたが、あれは間違ひなのでしたか。
> http://www.w3.org/TR/REC-CSS2/generate.html#lists
>>The following example sets the marker at the beginning of each list
>>item to be the image "ellipse.png".
>>
>>UL { list-style-image: url("http://png.com/ellipse.png") }
915Name_Not_Found:03/05/20 20:43 ID:???
新しいテンプレ見てきましたが・・・

ああいうデザイン、今はやってんですか?
Operaのフロントページ、Lunascapeのフロントページ、
みーんなそっくし。

もしかして作ってる人が同じ?
特徴がなくて何だか見ててつまんにゃい。
916Name_Not_Found:03/05/20 21:09 ID:???
http://web2ch.s31.xrea.com:8080/index.php?CSSFAQ を HTML4.01 Transitional としてチェックしました。
143個のエラーがありました。このHTMLは -1点です。タグが 33種類 367組使われています。文字コードは EUC-JP のようです。


……XHTMLでないのに<br />だの<img />だの、なんなんだろうね
917Name_Not_Found:03/05/20 22:06 ID:???
オナニーサイトだからな。
他人の評価なんてどうでもいいんだろう。
918Name_Not_Found:03/05/20 22:25 ID:???
>>906
このスレの関係サイトがこれじゃなねぇ。
919Name_Not_Found:03/05/20 23:03 ID:???
>>915
流行っていると言うかpukiwikiだし
920Name_Not_Found:03/05/21 00:04 ID:???
まあこの板で使うなら、ちゃんとしたソース吐くように
改造しても良さそうなもんだけどな。
921Name_Not_Found:03/05/21 19:41 ID:???
pukiwiki使う必要があるのかはさておき、
なんでCSSスレなのにpukiwiki使うのか。
http://pc2.2ch.net/test/read.cgi/hp/1041641395/
23 名前: Name_Not_Found :sage 投稿日: 03/01/04 (土) 17:31 ID:???
>>10
なんとなく作ってみますた…。
需要なさそうだったら消します。
http://hiro777o.fc2web.com/omega/2ch/css000.html

38 名前: Name_Not_Found :sage 投稿日: 03/01/04 (土) 22:20 ID:???
俺もFAQをなんとなく載せてみたんだが、かぶったな。
http://nira.s25.xrea.com/FAQCSS/ls_00.html

78 名前: Name_Not_Found :sage 投稿日: 03/01/06 (月) 17:30 ID:???
>>1に貼るテンプレ作ってみたよ。
http://fake_lint.tripod.co.jp/css.html

追加したいこととか、修正するとことか教えて。
923Name_Not_Found:03/05/21 21:00 ID:???
プッ
924Name_Not_Found:03/05/22 00:22 ID:???
>>922
真中のがよさげだな。
あとは
http://www.xrea.com/?action=ad
を見て広告を自分で挿入してくだちぃ。
CENTERはイカンよ。
それと、
DOCTYPE宣言がIEを互換モードへ導いてるのは仕様ですか?
925Name_Not_Found:03/05/22 09:01 ID:LdW0NUPk
質問です。

CGIで生成されるHTMLで(DOCTYPE宣言無し)、
Opera6のH要素につけた<CENTER>がききません。
<CENTER><H3 style="border:solid 1px #000;">見出し</H3></CENTER>が
 ブロックごと普通に左寄せになります。

<CENTER><table><tr>・・・・・</table></CENTER>
だと画面中央にちゃんときます。

<CENTER>なんか取っ払ってcssでBODY{text-align:center}とすれば
いいんでしょうが、
CGIなので<CENTER></CENTER>が記事を追加するたびに
延々吐き出されつづけます。

どう対処すればいいのでしょうか?
ちなみにIEでは問題ありません。
926Name_Not_Found:03/05/22 09:03 ID:???
>925
center{text-align:center}
これでダメならCGI改造するべし。
927動画直リン:03/05/22 09:09 ID:eu9qdXFr
928Name_Not_Found:03/05/22 16:33 ID:???
質問ではないのですが、
今自分でトラブってて解決したことからちょっと。

<p class=" myclass">
という感じに半角スペースをいれて
.myclass{  /*  いろいろ  */  }
とやるとオペラで無効、IEと根輔では有効に働きます。
ブラウザ振り分けのとても邪道な方法になる・・・・・わけないですよね。

駄文許してけろ。
929Name_Not_Found:03/05/22 20:53 ID:???
>>928
文法的には問題ないのかしら?
930Name_Not_Found:03/05/22 21:09 ID:???
>>929
http://www.asahi-net.or.jp/~sd5a-ucd/rec-html401j/types.html#type-cdata
>ユーザエージェントは、CDATA型属性値の、冒頭あるいは末尾の空白
>文字を無視してよい。 (例えば「 myval 」を「myval」として解釈
>してよい。) 著者は、冒頭あるいは末尾に空白文字のある属性値を宣言
>することを避けるべきである。
931Name_Not_Found:03/05/22 21:10 ID:???
http://www.w3.org/TR/1999/REC-html401-19991224/types.html#type-cdata
>User agents may ignore leading and trailing white space in CDATA attribute values (e.g., " myval " may be interpreted as "myval").
>Authors should not declare attribute values with leading or trailing white space.

UA的にはそういう空白は無視して良い。
ページ製作者的にはそういう書き方はするべきでない(禁止ではない)。
932930:03/05/22 21:20 ID:???
>>931
あたしでよければ、ケコーンし(ry
933Name_Not_Found:03/05/22 22:56 ID:???
>>928-932
こちらに登録してくれると、嬉しい。

CSS/DHTMLバグ辞典スレッド 第3版
http://pc2.2ch.net/test/read.cgi/hp/1050844510/l50
934Name_Not_Found:03/05/22 23:29 ID:???
すみません。初めてで解説サイト見ながら四苦八苦やってるんですがどうも出来ないので質問させてください。
素材サイトからフォントを落としたんですがこれをIEで表示させたい時はどうすればいいのでしょうか?
windowsのフォルダファイルに落としたフォントファイル入れてテキストエディタで
<font-family: "落としたフォントファイルの名前">〜</font>
でいいんでしょうか?
935Name_Not_Found:03/05/22 23:35 ID:???
<span style="font-family:xxxxx;">〜〜</span>
だけど結局自分以外には意味が無いからやめとけ。
936Name_Not_Found:03/05/22 23:36 ID:???
>>934
すれちがい
937Name_Not_Found:03/05/22 23:45 ID:???
>934
まあCSSでやるにはどう?って質問ならスレ違いじゃ無いんだけど。

見る人がそのフォントを持ってないとブラウザで指定されているフォントが使われるか、
まあそれなら良いんだけど実装や特定の環境によっては文字化けの原因になっちゃうので
フォント決め打ちはちょっと推奨できないかな。
938Name_Not_Found:03/05/22 23:46 ID:???
ああ、自分専用のローカルな文書を作るのなら問題無しだけど。
939Name_Not_Found:03/05/22 23:48 ID:???
>>922
なんだ、まだまともなHTMLのところもあるじゃないか。

つーか、結局このスレにテンプレ張っているんだから
あんまり必要ないような気が
940Name_Not_Found:03/05/22 23:48 ID:???
>>934
解説サイト↓読んで、ナゼわからないかねえ。
http://msugai.fc2web.com/web/CSS/font.html
941Name_Not_Found:03/05/22 23:51 ID:???
>>934
特定のフォントきめうちでは、そのフォントがインスコされていない
他のPCでは、あなたの思っているような表示にならないでしょうから、
(A) あきらめる
    [閲覧者の好みのフォントを使わせてあげる♥]
(B) 画像にしてみる
(C) "MS Pゴシック","Osaka",,,,,のように候補を増やす
942934:03/05/23 00:08 ID:???
詳細&迅速なレスありがとうございます。
あまり実用的でない&スレ違い失礼致しました。
フォントファイルを画像にして保存するってできないですよね?
ちと自分で方法探してみます
943Name_Not_Found:03/05/23 00:13 ID:???
>>942
著作者の意向も考えなきゃだめだよ。
画像にする、ってことは加工して表示するわけなんだから。
944Name_Not_Found:03/05/23 00:23 ID:???
>>933
> ユーザエージェントは、CDATA型属性値の、冒頭あるいは末尾の空白
> 文字を無視してよい
 って、ユーザエージェントが空白を無視しないのも仕様上間違っては
いないのでは?
つまりバグとは言えないような気がするのですが.。
識者フォローお願いします。
945Name_Not_Found:03/05/23 00:42 ID:???
>>944
それも含めて、こちらで論じては?

CSS/DHTMLバグ辞典スレッド 第3版
http://pc2.2ch.net/test/read.cgi/hp/1050844510/l50
946Name_Not_Found:03/05/23 01:09 ID:???

/* CSS・スタイルシート質問スレッド【19】 */
http://pc2.2ch.net/test/read.cgi/hp/1053619342/l50
947Name_Not_Found:03/05/23 01:17 ID:???
新スレッドにテンプレートを使用すべきではなかったか?
948Name_Not_Found:03/05/23 03:24 ID:???
<table>
<tr>
<td><p>oijfeafew<br />
affefew<br />
afewcafe<br />
wafewa<br />
wawoifjewa</p>
</td>
<td><img src="ea" /></td>
</tr>
</table>
こんな感じの←文字列、画像→のCSSはどんな感じで実現したらいいでしょうか
<p>feawfeawfewafea<img src="ea" /></p>
こんな風にすると結局文字列が画像の大きさに左右されて見にくくなってしまうので
949404:03/05/23 07:47 ID:???
>>948 言ってる意味理解するのに時間かかった。・゚・(ノД`)・゚・。 うえええん
<img style="float:left;" src="ea" />
950404:03/05/23 07:50 ID:???
全然違う・・・。・゚・(ノД`)・゚・。 うえええん
951404:03/05/23 07:52 ID:???
style="clear:right;"
鬱だ・・・
952Name_Not_Found:03/05/23 11:17 ID:???
解説サイト見ながらやってるんですがある素材サイトで重ねることで形が完成するようなメニューアイコンを落としたんですがどうもうまくいきません。
どうも上と下で微妙なスペースが空いてしまいます。
メニューアイコンを上下スペースナシで貼り付けるにはどうしたらいいんでしょうか?
953Name_Not_Found:03/05/23 11:32 ID:???
>>952
htmlソース書いてくれたらアドバイスできるかも。
自分である程度cssわかりますというレベルなら「margin、padding、line-height」
あたりをキーワードに調べてみるといいかも。
954953:03/05/23 11:34 ID:???
と思ったらマルチだったので放置します
955Name_Not_Found:03/05/23 11:56 ID:???
>>948
>文字列が画像の大きさに左右されて見にくくなってしまうので

意味わからん。なので回答できん。説明求む。
956Name_Not_Found:03/05/23 14:22 ID:???
-----------┌───┐
-----------│     │
-----     └───┘
という感じになると良くて
------┌───┐
------│     │
------└───┘
----------
のようにテキストが回り込むのが嫌って事なのか?
957948:03/05/23 15:38 ID:???
>>956
そんな感じです
958Name_Not_Found:03/05/23 15:52 ID:???
>>957
文をdivでくくって、floatで回り込ませれるとか…
959952:03/05/23 21:04 ID:???
自己解決しました。地道にやってりゃできました。
マルチすみません
960Name_Not_Found:03/05/24 14:07 ID:tFA3GdMj
すみません。
<li></li>の項目をCSSで
どうすれば横一列にすることができますか?

きっと初歩的なことだと思うのですがお願いします。
961960:03/05/24 14:09 ID:tFA3GdMj
あ、float:left; ですね。
スレ汚しでした。ごめんなさい。
962Name_Not_Found:03/05/24 14:13 ID:???
display:inline;でもよい。お好みで。 >>960-961
963Name_Not_Found:03/05/24 14:15 ID:???
次スレッド

/* CSS・スタイルシート質問スレッド【19】 */
http://pc2.2ch.net/test/read.cgi/hp/1053619342/l50
964960:03/05/24 14:37 ID:tFA3GdMj
>>962さんありがとう。

で、リストのアイコンを無しにしようと
ul の class で list-style:none;
と指定しましたが、消えません。

どうしたらいいでしょうか。
965Name_Not_Found:03/05/24 14:40 ID:???
>>964
・OSやブラウザの種類とヴァージョンについては必ず明記してください。
 特にNetscapeは、ver.4までと6以降でまったく別物です。
966Name_Not_Found:03/05/24 14:49 ID:???
>>964
li にする
967960:03/05/24 14:50 ID:tFA3GdMj
あの、、叩かれるのを承知でドキドキしながら書きますが、、
自分のパソコンのブラウザってどこを見たら分かるでしょうか。

ちなみにwindosです。
馬鹿ですいませんです。
968Name_Not_Found:03/05/24 14:54 ID:???
>>967
叩きはしないけど、初心者板あたりで聞いた方がいいと思うよ。
969Name_Not_Found:03/05/24 14:54 ID:???
>>964
IEとN7では消えるけど?
<ul style="list-style:none;">
<li style="float:left;width:3em">111</li>
<li style="float:left;width:3em">222</li>
</ul>
970Name_Not_Found:03/05/24 14:59 ID:???
>>967
WindowsならInternet Explorerがデフォルト(初期装備)で入ってる。
他にブラウザをインストールしてなければIEだと推定される。
使ってるブラウザのメニュー・バーから「ヘルプ」を開けば
ヴァージョンは判るはず。
971Name_Not_Found:03/05/24 15:06 ID:eHhCqL32
FrontpageExpressを使ってるんですが
改行するとやたらと行間が広くなってしまいます。
狭くするにはスタイルシートを使えば出来るってあったんですけど、
コピペしてやっても狭くなんないんですが、どういう事dしょう?
972Name_Not_Found:03/05/24 15:09 ID:???
>>971
該当部分のソースを出せと
973960:03/05/24 15:09 ID:tFA3GdMj
Internet Explorer の ver6 でした。
皆さんありがとう。

dreamweaver上では消えるのですが、送ると消えていないままです。
色々やってみます。お世話かけました。
974Name_Not_Found:03/05/24 15:10 ID:???
>>967
floatしてもリスト・マーカーが消えないってことは、
Mozilla/Netscape 6〜7だな。
 cf. http://cssbug.tripod.co.jp/detail/mozilla/b047.html
もっとも、list-style:none;を指定すれば消えるはずなんだが。

しかしブラウザ名もわからない初心者がなんでネットスケープを使ってるのか不思議。
975Name_Not_Found:03/05/24 15:10 ID:eHhCqL32
>>972
すいません。こんな感じです。

<html>

<head>
<meta http-equiv="Content-Type"
content="text/html; charset=x-sjis">
<meta name="GENERATOR" content="Microsoft FrontPage Express 2.0">
<title>Contents</title>
<STYLE type="text/css">
<!--
BODY { line-height:1.5em; }
-->
</STYLE>
</head>

<body bgcolor="#FFFFFF">
<div align="right">

<table border="0">
<tr>
<td><p align="left"><font size="2"><strong>Contents</strong></font></p>
</td>
</tr>
<tr>
<td><p align="left"><font size="2">▼ C</font></p>
</table>
</div>
</body>
</html>
976Name_Not_Found:03/05/24 15:13 ID:???
>>975
そのソースを見て、色んな感情を通り越して
むしろ爽やかな気分になった。
977Name_Not_Found:03/05/24 15:13 ID:???
>971
シフト+Enterで改行してみたら?
978Name_Not_Found:03/05/24 15:16 ID:eHhCqL32
>>977
おおおおお!!!!
ありがとうございます!!!!!!!マジうれしいです!
>>976
なんででつか?
979Name_Not_Found:03/05/24 15:21 ID:???
>>978 おい、冗談をまともに取って感激するなよな。
p要素とbr要素について学んで下さい。
brでやたらに改行するものではありません。
p要素のマージンを指定すると幸せになれるかもしれません。
980Name_Not_Found:03/05/24 15:24 ID:???
Frontpage Expressに依存してる限り、まともなCSSなんてムリでしょ。
981Name_Not_Found:03/05/24 15:26 ID:???
どうやらまともなCSSじゃなくても
かまわないみたいですので気にせず
そのまま続けてください
982Name_Not_Found:03/05/24 15:34 ID:eHhCqL32
>>979
そうでつか。アイスィー。
どうでもいいですけど、更新履歴って英語でなんていうんでつか?
983Name_Not_Found:03/05/24 15:35 ID:???
私もHTML触り立ての初心者の時はp改行とbr改行で悩んだな。
やはりフロントページ(昔は無料だった)を使ってたのだが、
CSSの便利さを知るにつれて、フロントページでは
思った通りにスタイル指定できないのが嫌になって、メモ帳に移行した。
984Name_Not_Found:03/05/24 15:37 ID:???
>>982 ここはCSS・スタイルシート質問スレッドです!

次スレッド

/* CSS・スタイルシート質問スレッド【19】 */
http://pc2.2ch.net/test/read.cgi/hp/1053619342/l50
985Name_Not_Found:03/05/24 21:30 ID:???
うめー
986Name_Not_Found:03/05/25 02:03 ID:???
まつー
987Name_Not_Found:03/05/25 10:56 ID:XIZjMQqn
ページを開こうとするとパスワードを入力せよと言うのがでて
正解か不正解によって2つのページに飛ぶ、といったようなものを
つくるにはどうしたらいいでしょうか
988Name_Not_Found:03/05/25 10:58 ID:???
JavaScriptかCGIでやれ。>>987
989Name_Not_Found:03/05/25 11:08 ID:???
>>987
ここはCSS・スタイルシートの質問スレッドです!

次スレッド

/* CSS・スタイルシート質問スレッド【19】 */
http://pc2.2ch.net/test/read.cgi/hp/1053619342/l50
990Name_Not_Found:03/05/25 13:01 ID:???
>>987
一体、いくつのスレにマルチしたんだよ…埋め。
991Name_Not_Found:03/05/25 13:09 ID:???
991
992Name_Not_Found:03/05/25 13:15 ID:???
990
993Name_Not_Found:03/05/25 13:21 ID:???
989
994Name_Not_Found:03/05/25 13:25 ID:???
976
995Name_Not_Found:03/05/25 13:28 ID:???
902
996Name_Not_Found:03/05/25 13:32 ID:???
752
997Name_Not_Found:03/05/25 13:35 ID:???
1001
998Name_Not_Found:03/05/25 13:36 ID:???
67
999Name_Not_Found:03/05/25 13:40 ID:???
401
1000Name_Not_Found:03/05/25 13:40 ID:???
0
10011001
このスレッドは1000を超えました。
もう書けないので、新しいスレッドを立ててくださいです。。。