Web製作 - 2ch-Libraryに戻る
元のスレッド

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

1Name_Not_Found :03/12/22 00:00 ID:EeFatYy0
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://web2ch.s31.xrea.com:8080/?CSS
【FAQ】 http://web2ch.s31.xrea.com:8080/?CSSFAQ
【過去ログ】 http://web2ch.s31.xrea.com:8080/?CSSLog
【関連リンク】 http://web2ch.s31.xrea.com:8080/?CSSRelated

2Name_Not_Found :03/12/22 00:01 ID:EeFatYy0
【過去ログ】
 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/hp/kako/1045/10451/1045124732.html
 http://pc2.2ch.net/hp/kako/1047/10471/1047154499.html
 http://pc2.2ch.net/hp/kako/1048/10487/1048775997.html
 http://pc2.2ch.net/hp/kako/1050/10500/1050086156.html
 http://pc2.2ch.net/hp/kako/1053/10536/1053619342.html
 http://pc2.2ch.net/hp/kako/1055/10555/1055536413.html
 http://pc2.2ch.net/hp/kako/1057/10578/1057860130.html
 http://pc2.2ch.net/hp/kako/1060/10608/1060869440.html
http://pc2.2ch.net/hp/kako/1064/10645/1064502391.html
http://pc2.2ch.net/hp/kako/1066/10663/1066310242.html
【前スレッド】
http://pc2.2ch.net/test/read.cgi/hp/1069216458/l50


3Name_Not_Found :03/12/22 00:01 ID:EeFatYy0
【関連スレッド】
・CSS/DHTMLバグ辞典スレッド 第3版
 http://pc2.2ch.net/test/read.cgi/hp/1050844510/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
・CSSでイケてるデザインサイト 19
 http://pc2.2ch.net/test/read.cgi/hp/1067806559/l50
・CSSでデザインしたサイト 18
 http://pc2.2ch.net/test/read.cgi/hp/1065882318/l50

【仕様書】
・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/12/22 00:03 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/
・『スタイルシートWebデザイン』ボランティアHTML化版。
 http://www.asahi-net.or.jp/~jy3k-sm/css1/2003maki/
・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.at.infoseek.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/

5Name_Not_Found :03/12/22 00:03 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/12/22 00:04 ID:EeFatYy0
【FAQ】
Q3: CSSで擬似フレームってどうやるの?
A3: 次のページを参考にして下さい。
overflow プロパティは擬似フレームも作成できる
 http://alt.s31.xrea.com/tips/overflow.html
 http://alt.s31.xrea.com/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/12/22 00:07 ID:EeFatYy0
【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.at.infoseek.co.jp/detail/winie/b079.html
 http://pc2.2ch.net/test/read.cgi/hp/991666454/683n

Q6:画面中央に配置するにはどうすれば?
A6:左右(水平方向)のセンタリングはA2に既出。垂直には色々な方法があります。
 「スタイルシート 縦中央(垂直中央)」参照のこと。
 http://chaichan.hp.infoseek.co.jp/qa3500/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
HTML でのレイアウト指定の、 CSS での指定との対応表
 http://deztec.jp/site/tips/page/p0037.html


8Name_Not_Found :03/12/22 00:08 ID:???
Q9.dt・ddを横並びにしたいのですが。(会話文など)
A9.下記サイトを参照のこと。
「<dl> の整形」
 http://www.remus.dti.ne.jp/~a-satomi/nikki/2001/12b.html#d18n03

Q10.リンクした画像の線が消えません。
A10.a:link img, a:visited img, a;hover img {border:none;}
NN4は http://cssbug.at.infoseek.co.jp/detail/nn4x/b022.html 参照。


91 :03/12/22 00:12 ID:???
ミスってたら、すみませんとしか言えません。すみません。

10Name_Not_Found :03/12/22 00:13 ID:???
>>1
>【FAQ】(>>5-7)を参照して、
>【FAQ】>>5-7

>>5-8 だね。

11Name_Not_Found :03/12/22 00:14 ID:???
>>1
ついでに http://web2ch.s31.xrea.com:8080/?CSS も「編集」してきてくれると偉い。

12Name_Not_Found :03/12/22 00:36 ID:???
>>10
すみませんすみません。
>>11
すみません、どなたかお願いします。

13Name_Not_Found :03/12/22 01:03 ID:???
>>1
乙華麗。ぐっじょぶ。
細かいことは(゚ε゚)キニスルナ!!

14Name_Not_Found :03/12/22 17:31 ID:lQwcqFUY
こちらの最初のほうで紹介されてるリンクも、全てでは無いですが
関係ありそうなものを見てみたのですが見つからなかったのでお尋ねします。


質問は、backgroundを使用して背景を表示させてるんですが、
tableでbackgroundを使用した場合、IEでは表示されるんですが
NN7.1だと表示できません。NNで表示させる方法はあるんでしょうか?

15Name_Not_Found :03/12/22 17:47 ID:???
>>14
どのように指定したか書けよ

16Name_Not_Found :03/12/22 18:06 ID:???
>>14
“表関連要素のうち何処に適用しているのか”など明確に質問してください。
Netscape7 は列および列グループへの背景指定には対応していませんが、
その他の表関連要素については、背景関連プロパティは適用される筈です。
まずは HTML および CSS文法の妥当性を検証サービスで確認してください。
それでも解決しない場合には、具体的なソースを提示してください。


17Name_Not_Found :03/12/22 18:31 ID:???
もう放置しようぜ

18Name_Not_Found :03/12/22 18:46 ID:???
backgroundにfixedを指定した場合はネスケで表示されないことがあるよ。

19Name_Not_Found :03/12/22 20:40 ID:???
>>18
それは閲覧領域に対して背景が固定されるからだろ。
その書き方だと Netscape のバグかのように取れる。

20Name_Not_Found :03/12/22 20:47 ID:YPBD2mxY
前スレに書いたのですが、新スレに移動しているようなので、こちらにも書かせていただきます。
985 :Name_Not_Found [] :03/12/22 20:27 ID:YPBD2mxY
a:link{
text-decoration:none;
border:dotted 1px blue;
color:navy;
}
.tabnavi a:link{
text-decoration:none;
color:navy;
}

として、文中のリンクには青い下線を、タブ型ナビゲーションのリンクには下線なし、にしようとしているのですが、下線が出てきてしまいます。
タブナビの方の文字色を赤にしてみても反映されません。
aに複数のクラスを指定して、複数のリンクスタイルを使用したい場合、どう書くべきなのでしょうか?
IE6での確認です。

988 :Name_Not_Found [] :03/12/22 20:39 ID:YPBD2mxY
>>986
タブナビのほうに border:none; を入れても出てきてしまいます…。
文字色の変更すら反映されないんですよ…。

21Name_Not_Found :03/12/22 21:33 ID:???
>>20
ちょっと話をずらして悪い。
インライン要素へのborderは右左にしか適用されないと思うが。
IE互換モードなら上下左右に適用されるけど。

22Name_Not_Found :03/12/22 21:40 ID:???
んなこたないよ。

23Name_Not_Found :03/12/22 21:42 ID:???
>>20
いろいろ突っ込みどころがあるが、まずはできない理由から。

その記述だと、a要素への装飾が、
text-decoration:none;
border:dotted 1px blue;
color:navy;

a要素、class名tabnaviへの装飾が、
text-decoration:none;
color:navy;

つまりa要素なら、class名"tabnavi"のほかに前者の装飾もかかる。
文字色の変更が効かないのは優先度の違い。前者のほうが優先される。

あとは自力で解決できるはず。難しい問題じゃないぞ。

あとうろ覚えだけど、>>21が言ってるのは確か俺も聞いたことがある。
displayプロパティでブロック要素にしたほうがいいと思う。
display : block;
ってね。

24Name_Not_Found :03/12/22 21:48 ID:???
>>23
だよなぁ。と思ったらあるみたい。俺も始めて知った。超やばい。
ttp://www.mozilla.gr.jp/standards/webtips0015.html#c1_4

2524 :03/12/22 21:50 ID:???
上下のボーダー(border) 要素の上下に存在 各行に存在するが、他の行に重なる場合がある
あ、存在するのか。読めてなかった(´・ω・`)

26Name_Not_Found :03/12/22 21:55 ID:???
インライン要素に指定できないのは、heightとwidth。
しっかりしろよ。

27Name_Not_Found :03/12/22 22:05 ID:???
>>20
>aに複数のクラスを指定して
という書き方からの想像だけど、もしかして、<a class="tabnavi">とか書いてたりはしない?
もしそうだったら、cssは a:link.tabnavi になるよ。
で、↑ではなく親要素に class="tabnavi" つけてるなら、
改めてa要素にclassふってやれば優先順位上がるから、できると思う。
a:link.navilink {
border:none;
}
<a class="navilink">〜</a>
という感じ。(クラス名は適当につけてみた)
text-decoration:none;
color:navy;
のふたつは a:link の方と重複するので、無くてかまわない。
それと、下線なら border-bottom:dotted 1px blue; じゃないの?

28kai- ◆kai/rQnSpY :03/12/22 22:06 ID:???
>つまりa要素なら、class名"tabnavi"のほかに前者の装飾もかかる。
>文字色の変更が効かないのは優先度の違い。前者のほうが優先される。

これ、間違ってませんか…?
後者というのは子孫セレクタの方のことでしょうけど、この場合後者が優先では?

29kai- ◆kai/rQnSpY :03/12/22 22:14 ID:???
意味不明だ…何書いてるんだ。
「後者と言うのは子孫セレクタの方のことでしょうけど、」の部分は読み飛ばしてください…。

30Name_Not_Found :03/12/22 22:15 ID:???
>>23の説明で
後者の .tabnavi a:link より前者の a:link が優先される理由が知りたいものだ。

>>20 多分
a:link{     .tabnavi a:link{
↓         ↓
a:link {     .tabnavi a:link {

31Name_Not_Found :03/12/22 22:20 ID:???
ところで、kai-さんは何時ごろからこのスレにいるんですか?

32kai- ◆kai/rQnSpY :03/12/22 22:23 ID:???
>>31
「ところで」も何も、スレ違いです。
糞コテですけど、別に荒らしに来てるわけじゃないのでそういう質問には答えられません。

33Name_Not_Found :03/12/22 23:21 ID:YPBD2mxY
>>21
border-bottomでした、書き間違いですスミマセン。オリジナルにはきちんと書いてます。

>>23
常にa要素への記述が優先されるのでしょうか…勉強してきます…。

>>27
> >>20
> >aに複数のクラスを指定して
> という書き方からの想像だけど、もしかして、<a class="tabnavi">とか書いてたりはしない?
> もしそうだったら、cssは a:link.tabnavi になるよ。
<a class="tabnavi">と書いています。
最初、cssは a:link.tabnavi と書いていたのですが、どうにも反映されないので .tabnavi a:link としてみました。
が、やっぱりダメでした。。。

>>30
> >>20 多分
> a:link{     .tabnavi a:link{
> ↓         ↓
> a:link {     .tabnavi a:link {
ハンカクスペース入れてみたけど、やはり…_| ̄|○

席を外していて、レスが遅れてスミマセンでした。
風呂に行って、すべてのa要素にクラス振ってみます…。ありがとうございました。

34Name_Not_Found :03/12/23 00:01 ID:???
a要素にクラス属性つけたのなら、
a.tabnavi:link
では?

そもそも、IE(6.0)は、祖先がクラスセレクタで子孫が擬似クラス、
というのに対応しているんでしょうか。

35Name_Not_Found :03/12/23 00:15 ID:???
>>33
特定のクラスが指定されているリンクの設定
a.tabnavi:link{...}
<a h." class="tabnavi">

特定のクラスが指定された要素に含まれるリンクの設定
.tabnavi a:link{...}
<p class="tabnavi">
<a h."></a>
</p>

という感じ。

36Name_Not_Found :03/12/23 02:34 ID:QryxhHhl
質問です。
ブロック要素に
h1, h2{
  display : inline;
}
などとした場合、これらはインライン要素としての扱いをされるということを
知ったのですが、このようなスタイル設定をした要素を
以下のようにbody直下に置いても良いのでしょうか?

<body>
<h1>見出し1</h1>
<h2>見出し2</h2>
</body>

これは、一応ValidなHTMLということになりますが、事実上、
inline要素をbody直下に置いているということになるので、
非常に気持ち悪いのです。

37Name_Not_Found :03/12/23 02:57 ID:???
>>36
さて、inlineにした理由から伺おうか…

38Name_Not_Found :03/12/23 03:10 ID:???
>>36
>これらはインライン要素としての扱いをされるということ
インライン要素になるのではなく、整形構造がインラインになるだけ。
'display' は HTML の文書構造を変化させるためのものではない。
ソース文書は DTD に沿って記述しなければならない事には変わりない。

>inline要素をbody直下に置いているということになるので、非常に気持ち悪いのです。
少しは仕様書を読んだらどうだ。

[HTML 4.01仕様書邦訳 7.5.3 ブロックレベル要素と行内要素]
>リスト要素を行内スタイルにするなど、ブロック要素を行内スタイルでレンダリングすることが適当であるような場合もある。しかし一般的に言って、著者はHTML要素の慣習的解釈を上書きするようなことはしないよう求められる。
http://www.asahi-net.or.jp/~sd5a-ucd/rec-html401j/struct/global.html#h-7.5.3


3936 :03/12/23 03:22 ID:QryxhHhl
>>37
ブロック要素を、インラインのように扱う必要があったからです。
ページのレイアウトは、次のようにします。
-------------------------
※ウィンドウの幅が広い場合
┌─────────┐ ┌───────┐
│タイトル画像      │ | ナビゲーション |
└─────────┘ └───────┘
メインコンテンツ

------------------------
※ウィンドウの幅が狭い場合

┌─────────┐
│タイトル画像      │
└─────────┘
┌─────────┐
│ナビゲーション     │
└─────────┘
メインコンテンツ

---------------------------
ウィンドウの幅が広いときは、ナビゲーションがタイトルの横に、
狭いときはタイトルの下に来るのがミソです。
タイトル画像は<h1>、ナビゲーションは<div>によるブロック要素です。

40Name_Not_Found :03/12/23 06:20 ID:???
もしかしたらスレ違いかもしれませんが、
スタイルシートで指定したレイヤー上に、
JavaScriptで…例えばテーブルや画像などを…同位置に指定し重ねると、
どうしてもレイヤーの下にテーブルが隠れてしまいます。
これをテーブルが上位に重なって表示させるにはどうしたら
良いのでしょうか?
説明が分り難くて申し訳ないのですが、何卒ご教授下さい。

41Name_Not_Found :03/12/23 07:17 ID:2QjUIEc8
js板いけ

42Name_Not_Found :03/12/23 08:32 ID:???
>>39
何もdisplay:inline;でなくても h1 img {float:left;} で充分なのでは。

4337 :03/12/23 16:47 ID:???
>>42
まったくそのとおりで

4436 :03/12/23 18:19 ID:QryxhHhl
>>42, >>43
レスありがとうございます。
実は、以前はそのようにfloatさせていたのですが、
それだと、ウィンドウの幅が狭くなったときに以下の問題が発生します。
・強制的にナビゲーションをタイトルの横に置こうとするので、
 横方向のスクロールバーが発生する(場合がある)。
・以下のようなレイアウトになってしまう。

┌────────┐ ┌─
│タイトル画像     │ | ナ
└────────┘ │ ビ
 ┌─────────┘
 │ゲーション
 └───────────

メインコンテンツ

-----------------------------------------------------

これを防ぐには、インラインとして配置させるのが最も合理的であると
判断しました。


45Name_Not_Found :03/12/23 18:20 ID:5a841lVG
絶対的位置配置ってやらない方がいいんでしょうか?
<ul>や<h1>に絶対位置指定してたら、
先輩から「アホか、古いブラウザで見られへんやろ」って
頭叩かれたんですが・・

46Name_Not_Found :03/12/23 18:52 ID:???
>>45
古いブラウザは@importなどでCSS適用されないようにすれば読めるようになる

4745 :03/12/23 18:59 ID:5a841lVG
>>46
それ言ったら
「はぁ? とにかく絶対位置指定だけはやめとけ。ずれまくる。
 相対指定にしろ」
とか言うんですよ・・。

48Name_Not_Found :03/12/23 19:05 ID:???
>>47
古いブラウザ対策をして、具体的に表示例を見せてやれば、納得するのでは?

49Name_Not_Found :03/12/23 19:30 ID:???
>>44
そのナビゲーションの要素にwidthを指定すればだいじょぶなんじゃないの?

50Name_Not_Found :03/12/23 19:31 ID:???
あーでも、幅固定じゃないとだめなのか(´・ω・`)
display:inline;が一番いいかもしれんね

5114 :03/12/23 20:01 ID:tjLgP7f8
ゴメンなさい、解決しました。
どうも、ファイル名に日本語を使用していたのが問題だったようです。
NN7.1だと日本語のファイルって読んでくれないんですね・・・
お騒がせしました。

52Name_Not_Found :03/12/23 20:03 ID:???
>>47
たしかに絶対配置は、いい加減な知識で下手にやられると困ったことになる。
よぅく理解した上で使用してほしいものだ。

53Name_Not_Found :03/12/23 20:33 ID:/Rev/GXy
IE6 表示OK
NN4.7 表示OK

なのにNN7.1で見ると
ボックスの背景色は出てないわ、
文章表示は全部上の方にごちゃごちゃ固まるわ
でむちゃくちゃなんですが・・・
NN7.1の時も、NN4のscreenみたいにスタイルシートを
適用させない方法ありますか?

54Name_Not_Found :03/12/23 20:36 ID:???
むちゃくちゃなのは IE6 & NN4.7 の方の予感。

5553 :03/12/23 20:38 ID:???
>>54
違わい違わい。
NN7.1って何か変なスタイルシートになりはらへん??

56Name_Not_Found :03/12/23 20:51 ID:???
>>55
君のスタイル指定かHTMLソースが間違ってる方に百万点。

ソース出してくれないと、対策も回答できませんよ。

57Name_Not_Found :03/12/23 20:59 ID:/Rev/GXy
>>56
(1)全部文字が上に集合する
   これはおそらく<br><p>等改行タグが一切入っていないからだと思うが・・。

(2)背景色が出ない
   .menubar {height: 40px;
         width: 600px;
  background-color: #000000;
  color: #FFFFFF;}
   これでNN7.1で背景色が#000000にならない。文字色は合ってる。

58Name_Not_Found :03/12/23 21:03 ID:???
>>57 そのスタイルを適用させるHTMLソースを書きませう。
もしや他にfloatとか使ってないか? だったらFAQ(>>7)を参考に。

59Name_Not_Found :03/12/23 21:08 ID:/Rev/GXy
>>58
<img src="top.jpg">
メニュー
<div class="menubar">
トップ | このサイトについて | 朝食 | 昼食 | 夕食 | メール |
</div>
■更新履歴
<h1>更新履歴</h1>
<ul>
<li>2003.12.21 朝食更新</li>
</ul>

こうすると、更新履歴がまずtop.jpgにかぶる。IEでは正常表示
menubarは背景色が出ない。

60Name_Not_Found :03/12/23 21:15 ID:???
>更新履歴がまずtop.jpgにかぶる。

何もしてないのにそんなことなる筈ない。
>>57に出した以外にも何かヘンなCSS指定してるでしょ? それを提示すること。

6159 :03/12/23 21:18 ID:???
>>60
してないんですよ・・・・信じて・・・

試してみた所、
.menubar の
height: 40px;
width: 600px;
この2つの要素外すと、表示はずれるけど
一応画像には被らなくなった。
でもメニューの範囲作るために必須なんだよなぁ・・
これ駄目なのかな・・。

62Name_Not_Found :03/12/23 21:29 ID:???
>>61
全部絶対配置しろ。
対応してないNN4以下は

ブラウザによる振り分け (JavaScriptを使用しない方法)
http://east.portland.ne.jp/~sigekazu/css/boxm.htm#ua

で弾ける。

63Name_Not_Found :03/12/23 21:30 ID:???
>>61 信じられません。下記のソースでちゃんと表示されました。Win98SE・NS7.1
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<STYLE type="text/css"><!--
.menubar {
height: 40px;
width: 600px;
background-color:#000;
color:#fff;
}
--></STYLE>
</HEAD>
<body>
<img src="top.jpg">
メニュー
<div class="menubar">
トップ | このサイトについて | 朝食 | 昼食 | 夕食 | メール |
</div>
■更新履歴
<h1>更新履歴</h1>
<ul>
<li>2003.12.21 朝食更新</li>
</ul>
</body>
</HTML>

64Name_Not_Found :03/12/23 21:31 ID:???
その昔NN6を初めて導入して、自分のページを見たらレイアウトがめちゃめちゃだった。
「Nって使えねぇ!」と思ったが、その後もう少しHTMLやらCSSやら勉強したら
結局自分のページの方がめちゃめちゃだったことに気づいた2年前の夏。
>>61
とりあえずValidatorとかには掛けてみました?


65Name_Not_Found :03/12/23 21:35 ID:???
>>63
スタイルシートを外部に持っていくと駄目なんですよ。。

66Name_Not_Found :03/12/23 21:36 ID:???
>>63
あ、勘違い!!
行けました!!

でもなんで!?!?!?

67Name_Not_Found :03/12/23 21:37 ID:???
>>62は何かの冗談のつもりなの? それにしてはつまらないし……。

68Name_Not_Found :03/12/23 21:39 ID:???
おい、まさか>>57はタブや半角スペースではなく、全角スペースを使ってやしないか?

6962 :03/12/23 21:40 ID:???
>>67
はぁ?

70Name_Not_Found :03/12/23 21:41 ID:VEwAR23J
>>64
> 「Nって使えねぇ!」と思ったが、その後もう少しHTMLやらCSSやら勉強したら
> 結局自分のページの方がめちゃめちゃだったことに気づいた2年前の夏。
 それ、非常にわかる。まず自分を信じてる、ってあるよね。

>>61
>してないんですよ・・・・信じて・・・
俺らがお前を信じて解決するならいくらでも信じてやるが。
望みは信用を得ることか?問題をクリアすることか?

71Name_Not_Found :03/12/23 21:42 ID:???
>>66
感嘆符使いすぎで非常に鬱陶しいんだけど。

72Name_Not_Found :03/12/23 21:42 ID:???
>>62
>全部絶対配置しろ。

本気で言ってるなら、寒いな。

7362 :03/12/23 21:45 ID:???
>>72
全部絶対配置の方が画像と文章がだぶったりする事も無いし、
置きたい場所に置けるから確実だろが。
俺は常にHPBのどこでも配置モードでスタイルシート作ってるが。

とりあえず鬱陶しいので消えてくれ>>72
な?皆。

74Name_Not_Found :03/12/23 21:47 ID:???
おお!あの悪名高き「どこでも配置モード」ユーザーが!!


75Name_Not_Found :03/12/23 21:47 ID:???
>>73 「どこでも配置モード」にチト笑ったが、やはり下手な冗談だな。

76Name_Not_Found :03/12/23 21:48 ID:???
>>72-74
ワロタw 腹いてーーww
おまいら最高だよ。

77Name_Not_Found :03/12/23 21:48 ID:???
つまらないと思ったらレスをしないでください。

78Name_Not_Found :03/12/23 21:49 ID:???
>>77
>>72よ、必死だな

79Name_Not_Found :03/12/23 21:50 ID:???
縦方向に点線入れる方法ありますか?

80Name_Not_Found :03/12/23 21:51 ID:???
説明不足ですよ。 何の縦方向さ? >>79 

81Name_Not_Found :03/12/23 21:54 ID:???
>>79
↓縦に太い点線
http://www.zspc.com/index.html

>>78
いや、>>73>>77でないの?

8279 :03/12/23 21:56 ID:???
>>81
どうもです

83Name_Not_Found :03/12/23 22:21 ID:???
頼むから真性のお子様を煽って無駄にレスを増やすのはやめてください。

84Name_Not_Found :03/12/23 23:02 ID:???
>44
ナビゲーション部分も float: left; でいいと思うが

85Name_Not_Found :03/12/23 23:33 ID:???
背景の画像をスクロールバーを動かしても動かないようにするにはどうすれば?

86Name_Not_Found :03/12/23 23:48 ID:???
固定する

87Name_Not_Found :03/12/23 23:55 ID:???
>>85
background-attachment:fixed;

やりたいことが分かっているなら、背景関係のリファレンスを見ませう。
http://hp.vector.co.jp/authors/VA022006/css/colors.html

88Name_Not_Found :03/12/23 23:56 ID:???
>>85

それをやってるページのソースとシートを見る→理解する→真似する→応用する
→熟達する

89Name_Not_Found :03/12/24 00:25 ID:???
それをやってるページのソースとシートを見る→間違って理解する→真似する→応用できない
→初心者を脱却できない


90Name_Not_Found :03/12/24 02:04 ID:???
それをやってるページのソースとシートを見る→理解する→真似する
→それをやってるページの管理人に見つかる→訴えられる
→裁判をする→敗訴する→罰金を払う→破産する→首をくくる
→天国へ行き再生の準備をする→生まれ変わる

91Name_Not_Found :03/12/24 08:24 ID:???
前世で私と一緒に戦ってくれた戦士を探しています

92Name_Not_Found :03/12/24 09:59 ID:???
>>90
てんごくいけませn

93Name_Not_Found :03/12/24 10:38 ID:???
>>91
ひょっとして貴方はエンジェルアドバイズ!?

94Name_Not_Found :03/12/24 11:40 ID:???
>>91
無理を言うな。前世も現世も一緒に戦う人なんてお前にはいない。

95宇野そうすけ :03/12/24 20:33 ID:???
テーブルを使わないで、新聞みたいに段組する方法教えてください。

<p> <P>
文章ブロック 文章ブロック
<P> <p>
文章文章文章 文文文文文文
文章文章文章 文章文章文章

こんなのって、無理ですの??

96Name_Not_Found :03/12/24 20:35 ID:???
>>95
>>6-7

97宇野そうすけ :03/12/24 20:38 ID:???
96氏

よく見ないで発言してごめんなさい。
そして、レスの番号表示してくれてありがとう。

早速見に行って、頑張って Web サイト作成します。

メリークリスマス。良いお年を。

98Name_Not_Found :03/12/24 21:53 ID:???
> <p> <P>
> <P> <p>
……。頑張ってくださいね。

9936 :03/12/25 05:34 ID:???
>>84
結局、displayとfloatを併用して
display : inline;
float : left;
width : x;
とすることで解決しました。
ウィンドウ幅が2x以下になるとブロック要素が改行します。

レスありがとうござです。


100Name_Not_Found :03/12/25 19:50 ID:???
質問です。

フィルターを使用し
.alfa {filter:alpha(opacity=70);}
これを定義して
テーブルにクラス設定してあるのですが、
テーブル内の特定のテキスト・画像にはフィルターを
適用させない方法って有りますか?

101Name_Not_Found :03/12/25 20:14 ID:???
>>100
というか、フィルター使うのはやめましょう。

102Name_Not_Found :03/12/25 20:27 ID:???
特定の要素にクラス指定して.hoge{filter:alpha(false)}
フィルタ使わないから正しいかどうかわかんない。
それとクラス名にalfaはどうかと思うよ(もし使っているとすれば)。

あと>>101に同意

103Name_Not_Found :03/12/25 21:35 ID:???
HPデザインをCSSで作り直そうと思っている。
んで、PS2のイージーブラウザーにも対応したい訳。
「Cascade Style Sheet(CSS)1.0 対応 ※一部対応のみ」って書いてある(この一部ってのが気になる・・・)。
また、どっかにPC用のイージーブラウザーのエミュレータみたいなもとないでしょうか?

104Name_Not_Found :03/12/25 21:37 ID:???
>100
こういう人がもっと増えますよう

105Name_Not_Found :03/12/25 21:45 ID:???
>>100
フィルタ使っても不快なだけで魅力に感じないよ。
可読性を損なってまでも表現すべきことなのかな。

>>103
碌なもんじゃない気がする。

106Name_Not_Found :03/12/25 22:46 ID:???
>>100の質問もFAQに入れた方がいいんじゃない?
filter関係の質問てこんなのばっかだし

107Name_Not_Found :03/12/25 23:04 ID:???
>99
誰か突っ込むと思っていたらまだ突っ込まれてないので

float: left; を指定した段階で強制的に display: block; になってます
よって display: inline は(間違いではないにせよ)あっても意味を成しません

ttp://www.swlab.csce.kyushu-u.ac.jp/man/rec-css2/visuren.html#float-position
ttp://www.swlab.csce.kyushu-u.ac.jp/man/rec-css2/visuren.html#q24

108Name_Not_Found :03/12/26 00:29 ID:???
>>107
更に突っ込むと Errata in REC-CSS2 および CSS2.1 では
必ずしも「block」になるとは限らないと変更されている。

ttp://www.w3.org/Style/css2-updates/REC-CSS2-19980512-errata#s-9-7
ttp://www.w3.org/TR/CSS21/visuren.html#dis-pos-flo
ttp://cssbug.at.infoseek.co.jp/detail/mozilla/b047.html

109Name_Not_Found :03/12/26 11:21 ID:???
>>108
と言っても、それはlist-itemの場合だから、>>36=>>99の件には関係ない。

110Name_Not_Found :03/12/26 13:59 ID:???
>>109
>>99 の件に関係なく「提示された仕様書は修正されていますよ」ってこと。
また突っ込むとだな display: list-item; の場合に限ったことではない。
例えば表要素(display: table)をフロート配置にしても「table」のままになる。

111Name_Not_Found :03/12/26 16:55 ID:???
質問です。IE6で、
body { line-height:1.3em; }
div.example { border:1px solid #000; }
dt { width:7em;float:left; }
として、
<div class="example">
<dl>
<dt>ほにゃほにゃ</dt><dd>なんとかかんとか</dd>
<dt>ほげほげ</dt><dd>なんとかかんとか</dd>
<dt>ぽにゃぽにゃ</dt><dd>なんとかかんとか</dd>
</dl>
</div>
とすると、何故か全体を囲う線のみでなく、各行の間にも線が入ってしまいます。
どのようにすれば解決されるのでしょうか?

112Name_Not_Found :03/12/26 17:33 ID:???
<dl class="example">


113Name_Not_Found :03/12/26 17:34 ID:???
幾つかの解説サイトでは、一部分の文字の色を変えるとき等に span タグを使うように と
書かれていますが、実際spanを使っているサイトは少ないように思えます。
これは何故なんでしょうか? spanタグ自体が不適切だからでしょうか?

114111 :03/12/26 18:14 ID:???
>>112
実際は
<div class="example">
<ul>
<li>ぽにゃぽにゃ</li>
<li>ほらぽら</li>
</ul>
<p>さて、これから定義リストを始めます。</p>
<dl>
<dt>ほにゃほにゃ</dt><dd>なんとかかんとか</dd> ……
のようにexampleの中にはdl以外にもいろいろなものが入っているので
そのように解決する事が出来ず困っています。

115Name_Not_Found :03/12/26 18:25 ID:???
>>113
「一部分の文字の色を変えるとき」というのは,潜在的に何かしらの意図がある筈です。
その意図が HTML の要素型で用意されていれば,その要素で印付けして意図を明示します。
HTML4 には,構造を示すインラインの要素型として,
em, strong, dfn, code, samp, kbd, var, cite, abbr, acronym が用意されています。
なんの構造を持たない div, span要素はなるべく使わないようにするのが基本です。

場合によっては,物理的なsmall, big要素型などを使っても構いません。
例えば「呟き」を表現する要素型は HTML には存在しませんが,
<small class="mutter">〜</small> として表現するのも一つの方法です。
違和感を感じるのであれば,span要素でマーク付けすればよいです。


116Name_Not_Found :03/12/26 18:27 ID:???
>>114
とりあえず手持ちのFirebird0.7では出なかったから、IEのバグかも知れんな。
解決法は↓の方よろしく。

117Name_Not_Found :03/12/26 18:31 ID:???
おかしくはない、他が原因だろ

118Name_Not_Found :03/12/26 19:57 ID:???
いや、確かにIE5.5だと出る。Opera7.23では出なかったけど。

119Name_Not_Found :03/12/26 20:01 ID:???
>>114
Operaでも行の間の線は出ないですね。
IEで確認してみたのですが、なぜか border-top が
定義リストの間に表示されるみたいですね。

解決法(?)
・試しに、div.exampleに背景色(background-color))を指定してみたら、
定義リストの間の線が消えました。
・ dl{background-color:white;} でも消えました。
色はなんでも良いみたい。

一応、CSSバグ報告スレッドにもいった方が良いかも。
http://pc2.2ch.net/test/read.cgi/hp/1050844510/l50

120111 :03/12/26 20:23 ID:???
返信有難うございます。IEの問題のようですね。
>>119
backgroud-colorの指定は盲点でした。
dtをborder-style:none;にしてみたりしても解決されなかったので、
悩んでいました。
バグ報告スレの方はほとんど覗いた事が無いのですが、
報告させていただくことにします。有難うございました。

121Name_Not_Found :03/12/28 04:51 ID:???
<table border="1">と同じ事をスタイルシートで
やろうとしているのですが、上手く行きません。どうしたら同じことができるでしょうか?

122Name_Not_Found :03/12/28 07:22 ID:???
>>121
table要素のborder属性は非推奨じゃないと思うが・・・

123Name_Not_Found :03/12/28 08:09 ID:???
いや。ISO-HTMLかもしれん。
tableの外枠はブラウザによって微妙に色が違うから

table { border: 1px outset silver }

とか

table {
 border-width: 1px;
 border-style: solid;
 border-color: white gray gray white;
}

とか ThreeDDarkShadow みたいにシステム色使うとか
好きなやつ選んでくれとしか言いようがない。

124Name_Not_Found :03/12/28 08:19 ID:???
>>123
ありがとうございます。でも、それでやると内枠が消えるんです。
テーブルタグだと、内枠まで自動設定されるのですが、スタイルシートでは無効になります。
逆にスタイルシートでtdについて指定すると、現在テーブルタグで指定しているものまで書き換えられてしまうのです。

125Name_Not_Found :03/12/28 08:38 ID:???


↓これで既存の <table border="1"> みたいになるっしょ。CSSのborderは子孫に継承しないんだし。

table {
 border-width: 1px;
 border-style: solid;
 border-color: white gray gray white;
}
td {
 border-width: 1px;
 border-style: solid;
 border-color: gray white white gray;
}

つーか、「現在テーブルタグで指定しているもの」って何?

126Name_Not_Found :03/12/28 12:04 ID:???
>>125
ありがとうございます。できました。
あと、class使ったら影響を閉じ込めれました。

127Name_Not_Found :03/12/28 12:07 ID:???
しかし、2種類のテーブルを使い分けるとき、
いちいち<td>だったところを<td class="hogehoge">とか指定しなければいけないのがつらいです。

128Name_Not_Found :03/12/28 12:09 ID:???
tableにだけclassを指定すれば充分でしょ。

129Name_Not_Found :03/12/28 12:16 ID:???
>>128
だめでした。classをtableだけに指定するとtdの指定が無くなり、<table border="1">みたいなことが出来ません。

130Name_Not_Found :03/12/28 12:20 ID:???
>>129
仕様書か解説サイトの「セレクタ」の項を参照されたし。

131Name_Not_Found :03/12/28 12:36 ID:???
>>130
それを参考に書いているのですが、
class指定がなければデフォルトの一種類の指定が使われてしまいます。たぶん仕様どおり。
td { border-width: 1px; border-style: solid; border-color: gray white white gray; }
td.test { border-width: 2px; border-style: solid; border-color: gray white white gray; }
で、
<td class="test">ほげほげ</td>
みたいなことをやろうとすると、各<td>でいちいちこのclassを指定しないとダメみたいです。
指定しないとクラス無し指定になります。
やりたいことは、<table class="test">な感じで、中の<td>も一括して設定変更をしたいのです。

132Name_Not_Found :03/12/28 12:47 ID:???
具体的には、ここにあるような
ttp://www.ne.jp/asahi/ohisama/ohisama2/hiko/table6.html
切り替えを境界線にも適用したいのです。

133Name_Not_Found :03/12/28 12:54 ID:???
table.test { 略 }
.test td { 略 }

134Name_Not_Found :03/12/28 13:00 ID:???
>>133
ありがとうございます!できました!

135Name_Not_Found :03/12/28 13:07 ID:???
オイオイ、子孫セレクタがわかってなかったのかよ……。基礎だよ? >>134

136Name_Not_Found :03/12/28 13:53 ID:ZLnWO3Ti
フジテレビHPより
<TITLE>もしもツアーズ</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=Shift_JIS">

<!--スタイルシート-->
<SCRIPT LANGUAGE="javaScript" TYPE="text/javascript" SRC="css/css.js">
</SCRIPT>
<!--スタイルシートここまで-->

このスタイルシートって・・・なんですか?

137Name_Not_Found :03/12/28 14:44 ID:???
>>136
スタイルシート振り分け用じゃないの?

関係ないけど、新聞・テレビとか大手メディアの悲惨なhtmlはなんとかしてもらいたいとか思った。

138Name_Not_Found :03/12/28 15:08 ID:???
いいんだ、ちゃんと振り込んでくれれば
後は知らん。知ったことじゃない。

139Name_Not_Found :03/12/28 15:32 ID:???
台本形式のテキストをCSS使って表現したいんですが、

モナー:今日はいい天気だ。
     明日もいい天気だろう
ギコ :あさっても多分いい天気だな

という感じに表現したい時、2行目以降にインデントをつけるのと、
2行目以降にマージンつけるのとどちらが正しいのでしょうか?

140Name_Not_Found :03/12/28 15:48 ID:???
>>139
フロート使って下記の感じでいいじゃない?

<head>
<title>台本形式のテキストをCSS使って表現</title>
<style type="text/css">
dt {
text-align: right;
float: left;
width: 3.5em;
}
dd {
margin-left: 3.5em;
}
p { margin: 0; }
</style>
</head>
<body>
<dl>
<dt>モナー:</dt>
<dd><p>今日はいい天気だ。<br>明日もいい天気だろう。</p></dd>
<dt>ギコ:</dt>
<dd><p>あさっても多分いい天気だな。</p></dd>
</dl>
</body>

141Name_Not_Found :03/12/28 16:39 ID:???
pタグは入れなくていいような気がするんだが…

142Name_Not_Found :03/12/28 16:46 ID:???
完全に間違いだな

143Name_Not_Found :03/12/28 17:23 ID:???
>>141-142
会話文だって文章なのだから、一つの主題をもって纏まった部分を
段落としてマーク付けするのは至極当たりまえのことだと思うが。

ここはCSS質問スレであって、Strictスレではないのだから、
最終的なマーク付け方法は >>139 が考えればよいことだろう。

明確な根拠を提示するつもりがないのなら黙ってろ。

144Name_Not_Found :03/12/28 18:46 ID:???
こんな感じだとどうなんでしょう。

<title>脚本</title>
<style type="text/css">
* {margin:0; padding:0;}
body{line-height:1.5em;}
dl{margin:1em 0 1em 4.5em;}
dt{position:absolute; left:1em;}
</style>

<dl>
<dt>モナー:</dt>
<dd>
<p>今日はいい天気だ。</p>
<p>明日もいい天気だろう。</p>
</dd>
<dt>ギコ:</dt>
<dd>
<p>あさっても多分いい天気だな。</p>
</dd>
</dl>


145Name_Not_Found :03/12/28 19:23 ID:???
>>144 なんで絶対配置なんかするのかね。せめて相対配置だろ。

146Name_Not_Found :03/12/28 19:54 ID:???
>>145
上記で、dt{position:relative; left:-4em; top:1.5em;} とかにしろってこと?
理由は?

147Name_Not_Found :03/12/28 20:01 ID:???
どこからtop:1.5em;が出てきたんだ? >>146
ともあれ、positionを使用する位なら、margin-leftに負の値、でよかろ。
positionを使用すると、その子孫要素によっては面倒が起きやすいから。
特にabsoluteはいかんよ。本来の位置を無視してキャンバスに対して配置するんだから。

148Name_Not_Found :03/12/28 20:39 ID:???
>>147
>どこから出てきた
スルーでお願いします。

>本来の位置を無視してキャンバスに対して配置するんだから。
(positionにstatic以外の値を指定してない)包含ブロックがない場合?
というか、IEにバグがあるし、使わないほうが無難というのはもっともか。
>positionを使用すると、その子孫要素によっては面倒が起きやすいから。
そうですね。サンクス。

149Name_Not_Found :03/12/28 22:35 ID:???
<dl>
 <dt>Title</dt>
 <dd>
  <ul>
   <li>A</li>
   <li>B</li>
   <li>C</li>
  </ul>
 </dd>
</dl>

を、

<table>
 <tr>
  <td>A</td>
  <td>
   TITLE
   <ul>
    <li>B</li>
    <li>C</li>
   </ul>
  </td>
 </tr>
</table>

みたいな感じに表示させるには
どんな css を書けば良いのか教えて頂けませんか?

TITLE には本の題名、
A には本の表紙画像、
B, C には著者名等を入れるつもりです。

150Name_Not_Found :03/12/28 22:42 ID:???
>>149
自分では、どんなスタイル指定を書いてみたのですか。
それを添削するとしませう(全部他人頼みはよくない)。


関係ないけど。
 li要素の子孫にdl要素があるとリストマークが上方にずれる
 http://cssbug.at.infoseek.co.jp/detail/winie/b028.html

151Name_Not_Found :03/12/28 22:45 ID:???
ほんとに関係ないな(w


152Name_Not_Found :03/12/28 22:47 ID:???
>>149
<dl>
 <dt>Title</dt>
 <dd><img src="A.gif" alt="A"></dd>
<dd>
  <ul>
   <li>B</li>
   <li>C</li>
  </ul>
 </dd>
</dl>
で、ddを横並びにすればよし。
dt一つに対しdd複数でもいいんだよ?

153Name_Not_Found :03/12/28 22:48 ID:???
>>149
>>150も言ってるが、
人に聞くほどの質問じゃないだろ。


154Name_Not_Found :03/12/28 22:58 ID:???
>>149
無理に定義リストにしなくとも、表ならばtableを使ってよし。
<table>
 <tr>
  <th rowspan="3">表紙画像</th>
  <th>タイトル</th>
</tr>
<tr><td>著者名</td></tr>
 <tr><td>発行年</td></tr>
</table>
とか。

155Name_Not_Found :03/12/28 23:01 ID:???
 以前にもこのスレなどで質問したことがあるのですが、原因がわかったので再度質問
させていただきます。 わかる方お願いします。

 Mozilla で XHTML(application/xhtml+xml) 文章に <?xml-stylesheet ...?> で CSS
を関連付けると、例えば

   <dc:title>         ⇒  dc\:title {...}
   <hoge xml:lang="..">   ⇒  hoge[xml\:lang] {...}

のようにエスケープしていても反映されません。 これは XHTML に Link 要素で関連付けても、
XHTML 内に CDATA として書き込んでも同様でした。 Opera7 ではどちらも反映されています。
 また、同じ文章を HTML(text/html) として Link 要素で CSS を関連付けると、こちらは反映さ
れています。 これは Mozilla のバグと考えていいでしょうか?

 上にもある通り Dublin Core や SVG を埋め込んでいるので、どうしても application/xhtml+xml
として扱いたいんです。 また、Moz スレで訊こうかとも思いましたが、あちらのスレもみている
web 制作板の住人さん(全員?)に判断してもらおうと思ってこっちにカキコしました。
 以前は私の説明不足で話が噛み合わなかったので、今回はどうぞよろしく。。。 長文スマソ

156149 :03/12/28 23:03 ID:???
>>150
1: TITLE 部分の background image として A を使う
 変だったので保留。

2: A を dl の外側に出して float
 html として変か・・・

発想が乏しく、試したのはこの 2 つくらいのもんで・・・
後は、画面左側からの位置をきっちり定めるくらいしか方法が思い付きませんが、
出来たらこの方法は採りたくない・・・

>>152
説明不足で申し訳ない。
TITLE も、画像 A の横に来て欲しいんです。
その方法だと、まず TITLE が来て、
その次に画像 A と B, C が来てしまうかと。


157149 :03/12/28 23:11 ID:???
>>154
表、と言う事になるのか・・・
そうか、表か・・・

なんかこういうのを表として書いて良いのかどうなのか
ちと疑問だったんスけど、表で逝く事にします。



愚問につきあって下さった皆様、有り難う御座いました。



158Name_Not_Found :03/12/28 23:14 ID:???
>>156 
float:right;なら順序を変更できますが。

159139 :03/12/29 00:49 ID:???
遅くなりましたが、レスをくださったみなさんありがとうございます。
私にはちょっと難しいので、また研究しながらやってみます。
ありがとうございました。

160Name_Not_Found :03/12/29 13:52 ID:???
>>159  別に難しくはないだろ。>>140でよいではないか。

161159 :03/12/29 17:26 ID:???
すみません、知らない書き方もあるので、教えていただいた書き方を研究するという意味です。
ただコピーするだけだといつまでたっても理解できないと思うので、意味とか使い方とかを
知ってからにしようと思っています。



162Name_Not_Found :03/12/29 19:05 ID:???
久しぶりの謙虚なタコに心洗われる年末。

163Name_Not_Found :03/12/29 22:06 ID:???
ここでタコなどと聞くとは。知らないやつが言われると煽りと勘違いされそうだ

164Name_Not_Found :03/12/29 22:22 ID:???
↑うぜー

165155 :03/12/30 00:10 ID:???
CSS Laboratory さんのソースを眺めていて気付いたんですが、
dc:title を dc|title のようにすればよかったみたいです。
これってどの仕様書にかいてあるんでしょうか?

166Name_Not_Found :03/12/30 04:43 ID:dY/zFyBK
教えて下さい。
<h1>こんにちはアリガトウ</h1>
というタイトルで、こんにちは      アリガトウ のように、
間にスペースをあけるにはどうしたらいいのでしょうか?

167Name_Not_Found :03/12/30 04:45 ID:???
<h1>メインタイトル<small>サブタイトル</small></h1>

h1 small { margin-left : 50px }

とか。
ダメか。

168166 :03/12/30 05:20 ID:dY/zFyBK
>>167さん
できました!
pxの数値を変えたら左右のスペースを思い通りに動かせました。
即レスで教えて下さってありがとうございます!
感謝!!<(_ _)>

169Name_Not_Found :03/12/30 05:37 ID:b86aNd1w
>>166
<h1>こんにちは<span style="margin-left:50px">アリガトウ</span></h1>
とか。
スタイルシートでなければ
<h1>こんにちは      アリガトウ</h1>
とか。

アリガトウの部分が本当にサブタイトルなら
<h2>にでもして分けて、あとはfloatでやるのがいいと思う。

170Name_Not_Found :03/12/30 05:39 ID:b86aNd1w
&nbsp;が消えたよう(´Д`)


171Name_Not_Found :03/12/30 05:43 ID:p38WRZ4A
フォントサイズ固定するアホは死んでもらいたいんですが
政府の見解はいかがなものでしょうか?

172166 :03/12/30 05:44 ID:dY/zFyBK
すみません...ブラウザの大きさ変えてみたら、
こんにちはとアリガトウがピッタリ左右には分かれないみたいです。
pxの数値を大きくしたら改行になってしまいます。
169さんのも試してみます。

173166 :03/12/30 05:48 ID:dY/zFyBK
度々、後だし情報ですみません。
こんにちはとアリガトウを、
一本の罫線の中で左右に分けることができたらと思って。

174Name_Not_Found :03/12/30 06:00 ID:???
>>169
サブタイトルをh2に回すのか?(´д`;)
なんかおかしなことにならないかそれ。
口じゃ説明できないような、モヤモヤが。

>>172
pxじゃそりゃだめだ。それで気に入らないなら、%にしてみな。

175Name_Not_Found :03/12/30 06:01 ID:???
>一本の罫線の中で左右に分けることができたらと思って。
俺が文盲なのか、貴方が文盲なのかはおいておいてだな。
もうちょっと意味をしてくれ。

176Name_Not_Found :03/12/30 06:10 ID:???
>>175
要するに、画面の左端に「こんにちは」
画面の右端に「有り難う」と表示させたいのだろう。

但し「こんにちは」と「有り難う」は、同じ行に在る・・・と。


177Name_Not_Found :03/12/30 06:24 ID:???
h1 big{
position : absolute;
left : 20px;
}
h1 small{
position : absolute;
right : 20px;
}

<h1><big>メインタイトル</big><small>サブタイトル</small></h1>

一応これでできるみたいだけど、インライン要素にしちゃダメな希ガス(´・ω・`)

178Name_Not_Found :03/12/30 06:28 ID:???
あんまり関係ないかもしれないけれど、自分は
<h1>タイトル<br><span id="hogehoge">サブタイトル</span></h1>
にしています。
タイトルだけで<h2>まで使ってしまうのはどうだろう、と思ったことがひとつ。
タイトルとサブタイトルを
CSSだけで確実に配置分けできるかどうか不安だ、というのがひとつ。
しかし、強制的に改行させていいのだろうかという迷いもあります。

179Name_Not_Found :03/12/30 06:37 ID:???
br は使わない方が良いだろう


180Name_Not_Found :03/12/30 08:16 ID:???
>>177
position、しかもabsoluteはおすすめできない。
横並びにさせるならfloatがよいと思ふ。

181Name_Not_Found :03/12/30 08:46 ID:???
>>178
お前の理念に興味はないが、「強制的に改行させていいのだろうかという迷い」や「タイトルだけで<h2>まで使ってしまうのはどうだろう」なんてことはつまらんことであることは、もっと勉強すればおのずと理解できる。

182162 :03/12/30 09:36 ID:???
>>163
漏れの周りでは普通に使ったりするおっさんが多く、
タコは珍重、もとい、尊重されてるっす。スマソ

>>164
なぜに?

183Name_Not_Found :03/12/30 09:38 ID:???
>>182
> なぜに?
勘違いしたやつだろ気にスンナ

184Name_Not_Found :03/12/30 09:57 ID:???
( ´ _ゝ`)...
オマエらCSSより先にマークアップを勉強しろよ

185Name_Not_Found :03/12/30 10:10 ID:???
>>178
>強制的に改行させていいのだろうかという迷いもあります。

ならばこれでよかろ。悩むほどのことかい。
<h1>タイトル&nbsp;<small>サブタイトル</small></h1>
h1 small {display:block;}

186Name_Not_Found :03/12/30 10:28 ID:???
  って何?


187Name_Not_Found :03/12/30 10:38 ID:???
>>185
ソレってhtml的にも正しいと言えるの?


188Name_Not_Found :03/12/30 12:56 ID:???
>>187 誤りや不審な点があるなら具体的に指摘してください。

189Name_Not_Found :03/12/30 13:20 ID:???
HTMLがどうだろうとここはCSSの質問スレだ。
W3C信者が集う場所ではない

190Name_Not_Found :03/12/30 17:46 ID:???
でもHTMLの記述すらできないヤシは、そもそもこのスレで
質問する資格をもたない。

191Name_Not_Found :03/12/30 17:57 ID:nlmZXRDi
質問です。
http://www.swlab.csce.kyushu-u.ac.jp/man/rec-css2/selector.html#attribute-selectors
にあるように属性セレクタのテストをやってみたんですが、
下記の「aaaa...」が赤で表示されませんでした。ブラウザはIE6です。
解決策のご教示を請います。


<html><head><title>selectortest</title>
<style type="text/css">
div [align="center"] {color: red;}
</style></head><body>
<div align="center">
aaaaaaaaaaaaaaaa
</div></body></html>

192Name_Not_Found :03/12/30 18:02 ID:???
IEは属性セレクタ未対応

193178 :03/12/30 18:25 ID:???
お答えをくださった方、どうもありがとうございます。
>179 参考にしてみます。
>181 つまらないことだとは思います。割り切ってしまうことも必要でしょうか。
>185 <small>を使うよりは、<span>の方が適しているかと思います。
確かに、メインのタイトルよりも小さくなりますが・・・。

>191 クラスをつけるのが無難かと思います。

194Name_Not_Found :03/12/30 18:25 ID:???
>>185
>ならばこれでよかろ。悩むほどのことかい。
( ´,_ゝ`)プッ

195Name_Not_Found :03/12/30 18:49 ID:???
>>193
smallは非推奨ではなかったはず。なんで無意味なspanなの?
emの反対で強調度を下げる要素が無いのだから、smallでいいかと。

196Name_Not_Found :03/12/30 18:53 ID:???
>>194 ?

197Name_Not_Found :03/12/30 19:35 ID:???
>>190
初心者用質問スレなのに、なんでそんなに鼻息荒いの?必死杉w

198166 :03/12/30 19:39 ID:D3t19gir
166です。みなさんこんなに考えて下さって
ありがとうございます。
レイアウトは>>176さんの仰るとおりです。
説明が足りませんでした。
みなさんのお答えを参考に色々試してみます。
ありがとうございました。

199Name_Not_Found :03/12/30 19:41 ID:???
>>198 で、結局どうやって解決したの? 結果報告が無いと今後に生かせない。

200Name_Not_Found :03/12/30 19:44 ID:???
>>193

small要素に関して。

 このモジュールは、単純なプレゼンテーション関係の
 マークアップのための要素、属性、最小内容モデルを定義する

XHTML1.1でもsmallは非推奨要素でないし、間違った使い方でもないと思う。

まぁStrictスレ行きだわなこれは。

201166 :03/12/30 20:54 ID:???
pxを%に変えてみました。勉強不足で、たびたび恐れ入ります。

202Name_Not_Found :03/12/30 21:18 ID:???
>>201
横並びにするのはpositionでやったのかfloatでやったのか、はどうなんです?

203Name_Not_Found :03/12/30 21:31 ID:???
うぜー粘着し寝

204Name_Not_Found :03/12/30 22:45 ID:???
早めに答えてもらえませんか?
さもないと本当にあなたたちを無知だと見なしますよ。

205Name_Not_Found :03/12/30 22:58 ID:???
見做せばええやん。見做したところで何か変わるとは思えないが。

206Name_Not_Found :03/12/30 23:20 ID:???
↑冬将軍釣られまくり。

207Name_Not_Found :03/12/31 09:53 ID:???
>>204
だから、本買えよ


208Name_Not_Found :03/12/31 11:15 ID:???
そもそも>>204がいったい何の質問をしたといふのか。

209Name_Not_Found :03/12/31 12:06 ID:???
日本語の喋れない奴は黙れ

210Name_Not_Found :03/12/31 13:43 ID:???
質問です。
デフォルトスタイルシート言語の設定:
<meta http-equiv="Content-Style-Type" content="text/css">
をしなくても、タグ内のstyle属性の記述がIE6などのwebブラウザで有効なのは、
CSSの仕様ではなくブラウザの仕様によるものという理解は正しいですか?

211Name_Not_Found :03/12/31 15:15 ID:???
仕樣と實裝とを區別しませう。>>210

212Name_Not_Found :03/12/31 15:29 ID:???
>>211
書き方が悪かったせいか、思い違いなさってます。
仕様と実装を区別した上で、どっちの要因によるものかという質問の主旨です。

仕様書を見ますと、はっきりした記述が読み取れなかったので、どっちかなあと思ったんです。
IEやNNで使えるんだからそれでいいといえばそうですが。

とにかく
デフォルトスタイルシートの宣言なしでもタグ内でstyle属性使えることがあるのは事実ですよね。
厳格に学習していこうとする上でちょっと引っかかっただけです。

213Name_Not_Found :03/12/31 17:34 ID:???
>>212
これかな。Another HTML-lint の解説から。
http://www.asahi-net.or.jp/~sd5a-ucd/rec-html401j/present/styles.html#h-14.2.1
> どちらもない場合、デフォルトスタイルシート言語は text/css である。


214Name_Not_Found :03/12/31 17:44 ID:???
>>211
正しい日本語を使いましょう。

215Name_Not_Found :03/12/31 18:08 ID:???
これテーブルの枠線が表示しなかったんですがどうしてですか?IE6です。

<html><head><title>a</title><style type="text/css">
table {
text-align: center;
margin-left: auto;
margin-right: auto;
width: 400px;
height: 400px;
border-width: 10px;
border-color: black;
}
div {
text-align: center;
}
</style></head><body><div><table><tr><td>a</td></tr></table></div></body></html>

216Name_Not_Found :03/12/31 18:08 ID:???
>>214
「正かな遣い」で書いている人にいちいち反応するな。

217Name_Not_Found :03/12/31 18:47 ID:???
2chで煽られた香具師が明治神宮に爆弾設置宣言!警察官500人体制!
http://live4.2ch.net/test/read.cgi/mmonews/1072845014/
↑↑↑↑↑
お祭り会場!

218昔の人 :03/12/31 20:45 ID:???
>>215
枠線が表示“され”なかったのは、border-widthとborder-colorだけで
border-styleプロパティーを指定してないからではないでせうか。

219Name_Not_Found :03/12/31 20:57 ID:???
初期値が「none」なんですね!勉強になりました。
ご丁寧にも文法の指摘までしていただいて。

220Name_Not_Found :03/12/31 21:01 ID:???
>>215
ふつうは簡略化プロパティを使用しないかい?
border:10px solid #000; にすればいいのに。
cf. http://hp.vector.co.jp/authors/VA022006/css/box.html#border-shorthand-properties

221215 :03/12/31 21:04 ID:???
>>215
はいそうですね。初心者でした。
参考にします

222215 :03/12/31 21:05 ID:???
>>221>>220の間違い。

223Name_Not_Found :04/01/01 00:51 ID:???
旧かな旧字使いはアポ!

224Name_Not_Found :04/01/01 08:29 ID:???
↑あけまして、おめでたう。

225Name_Not_Found :04/01/01 21:06 ID:???
アホばっかりだな!

226Name_Not_Found :04/01/02 19:46 ID:???
文字の色の変え方を教えてください!
リンクは全部読みましたがわかりません!

227Name_Not_Found :04/01/02 20:02 ID:???
旧字旧仮名遣い=ウヨ=木違い

228Name_Not_Found :04/01/02 20:25 ID:???
>>226
ネタかな?
讀んでわからない人には、ここで説明してもわからないのではないかと思ふ。

229Name_Not_Found :04/01/02 20:42 ID:???
色の指定
http://www.tg.rim.or.jp/~hexane/ach/lbcs/lbcs1-04.htm
color(前景色)
http://hp.vector.co.jp/authors/VA022006/css/colors.html#color
色(Colors)
http://hp.vector.co.jp/authors/VA022006/css/data.html#colors

230Name_Not_Found :04/01/02 21:44 ID:???
質問です。
<div>でstyle="float:○○;"を使って、divの箱を左右に並べます。これ自体に問題はないのですが、
その中で<ol>を使ったリストがあるのですが、左と右で通し番号を付けたいのです。

1. ○○ 5. ○○
2. ○○ 6. ○○
3. ○○ 7. ○○
4. ○○ 8. ○○

と言った感じです。可能ですか?
(もしガイシュツだったらスマソ)

231Name_Not_Found :04/01/02 21:58 ID:???
>>230
質問はageで。

順序付きリストのstart属性をCSSで指定したいのかな?

http://www.ne.jp/asahi/minazuki/bakera/html/reference/list#ol
しかし
>compact、start属性については、代替する属性/CSSプロパティはありません。
http://www.cybergarden.net/xhtml/attributes.html

CSS3でも無いのかね? 誰か無い理由を知ってますか。

232Name_Not_Found :04/01/02 22:08 ID:???
counterプロパティーで生成しろってことかしらん。
しかしOperaしか実装されてないし。↓
 http://is.vis.ne.jp/charts/css2_values/index.xhtml#counter

233Name_Not_Found :04/01/03 05:05 ID:arsUX4ir
<div title="hogehoge">
<p><abbr title="Internet Explorer">IE</abbr> 5.5<br>
<kbd>Alt</kbd>キー</p>
</div>

簡略に書くとこのような状態なのですが、
abbr要素のスタイルが適用されません。
lintでもCSS検証でも問題なかったのですが、なぜなのでしょうか。
(読みこむCSSの指定をまちがえているわけでもありません)
ブラウザはIE5.5です。

ttp://www.remus.dti.ne.jp/~a-satomi/nikki/
ここでは反映されて表示されるのですが・・・。

234Name_Not_Found :04/01/03 05:11 ID:???
少々わかりにくい書き方になったので訂正。
abbr要素だけは、通常のテキストと同様に表示されてしまいます。

いじっている途中のものを書くのもなんですが、
現在のスタイルはこんな状態になっています。
abbr {
cursor: help;
background-color: transparent;
font-style: normal;
border-width: 0px 0px 2px 0px;
border-style: dotted;
border-color: #333366;
}

235Name_Not_Found :04/01/03 08:00 ID:???
>233
abbr要素はIEが非対応じゃなかったっけか。IE6でも。
マークアップとして不適当になるがacronym要素やspan要素で代用するしかなさげ。

236Name_Not_Found :04/01/03 08:09 ID:???
>>233
そのサイトはJS使ってる。
JSをきってみ。

237Name_Not_Found :04/01/03 08:56 ID:???
>>233
http://www.akatsukinishisu.net/itazuragaki/id/copying_javascript
 http://www.akatsukinishisu.net/style/head.js
http://www.remus.dti.ne.jp/~a-satomi/nikki/2002/06c2.html#d26n02

238233 :04/01/03 13:43 ID:???
いろいろ参考になりました。どうもありがとうございます。
IEの環境が早く整ってくれないことには、なかなか難しい問題ですね。
IEでないブラウザを使うような人のほとんどは
多少でもPCの知識を持っている人だと思われるので、
あまり<abbr>の恩恵がなさそうな気がします。

239Name_Not_Found :04/01/03 13:45 ID:???
>>238
abbrの恩恵って。

240Name_Not_Found :04/01/03 14:23 ID:???
hr 要素の線の太さ(size)はCSSではどうやって変更するのですか?

241Name_Not_Found :04/01/03 14:26 ID:???
>>240
デフォルトで線などないと思うんだけど。

242Name_Not_Found :04/01/03 14:46 ID:???
>>240
訊く前に、>>4のリンク先からすぐ見つけられるはずだ。

hr要素へのスタイル指定
 http://cssbug.at.infoseek.co.jp/misc/hr.html

243Name_Not_Found :04/01/03 15:05 ID:???
>>242
なんとかできました。ありがとうございます。
そこのリンク思いっきりスルーしてました。次からは気をつけます。

244230 :04/01/03 15:55 ID:2EneXQof
>>231
ageですか。気をつけますー。

>>232
これでつ!でもOPだけってのは…
地道に普通に1. 2. って打ちますよ...(´З`)チェッ
ありがとうございました。

245Name_Not_Found :04/01/03 16:57 ID:???
ここはスタイルシートの中身だけを取り扱うスレですか?
故あって、本文(BODY)の中でスタイルシートを定義したいのですが、
そんなことって許されるのでしょうか?

246Name_Not_Found :04/01/03 17:02 ID:???
>>245
HTMLの話ではないかと。
ちなみにHTML4.01にあるのはstyle属性だけ。もしくはscript

247Name_Not_Found :04/01/03 17:46 ID:???
list-item で

・△item
 ↑ここの隙間の長さを調整するのってどうやるんですか?

248Name_Not_Found :04/01/03 18:39 ID:???
padding-left

249Name_Not_Found :04/01/03 21:54 ID:???
>>248
ごめんなさい。小さくしたいんです。

250Name_Not_Found :04/01/03 22:05 ID:???
>>249
marker-offset


251Name_Not_Found :04/01/03 22:07 ID:???
>>249
liの中をdivでもpででも括って、それにmargin-leftでマイナス値、とか。

252Name_Not_Found :04/01/03 22:11 ID:???
marker-offsetに對應してゐるのはMozilla/Netscape7だけ。
http://hp.vector.co.jp/authors/VA022006/css/corrbrwser/generate.html#marker-offset

253Name_Not_Found :04/01/03 22:20 ID:???
>>250
>>252
すいません、できればIEにも対応したいので…

>>251
試してみましたがダメでした(IE6)。

+長めの説
 明文章

というのを綺麗に出力したいんですが、テーブル組まないと仕方ないですかね…


254Name_Not_Found :04/01/03 22:38 ID:???
>>253
margin-leftでマイナス値、が駄目ならposition:relative;でleft:-1em;とか。
工夫しなさい。

255Name_Not_Found :04/01/03 23:24 ID:9bXmXTAb
net shopやるに、strictでサイト作ろう
というのどうでしょか?PC初心者。
HPビルダーがいいとこ?
なぜにstrict?わからんす、すんまそん・・

256Name_Not_Found :04/01/03 23:25 ID:???
わけわからん質問すな。strict HTMLスレッドへ行きなさい。>>255

257Name_Not_Found :04/01/04 00:27 ID:???
>>255はこっち。


Webサイト制作初心者用スレ vol.78
http://pc2.2ch.net/test/read.cgi/hp/1072860019

電子商店-オンラインショップ-スレッド
http://pc2.2ch.net/test/read.cgi/hp/1022242508


というかネットショップやるにも、その程度の事が判断できないレベルでは、
すべて自分でやるにしても一部外注するにしても必ず火傷をするぞ。
頭冷やして一から勉強してこい。

258Name_Not_Found :04/01/04 00:33 ID:???
擬似クラスと擬似要素って名前がどうして分かれてるんですか?

259Name_Not_Found :04/01/04 00:38 ID:???
要素とclassは別物だから。セレクタの優先度があるわけだし。

260Name_Not_Found :04/01/04 01:47 ID:???
疑似クラス関連で質問です。今リンクをhoverでボックスハイライトで表示してるんだけれど
画像リンクがあったとして、カーソルをその画像に持っていくと下の方にうっすらとハイライト
が残ってしまうのです。画像リンク要素だけボックスハイライトを無効にする事って出来ます?

261Name_Not_Found :04/01/04 02:07 ID:???
ボックスハイライトってナニ? 一般に通用する言葉で記述してくれないかな。

262Name_Not_Found :04/01/04 02:09 ID:???
>>260
>画像リンク要素だけボックスハイライトを無効にする事って出来ます?

ボックスハイライトが何かは知らんが、FAQの>>8を見れば解決する問題では。

263Name_Not_Found :04/01/04 02:27 ID:???
>>261

通常ブラウザはリンクを表示する時は大抵アンダーラインで示すでしょ。それをa:hover疑似クラスを
使ってそのリンク表示をアンダーラインからリンク文字を別の色で覆う様に表示してるんだけれど、
<a herf="./hoge.html"><img src="hoge.jpg"></a>とした画像を使ったリンクがあったら、その画像
リンクの下の方にa:hoverがかかっているので画像(img要素)だけa:hoverを適用させない様にしたい
のでつ。border周りも弄ってみたけど駄目ですた。

説明が下手で申し訳ない_| ̄|○

264Name_Not_Found :04/01/04 02:30 ID:???
リロードしたら答えが出てた
吊ってきます(´・ω・`)

265Name_Not_Found :04/01/04 02:50 ID:???
説明がヘタって言うか・・・
脳内用語使いたがる人って、どうしてこうなんだろ

266Name_Not_Found :04/01/04 03:05 ID:???
やっぱ駄目ですた・・・仕様書見てきます。お騒がせしますた_| ̄|○

>説明がヘタって言うか・・・
>脳内用語使いたがる人って、どうしてこうなんだろ

おーう、何とでも云ってくれ。ガンガン貶してくれ。他の人みたいに出来て当然な事が洩れには出来ないしな

267Name_Not_Found :04/01/04 03:56 ID:???
>>263
>リンク表示をアンダーラインからリンク文字を別の色で覆う様に表示してるん
意味わからん。
具体的に、どんなスタイル指定をしたのか、CSSのソースを出してくれ。
でないと何をしようとして何で駄目だったのか見えないから、助言できない。>>266

268Name_Not_Found :04/01/04 04:26 ID:???
a:hover img の場合だけ、
a:hover が適用されないようにするという意味かな?
hover状態になっても、画像だけは
アンダーラインをつけたくないということでしょ。
余計なことをたくさん書いているから、肝心なことが伝わっていない。

269Name_Not_Found :04/01/04 04:28 ID:???
いや、そもそも
a:hover img なんてものがあれば
自分も使ってみたいとは思うのだが・・・。
そういうのは無理なのかな。
過去に試したことがあるけれど、思い通りにはならなかった。

270Name_Not_Found :04/01/04 04:45 ID:/bU6QBQM
<div class="aaaaa">
で囲った中のpとかaにだけ、囲われていないpやaと別のスタイルを適用したい場合、
.aaaaa p{ }とか
.aaaaa a{ }
とかって書けばいいんですか?

271Name_Not_Found :04/01/04 06:28 ID:???
試してみればいいんじゃないですか?

272Name_Not_Found :04/01/04 09:11 ID:???
>>269
>a:hover img なんてものがあれば

ハア? ありますけど。
もしもし、下位要素(子孫)セレクターってわかってますか。
http://www.tg.rim.or.jp/~hexane/ach/lbcs/lbcs2-02.htm
http://hp.vector.co.jp/authors/VA022006/css/selector.html#descendant-selectors



273Name_Not_Found :04/01/04 09:16 ID:???
>>270も、>>269のリンク先でお勉強したまへ。

274Name_Not_Found :04/01/04 11:58 ID:???
>>266
> 他の人みたいに出来て当然な事が洩れには出来ないしな
 出来ない、ってことと、自作の用語を使うことには関係が見受けられないんだけど。

275Name_Not_Found :04/01/04 12:25 ID:???
>>266
ボックスハイライト→背景色のことかと解釈してみたが(もしかしたら文字色かもしれないが)、
それは単に藻前さんがハイライトとして使用しているというだけのこと。
表現方法わからなければ、
a:hoverにbackground-color(文字色ならcolor)を指定して…とかそのまんま書けばいいんだよ。
下手に言い換えようとするから他人に伝わらない。

子要素がimgの時のみa:hoverでの指定を適用したくないなら、classを使うとかしたら?

276Name_Not_Found :04/01/04 13:39 ID:???
img:hover

277Name_Not_Found :04/01/04 21:05 ID:???
>>274
他の人みたいに日本語を上手に使う事が出来ないので

278Name_Not_Found :04/01/04 22:19 ID:???
>>277
なんなら英語で書いても良いよ。
語学力の問題ではなく、論理的に伝えたいことを伝える能力に欠如していることに気がつけ。


a:hover img {background-color: transparent !important}

279Name_Not_Found :04/01/04 22:57 ID:???
266じゃないけど、a:hover img{〜}でうまく出来ないな。
画像の下にテキストに付けた色が数pxぐらいはみ出る。
これはブラウザ依存なのかな?

280Name_Not_Found :04/01/04 23:07 ID:???
>279だけど、ソースさらす。なんかまずい?

<style type="text/css">
<!--
body{color:#000; background-color:#fff}
a:link {text-decoration:none;color:#000;background-color:#ccc;}
a.visited{text-decoration:none;color:#000;background-color:#ccc;}
a:hover{color:#fff;background-color:#f00;}
a:active{color:#fff;background-color:#00f;}

a:link img{text-decoration:none;color:#000;background-color:#ccc;}
a:visited img{text-decoration:none;color:#000;background-color:#ccc;}
a:hover img{color:#0f0;background-color:#0f0;}
a:active img{color:#fff;background-color:#00f;}
-->
</style>
</head>

<body>
<a href="x">画像だよ><img src="あーたら.jpg" alt="あーたら"></a>
</body>


281Name_Not_Found :04/01/04 23:32 ID:???
border

282Name_Not_Found :04/01/04 23:34 ID:???
>>280
そもそもaにボーダーが指定してあるので間に何が挟まってようが、
imgのボーダー消しても <a></a>間のボーダーは消えない。
もともと a imgにボーダーがかかってるわけではないので。

この質問頻出。


283Name_Not_Found :04/01/05 00:05 ID:???
じゃ次スレはテンプレ追加でよろしく。

284Name_Not_Found :04/01/05 00:09 ID:???
>>2読め、でいいんだけどな

285Name_Not_Found :04/01/05 00:41 ID:???
そんな殺生な・・・(・_・;)

286Name_Not_Found :04/01/05 01:21 ID:???
280 >>282
> そもそもaにボーダーが指定してあるので

a の border-widthを0にすればいいってこと?、、、じゃないよな。。。

これって、消せるんすか?まじで。
ちなみに、

<body>
<a href="x">画像だよ><br>
<img src="あーたら.jpg" alt="あーたら"></a>
</body>

これで画像の下にはみ出るa:hoverの色は消えますけど、そういうことじゃないと思うんだな。。。

287Name_Not_Found :04/01/05 02:14 ID:???
もしかして>>286の言いたいのは、>>280のソースで言うと、
hoverのとき画像の下に赤い部分があることを言いたいのかな?

288Name_Not_Found :04/01/05 02:30 ID:???
inline-tableとかの実例載ったサイト教えて下さい

289Name_Not_Found :04/01/05 04:44 ID:???
>>286
a:link imgにvertical-align:bottom;とでも指定すれば良いような。
テキストのline-hightよりimgがでかけりゃ赤い部分は隠れるはず。

…って、IE(5.5)で何かおかしいなぁ。
http://cssbug.at.infoseek.co.jp/detail/winie/b069.html
の影響?

つーか、ちょっとテストしてみたら壊滅的に変だぞIE…


290Name_Not_Found :04/01/05 09:49 ID:x3I3uJOw
テーブルの中の文字のサイズも一括で指定する方法はありますか?
どのようにすればいいのでしょうか。

291Name_Not_Found :04/01/05 10:07 ID:???
ハァ…?
普段はどうやって指定しているのかを聞くのも怖いな

292Name_Not_Found :04/01/05 11:04 ID:BTT/TPeg
CSSでlist-style-imageを使って箇条書きのマークを
自分でペイントで作ったgif画像にしようと思ったらちゃんと表示されませんでした(普通の黒丸になる)。
ところが、誰か他の人が作ったgif画像を指定したらちゃんと表示されました。
なぜでしょうか???

293Name_Not_Found :04/01/05 11:13 ID:???
それはCSSの問題か・・・

294Name_Not_Found :04/01/05 11:13 ID:???
>>292 パス(URL)を間違へてゐませんか。

295Name_Not_Found :04/01/05 11:21 ID:???
>>289
何が、どう変なのか。
報告たのみます。↓
 CSS/DHTMLバグ辞典スレッド 第3版
 http://pc2.2ch.net/test/read.cgi/hp/1050844510/l50

296Name_Not_Found :04/01/05 11:34 ID:???
>>290 table, th, td {font-size:100%;}

297Name_Not_Found :04/01/05 13:07 ID:FQqSPchs
>>293自分もそう思いましたが今度は他のページでは正しく表示されていた画像を使ったら
やっぱり表示されなかったのです。
>>294URLはあっています。
なぜ?
ちなみにCSSは別ファイルにしてあって
ul {
list-style-image: url(list.gif)
}
list.gifはhtmlと同じディレクトリにあります。

298Name_Not_Found :04/01/05 13:14 ID:???
>>297
やはり問題はパスにあったか。自分で気づいてほしかったね。
>なお,CSS の外部スタイルシートにおける基準URIは,
>“ソース文書の URI” ではなく “外部スタイルシートの URI” です。
http://hp.vector.co.jp/authors/VA022006/css/data.html#uri


299Name_Not_Found :04/01/05 14:10 ID:???
もっと単純な部分でセミコロンが無いとかじゃね?

300Name_Not_Found :04/01/05 15:07 ID:???
おい藻前ら!厨な質問だがCSSを外部ファイルで管理していて@ルールを記述してない香具師はいるかい?
文字コードを合わせててもやっぱ明示的に@charsetで指定した方がブラウザに優しいの?
教えて偉い人(・∀・)

301Name_Not_Found :04/01/05 15:21 ID:???
>>300よ、なぜ>>4の解説サイトを読まないのか。
 文字コード宣言は行いましょう(CSS)
 http://www.mozilla.gr.jp/standards/webtips0023.html#c1

302300 :04/01/05 15:30 ID:???
>>301
今までHTMLと外部CSSの文字コードをShift JISにしていて特に問題なかったし
いちいち@ルールを追加するのが面倒臭かったのもあるが、やっぱ追加した方が
いいのね。サンクスコ

303Name_Not_Found :04/01/05 20:39 ID:???
286 >>287
そうっす。

>>289
> a:link imgにvertical-align:bottom;とでも指定すれば良いような。
> テキストのline-hightよりimgがでかけりゃ赤い部分は隠れるはず。

Mozillaでいけました。Safariはだめっす。IEは論外な状態です。

304Name_Not_Found :04/01/05 21:16 ID:HzaXKBc2
可能か不可能なのか解らないので質問させて頂きます。
http://www.geocities.co.jp/Playtown-Domino/4598/HTML_11.html←ここのページ
にあるようなテーブル内のスクロールなのですが
これの応用でEXCELの枠固定みたいなことは出来ないのでしょうか?
(行、列のヘッダ部を固定)

305Name_Not_Found :04/01/05 21:32 ID:???
>>304
IEオナニーで頑張って


306Name_Not_Found :04/01/05 23:03 ID:???
>>303
なんだIEってMacIEなのか。IE6ならちゃんと表示されるもの。
最初からOSとバージョンを明示してほしいね。

まあMacIEのバグならバグで報告しておいておくれ。
 CSS/DHTMLバグ辞典スレッド 第3版
 http://pc2.2ch.net/test/read.cgi/hp/1050844510/l50

307Name_Not_Found :04/01/06 01:56 ID:???
303 >>306
> なんだIEってMacIEなのか。IE6ならちゃんと表示されるもの。
> 最初からOSとバージョンを明示してほしいね。

スマソ。こちらマカーOSX 10.2.6 でWinについてはわからないっす。

>289の方法で、画像の下のhoverの赤は、
Mozilla 1.2.1では、消える。
Safari 1.0(v85)、Opera 6.0で消えない。
IE 5.2では画像の下の赤が消えない上に、文字が緑になり文字背景の赤が画像の高さに沿って上に延びます。かなり変です。


308Name_Not_Found :04/01/06 05:11 ID:???
>307の補足。
vertical-align:bottom;を、
a:link img、a:visited img、a:hover img、a:active img、全てに付けてみた。
そしたら、Mozilla 1.2.1、Safari 1.0(v85)、IE 5.2では、画像の下のhoverの赤が消えた。
Opera 6.0で消えない。

309Name_Not_Found :04/01/06 05:18 ID:???
あ、、、a:link imgに付けるだけで>308と同じですね。

そして今更、>289を読み間違えてたことに気付いた。




   _| ̄|○




310遅レスながら290 :04/01/06 10:06 ID:???
>>296
ありがとうございます。できました。

311Name_Not_Found :04/01/06 10:29 ID:rPfZ52To
>>293
>>294
>>298
>>299
やっぱりURLが間違ってました
自信ありげに「URLはあってる」なんて言ってすみません。
ありがとうございました。

312Name_Not_Found :04/01/06 15:55 ID:???
>>165
何か今更ですが、名前空間付きセレクタは
CSS3 モジュールの1つ "Selectors" の 6.1.1

Selectors - 6.1.1 Type selectors and Namespaces
http://www.w3.org/TR/2001/CR-css3-selectors-20011113/#typenmsp

辺りで提案されています。まだ勧告候補(Candidate Recommendation)だけど。

313Name_Not_Found :04/01/06 18:15 ID:???
FAQのA3(>>6)の参照ページが移転した(させられた)みたいだ。
 overflow プロパティは擬似フレームも作成できる
 http://www2.u-netsurf.ne.jp/~alt/tips/overflow.html
 http://www2.u-netsurf.ne.jp/~alt/files/frame.html

経緯を知ると、XREAもinfoseek isweb もひどいプロバイダだと思った。
>誰かが不利益だと言いさえすれば内容如何に関わらず削除される
批判の自由などてんで考慮してないのだ。
cf. http://www.google.co.jp/search?sourceid=navclient&hl=ja&q=cache:http%3A%2F%2Fmar0%2Ehp%2Einfoseek%2Eco%2Ejp%2F

314Name_Not_Found :04/01/06 18:34 ID:???
にしても、一番ひどいのは「西久保希光」って人か。
プロバイダに告げ口してまで自分への批判を封じたいものかね。
それを鵜呑みにしてとにかく出てけってXREAも情けなや。
http://www.google.co.jp/search?sourceid=navclient&hl=ja&q=cache:http%3A%2F%2Fthat%2E2ch%2Enet%2Ftest%2Fread%2Ecgi%2Fnanmin%2F1071246734%2F

315Name_Not_Found :04/01/06 21:35 ID:???
批判を批判するのも自由、って言うか、お前らウザイ。xreaスレから出てくるな

316Name_Not_Found :04/01/07 00:27 ID:???
xreaスレってどこ? あと、批判の批判ももちろん自由だが、批判を封じるのはよくない。

317Name_Not_Found :04/01/07 02:18 ID:???
あー粘着ヴァカが住み着いちゃった

318Name_Not_Found :04/01/07 02:44 ID:???
こちらへ。
 CSSコミュニティの功罪を懷かしむスレ 16th
  http://etc.2ch.net/test/read.cgi/nanmin/1071246734/l50

319Name_Not_Found :04/01/07 11:32 ID:tH6uSX2A
http://web2ch.s31.xrea.com:8080/?plugin=attach&pcmd=open&file=oshiete.jpg&refer=Uploader
↑のように、cssを使って正しく配列するにはどうしたらいいのでしょうか?
HTMLならテーブルを使って簡単にできるんですが・・・

320Name_Not_Found :04/01/07 11:42 ID:???
div {float :left;}
div#none {clear : left;}

<body>

<h1>aaaa</h1>

<div>bbb</div>
<div>ccc</div>
<div>ddd</div>

<div id="none">eee</div>

</body>

激しく適当だがこれで十分だろ。
あとはmarginとかやるよろし。

321Name_Not_Found :04/01/07 11:51 ID:tH6uSX2A
できたあああぁぁぁ
ありがとうございました

322Name_Not_Found :04/01/07 12:01 ID:???
>>320-321
駄目! floatさせる要素にはwidth指定が必須!
MacIEとかで表示が崩れるよ。
FAQにもあるんだから、見てよね。

323Name_Not_Found :04/01/07 15:53 ID:???
あー、素で忘れてた
吊ってくる

324Name_Not_Found :04/01/07 22:06 ID:z3dcz5XN
指定した場所だけをCSSを無効にしたいのですが、どのようにすればいいでしょうか?

325Name_Not_Found :04/01/07 22:58 ID:???
>>324
そこだけクラス名与えてやって、そのクラスだけ「デフォのスタイル」を記述してやったらどうかね?

326324 :04/01/07 23:10 ID:???
>>325
初心者なんで、おっしゃってることを理解するのが難しいですが、そのヒントを元にネットで答えを探してみます。
ありがとうございました。

327Name_Not_Found :04/01/07 23:38 ID:???
>>312
ありがとうございました。

328Name_Not_Found :04/01/07 23:39 ID:???
>>326
こんな感じ。

em{
font-size : 3em;
font-weight : normal;
}
.foo{
font-size : 1em;
font-weight : bold;
}

em要素は3emで表示。でも、クラス名fooのem要素は太字でレンダリング、みたいな。

329Name_Not_Found :04/01/07 23:58 ID:???
>>326
id と class ぐらいはわからないの?
解らないのなら基本的なことを勉強すべし

330324 :04/01/08 00:14 ID:???
>>328
参考になります。

スタイルシートの基礎を勉強してきます。。
ありがとうございました。

331324 :04/01/08 00:36 ID:???
あと、一つだけ教えてください。
ttp://www.interq.or.jp/www1/da4393/begin/stkozo_5.html
↑ここにある二番目のHTML文書をメモ帳にコピーしてHTMLで保存してから開いても
どうもうまくいかないのです・・
どうしたらいいでしょうか・・

332Name_Not_Found :04/01/08 00:41 ID:???
>>331
全角スペースを全部消せ。

333Name_Not_Found :04/01/08 00:42 ID:???
>>324
全角スペースで字下げしてます。

334324 :04/01/08 00:53 ID:???
助かりました。

335289 :04/01/08 01:32 ID:???
今更だが、補足。

WindowsのIE5.5/6(標準/互換)にて確認。
vertical-align:bottomを行で一番heightが高い要素に指定すると、
vertical-align:topを指定したようなレイアウトになってしまう。
詳細はバグ辞典スレに報告しとく。

>>307の問題(文字背景が画像の高さまで延びる)については、どうも
規格解釈の範囲内のような気もする。
http://www.y-adagio.com/public/standards/tr_css2/visudet.html#q22
での"リーディング"が行内ボックスの中と外どちらに挿入されるか
明確には定められてないみたいだし…

…って、原文を確認したら
> User agents center glyphs vertically in an inline box,
> adding half-leading on the top and bottom.
か?これ"挿入"より素直に"追加"と訳した方が適切な気がするなぁ。

だとすると、行内ボックスが拡張されるIEの実装は駄目っぽいかも。


336289 :04/01/08 03:02 ID:???
補足の補足。

>>280の例に限った話なら、bottomの代わりにtext-bottomで対応可能。

337Name_Not_Found :04/01/08 22:59 ID:205CjgYs
1箇所だけaのhoverスタイルを変更したいのですが、どうしたら良いでしょうか?

338Name_Not_Found :04/01/08 23:02 ID:???
>>337
class id セレクタ

339Name_Not_Found :04/01/08 23:25 ID:???
>>337 とりあへず訊く前に>>324-330を讀んで貰ひたかった。

340337 :04/01/08 23:43 ID:205CjgYs
>>339
ごめんなさい。

341Name_Not_Found :04/01/09 00:26 ID:???
>>340
a#mage:hover{hogehoge}

-----------

<a href="hoge" id="mage">変えたいところ</a>

342Name_Not_Found :04/01/09 05:50 ID:???
何で341みたいなんが出てくるのかが解らない

343Name_Not_Found :04/01/09 08:54 ID:uu1TycfK
すみません質問なんですけどよろしいですか?

http://internet.watch.impress.co.jp/
例えばこういうページでリンクの色を変えて表示するために

a:link{color:#0000FF;}
a:visited{color:#800080;}
a:hover{color:#FF0000;}

ってやったんですけど、

左側の
■ ニュース
■ 特別企画
■ イベントレポート
■ リンク集
■ ダイジェストニュース
とかの色が変わんないんですよ。

それでちょっと調べてみたんですけど、タグに依存しないクラスっていうのになっていると思うんですが、
それをどうにかして上のが適応するようにできないですか?

344Name_Not_Found :04/01/09 08:57 ID:???
言いたいことはよく解らないが、>>1読んでこい

345Name_Not_Found :04/01/09 09:03 ID:uu1TycfK
ちなみにDonutpでCSS使ってます。

346Name_Not_Found :04/01/09 09:05 ID:uu1TycfK
<STYLE type="text/css">
<!--
.indextext{ font-size: 9pt}
A { TEXT-DECORATION: none }
A:hover { TEXT-DECORATION: underline }
--></STYLE>

スタイルシートに関してど素人なんですが
たぶんこの部分が原因なんだろうなぁという所まではいったんですが。


347Name_Not_Found :04/01/09 09:10 ID:???
なんとなく事情は解ったんだが、とにかくお前が今一体何をしようとしているかを
客観的に説明してくれ
ユーザースタイルシートがキーワードだ

348Name_Not_Found :04/01/09 09:21 ID:uu1TycfK
http://internet.watch.impress.co.jp/
このページをユーザースタイルシートで

a:link{color:#0000FF;}
a:visited{color:#800080;}
a:hover{color:#FF0000;}

にしたんですけど。

■ ニュース
■ 特別企画
■ イベントレポート
■ リンク集
■ ダイジェストニュース
■ 〜2003年7月記事一覧

<!-- 今月のバックナンバー -->
<TR>
<TD valign="top" width="16" class="text"><FONT color="#000000" size="2" class="indextext">■</FONT></TD>
<TD class="text" width="144"><a href="http://internet.watch.impress.co.jp/cda/news_backnumber/"><font color="#000000" size="2" class="indextext">ニュース</FONT></A></TD>
</TR>
<!-- /今月のバックナンバー -->

この部分が変わらないのでこの部分も変わるようにしたいということです。



349Name_Not_Found :04/01/09 09:29 ID:???
無理です
classじゃなくて、<font>のせいです
文句はこんな不細工なhtml書いた本人に言ってください

350Name_Not_Found :04/01/09 09:33 ID:uu1TycfK
<font color="#000000" size="2" class="indextext">ニュース</FONT>

この部分のせいで、
これにユーザースタイルシートを適応させる方法は無いということですか?

351Name_Not_Found :04/01/09 09:40 ID:???
>348
あーと、擬似クラスと"{"の間に一つ以上の空白文字が無いと認識しないIE様のバグがあるので、
a:link {〜〜} 以下同
のようにするとよろしかろ。

んで、
font { color: inherit; font-size: inherit; }
で解決しないかな。試してないから判らんけど。

352Name_Not_Found :04/01/09 09:43 ID:???
>>351
解決するわけ無いだろ

353Name_Not_Found :04/01/09 09:48 ID:???
とりあえず説明すると
ユーザースタイルシートで<a>の色を変更したが、直後に<font>で指定した色を上塗りされている
んだよ

font.indextext{color:#0000FF;}
を追加しとけ、擬似クラスは効かんが。

354Name_Not_Found :04/01/09 09:53 ID:uu1TycfK
>>353
それだと訪問済みのリンクでも#0000FFこの色のままですよね?



355Name_Not_Found :04/01/09 09:58 ID:???
だから擬似クラス効かんと言うただろが
解らん言葉があったらちょっとは調べろ

最終的にはそのサイト全部ローカルに保存してソース書き直したら
思い通りの表示がされるようになるわ
もしくは管理人にメールでも出せ、もっとまともなHTML書けってな

356Name_Not_Found :04/01/09 10:00 ID:uu1TycfK
ども

357Name_Not_Found :04/01/09 23:19 ID:CjU6QCnH
ttp://www.ah.wakwak.com/~daobian/css/css_21.html

↑で説明されている「ボックスが重なって表示〜」という所なんですが
IEだと重なって表示されるんですが、ネスケだと表示されません。
ネスケだと例のように画像を重ねるような事はできないのでしょうか?

ちなみに上記サイトは去年の年末に閉鎖されて、放置状態でした。

358Name_Not_Found :04/01/09 23:24 ID:???
>>357
z-indexにマイナスの値を指定してるとかはないかね

359Name_Not_Found :04/01/09 23:28 ID:???
>>357
>ネスケ
見たところ火の鳥ではIEと同じに表示されているが?
ネスケってN4のことじゃないよね。まさか。

360Name_Not_Found :04/01/09 23:38 ID:???
と言うか、また人のサイトの話か

361357 :04/01/10 00:08 ID:xoFjF0/W
>>359
Netscape 7.1で、インストール後のデフォ設定で確認しましたが
widthとpadding、top、leftが無視された状態で表示されました。


362359 :04/01/10 00:34 ID:???
あ、ごめん。画像と言うのを勘違いしてた。確かに火の鳥では表示が違うわな。


363359 :04/01/10 00:47 ID:???
どうやら、ソースを見るとCSS部分に全角スペーつが紛れ込んでるね。
それを削除するとちゃんと重なって表示されるよ。(微妙な違いはあるけど)
MozillaやOperaはその辺厳密だから。
結局は作者のミスということで。

364359 :04/01/10 00:48 ID:???
>全角スペーつが→全角スペースが

_| ̄|○

365357 :04/01/10 00:54 ID:xoFjF0/W
>>363-364
なるほど! これで安眠できます。
ありがとう。

366Name_Not_Found :04/01/10 01:35 ID:???
きょうは、CSSでレイアウトの調整をやってて、もうCSSのバカ!と叫びたくなりました。
テーブルに流れちゃいそうです。

あと、質問で恐縮ですが、
CSSとスタイルって使い分けて使う言葉なんでしょうか?

アホな質問だったらごめんなさい。

367Name_Not_Found :04/01/10 01:38 ID:???
>>366
CSS以前にHTMLが馬鹿なんじゃないか?

368Name_Not_Found :04/01/10 01:43 ID:Y+6UwXZJ
テーブルのセルとセルの間隔をピタッとやりたいのですが、スタイルシートですか?

369Name_Not_Found :04/01/10 01:46 ID:F7F8NJzc




となっているブロック要素を
1 2
3 4
としたいのですが、どうすればいいのでしょうか?


370Name_Not_Found :04/01/10 01:49 ID:???
>>369
フロートで段組だな。
1,2,3,4にfloat:left;
3にclear:left;
幅の指定忘れんなよ

371369 :04/01/10 02:13 ID:???
>>370
4が右にいかなくて悩んでました(つд`)
モーレツに感謝します!
ありがd

372Name_Not_Found :04/01/10 09:58 ID:???
文章中のアルファベットにのみ違うフォントを設定したいんだけど、
CSSで可能ですか?アルファベットの部分をspanとかで囲わないと無理?


373Name_Not_Found :04/01/10 10:09 ID:???
>>372

font-family:英語フォント名,'日本語フォント名';

でいけると思う。
ちなみに日本語のフォント名は''で囲まないといけません。

374Name_Not_Found :04/01/10 10:15 ID:???
>>373
成る程。有り難う御座いました。


375Name_Not_Found :04/01/10 10:25 ID:???
それじゃぁ、アルファベットにだけMS明朝を指定したい時はどうするんだっ!
って言おうとしたけど質問者が納得したようなのでそれで

376Name_Not_Found :04/01/10 10:28 ID:???
>>375
確かに。日本語も英語も用意されている場合には、
どうしたら良いんだろうか。
まあ、どうしようもなさそうだが。


377Name_Not_Found :04/01/10 10:54 ID:???
>>372
lang[en]というセレクタがあるぜ。
IEが実装してないけどな。

378Name_Not_Found :04/01/10 10:59 ID:???
>377
それって例えば<p lang="en"></p>の範囲でしか効かないんじゃ?
<p>日本語とEnglishの混じった文章</p>で指定しても意図通りに効くの?

379Name_Not_Found :04/01/10 11:06 ID:???
>>378
正しい構文を書いてたら必然的に
<p>日本語と<span lang="en">English</span>の混じった文章</p>
になるだろ。おまいは日本語とEnglishの混じった文章なのに言語指定していないのか?
<html lang="ja">とやってれば、Englishという文字列すら「日本語です」と宣言してることになるんだぞ。

380Name_Not_Found :04/01/10 11:11 ID:???
>>378
<p lang="ja">日本語<span lang="en">English</span>日本語</p>

381Name_Not_Found :04/01/10 11:18 ID:???
>>380
(´-`).。oO(html要素のlang指定はどうなってるんだろう……

382Name_Not_Found :04/01/10 11:22 ID:???
英語どうこうではなくて、アルファベットの話だと思うんだが。


383379 :04/01/10 11:26 ID:???
>>382
なるほど。薄々そんな気がしてきてたところだったんだ。

>>378
ごめん。lang指定をする必要がない通常の英字文字列には適応されない。
なんでつっかかる書き方しちゃったんだろ。ほんとごめんね。

384Name_Not_Found :04/01/10 11:55 ID:???
 日本人って「アルファベット=ラテン文字」と思ってる香具師が多いね。
アルファベットってのは広義には、ひとつひとつの文字が原則としてひとつの音素をあらわす表音文字の体系の総称のことを指すんだけど。例えばヘブライ文字はラテン文字ではないけれど、アルファベットであるわけだが。
 「アルファベット=英語で用いる文字」と思ってる香具師も多いだろうな。

385Name_Not_Found :04/01/10 11:58 ID:???

>>384

 で ?



386378 :04/01/10 11:59 ID:???
いや漏れもEnglishじゃなくてAlphabetと書けば良かったなと思ってたゴメン(´Д`;)
答えありがとう

多少面倒でもemなりで括る方が良いかな。
良く考えたらフォントを変えたい→注目を引きたいって事だし

387Name_Not_Found :04/01/10 12:23 ID:???
> 良く考えたらフォントを変えたい→注目を引きたいって事だし

誰もそんなこと言ってないけど。


388Name_Not_Found :04/01/10 12:27 ID:???
>>387
言ってなくてもそういうことになるだろうなぁ。「英語だけ違うフォントに」は強調でしょ。
だったら、
em lang[en]{
font-weight : normal;
font-family : ○○;
}
といった感じが適切かな。

389Name_Not_Found :04/01/10 12:29 ID:???
>>384
スレ違いなので FYI ということで。
alphabet という英単語には

>>ひとつひとつの文字が原則としてひとつの音素をあらわす表音文字の体系の総称

という意味があるが日本語の「アルファベット」はそうではない。

http://jiten.www.infoseek.co.jp/Kokugo?qt=%E3%82%A2%E3%83%AB%E3%83%95%E3%82%A1%E3%83%99%E3%83%83%E3%83%88&sm=1&pg=result_k.html&col=KO

390Name_Not_Found :04/01/10 12:44 ID:???
>>388

MS Word のように、スタイルに日本語フォントと英字フォントを
指定できて、スタイルを設定した範囲に自動で適用されるような
イメージもあるかもしれない。

それだと強調ではなく文章の見栄え(≒視認性)の問題。

391390 :04/01/10 12:47 ID:???
補足。

日本語フォントと英字フォント

 →日本語用フォントと英字用フォント

392372 :04/01/10 12:54 ID:???
>>388
いやいや、>>387 さんや、特に >>390 さんの言う様に、
別に強調したかった訳では在りません(w


393Name_Not_Found :04/01/10 13:02 ID:???
> 言ってなくてもそういうことになるだろうなぁ。
> 「英語だけ違うフォントに」は強調でしょ。

>>388はとんだ道化師だな。


394Name_Not_Found :04/01/10 13:13 ID:???
>>388は早とちりマン

395Name_Not_Found :04/01/10 13:29 ID:???
>>381
(´-`).。oO(日本語と英語しか言語を知らないのかな……

396Name_Not_Found :04/01/10 13:36 ID:???
>>373
>font-family:英語フォント名,'日本語フォント名';
>
>でいけると思う。

いけません。
http://cssbug.at.infoseek.co.jp/detail/winie/b033.html
http://cssbug.at.infoseek.co.jp/detail/macie/b032.html

397378=386 :04/01/10 13:39 ID:???
ああいや、注目を引きたいってのは漏れの場合の話ね
何度も舌足らずで混乱させてしまって申し訳無い(´Д`;)
日光浴でもしてきまつ…

398Name_Not_Found :04/01/10 13:54 ID:???
>>396
バグだろ。なら無視だ無視。
IEのことなんかいちいち気にせんで良し。


399Name_Not_Found :04/01/10 14:01 ID:???
駄洒落カヨ


400Name_Not_Found :04/01/10 14:18 ID:???
@charsetについて質問です
@charset "文字コード"
の部分の文字コード、Shift_JISやUTF-8あたりを入れているのを見かけるので
規格では、それが正しいのかCSS2仕様書の邦訳をたよりに探したところ
http://216.239.53.104/search?q=cache:Zh9rnmvPc9cJ:www.f4.dion.ne.jp/~adem/rfc/rfc3232.pdf+RFC+1700&hl=ja&lr=lang_ja&ie=UTF-8
という文書を見つけました
「RFC 1700を公的に廃止し」とありますが
@charsetでの文字指定は意味があるのでしょうか?
あとは、指定した場合、各ブラウザではどの程度有効なのか
日本語関連の文字コードのリスト等、あれば何方かご存じありませんでしょうか?

401Name_Not_Found :04/01/10 14:53 ID:???
>>400
>>@charsetでの文字指定は意味があるのでしょうか?
ttp://www.mozilla.gr.jp/standards/webtips0023.html

402Name_Not_Found :04/01/10 14:54 ID:???
>395
違う言語があるからこそ、「何語使ってる人を対象にレクチャーしてんの?」と言ってるんだよ。
存在してないと思ってたらhtml要素のlang属性を気にしたりすまい。

もしかして、「どっちかが重複してる」と突っ込んだと思われてるのかもしれないけれど、それなら納得だな。


>390
>>>388
>
> MS Word のように、スタイルに日本語フォントと英字フォントを
> 指定できて、スタイルを設定した範囲に自動で適用されるような
> イメージもあるかもしれない。
>
> それだと強調ではなく文章の見栄え(≒視認性)の問題。

>392
> 別に強調したかった訳では在りません(w
 強調の意味を調べてから発言してね。

>393
> >>388はとんだ道化師だな。
 気が早いね。白痴か?

403Name_Not_Found :04/01/10 14:55 ID:???
>>400
>@charset "文字コード" の部分の文字コード、Shift_JISやUTF-8あたりを入れているのを見かけるので規格では、それが正しいのか

IANA に登録された符号化方法の名称でなければならないと仕様書に書いてある。
http://www.swlab.csce.kyushu-u.ac.jp/man/rec-css2/syndata.html#q23
符号化方法の一覧は [CHARSETS] を参照せよ。
http://www.iana.org/assignments/character-sets

>日本語関連の文字コードのリスト
主に Shift_JIS, EUC-JP, ISO-2022-JP あたりでは。
これらは正式に IANA に登録されている符号化方法。

>@charsetでの文字指定は意味があるのでしょうか?
>あとは、指定した場合、各ブラウザではどの程度有効なのか

なぜ >>3-4 を読まないのだ。

>「RFC 1700を公的に廃止し」とありますが
はて? @charset や文字符号化方法とは無関係なのだが。


404Name_Not_Found :04/01/10 15:25 ID:???
>>402
鼻息荒いマン

405Name_Not_Found :04/01/10 15:30 ID:???
>>404
白痴マン

406Name_Not_Found :04/01/10 15:31 ID:???
肉まん


407Name_Not_Found :04/01/10 15:33 ID:???
豚まんだろ

408Name_Not_Found :04/01/10 15:35 ID:???
>>402=>>405
まあ頑張って。


409Name_Not_Found :04/01/10 15:36 ID:???
別に何まんでもいいよ(w

410Name_Not_Found :04/01/10 15:37 ID:???
一言しか書けない人は多分なんにも理解できてないから「多数に見える方」に賛同してるだけだろうな。

411Name_Not_Found :04/01/10 15:40 ID:???
ふふ


412400 :04/01/10 16:47 ID:???
>>403
ども、調べが足りませんでしたね…スイマセン
参考リンクの欄の解説にSTD2やRFC 1700等の言葉があったので、見つけてはGoogleをしていましたが
探し方悪かったですね


413Name_Not_Found :04/01/10 16:51 ID:???
h2:before{
content:"文字";
}
等で要素の前に、装飾様に文字が入れられますが
content内に
http://pielin.hp.infoseek.co.jp/index.html (ネスケだと正常に表示されません)
であるようなWingdingsフォントで表される特殊記号を使いたいのですが、どうすればよいでしょうか?


414Name_Not_Found :04/01/10 17:19 ID:???
Wingdingsなんて使っちゃだめ
Windows以外の環境の事も考えろよ。

415Name_Not_Found :04/01/10 17:33 ID:???
>>413
>であるようなWingdingsフォントで表される特殊記号を使いたいのですが、どうすればよいでしょうか?

フォント依存になる可能性があるので本来は控えた方がよろし。
ttp://www.mozilla.gr.jp/standards/webtips0009.html

#いい加減>>4-8位見ろよ

416Name_Not_Found :04/01/10 17:38 ID:???
>>413
生成内容はurl()関数で画像を埋め込むこともできます。


417Name_Not_Found :04/01/10 17:40 ID:???
>413
そのページ、ネスケで正常に表示されないとか言ってくるけど
ネスケは正しくてIEが間違ってるんだけどなぁ

418Name_Not_Found :04/01/10 18:53 ID:57mcAI2b
>>403晒しage

419Name_Not_Found :04/01/10 19:05 ID:???
>>417
そうそう…ネスケ=○ OP=○ IE=逝ってよし
(ことcontentに関しては)
何とかせいよゲイシ

420Name_Not_Found :04/01/10 20:31 ID:???
>>419
激しく同意。

421413 :04/01/10 20:44 ID:???
ご教授ありがとうございます
実際、まぁ、そうなのですが…
画像を使った場合、色とか変更かけにくいのもそうですが
何より拡大縮小の融通が利かないので、ユーザー側の文字サイズの変更に付いていけません
SVGとか使えればよいのでしょうが、これもMozillaの対応を暫く待つ状態なので
今やるなら記号文字だと感じているのです

HTMLに直接書き込む人は、装飾用にガンガン特殊記号を使っているわけで、せめて
h2 {
content:"&hearts";
}
とかするとハートマークが出ないかな…とかやってみれば、ガーンな結末になってしまうわけで…
気持ちだけでも分かっていただければ…


422413 :04/01/10 20:47 ID:???
あ、記号が変換表示されて、ハートマーク出ていますが
content"&hearts;"
です、2chでも使えるのですね、新発見でちょっと感動です


423Name_Not_Found :04/01/10 21:29 ID:???
ハートマークなら使えるぞ。

h2:before {
  content: "\2665";
}


424413 :04/01/10 22:06 ID:???
>>423
もしかしてコレは…、私のノータリンと言うことでファイナルアンサーでしょうか…
今、検証してみてちょっと感動しています
ありがとうございました
他にも使えるコード無いか漁ってきます

425Name_Not_Found :04/01/10 22:36 ID:hGiNNDcD
すみません質問です
dtにfloat:leftを設定してddを横に並べたりするとき、
dt{width:10em;}だったら、floatするddはmargin-left:10em;とか
付けなければいけないのでしょうか?marginをつけないと、floatするddが
dtの領域に食い込むのです。
┌───┰━┯━━━┓
│ dt  ┃ │ dd . ┃
└───┸━┷━━━┛
わかりづらいですがこんなことになってます。
IEではなりませんがmozillaでは食い込みます。これは回避できないでしょうか?
-----
<dl>
<dt style="float:left;width:5em;border:1px solid red;">aa</dt>
<dd style="width:5em;border:1px solid blue;">bb</dd>
</dl>

426Name_Not_Found :04/01/10 22:42 ID:???
>>424
・Unicodeにある文字はバックスラッシュ(円記号)を使うことで記述できます。
 参照 : http://hp.vector.co.jp/authors/VA022006/css/syntax.html#escaped-characters
 どんな記号が使えるかは文字コード表なんかを見て調べてみてください。
・Wingdingsにある記号はUnicodeに入ってないものが多く、
 Webでは使えない記号だらけです。

427Name_Not_Found :04/01/10 23:04 ID:???
>>425
食い込まないIEがおかしい。

428Name_Not_Found :04/01/10 23:08 ID:???
>>427
つまり、floatする要素にはmarginが必要ということでいいのでしょうか?

429Name_Not_Found :04/01/11 00:38 ID:???
>>428
そういうこと。むしろ食い込むようにレイアウトできるのがfloatの役割。


430Name_Not_Found :04/01/11 00:39 ID:???
>>425
http://homepage1.nifty.com/emk/moz/browsertest.html
上記リソースの「4. floatの解釈」を読め。IEのバグだ。

431Name_Not_Found :04/01/11 01:00 ID:???
>>429-430
わかりました、marginつけるようにします。
説明どうもありがとうございました。

432Name_Not_Found :04/01/11 01:57 ID:???
>>425
dtにclear : left;
ddにfloat : left;
を追加してやればいけるよ。

433Name_Not_Found :04/01/11 02:00 ID:???
なぜFAQを参照しないのか。

8 :Name_Not_Found :03/12/22 00:08 ID:???
Q9.dt・ddを横並びにしたいのですが。(会話文など)
A9.下記サイトを参照のこと。
「<dl> の整形」
 http://www.remus.dti.ne.jp/~a-satomi/nikki/2001/12b.html#d18n03

434432 :04/01/11 02:00 ID:???
あ、うそついちゃった。ごめん。

435432 :04/01/11 02:04 ID:???
ごめん。うそじゃなかった。
dd自体をfloartしてやることで、領域が干渉しあわないボックスが生成されるはず。

436Name_Not_Found :04/01/11 02:15 ID:???
なぜベストを尽くさないのか

437432 :04/01/11 02:30 ID:???
>>436
俺か?俺はベスト尽くしてるぜ?

438Name_Not_Found :04/01/11 02:33 ID:djWYaAuk
多分CSSだと思うので質問させてください。

http://www.macromedia.com/jp/

マクロメディアのサイトで、製品やカスタマーサービスにマウスを乗せると色が変わります。
画像ではないようなのですが、このようにするのはどうすればいいのでしょうか?

板違いだったらすみません。

よろしくお願いします。


439Name_Not_Found :04/01/11 02:37 ID:???
>>438の解説サイトで:hover疑似クラスについて学習しよう。

440Name_Not_Found :04/01/11 02:40 ID:???
>>4の解説サイト、ね。
http://msugai.fc2web.com/web/CSS/selector2.html#link-pseudo とか。

441Name_Not_Found :04/01/11 06:42 ID:???
>>438の、ね。

442Name_Not_Found :04/01/11 08:08 ID:s9tXhxwE
http://hail2u.net/index.html
このサイトのようにリスト表示の左の空間を
なくすにはどうすればよいのでしょうか?

443Name_Not_Found :04/01/11 08:12 ID:s9tXhxwE
あと<p></p>を利用した際
下に一定の空間ができるのも
調整できませんか?

444Name_Not_Found :04/01/11 08:45 ID:???
>>442
とりあえず1読んでから出直せ

445442 :04/01/11 09:37 ID:s9tXhxwE
リンク先読んでも解決できなかったのですが・・・・・

446Name_Not_Found :04/01/11 09:50 ID:???
じゃぁ産まれてきた事を後悔しながら味噌汁飲んで窒息死しろ

447442 :04/01/11 09:56 ID:s9tXhxwE
ちょっとぐらいヒントくれてもいいのに。
やっぱWEB関連は閉鎖的な人が多いよな。
友達できないぞ♪

448Name_Not_Found :04/01/11 09:58 ID:???
はいはい逆切れ厨は放置で

449442 :04/01/11 09:59 ID:s9tXhxwE
ヒントだけでもください。
おながいします。

450Name_Not_Found :04/01/11 09:59 ID:???
>>447
何をどう試して何がわからないか書かなきゃアドバイスしようもない。
そっけない返答がつくのは質問者側に問題がある場合がほとんど。

他人のせいにするのは簡単だが、それではいつまで経っても進歩がない。

451442 :04/01/11 10:02 ID:s9tXhxwE
あ、すいません。
質問の仕方が悪かったということですかよくわかりました。
すいません。

452Name_Not_Found :04/01/11 10:03 ID:???
>>451
分かったらもう当分来るなよ。


453Name_Not_Found :04/01/11 10:03 ID:???
良かったですね、じゃぁ次の質問どうぞ

454442 :04/01/11 10:06 ID:s9tXhxwE
<ul>
<li></li>
</ul>

このタグや定義リストを使用して表をすると

題名
  −−−−−−
  −−−−−−
  −−−−−−

このように必ずリスト部分の左側にスペース空くのですが
このスペースの幅をなくす、もしくは調整するには
どのような方法が適切なのでしょうか?

455442 :04/01/11 10:06 ID:s9tXhxwE
>>452
煽るだけならこのスレに必要ないですよ。

456Name_Not_Found :04/01/11 10:07 ID:???
>>454
自分で調べろ。


457Name_Not_Found :04/01/11 10:07 ID:???
>>454
1読んでから出直して来い

458Name_Not_Found :04/01/11 10:08 ID:???
まあ馬鹿な質問者もいらんがな・・・


459Name_Not_Found :04/01/11 10:08 ID:???
>>442
早く首を吊れよ。


460442 :04/01/11 10:11 ID:s9tXhxwE
余計な煽りはスレの浪費なのでやめてください。
荒らしとして報告しますよ?

461Name_Not_Found :04/01/11 10:12 ID:???
>>442は釣りだろ。


462Name_Not_Found :04/01/11 10:14 ID:???
釣りだな

463442 :04/01/11 10:14 ID:s9tXhxwE
釣りかどうかは質問にお答えいただければ
わかるはずです。

464442 :04/01/11 10:17 ID:s9tXhxwE

あ、もしかして定義ファイルを例として

dd{margin : 3px;}

という風にすればいいんでしょうか?

465Name_Not_Found :04/01/11 10:17 ID:???
一応質問に対する回答を書いていたんだが、
書き込んだ瞬間「釣れた」と言われたんじゃかなわないので
書き込むの止めました。


466Name_Not_Found :04/01/11 10:20 ID:???
釣れたw

467442 :04/01/11 10:20 ID:s9tXhxwE
釣れたとかしょうもないこと絶対いいません。
お願いします教えてください。

468Name_Not_Found :04/01/11 10:22 ID:???
じゃぁ次の質問どうぞ


469Name_Not_Found :04/01/11 10:24 ID:???
<ul>
<li></li>
</ul>

このタグや定義リストを使用して表をすると

題名
  −−−−−−
  −−−−−−
  −−−−−−

このように必ずリスト部分の左側にスペース空くのですが
このスペースの幅をなくす、もしくは調整するには
どのような方法が適切なのでしょうか?

470Over 10 Res &rlo;よんせまけ書 :04/01/11 10:29 ID:???
ID:s9tXhxwE >>442, 443, 445, 447, 449, 451, 454, 455, 460, 463, 464, 467
あなたは規定の書き込み数を超えて書き込みをしています。
もうこれ以上質問レスをしても答えることはありません。
どうしても解決したい問題であれば、>>4でリストやmargin、paddingなどを勉強してください

471442 :04/01/11 10:34 ID:s9tXhxwE
わかりました。
ありがとうございました。

472Name_Not_Found :04/01/11 10:38 ID:???
権威に弱いな

473Name_Not_Found :04/01/11 11:16 ID:???
皆さんhref属性のあるアンカーテキストの色は何色にしてますか?
今色々試してるんだけれど、閲覧者とって優しい色(読みやすい色)ってどんなのだろう?

色の選択って結構難しいのね

474Name_Not_Found :04/01/11 12:43 ID:???
迷ったらデフォルト。青に下線が一番わかりやすい。 >>473

475Name_Not_Found :04/01/11 12:48 ID:???
黒地に青いリンクとかは止めて欲しいけどな。

476Name_Not_Found :04/01/11 13:06 ID:???
>>473
未リンク色をリンク済み色より目立つようにしてる。
背景が白とかの場合は未リンクの文字色の方を濃くするとか。

あと下線は消さないでほしいな

477Name_Not_Found :04/01/11 13:27 ID:???
未リンク……? 「訪問済み(visited)」のことか。

478Name_Not_Found :04/01/11 13:28 ID:???
a:linkなのに未リンクとはこれ如何に。

479Name_Not_Found :04/01/11 13:51 ID:???
俺は下線消してる。

480Name_Not_Found :04/01/11 14:20 ID:???
それでリンクだって訪問者にもはっきりわかるの? >>479

481Name_Not_Found :04/01/11 14:28 ID:???
メニューとかの、明らかにリンクってところは、下線消すこともあるな。
文章中とかは消さないようにしてる。

482479 :04/01/11 14:34 ID:???
リンクの文字色は変えてる。リンク以外で文字色は変えていない。

まぁそれ以前に………訪問者ひとりもいないから……大丈夫さ。

483Name_Not_Found :04/01/11 16:20 ID:???
下線が消されてても、いざとなったらCSSOFFにすればわかるしな。

484Name_Not_Found :04/01/11 16:22 ID:???
>479
下線付いてないと、うっかりクリックしちゃったりしてウザいのでやめれ

>481
できる限り下線消すのはやめれ

485Name_Not_Found :04/01/11 17:06 ID:???
下線が嫌いな人はUAの機能で消すはず。
サイト作成者側がそこを変更するのは閲覧者にとっては
迷惑なことが多い。

486Name_Not_Found :04/01/11 17:17 ID:???
>>485
ユーザサイドスタイルシートとか使えばいいのにな。

487Name_Not_Found :04/01/11 17:30 ID:???
そのうちなんでもUAで(略って議論になりそうだな。

488Name_Not_Found :04/01/11 19:21 ID:???
ここはCSS質問スレであって、アクセッシビリティすれ出はありませんが何か?

489Name_Not_Found :04/01/11 21:08 ID:???
>>488
空手道場は倫理を教える場ではないが、「悪用しちゃダメ」と教えるぞ。
ここが無責任に教えっぱなしのスレだと思い込んでるお前が教えっぱなしにしてれば済む話だ。

490Name_Not_Found :04/01/11 21:35 ID:???
ほんま例え話好きだよな

491Name_Not_Found :04/01/11 21:40 ID:???
>>490
バカが多いからな。仕方ない。

492Name_Not_Found :04/01/11 21:42 ID:???
誰か質問しろよ

493Name_Not_Found :04/01/11 21:44 ID:???
>>491
ほんま多いよな

494Name_Not_Found :04/01/11 21:53 ID:???
>>492
お前が質問すればいいだろ

495Name_Not_Found :04/01/11 21:56 ID:???
>>494
なんだとコラ
お前は黙ってろよ

496Name_Not_Found :04/01/11 21:57 ID:???
いがみあいはやめたまえ。まったく…。

497Name_Not_Found :04/01/11 21:58 ID:???
>>492
>>469

498Name_Not_Found :04/01/11 22:32 ID:???
CSSでフレームの境界線消すことはできますか?

499Name_Not_Found :04/01/11 22:39 ID:???
CSSを使わずとも出来る事を、何故CSSでやろうとする?

500Name_Not_Found :04/01/11 22:41 ID:???
フレームやめろというレスが付く予感↓

501Name_Not_Found :04/01/11 22:48 ID:???
html4.01でやろうとすると↓で怒られるんですよ。

http://hanoi.softvision.co.jp/htmllint/htmllint.html

502Name_Not_Found :04/01/11 23:03 ID:???
ttp://openlab.ring.gr.jp/k16/htmllint/htmllint.html


503Name_Not_Found :04/01/11 23:06 ID:???
>>500
フレームセットDTD使ってたら問題ないだろ。
無知なくせに発言するなよ鬱陶しい。

504Name_Not_Found :04/01/11 23:07 ID:???
>>501
何をやろうとして怒られたの?

505500 :04/01/11 23:19 ID:???
>>503
framesetDTD宣言した上でフレーム使ってますが何か?

506Name_Not_Found :04/01/11 23:22 ID:s9tXhxwE
>>504
<frameset cols="*,*" frameborder="0" border="0">
で枠線消したのですが4.01の形式では使用は薦められません
といわれますた。

507Name_Not_Found :04/01/11 23:22 ID:???
>>505
だから問題ない、っつってんの。白痴か?

508Name_Not_Found :04/01/11 23:23 ID:???
>>506
lintの結果をまんまコピペして。該当部分ね。

509Name_Not_Found :04/01/11 23:37 ID:???
そんなにカリカリするなよ

510Name_Not_Found :04/01/11 23:40 ID:???
>>506
どちらの属性も独自拡張扱いだから弾かれるのは仕方ないね。

>>507
なに怒ってんだ?


511Name_Not_Found :04/01/11 23:41 ID:???
<frameset cols="230,*" title="パチうぇぶの分割比率">

<frame src="menu.html" name="menu" frameborder="0" title="パチうぇぶメニューページ">
<frame src="main.html" name="main" title="パチうぇぶのメインページ">

<noframes>


あ、frameborderのみの指定にすればいけました。
参考書にはframeborderとborder両方指定するように
とかいてたんですがframeborderの指定のみで大丈夫なんですかね?


512511 :04/01/11 23:44 ID:???
でもやっぱり境界線消えないですわ・・・・・・・

513Name_Not_Found :04/01/11 23:47 ID:???
>>511
質問するよりやってみた方が早いだろ?

514511 :04/01/11 23:57 ID:???
>>513
そうですね。
でも、結果的にボーダー消えてないので・・・・・・・

515511 :04/01/12 00:01 ID:UCJzdsB5
・・・・・すいません!!!
入れる場所間違えてました、消えました。
参考書のborder="0"も入れろというのは結局
なんだったのでしょうか?・・・・・・
意味ないのかな?

516Name_Not_Found :04/01/12 00:08 ID:???
フレーム使ってないのであやふやな記憶ですまんが、
NNとIEでは境界線を消すのに有効な属性が異なると思ったよ。
borderはNNのみで有効な属性かと。(IEで見てもわからない)

なんにしてもCSSじゃないから厳密にはスレ違いだわな(オレは構わんけど)

517442 :04/01/12 00:15 ID:???
すいませんでした。
勘違い甚だしいですね。
以後気をつけます。

>>516
あ〜、そうなのですか。
それをしちゃうと採点ソフトに指摘されちゃうということは
どの道つかえないですよね。
ありがとうございました。

518Name_Not_Found :04/01/12 00:41 ID:???
>>516
禿胴
フレームなどの表示はブラウザに依存する「ブラウザの仕様」です。

519Name_Not_Found :04/01/12 00:53 ID:???
>>518
そういう問題じゃなくて、「HTMLの問題」だから「CSSのスレ」ではスレ違い、って話だろ。

520Name_Not_Found :04/01/12 01:00 ID:???
HTMLとかCSSの本ってロクな本ないからあまり信用しない方がいいぞ

521Name_Not_Found :04/01/12 01:05 ID:???
492 名前:Name_Not_Found[sage] 投稿日:04/01/11 21:42 ID:???
誰か質問しろよ

494 名前:Name_Not_Found[sage] 投稿日:04/01/11 21:53 ID:???
>>492
お前が質問すればいいだろ

495 名前:Name_Not_Found[sage] 投稿日:04/01/11 21:56 ID:???
>>494
なんだとコラ
お前は黙ってろよ



お前ら、仲いいな。

522Name_Not_Found :04/01/12 01:10 ID:???
>>520
誰も信用していないわけだが。

523Name_Not_Found :04/01/12 02:42 ID:???
俺だけは信用してくれ

524Name_Not_Found :04/01/12 03:43 ID:UCJzdsB5
http://www.geocities.jp/koreyoro/menu.html
http://www.geocities.jp/koreyoro/menu_stlsht.css

すいません、先ほど質問させていただいたものなのですが
上記のサイトのメニュー欄とその上に位置する画像
をくっつけたいのですがどうしても間にスペースが
空いてしまいます。

スタイルシートでいろいろいじったのですが
どうしてもうまくいきません。
ご助言いただけませんか?


525Name_Not_Found :04/01/12 05:19 ID:???
>>524
<div><img src="table.gif"></div>

あと、ネスケ6とかOpera6とかも気にするなら
.menu_table { margin:auto; }
を追加する。


526524 :04/01/12 07:02 ID:???
おお!!すごい、ありがとうございます。
これはどういう仕組みでこうなるのかもしよければ
後学のために教えていただけませんか?

527Name_Not_Found :04/01/12 07:13 ID:???
自分で調べて学ぼうって気はないのかよ・・・

528525 :04/01/12 07:23 ID:???
す、すいません。
自分で原因調べてみます。
本当にありがとうございました。

529Name_Not_Found :04/01/12 08:56 ID:???
なあなあ、ちと気になったんだが、
本当は「すいません」じゃなくて
「すみません」が正しいんだよな?


530Name_Not_Found :04/01/12 09:18 ID:???
心底どうでもいい。

531Name_Not_Found :04/01/12 09:20 ID:???
>>529
板違い

532Name_Not_Found :04/01/12 09:26 ID:???
“済みません”が正解。


533Name_Not_Found :04/01/12 09:37 ID:???
>>532
すいません
>(連語)
>〔「すみません」の転〕⇒すみません
三省堂提供「大辞林 第二版」より

正解と言い切れるもんじゃないね。

534Name_Not_Found :04/01/12 09:42 ID:???
は?


535山瀬 :04/01/12 09:45 ID:???
すびばせん

536Name_Not_Found :04/01/12 09:46 ID:???
連語て何だ?

よく分からんが、辞書に載ってるなら、
“済みません”が転じて“すいません”になったとは言え、
“すいません”も日本語として認められているということか?


537Name_Not_Found :04/01/12 09:47 ID:???
すんまそんは?


538Name_Not_Found :04/01/12 09:56 ID:???
いい加減板違い

539Name_Not_Found :04/01/12 10:03 ID:???
>>536
> “すいません”も日本語として認められているということか?
 そゆことだね。

540Name_Not_Found :04/01/12 10:51 ID:???
CSS厨はほんと粘着でスレ違い板違いの議論が好きなんだね

541Name_Not_Found :04/01/12 11:22 ID:???
>>540
CSSと無関係な話をしてるんだからCSS厨とは呼べないだろ。白痴か?

542Name_Not_Found :04/01/12 11:31 ID:???
誰か質問しろよ

543Name_Not_Found :04/01/12 11:37 ID:???
>>542
お前が質問すればいいだろ

544Name_Not_Found :04/01/12 11:43 ID:???
>>542-543
お前ら仲いいな

545Name_Not_Found :04/01/12 11:45 ID:???
>>541
うわあ……開き直っちゃったよ……。

546Name_Not_Found :04/01/12 12:01 ID:???
おまいら
ほんと柔軟性ないな。WWWスレ全般きもいマニュアル厨だらけ
お前らのセックスも何かのマニュアル通りなんだろうな。 あはは きもっ

547Name_Not_Found :04/01/12 12:18 ID:???
>>546
俺の最初のマニュアルは週刊宝石でした。

548Name_Not_Found :04/01/12 12:19 ID:???
>>546

お前エロいな

549Name_Not_Found :04/01/12 13:08 ID:???
>>541
※ 議論はよそで ※

550Name_Not_Found :04/01/12 14:33 ID:???
君達そろそろ気づけよ
君達は一冊の仕様書に基づいてやってるから行きつく先は皆同じ、ただ微妙な違いをつつき合ってるだけなんだよね。くだらねーよ
Webなんて見れればよし。ビルダーで作ろうがソースが適当でも重くても人気があるサイトは人が集まる
CSSでデザインしたからって100万HITするわけじゃし、それならテーブルで作っても同じ。
何の為にWeb作ってんのかな?
結局、君達はどうでもいい事で時間つかってるだけなんだよね
ここに来て自分に必要な事だけ抜いていってる人の方がよっぽど賢いよ。

551Name_Not_Found :04/01/12 15:37 ID:???
※ 負け犬はよそへ ※

552Name_Not_Found :04/01/12 15:50 ID:???
>>550-551
ハゲワラ

553 ◆MbpwKgPmhw :04/01/12 16:26 ID:???
a {
border-style : solid;
border-color : #f00;
}
a:link {
border : 0;
margin : 1px;
}
a:visited {
border : 0;
margin : 1px;
}
a:hover {
border : 1px;
margin : 0;
}
a:action {
border : 1px;
margin : 0;
}

このCSSに対して、

<p>
<a href="#">例示アンカー</a>
</p>

を置いて、この上にマウスポインタを置くと、
リンクの位置がずれるのは既出のバグだと思うんですが、
これの対処法が見つかりません。どうしたらいいのでしょうか

554Name_Not_Found :04/01/12 17:32 ID:???
バグと言うか、記述どうりの動作だと思うが
ズレるのが嫌ならmarginとborderの値を全部0にすれば良い

555Name_Not_Found :04/01/12 17:57 ID:???
>>554

Hover時に回りをボーダーで囲んで、
それ以外は標準リンクスタイル、てことがしたいんですが・・・
諦めろ、って事ですかね

ま、しゃーないか

556Name_Not_Found :04/01/12 17:58 ID:???
marginでなくpaddingを使えば解決する。

557Name_Not_Found :04/01/12 18:02 ID:???
>>555
a { border-style : solid; border-width : 1px;}
a:link { border-color: transparent; }
a:visited { border-color: transparent; }
a:hover { border-color: red; }
a:active { border-color: red; }


558Name_Not_Found :04/01/12 18:02 ID:WRlFOPlP
アドバイスお願いします。

1.「トップ」「リンク」「自己紹介」…というようにリンク先を横並びに表示
2.リンク先を横並びにして、背景色をリンク先ごとに替える
3.背景色の幅を統一する
4.一列に並んだリンク先をまとめて画面中央に表示

を作りたいと思っています。

.toplink{margin-left:auto;margin-right:auto;margin-bottom:5px;width:100%;}
.top{float:left;background-color:#99FF99;width:6em}
.link{float:left;background-color:#CCFFFF;width:6em}
.shoukai {float:left;background-color:#CC99FF;width:6em}

<div class="toplink">
<div class="top"><a href="./top.html">top</a></div>
<div class="link"><a href="./link.html">リンク</a></div>
<div class="shoukai"><a href="./shoukai.html">自己紹介</a></div>
</div>

としてみました。1〜3までは希望通りの表示になったのですが、
4.が表示できません。
一列まとめてセンタリングするにはどのようにしたらいいのでしょうか。









559Name_Not_Found :04/01/12 18:07 ID:???
お前にとってdivは何だ、言ってみろ

560Name_Not_Found :04/01/12 18:07 ID:???
>>558
>.toplink{margin-left:auto;margin-right:auto;margin-bottom:5px;width:100%;}

.toplink{margin-left:auto;margin-right:auto;margin-bottom:5px;width:18em;}
煮汁!

561 ◆MbpwKgPmhw :04/01/12 18:09 ID:???
>>556
同じ動作しかしませんでした

>>557
IEだと(ネスケ等他UA未確認)borderのTransparent指定は#000になってしまうんです

レスありがとうございます。
ここで解決しなければ無理、と心得ているので、
大人しく引っ込みます。
まぁいたしかたないのでtext-decoration : overline underline;
でこらえておきます。

562Name_Not_Found :04/01/12 18:14 ID:???
>>561
アホか、a:linkのボーダー色とbodyの背景色を揃えたらそれで良いだけだろ

563558 :04/01/12 18:16 ID:???
18emにしたら中央にできました!ありがとうございました。
この18は指定したwidht*指定した個数なんですね。

自分の判る範囲で考えてやったことなんですが、>558
書いたような記述のしかたって間違っているんでしょうか?

564Name_Not_Found :04/01/12 18:16 ID:???
>>561

・border-colorにtransparentを指定すると前景色で表示される
 http://members.at.infoseek.co.jp/cssbug/detail/winie/b095.html
こいつか。なっかりだな(´・ω・`)。
親要素の背景に画像を使っていないのなら、transparentではなく親要素の背景色と同じにすると回避できるな。


・前景色にtransparentを指定すると#000000を指定したものとして扱われる(IE5.5)
 http://members.at.infoseek.co.jp/cssbug/detail/winie/b031.html
なんてのもある。


IEのtransparentは鬼門だな。

565Name_Not_Found :04/01/12 18:17 ID:???
>>563
>>1-10あたりでボックスモデルについて勉強汁と吉。


566Name_Not_Found :04/01/12 18:18 ID:???
>>561
http://www2.u-netsurf.ne.jp/~alt/tips/border.html
少しは検索するってことを覚えなさいよ

567Name_Not_Found :04/01/12 21:56 ID:???
TABLE { empty-cells: show; }
を試しても空白セルの枠線が表示されないんですが
どうしてなんでしょうか?(IE6)


568Name_Not_Found :04/01/12 22:06 ID:???
>>563
間違ってる、という以前の問題だ。

>CSSスタイルシートを意図した通りに機能させるには、正しい文書解析木が必要です。つまり、正当(valid)なHTMLと共に、CSSスタイルシートを用いる必要があります。
ttp://jigsaw.w3.org/css-validator/

569Name_Not_Found :04/01/12 22:44 ID:???
>>567
たんなるバグじゃね?
tableまわりのCSSはIE、NNともにバグが多いからテンプレサイトで調べた方がいいと思う。

570Name_Not_Found :04/01/12 23:28 ID:???
>>567
IEは empty-cells 非対応です。

空セルを
<td> </td>
とするか、これじゃあ構造を表してないと思うなら、
<td><span style="display: none">(なし)</span> </td>
などとしよう。

571Name_Not_Found :04/01/12 23:31 ID:???
>>570
うわぁ、2ch は実体参照がそのままになるのか。じゃあ、
<td>&nbsp;</td>
と書くと見えるのかな?

572 ◆MbpwKgPmhw :04/01/12 23:59 ID:???
>>562
「全てのアンカーの背景色が必ずしも一定でない」状況です。
Transparentを試した理由はそこにあります。

>>566
>>556,>>561

どうやらだめっぽいので諦めました。
仕様と言うことで・・・・
ありがとうございました

573Name_Not_Found :04/01/13 00:29 ID:???
>572
(´д`)

a {
margin : 1px;  /*←ここ*/
border-style : solid;
border-color : #f00;
}

これで出来るだろが。
全然読んで無いのバレバレ。勝手に仕様にするな。

574Name_Not_Found :04/01/13 09:31 ID:???
自ら創意工夫を行おうと言う気が一切無いものがCSSを使いこなすのは難しい

575Name_Not_Found :04/01/13 11:54 ID:???
>>553
動的な疑似クラスによってスタイルが変化しても、
ボックスの幅(box-width)が変動しないように、
マージンやパディングを調整すればよいのだが、
そこまで頭が回らないものなのかと思った。

「リンクの位置がずれる」という現象からどうして
『なぜそうなるのか』を自分で考察できないのか。

“UA のバグ”なのか“仕様”なのか“自分のミス”なのか
碌に調べもせず考察もせず『何々ができません』と質問すれば、
答えがかえって来ると思っている初心者の態度には反吐が出る。
もっと頭を使って考えろ。調べろ。仕様書よめ。文法チェックしろ。<初心者

576Name_Not_Found :04/01/13 12:28 ID:???
>>575
> “UA のバグ”なのか“仕様”なのか“自分のミス”なのか
> 碌に調べもせず考察もせず『何々ができません』と質問すれば、
碌に調べもせず考察もせず『CSS2の仕様がクソ』『IEの実装がクソ』とかいうやつも多いよな。

577Name_Not_Found :04/01/13 13:11 ID:???
※ 議論はよそで ※

578Name_Not_Found :04/01/13 15:43 ID:/vM4CVUh
ネスケ4.xでCSSを読み込ませない方法として
media指定のバグを利用するというのがありますが

CSSファイルをルートじゃなくCSSフォルダに入れて
それを相対パスの指定では読み込まれないバグを利用するってのもありですか?
他のブラウザで何か不具合とか出ます?

579Name_Not_Found :04/01/13 15:47 ID:???
相対パスでも読むだろう? ネスケ4

580Name_Not_Found :04/01/13 16:27 ID:???
>>573
はぁ?

a {
padding : 1px;
}

a:hover{
padding : 0px;
border : 1px solid #f00;
}

hover時のborder-widthプロパティ値+paddingプロパティ値 = 通常時のpaddingプロパティ値
になればいいわけだろ。

581Name_Not_Found :04/01/13 16:32 ID:???
>>578
こういうのはどうか?
ttp://www.rju666.com/web/mistakable.html#css_layout_supplement

582Name_Not_Found :04/01/13 16:46 ID:???
>580
文中の"padding"を全部"margin"に変えても全く問題無いのだが。
元の>553がmarginだったからmarginにしただけ。
もうちょっと考えてくれな。

583567 :04/01/13 16:48 ID:???
>>569-570

非対応なんですね。
どうもありがとうございました。

584578 :04/01/13 18:07 ID:???
>>579
これを勘違いしてたみたいです(^^;)
ttp://cssbug.at.infoseek.co.jp/detail/nn4x/b008.html
>>581
ここいいですね。勉強になります。お気に入りに入れておきます。

どうもありがとうございました。

585Name_Not_Found :04/01/13 18:48 ID:???
いままでリンクに下線をつけていなかったのですが、
>473からを読んで、borderをつけてみることにしました。
a:link {
color: blue;
text-decoration: none;
border-width: 0px 0px 1px 0px;
border-style: dashed;
border-color: blue;
}
a:visited {
color: red;
text-decoration: none;
border-width: 0px 0px 1px 0px;
border-style: dashed;
border-color: red;
}
Mozilla Firebird 0.7 で表示させたとき、
a:visited の color が a:link の color になってしまいます。
border-color も同様なのですが、これはバグなのでしょうか?
なお、IE5.5では正常に表示されました。

>553 a:action → a:active

586Name_Not_Found :04/01/13 18:51 ID:???
>>585
> text-decoration: none;
> border-width: 0px 0px 1px 0px;
 質問とは関係ないが、この指定の仕方の意味が知りたい。

587Name_Not_Found :04/01/13 18:53 ID:???
>>585
意味って言うか、書き方じゃないの。個人の。

588Name_Not_Found :04/01/13 19:27 ID:???
>585
586がものすごくヒントくれてる
CSSをも一度きちんと理解、そしてチェック

589kai- ◆kai/rQnSpY :04/01/13 19:32 ID:???
>>585
コピペして試してみたところ、 Mozilla Firebird 0.6.1 では正常に表示されていました。
バグなのかどうか、僕ではなんとも言えません。

590kai- ◆kai/rQnSpY :04/01/13 19:39 ID:???
>>588
>>586はなぜ text-decoration ではなくて border を用いて下線を引いているのかについて尋ねているだけの様な。

僕がヒントに気付かない無知な人なだけかもしれませんが(´Д⊂

591Name_Not_Found :04/01/13 19:57 ID:???
>>585
Mozilla Firebird 0.7でみたけど、ちゃんと表示されてるぞ?
訪問済みのリンクでテストとかしてないだろうな。

592585 :04/01/13 20:20 ID:???
text-decoration では破線が使えないので、
border を使ってみました。
こういう使い方は strict ではないのだろうかと
疑問には思っているのですが、
まだいろいろテストしているところなので
text-decoration に変更するかもしれません。

ローカルの .html (自分で書いたもの)を
IE と Firebird で開いたとき、前述の結果になりました。
lint や CSS 検証でも、とくに問題はありませんでした。

* {-moz-box-sizing: border-box;}
これだけは警告がでましたが・・・。
ttp://www.fromdfj.net/html/border2.html

593kai- ◆kai/rQnSpY :04/01/13 20:50 ID:???
>>592
>>591さんによれば 0.7 でも正常に表示されたようですし、
CSS中の、>>585でない箇所の記述に問題がある (意図に反する指定をしている) としか思えません。


>こういう使い方は strict ではないのだろうかと
>疑問には思っているのですが、

要はリンクがリンクであるという事が閲覧者に伝わればいいわけですから、
下線を引くのためにどちらの方法を用いても構わないと思います。

594Name_Not_Found :04/01/13 22:19 ID:???
CSSにstrictもへったくれもないと思った。

595Name_Not_Found :04/01/13 22:22 ID:???
猫も杓子もstrictだな

596Name_Not_Found :04/01/13 23:56 ID:???
適切なマークアップについて解説するページは無いでしょうか?
div厨に一直線なので、ここら辺でブレーキかけようかと・・・。

597Name_Not_Found :04/01/14 00:04 ID:???
>>596
(=´Д`=)そのままdiv厨にナローヨ
      なっちまえば後は楽ダーヨ

598Name_Not_Found :04/01/14 00:37 ID:???
>596

Strict-HTML スレッド17
ttp://pc2.2ch.net/test/read.cgi/hp/1068907834/

W3C信者にサイトを正しい記述に直して貰うスレ3
ttp://pc2.2ch.net/test/read.cgi/hp/1061741473/

あたりで

599Name_Not_Found :04/01/14 01:03 ID:63aF9EvD
HTMLのヴァリッド検査ツールで、満点みたいなのとると
ヴァリッド!てバナーみたいな画像が出現するサイトありましたが、
CSSのはどこ? FAQとか関連リンクとかみたけど、画像が出てくるサイトが紹介されてない・・・

600Name_Not_Found :04/01/14 01:31 ID:???
>>599
>>3

601Name_Not_Found :04/01/14 04:35 ID:bpHmIeFM
ちょい質問ですが、みんさんWindowsのIE6でフォントサイズが小を
サイトの本文サイズとしている場合、cssで .font12 { font-size: small; }
と割り当てますか?それとも割り当てませんか?

と言うのも割り当てないとそのブラウザ環境のフォントサイズで表示されますが
出来るだけスタイルを統一させたいと考えた場合、指定した方がいいのかどうか迷ってます。

今まではピクセル指定でフォントサイズを固定していたのですが
ユーザビリティ的にそれをするのはいささか問題あるかと思いまして。

602Name_Not_Found :04/01/14 04:56 ID:???
>>601
本文の文字サイズはできるだけ指定しない、が正解だろう。

603Name_Not_Found :04/01/14 05:39 ID:bpHmIeFM
>>602
なるほど。それはユーザーのOS、ブラウザ環境に依存するのを最優先とし
こちら側の意向(例えばどの環境でも同じように見えるなど)
を優先しないと言う考えですね。

なるほど。参考になります。ありがとうございました。

604Name_Not_Found :04/01/14 09:04 ID:???
IEのemバグ回避のために
body { font-size: 100%; }
は書いといて損は無いかもしらん。

605Name_Not_Found :04/01/14 11:27 ID:???
>>600
ありまとう。
どうやらCSSのURI指定で検査しないと、画像が出ないみたいね・・・
ヴァリッドをこれからも続けるぞーおー

606Name_Not_Found :04/01/14 11:28 ID:???
>>601
多分老若男女、視力の強い人弱い人を考えると、
相対指定がいいのでゎ?


っと連投スマソ。

607Name_Not_Found :04/01/14 11:40 ID:???
視力の弱い人はOSの設定で基本フォントを大きくしているか、
ブラウザの通常サイズのフォントを大きく設定しているかする
可能性が比較的高い。

だからWebページ側では本文のフォントサイズは変更されていない
(何も指定されていない)のが望ましい。それならその人にとって
一番見やすいサイズで表示されることになる。

608Name_Not_Found :04/01/14 12:15 ID:???
私のように40代半ばになってくると、小さい文字が見づらくなります。
OSはもちろん大きいフォントにしていますが、フォントがpt指定のHTML(CSS)だと、見えない(読めない)ことが多々あります。
自分がCSSを書く場合(デザイン・レイアウト的にシビアな要求はないので)、フォントサイズは「%」で指定しています。
bodyが100%、h1が140%、h2が120%とか。
これであれば、IEの場合Ctrl+マウスホイールで大小が簡単に切り替えられます。



609Name_Not_Found :04/01/14 12:32 ID:UaFbZJmZ
<head>
<style type="text/css"><!--
BODY
{margin-left:5px;
background-color:#efefef;
color:black;}-->
</style>
</head><body>
<div style="position:relative; width:45%;">
<form action="null" style="margin: 0px;" name="pulink">
<select onchange='parent.patches.location.href=this.options[this.selectedIndex].value' style="position:relative; " align="center">
<option>選択</option>
<option value="nullpo.html">ぬるぽ
</select>
</form>
<!--
<option value="patches/">
-->
<iframe marginheight="7px" marginwidth="5px" scrolling="auto" frameborder="1"
src="ReadMe.html" name="patches" width="100%" height="180" style="border: 1px thin black;" title=""></iframe></div>
</body>

上のソースのselectにあるalign="center"をrightにすると、
下のiframeにかぶります。centerだとかぶりません。
align="right"にして、どうすればiframeにかぶらなくなるんでしょうか。

610Name_Not_Found :04/01/14 12:50 ID:???
>>606
フォント関係のスレはこの板にもよそのサイト関連のサイトの板でも語りつくされてるから一度探してみるといい。
絶対固定でそれでもなお「小さい」と思ったらCSS切ってさらにブラウザのフォントサイズをあげる、といった面倒なことを強いることになる、とは散々言われてる。

611610 :04/01/14 12:51 ID:???
わあ、誤読。>>606は「相対」っつってるのね。
寝起き早々勘違いした。

>>606
ごめん。

612Name_Not_Found :04/01/14 13:10 ID:???
>>609
端的に言うとiframeのwidth="100%"が原因かと。
ついでにいうと、select要素のalign属性はIE独自拡張ですがOK?

613Name_Not_Found :04/01/14 13:43 ID:???
>>609
position:relative
を指定している目的は?

614609 :04/01/14 14:08 ID:UaFbZJmZ
どうもありがとうございます。

align>知りませんでした。外します。
> position:relative
divで囲み、selectをdiv内で右寄せする為です。
外がdiv、細い長方形がselect、その下がiframeです。
┌────────┐
│    ┌───┐│
│    └───┘│
│┌──────┐│
││        ..││
││        ..││
│└──────┘│
└────────┘

615609 :04/01/14 14:09 ID:UaFbZJmZ
divは画面の百パーセントで表示しません。
おおよそ画面の五十パーセントほどです

616Name_Not_Found :04/01/14 14:53 ID:???
>>614=609
ああそういうことか。(てっきり、横並びに表示させようとしてるのかと思った。)
IEが拡張した(select要素の)align属性は、iframeのalignと似たようなもので、
縦方向の位置や、後に続く「テキストの回りこみ」を指定するものです。
(ただし値がcenterの場合は回り込みをせずに中央ぞろえになる。)

>>614のAAのように右揃えしたいなら、selectにfloat:right;、iframeにclear:right;、
とかかなあ。position:relativeは不要。

617Name_Not_Found :04/01/14 14:59 ID:0ma6BJjP
何か難しい話をしているところ申し訳ありません。
初心者スレから誘導されて来ました。

凄い初心者な質問で申し訳ないんですが
文字<br><br>…<br><br>文字<br>…と、大量に<br>使って等間隔で文字を打った場合
IEとNNでは文字を表示する間隔が違うのですが
それを防ぐにはどうしたらいいでしょうか?


初心者スレでは「改行はそんな風にしちゃ駄目」と言われました。
どうしたらいいでしょか?

618Name_Not_Found :04/01/14 14:59 ID:???
<br>連打で行間空ける厨は死んでください。

619618 :04/01/14 15:00 ID:???
遅かったか・・・・_| ̄|○

620Name_Not_Found :04/01/14 15:02 ID:???
>617
あなたはCSSでなんとかできそうにないので、透明GIFでも用意して、想定したピクセル数の
空きをとったらいいのではないかと思う。

CSSでなんとかする気があるなら、>>4をドゾー。

621Name_Not_Found :04/01/14 15:07 ID:???
あれだ。
br + br + br {display:none;}
このユーザーCSSで、ウザイ強制改行連打が回避できる。

というわけで、>>4http://www.kanzaki.com/docs/htminfo.htmlあたりを
読んでから、おいでなさい。

622609 :04/01/14 15:07 ID:UaFbZJmZ
>>616
それぞれ、スタイルを指定したら出来ました。
ありがとうございました。

623Name_Not_Found :04/01/14 16:01 ID:???
>>617
隣接セレクタかな。
空けたい直前ブロックレベル要素にclass名(仮にfoo)を与えて、次のブロックレベル要素(仮にP要素)で。

.foo + p { margin-top : 990em;}

こんな感じ。

624Name_Not_Found :04/01/14 16:21 ID:???
> 990em
って、おい(w

625617 :04/01/14 16:57 ID:0ma6BJjP
>>623
閃きました!ありがとう!

626585 :04/01/14 19:24 ID:???
>593 了解いたしました。
もっとよく調べてみることにします。
どうもありがとうございました。

あと、あまり strict に拘らないようにもしようと思います。

627Name_Not_Found :04/01/14 19:29 ID:???
strictにはこだわっても良いが、俺strictにはこだわらなくても良いと思う

628Name_Not_Found :04/01/14 20:12 ID:???
strictでもtranditionalでも何でも
markupがvalidならそれでいい

629Name_Not_Found :04/01/14 20:45 ID:???
letter-spacing についてなんだけど、指定して確認したら、空いてる間隔が

IE6 < NN7 = Opera7

になってんだよね、明らかに。
これってどうしようもないかな?

指定してるのサイトタイトルだけなんで、いっそ半角スペースでやっちまおうかとも思ったけど、
ソース汚くなるし、音声読み上げブラウザだとマズいことになるらしいし。

630Name_Not_Found :04/01/14 20:53 ID:???
原因はわからないけど
うまく解決できなかったらIE未対応の + とか >をうまく使って
IEとNN(Opera)それぞれに別のスタイルを指定して回避してみたらいかが?

631Name_Not_Found :04/01/14 21:52 ID:???
何の単位を使って指定したか書いてくれないとなんとも…
em? emはIEで入れ子バグがあったような。
pxで指定しても違うならバグ辞典に報告に行ってみては。

632629 :04/01/14 22:08 ID:???
■em単位で指定した字間をbody要素の文字サイズを基準に算出する
http://members.at.infoseek.co.jp/cssbug/detail/winie/b109.html

これか!これのせいでIEだと、ネスケとかに比べて字間が空かなかったのか。
ちなみにexでやっても結果は同じだった。
ピクセル指定だと平気っぽいけど、激しく解像度依存だよなぁ

>>630
サンクス

>>631
確かに結構重要だったね、ゴメン。上に書いた通りemでした。



633629 :04/01/14 22:11 ID:???
いや、ピクセルでいくことにした。別に閲覧に支障でないし

お騒がせしました。

634Name_Not_Found :04/01/14 22:32 ID:???
>633
ユーザ側でフォントサイズ変更している場合も考慮しれ

635Name_Not_Found :04/01/14 22:45 ID:???
>>634
文字そのものじゃないから別にいいんじゃね?

636Name_Not_Found :04/01/15 00:04 ID:???
<p class="hoge"></hoge>で囲まれた文字列の
一文字目の文字の色を青にしたいのですが、
そのような指定をcssでできるのでしょうか?
<font>タグで指定するしか無いのでしょうか?
よろしくお願いします。

637Name_Not_Found :04/01/15 00:11 ID:???
:first-letter 擬似要素ってIE5.5以降で使えるってことでOKなんかなぁ?
5.0では駄目だったような記憶があるんだが。

638Name_Not_Found :04/01/15 00:15 ID:???
>>636
なんでp開始タグをhoge終了タグで括るんだ?

ちなみに、
p[hoge]:first-letter
かな。

639Name_Not_Found :04/01/15 00:17 ID:???
:first-letter , :first-line擬似要素は
WinIE => 5.5
MacIE => 5.x
NN => 6.2
以上で対応してるはず

640638 :04/01/15 00:19 ID:???
補足。
MACだとfirst-letter適応の一文字目が2バイト文字の場合バケる。

641Name_Not_Found :04/01/15 00:46 ID:???
>>640
げげ、そいつは初めて知った。
そんなのホヮスト・レターじゃないだろ…

642Name_Not_Found :04/01/15 00:50 ID:???
>>641
MACを意識するなら英字が出だしの文字列にしなきゃいけないけど、
英字が出だし、って「1.〜」とかQ&Aの「Q.〜」とか、「Link」とかそういう見出しとかくらいしか思いつかん。

lang[en]がIE対応してくれりゃなぁ。

643Name_Not_Found :04/01/15 00:53 ID:???
一応。
:first-letter擬似要素の適用対象が2バイト文字の場合に表示が崩れる(IE5)
ttp://cssbug.at.infoseek.co.jp/detail/macie/b001.html

644Name_Not_Found :04/01/15 02:18 ID:???
エンコードにユニコード使うと遅くなるよね。

645Name_Not_Found :04/01/15 09:28 ID:???
例えば本文中で
<div class="bigbox"><div class="smallbox"><p>テキスト</p></div><div>
と書いてから別途、CSSで
div.bigbox {width:80%;}
div.smallbox{width:50%;}
と指定するとMacIEではsmallboxはbigboxの幅に対して50%の幅となるのですが、
WinIEではsmallboxはbodyに対して50%の幅になるみたいなのです

%表示を使ってWidthを指定する場合、MacとWinでの見た目を統一することは無理なのでしょうか?

646Name_Not_Found :04/01/15 10:00 ID:???
>>645
そうなの?
あちきのWinIE5.5と4.01では、smallboxはbigboxの幅に対して50%の幅になってるけど?

647645 :04/01/15 10:22 ID:???
>>617
CSSで段組作ってみたらレイアウトがMacとWinで違っていたので
てっきりwidthの解釈が違うものとばっかり思ったんですが・・・
ちなみに当方はIE6で確認しました。

648645 :04/01/15 10:25 ID:???
すいません、間違えました。
>>617ではなく、>>646です。

649645 :04/01/15 10:57 ID:???
前の質問はこっちの間違いでした

自分のサイトのトップページを段組にしてみたかったので
本文で
<div class="bigbox">
<div class="leftbox"><p>テキスト</p><p>テキスト</p><p>テキスト</p><p>テキスト</p></div>
<div class="rightbox"><p>テキスト</p><p>テキスト</p><p>テキスト</p><p>テキスト</p></div>
<div>

CSSで
.bigbox {margin-left:3em;margin-right:3em;}
.leftbox {width:50%;float:left;}
.rightbox {width:50%;margin-left:50%;}
P {border:1px solid black;white-space:nowrap;}

とした場合、MacIEではleftboxとrightboxの幅が同じ段組が出来るのですが、
WinIEではrightboxの幅がleftboxと同じにならないんです。

650Name_Not_Found :04/01/15 11:04 ID:KfOGa9oO
質問です。CSS初心者(2日目)なんで変なこと言ってたらごめんなさい。

質問1 http://www.fotolog.net/fotocats のソース見たんですが、
てっきりフレームで3つ(左、中、右)に分けると思ったんですが、CSSって記述が無いみたいなんです。
って事は、CSSじゃ無い別のスタイルシートで分けてるんですかね?

質問2 CSSで上記の様なレイアウトにしするのは、FRAMESET要素で定義するんですか?

651Name_Not_Found :04/01/15 11:17 ID:FxsUJ13J
・トップのページ
・ギャラリーのページ
・リンクのページ
・掲示板のページ

各々のページの<body>を
<body id="top">
<body id="gal">
<body id="link">
<body id="board">
とするのは変ですかね?


なんで上記のようにしたいかというと、各々のページに<p>を使っているんですよ。
そんでページごとに<p>のスタイルを変えたいんですよ。
そうゆう場合は
<p id="top">
・・・・
とかにした方が良いのですかね。


652Name_Not_Found :04/01/15 11:18 ID:???
回答1 CSSと呼ばれるスタイルシートも、CSSじゃない別のスタイルシートも
     一切使われていない典型的なテーブルレイアウト。

回答2 >>6参照。

653Name_Not_Found :04/01/15 11:46 ID:FxsUJ13J
またすいません。


ttp://www.remus.dti.ne.jp/~a-satomi/nikki/tmp/dangumi.html
これ見てください
ttp://www.daizou.jp/up/upload/20040115114354.gif

ピンク線の上と下で見栄えが変わります。
下のほうが左によっています。
floatをやるとこうなっちゃいます。
うちはIE6なんですけど、これはバグですか?
対策はありますか?

654Name_Not_Found :04/01/15 11:50 ID:???
>>653
それIEの有名なバグなんで
http://www.positioniseverything.net/explorer/threepxtest.html
このへん参考にして。英語だけど

655Name_Not_Found :04/01/15 12:05 ID:KfOGa9oO
>>652
即レス有難うございます。勉強し直しますハイ!

656Name_Not_Found :04/01/15 12:34 ID:???
>>651
全然問題ないと思う。
オレなんか <body class="hoge">とか平気でやってるよw
bodyは1個しかないし、Scriptからのアクセスを考えるとidの方がいいかも。。。

657645 :04/01/15 16:14 ID:???
>>651
多少、ファイル数が多くなるけど、複数のCSSに分けて記述しておいて
ページごとに読み込ませるCSSを変えるという手もあるよ。

658Name_Not_Found :04/01/15 17:29 ID:???
IEでid="top"とすると、
window.topと被るからお勧めできない。

659Name_Not_Found :04/01/15 21:18 ID:???
>>651
全く問題ない。むしろスマート。
<p id="..."> といちいち書く方がダサい。

っていうかそれHTMLの書き方の問題であって
CSSの質問じゃねーよ

660Name_Not_Found :04/01/16 00:43 ID:???
CSSでタブを書こうと思って以下のように書きました。
// HTML
<ul>
<li>Tab1</li>
<li class="selected">Tab2</li>
</ul>
// CSS
ul {
color:#000;
background-color:#fff;
border-bottom:solid 1px #000;
}
li {
display:inline;
border:solid 1px #000;
}
li.selected {
border-bottom-color:#fff;
}

IE6SP1では
_| ̄|_| ̄|_
 ̄ ̄ ̄  ̄
このようになったのですがMozillaFirebirdだと
_| ̄|_| ̄|_
 ̄ ̄ ̄ ̄ ̄
こんな感じになります。
どうすればどちらのブラウザでもIE6SP1のように表示できますでしょうか?
また、CSS的にはどちらが正しいのでしょうか?


661Name_Not_Found :04/01/16 01:16 ID:???
>>660
たぶん↓と同じことしたいんだと思うけど
http://unraveled.com/projects/css_tabs/
どっちかでズレると言やズレるわな。

CSS的には「IEは常に間違ってる」と思って支障ない。

662660 :04/01/16 03:07 ID:???
>>661
えぇ、そこも参照したんですがそこだとIEでもFBでも意図する通りに見えるんです。
じゃあそのCSSパクればいいんですが、px指定してるのが気持ち悪くて…。


663Name_Not_Found :04/01/16 07:29 ID:???
>>662
やってみればいいじゃん
pxも色々自分なりに変えてさ
聞く前にやってみな

664Name_Not_Found :04/01/16 15:10 ID:???
>>662
>>660の方針でできるか試してみた。
※ulを「<ul class="tab">」とクラスを追加した。
※便宜のため適当に背景色を追加した。

* {
font-size:1em;
margin:0; padding:0;
}
ul {
color:#000;
background-color:ddd;
border-bottom:solid 1px #000;
margin:1em 0 1em 3em; padding:0;
}
/*WinIEよけに属性値セレクタにしてみた*/
ul[class="tab"] {line-height:1em;}

li {
display:inline;
padding:0 0.1em;
margin-right:0.2em;
border:solid 1px #000;
background-color:#eee;
}
li.selected {
border-bottom-color:#fff;
}
----
一応、IE6とFirebird0.7とOpera7で似たような表示にはなるみたいだけど…

665Name_Not_Found :04/01/16 22:27 ID:lFfhflg3
テキスト入力<input type="text">で、スタイルシートを使うことで、
入力できなくなるようにすることができたと記憶してるんですが、どなたかご存知ないですか?

666Name_Not_Found :04/01/16 22:31 ID:???
>>665
disabledやreadonlyといったinputの属性じゃなくて?

667Name_Not_Found :04/01/16 22:50 ID:???
>>665
IEの独自拡張でime-modeというプロパティがあるけど、そのことかな?

668Name_Not_Found :04/01/16 22:56 ID:lFfhflg3
うひゃーreadonlyでした。
勘違いでした。
>666
>667
どうもありがとうございました。

669660 :04/01/16 23:39 ID:???
>>664
ありがとうございます。
IEのCSSバグを使って篩い分けする方法ですね。


670Name_Not_Found :04/01/17 00:34 ID:???
バグじゃあないんだがな…

671Name_Not_Found :04/01/17 01:24 ID:cK8f3ARe
body にwidth 80%の指定してtableで
<tr><td> floatした画像+右に回りこんだ文字列をmarqeeで動かす</td></tr>

としたときに、NN7.1ではテーブルがwidth 80%からはみ出てしまいます。
何か他にやり方ありますか?


672Name_Not_Found :04/01/17 01:29 ID:???
>>671
俺が文盲なのもあるが、まず日本語の意味が理解できん。
だらだら文章で説明するよりソースをだしてくれるとありがたいな。


あと、marqeeってお前勘弁してくださいよ。

673671 :04/01/17 02:43 ID:cK8f3ARe
>>672
こちらです。どうでしょうか?
http://yuppy.s8.xrea.com/css/table.html

marqeeはどうしても押して欲しいリンクがあるもので;;;

674Name_Not_Found :04/01/17 03:22 ID:???
>>673
末期ガンなぐらい悪いところが多いので、1からソースを書き直してみろ・・・(´д`;)

675Name_Not_Found :04/01/17 03:31 ID:???
tableのセンタリングをしたいようにみえるが、どうか?

tableのセンタリング方法はテンプレにあるから目を通すべし。

676Name_Not_Found :04/01/17 04:36 ID:???
>>673
>marqeeはどうしても押して欲しいリンクがあるもので;;;

あほ?
Linkがmarqeeしてたらクリックしにくくてたまらない。
先ず間違いなくだれも押さないだろう。

677Name_Not_Found :04/01/17 04:41 ID:???
>>673
marqeeがリンクになってるって、レス読み返すまで気が付かなかったよ。いや、マジで。
・・・と、それぐらい役に立たない機能。


678Name_Not_Found :04/01/17 04:42 ID:???
どーーーーーーーーーーーしても、誰に何を言われようが閲覧者の事なんざ関係なく文字をうごかしたいならJSでやれ。

679Name_Not_Found :04/01/17 04:59 ID:???
>>673
Strictに書き直してぇ(;´Д`)


680Name_Not_Found :04/01/17 05:19 ID:???
>>673
ここまでで突っ込まれてる話をあえて無視して言うが、
marqeeタグ閉じてないよ。使用の是非以前に。

681Name_Not_Found :04/01/17 05:33 ID:???
____________
||_(((((((((_ ) ||       ||
|| _ 《 _  | .||       ||
||(_//_)-(_//_)-|) ¶|         ||
||   厶、    |  ||        ||
|| |||||||||||| /  ||        ||
 ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄

682Name_Not_Found :04/01/17 05:37 ID:???
そりゃマーシー


683Name_Not_Found :04/01/17 05:55 ID:???
<marquee style="position:absolute;width:12em"
direction="right"><br>
 _(((((((((_ )<br>
  _ 《 _  |<br>
 (_//_)-(_//_)-|)<br>
    厶、    |<br>
  |||||||||||| /</marquee>

<div style="position:absolute">
____________<br>
||             ||       ||<br>
||             ||       ||<br>
||          ¶|        ||<br>
||             ||       ||<br>
||             ||       ||<br>
 ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄</div>

684Name_Not_Found :04/01/17 07:43 ID:???
marqeeはどうしても押して欲しいリンクがあるもので;;; 伝説


685Name_Not_Found :04/01/17 10:49 ID:???
>>683
ワラタ

686Name_Not_Found :04/01/17 11:03 ID:???
でもなんだかんだいってmozillaもOperaもmarquee対応してるんだよな。
中華人民共和国のユーザの要望がかなり強いとかで。

687Name_Not_Found :04/01/17 14:20 ID:???
みなさん、どれくらいの比率でCSSでレイアウトしてます?
全てのレイアウトでCSSを使われている会社の方いらっしゃいますか?

わたしは、テーブルが主体で、補助的にCSSを使っています。
(当たり前なんですが、非推奨タグは避けCSSにしています。)
参考までに聞かせていただけませんか?

688671 :04/01/17 14:51 ID:???
>>675
>>5を参考にdivでテーブルのセンタリング
(+IE向けにCSSでtext-align:justify;を指定)
したらテーブルがはみ出すのは直りました。
どうもです。
>>680
typoです。すいません。

#うp板に広告を貼っても異様にクリック率が低いので、
#苦肉の策で考えたんですが、
#marqueeは評判が悪いようなので採用は見送ります;;;
#CSSとは関係のない方向に話がいってスレ汚しゴメンナサイ。

689Name_Not_Found :04/01/17 14:58 ID:???
>うp板に広告を貼っても異様にクリック率が低いので、
('`)

広告をクリックしてもらいたいのか。今時クリックするやつなんていうのか?
UOのほうで無理やりクリックさせる時とか以外、クリックしようとする奴いないだろ。


なんにしろ、「クリックしてね」とか書かないほうがいい。逆効果だから。


690Name_Not_Found :04/01/17 15:02 ID:???
>687
うちは100%とCSS。
ドリキャスでも見れる、とお客さんにも評判がよいです。

691Name_Not_Found :04/01/17 15:28 ID:???
テーブルレイアウトなし、CSSでデザイン、代替スタイルシートも用意している。
・・・・IEでは代替スタイルシートに対応していないわけだが・・・・

692Name_Not_Found :04/01/17 15:30 ID:???
>>691
プルダウンメニューとやらをつけるしかないのか、あの。

693Name_Not_Found :04/01/17 22:02 ID:???
CSSとは物理的なモノです。
それより先に論理的なモノを理解するのが先決です。


694Name_Not_Found :04/01/18 00:05 ID:???
マルチカラム?段組み?あたりで手間取ってます。
単刀直入に申し上げると
罫線を引く感覚でCSSをデザインできるソフトはありませんか。

どなたかご存知でしたらお願いします。

695Name_Not_Found :04/01/18 00:08 ID:???
>>694
そんな意味不明な日本語のソフトはありません。

段組を組みたいならテンプレよみましょう。

696Name_Not_Found :04/01/18 00:48 ID:???
壁紙の位置の指定なのですが、%指定とright centerとではどちらが好ましいのでしょうか。

697Name_Not_Found :04/01/18 00:49 ID:???
訂正
right centerなどによる指定

698Name_Not_Found :04/01/18 00:54 ID:???
>>696
お好きな方でOK

699Name_Not_Found :04/01/18 01:02 ID:???
>>694
要するに、お絵かきソフトみたいな感じで絵を描くと
その通りのデザインにCSSを吐き出してくれるソフトはあるかって事か?





ネェヨ

700Name_Not_Found :04/01/18 01:25 ID:???
>>699
もしあったとしても、ビルダーのどこでも配置とか、
フロントページ以上のものすごいソースを吐き出してくれそう。

701Name_Not_Found :04/01/18 13:51 ID:???
質問です
試行錯誤してまでCSSにこだわるメリットとは何でしょうか?

ページ表示が速いらしいが実際どれくらいのものなのでしょうか?
netscape4. は結局無視の方向なのですか?

702Name_Not_Found :04/01/18 14:06 ID:???
>701
メリットは端から挙げると数え切れないが…
「構造と見た目を分離出来る→保守・変更が容易になる」が第一のメリットかな。
全てのHTMLの<body background="hoge">を修正するよりCSSの一行を修正する方が圧倒的に楽。

レンダリングの早さは…変わるのか?
ソースに冗長な記述がなくなる分ロードは多少早くはなると思う。

NN4は…お察し下さい。
時代の変遷と共に古い物は使われなくなるものです。

703Name_Not_Found :04/01/18 14:45 ID:???
返答ありがとうございます。もう1つ質問させてください

TABLE+CSSは駄目的な書き込みをよく見るのですが、そんなに駄目なのでしょうか?
テーブルの本来の使い方ではないとはわかっているのですが、段組等はTABLEの方が組みやすいですよね?
それをテーブル無しで作ろうとしているのは、ただのこだわりなのですか?

704Name_Not_Found :04/01/18 15:00 ID:???
>>703
>段組等はTABLEの方が組みやすいですよね?
私はそっちの方が面倒だと思うなあ。
だから、テーブルレイアウトしている人って何故レガシーマークアップに固執してるのかと思うよ。

そんな人もいるって事で。

705Name_Not_Found :04/01/18 15:02 ID:???
>>703
やりたければテーブルレイアウトでも何でもどうぞ。
ココはCSS質問スレだからCSSで出来ることはCSSでやれると言うのが筋ってもんだろ。


次の質問ドゾー

706Name_Not_Found :04/01/18 15:59 ID:???
>>703
こだわりっていうか、表の使い方として違ってるだろ。テーブルレイアウトってのは。
そっちが間違ってるのに正しい使い方を拘りといわれてもな。

707Name_Not_Found :04/01/18 16:39 ID:???
正しく使いたいという“拘り”ちうことでは?

>>704
同意。

708Name_Not_Found :04/01/18 17:20 ID:???
>>704
こんなにバグが多い現状でもそうなんだ・・・最近Web始めてCSSしか知らない人じゃないですよね?ははは

>>705
そうですね。失礼しました

>>706
では世界中間違ったWebばかりですね。何故なんでしょう?

709Name_Not_Found :04/01/18 17:21 ID:???
釣りイラネ。

710Name_Not_Found :04/01/18 17:39 ID:???
>>702
外部スタイルシートが全ページ共通、とかなら、一度読み込んだあとは早くなるね(まぁちょっとだけど)

テーブルは本来の用途と違うだけじゃなく、音声読み上げブラウザ等で弊害がで安い

マジレスしちゃったけど、結局>>708は釣り士なのか……
世界中間違ったWebばかりなのです。理由はきちんと理解していない人が多いからです。

ま、俺も去年はテーブル使ってたけどナー

711Name_Not_Found :04/01/18 18:00 ID:???
>>710
CSSのみだとネスケ4.7とかでまともに表示できないじゃん

てかCSSのみなんて趣味でやるもんだろ
Web製作会社見てればわかるだろ。

712Name_Not_Found :04/01/18 18:04 ID:???
おれが見たとき変じゃなきゃいいよ

713【議論はどこで?】 :04/01/18 18:04 ID:???
さて、ココはCSS質問スレなのだが。

次の質問どぞー。

714Name_Not_Found :04/01/18 18:18 ID:???
NN4には@importでCSSを適用させないようにすりゃいいだろ
HTMLをしっかり書いておけばデザインが適用されなくても大丈夫

715Name_Not_Found :04/01/18 18:26 ID:???
商用サイトでそんなもん通用しねーよ

716Name_Not_Found :04/01/18 18:41 ID:???
CSSのfloatプロパティなんか知ってる奴が多くないんだろ。

717Name_Not_Found :04/01/18 18:46 ID:???
>>715
>商用サイトでそんなもん通用しねーよ

なぜ商用サイトの話が出てくるんだ?
テーブルレイアウトだろうが何だろうが、やりたければ勝手にどうぞ。

ここはCSS【質問】スレだ。議論はよそでやれ。よそで。

718Name_Not_Found :04/01/18 20:33 ID:???
>>715
通用させられない、
蔵を納得させられない、
自分の技量の無さと実績の無さを
えらそうに語るな。

719Name_Not_Found :04/01/18 20:49 ID:???
議論は他所で

720Name_Not_Found :04/01/18 21:25 ID:???
質問も他所で

721Name_Not_Found :04/01/18 21:27 ID:???
ここで質問する前に本買うとか、WEBで関連文書読んでから
質問しなさい。
あまりにも最近レベルが低すぎ
そうか馬鹿が多いのか(w


722Name_Not_Found :04/01/18 21:29 ID:???
釣り堀ではありません

723Name_Not_Found :04/01/18 21:50 ID:???
>>722
ここには釣る程のもではない、セルビンで十分

724Name_Not_Found :04/01/18 22:13 ID:???
それでは次の質問どうぞ

725Name_Not_Found :04/01/18 22:58 ID:???
>>6を見給へ。
>なかよしぱれっと (ネスケ4でも崩れない段組みの実例)
> http://village.infoweb.ne.jp/~fores/

726Name_Not_Found :04/01/19 00:50 ID:???
hr {
width: 100%;
height: 10px;
color: #000;
}
このような罫線をひいてみたのですが、Mozilla Firebird 0.7では
ボタンを押したような線が表示されてしまいました。
color: #000; を取り除いてみるとIE5.5でも同様の表示になったのですが、
Firebirdは罫線のcolorに対応していないのでしょうか?

727Name_Not_Found :04/01/19 01:02 ID:???
>>726
http://www.mozilla.gr.jp/standards/webtips0003.html

728Name_Not_Found :04/01/19 01:04 ID:???
>>726
hrは扱いがブラウザによって様々。このへん参照。
http://www.mozilla.gr.jp/standards/webtips0003.html

borderの使用も検討してみてはどうか。

729Name_Not_Found :04/01/19 01:36 ID:???
> では世界中間違ったWebばかりですね。何故なんでしょう?
 ポイ捨てが横行すりゃそれも正しい行為だと言う勢いだな。

730726 :04/01/19 02:01 ID:???
>727-728 どうもありがとうございます。解決しました。
borderを使うという方法も考えましたが、
今回はとりあえず<hr>のままでいってみます。

731Name_Not_Found :04/01/19 02:18 ID:???
>>726 既出。
hr要素へのスタイル指定
http://cssbug.at.infoseek.co.jp/misc/hr.html

732Name_Not_Found :04/01/19 03:22 ID:???
>>6のFAQ
>overflow プロパティは擬似フレームも作成できる
> http://alt.s31.xrea.com/tips/overflow.html
> http://alt.s31.xrea.com/files/frame.html
またまた移転した。↓
 http://kobit.info/tips/overflow.html
 http://kobit.info/files/frame.html

733Name_Not_Found :04/01/19 04:12 ID:???
恒久的なURIなど夢のまた夢。

734Name_Not_Found :04/01/19 12:34 ID:yYfChCEL
<table>
<caption>table1</caption>
...
</table>
<table>
<caption>table2</caption>
...
</table>

表示されたときにtable2のキャプションとtable1の間を空けたいのですが、
CSSでどのように指定すればいいのでしょうか?


735Name_Not_Found :04/01/19 12:42 ID:???
>>734
margin

736734 :04/01/19 13:50 ID:yYfChCEL
tableにmarginを設定するとIEだと空いて、Mozillaだと空かない。
captionにmarginを設定するとIEだと空かなくて、Mozillaだと空く。

どちらが正しいのかは知らないけど、同じ書き方はできないでしょうか?


737Name_Not_Found :04/01/19 13:58 ID:???
じゃ、中とって padding

738734 :04/01/19 14:52 ID:yYfChCEL
captionにpaddingを設定したら、IEとMozillaで同じ表示になりました。
ありがとうございます > 737


739Name_Not_Found :04/01/19 15:34 ID:???
>>734
おそらく Mozilla の方が正しいだろう。

740Name_Not_Found :04/01/19 15:56 ID:???
>>737
それは中なのか?w

741Name_Not_Found :04/01/19 19:23 ID:???
テーブル関連テスト キャプションのマージン
 http://is.vis.ne.jp/tests/tables/caption/margin.html


742Name_Not_Found :04/01/19 19:34 ID:???
>>739
tableを margin-left: auto; margin-right: autoでセンタリングするとcaptionだけセンタリングされない。
http://bugzilla.mozilla.gr.jp/show_bug.cgi?id=2496

Netscape Navigator/Mozillaの問題点
http://homepage2.nifty.com/hobbit/html/netscape.html

743Name_Not_Found :04/01/20 12:34 ID:???
Macromediaのサイトのように、boxの角に丸い画像を貼り付けるのは、どうしたらよいのでしょうか?
imgタグに背景画像、背景色等を組み合わせてみるのですが、どうもうまくいきません。

おそらく他の考え方で成立するのでしょうが、アイデアがでません…

744Name_Not_Found :04/01/20 14:09 ID:???
>>743
Macromediaのサイトのソース見てわからないようであれば諦めましょう。
テーブルででもやったらどうですか?

745Name_Not_Found :04/01/20 14:50 ID:???
>>743
上下それぞれの「フタ」になる画像をあらかじめ用意しておいて、
<div style="background: url(ue.gif);"> </div>
<div>本文</div>
<div style="background: url(sita.gif);">&> </div>
とまぁなんでも良いので本文の上下のブロックの背景に「フタ」の画像を設定すれば良い
微調整は自分でやんな

746743 :04/01/20 15:07 ID:???
>>745
回答、ありがとうございます。
boxを%で指定しています。pxでboxのwidthをきっちり固定しているのなら、
>>745の回答できちんと対応できるんですが…。

>>744
説明不足でしたね
boxは%で指定しているので、px固定だったら、きっちりできます。

指摘される以前から、IEはboxの解釈がおかしいので、しかたなく
tableで対応させてはいるんですが。

透過gigでbodyの背景色を出したいので、box内での背景色を
影響させずにするには…、と考えているところです。

747Name_Not_Found :04/01/20 15:15 ID:???
質問させてください。
MacIEのバックスラッシュハックの事ですが、
コメントを{}の中に入れてもバックスラッシュハックは機能するのでしょうか?

例えば、

hoge {
color: #000000;
background-color: #ffffff;/*ハック開始\*/
border: solid 1px #000000;/*ハック終了*/
}

この様な事もできるのでしょうか?

また、1ファイルの中で、何回も使用できるのでしょうか?

もう一つ、バックスラッシュは、BackSpaceの左のキーと、「ろ」のキーと
どちらでも大丈夫でしょうか?

当方Windows環境しかないため、確認が取れません。
よろしくお願いします。

748Name_Not_Found :04/01/20 15:55 ID:???
>>746
とりあえずマイクロメディアは横幅決め打ちなのだ

749747 :04/01/20 16:29 ID:eLtUpxue
ごめんなさい。
一回だけageます。

750Name_Not_Found :04/01/20 16:54 ID:???
>>747
その例で大丈夫。
MacIE5でborderが無視されるようになる。
{}の外・内のどちらでも、また併用でも可で、回数の制限もないはず。
\と\は記述してる文字コードのほうで書けばいい。

751747 :04/01/20 17:16 ID:eLtUpxue
>>750
丁寧な受け答え、ありがとうございます。
助かりました。


752Name_Not_Found :04/01/20 17:38 ID:???
:before と :after がまともに動作すればらくだよね。
漏れは js で前後に蓋と底になるためだけの要素を生成してます。

753Name_Not_Found :04/01/20 18:23 ID:???
CSSでHTMLのvalignタグと同じ働きのものってありますか?
ページの中央にコンテンツを表示させたいんですが、vertical-alignを使っても上手くいきません。

754Name_Not_Found :04/01/20 18:36 ID:???
>>753
なぜFAQを見ないのか。Q6(>>7)です。

だいたいvertical-alignはテキスト(インライン)の垂直位置だってのもわかってないみたいだし。
http://msugai.fc2web.com/web/CSS/text.html#vertical

755Name_Not_Found :04/01/20 22:17 ID:???
CSSバグ辞典スレッドの対象かもしれませんが、勘違いしているかもしれませので質問させて頂きます。
MozillaFirebird0.7(20031007)を使っているのですが、
<p><img src="hoge.png" width="x" hright="x" alt="hoge" /></p>
として、
p object{margin:0px; padding:0px;}
p img{border:1px solid black;}
とするとwidth/heightとも、x-2(50なら48)として算出・表示されてしまいます。
IE6.0ではちゃんとxとして表示されたのですが、どちらが正しいのでしょうか?


756Name_Not_Found :04/01/20 22:18 ID:???
あ、CSSには
* {box-sizing : border-box;}
* {-moz-box-sizing : border-box;}を指定しています。
関係ないとは思いますけど・・

757Name_Not_Found :04/01/20 22:28 ID:???
>>756
氏んでください。

758Name_Not_Found :04/01/20 22:29 ID:???
あ、やっぱりなんか勘違いしてましたか。
勉強しに逝ってきます

759Name_Not_Found :04/01/20 22:31 ID:???
>>756
関係ありまくりだ( ゚Д゚)ヴォケ!!

760Name_Not_Found :04/01/20 23:35 ID:oCiMVtb0
テーブルのスタイルシートで
マウスをおくと色がかわるものを探しています。
ぐぐりましたが発見できず。。
厨なあたしですが、良かったらおしえてください

761760 :04/01/20 23:36 ID:???
あげてしまってごめんなさい
回線切って首吊ってきます

762Name_Not_Found :04/01/20 23:58 ID:???
>>761
質問でageるのはいいんだがな。

質問内容がわけわからん。

763760 :04/01/21 00:04 ID:???
>>762
ΣΣ(o_o)ごめんなさい
えっと、テーブルが4つぐらい並んでるじゃないですが
税所は赤なのにマウスをおくと色が変わって白になったりするんです
スタイルシートだったようなきがするんですけどもしかして違うかもです
違ってからごめんなさい;

764Name_Not_Found :04/01/21 00:08 ID:???
>>760
ひょっとして、セルにカーソルをのせたら、変化するとかいうこと?

td {
background-color:#ddd;
color:#111;
}
td:hover {
background-color:#eee;
color:#000;
}

ただし、当然MSWinIEは、a要素以外の:hoverには非対応。

765Name_Not_Found :04/01/21 00:09 ID:???
どうしてもしたいっていうなら、JSか。

766764 :04/01/21 00:13 ID:???
>>763
あなたが、IEで見てたのなら、javascriptだったのかもしれない。
javascriptだったらスレ違いなのでスクリプトの質問スレへどうぞ。

767760 :04/01/21 00:16 ID:???
>>766
そうかもしれません。IEだったので…
>>764さんのを入れてもなりませんでした。

あっちのスレにいってきます(o^◇^o)誘導ありがとうですっ

768Name_Not_Found :04/01/21 00:26 ID:???
何だろう…

>>767に殺意を感じた…

769760 :04/01/21 00:40 ID:???
>>768
顔文字のせいですか?ごめんなさい…

770Name_Not_Found :04/01/21 00:45 ID:???
>>760
>マウスをおくと色がかわるものを探しています。
ここは探し物のスレではありません。

771Name_Not_Found :04/01/21 00:48 ID:???
>>770
もう誘導済みなんだから、いいじゃねぇかよ。
ネチネチして気持ち悪いな。

772Name_Not_Found :04/01/21 01:17 ID:???
MacIE5でtableにたいして、border-collapse: collapse; も border-spacing: 0px; も無視されるわけだが、CSSで表のセルの間隔を詰める方法って他にない?

<table cellspacing="0">と出来れば良いのだが、相手が某サービスの某モジュールなので、タグには手も足も出なくて困ってる。


773Name_Not_Found :04/01/21 02:29 ID:TMb9LOEb
よく利用するようなタグでCSSを組み利用し、行間をほどよく空けていたのですが
画像を利用すると行間指定のCSSが無視されてしまいます。
これは仕様なのでしょうか?

例>画像(12*12)テキスト

上記のような感じです。画像はよく文の最初に置くような小さいファイルです。
使用しているCSSはhttp://www.border.jp/uploader/img/707.zipにうぷしました。

どうぞアドバイスよろしくお願いいたします。

774Name_Not_Found :04/01/21 03:34 ID:???
>>773
HTML&CSSソースをここに記すこと。使用ブラウザとそのヴァージョンも。

775Name_Not_Found :04/01/21 03:50 ID:TMb9LOEb
>>774
http://www.border.jp/uploader/img/708.zip【html】
http://www.border.jp/uploader/img/707.zip【css】
使用ブラウザ:IE6.0.2800.1106

お手数おかけします。これが環境になります。
仕事のためこれから就寝しますが、明日の昼には見ることができると思います。



776Name_Not_Found :04/01/21 03:51 ID:???
>>772
table{border-style:none}
th,td{border:1px #000 solid}
ではどうだろう。試してないけど。

777Name_Not_Found :04/01/21 07:59 ID:???
775のソースとやらが衝撃的だったので今日一日はトイレから出ないことにする

778Name_Not_Found :04/01/21 09:58 ID:???
>>776
無理ですた。
tableのボーダーは表の周りのボーダーだし、th,tdのborderやmarginを調節してもセルの間隔は変わらないんだよねぇ。
MacIEの困ったちゃん。

779Name_Not_Found :04/01/21 10:56 ID:???
>>775 だからソースは「ここに」記せって。いちいち圧縮するな、見るの面倒臭い。

780Name_Not_Found :04/01/21 12:43 ID:++dQIGAQ
---------------------------------------------------------------
<h3>其の一</h3>
<img src="./img/1.jpg" width="120" height="120" alt="米" />
<p>みんな米を食べようぜ</p>
<h3>其の二</h3>
<img src="./img/2.jpg" width="120" height="120" alt="酒" />
<p>酒飲もうぜ</p>
<h3>其の三</h3>
<img src="./img/3.jpg" width="120" height="120" alt="魚" />
<p>酒魚うまいぜ</p>
---------------------------------------------------------------
img {
float : left;
}
h3 {
clear : left;
margin : 1em 0em 0em 0em;
}
p {
margin : 0em;
}
---------------------------------------------------------------
ネスケとかモジラで見るとimgとh3の間にスペースができません。
うえのでいうと、「米の画像」と「其の二」の間、「酒の画像」と「其の三」の間に1em分の空きをつくろうとしたいのです。
どうしたらよいのでしょうか?

781Name_Not_Found :04/01/21 12:55 ID:???
>>780 "marginの相殺"か?

782Name_Not_Found :04/01/21 13:19 ID:???
>>780
imgはインライン要素だから、<p>か、<div>の中に入れておかないと・・・・

783780 :04/01/21 13:32 ID:8eWu3+yf
ああ、ちゃんとはいってます。

<div>
<h3>其の一</h3>
<img src="./img/1.jpg" width="120" height="120" alt="米" />
<p>みんな米を食べようぜ</p>
<h3>其の二</h3>
<img src="./img/2.jpg" width="120" height="120" alt="酒" />
<p>酒飲もうぜ</p>
<h3>其の三</h3>
<img src="./img/3.jpg" width="120" height="120" alt="魚" />
<p>酒魚うまいぜ</p>
</div>

オペラとIEではコチラの都合どおりなんですが・・・

784Name_Not_Found :04/01/21 14:44 ID:???
>>780
Mozilla が正しい実装です。'clear: left' の効果は:
>要素のボーダー上辺が、ソース文書内でそれ以前に出現するあらゆる左フロートの外下辺より下であるように、要素が生成するボックスの上マージンを十分大きくする。
従ってh3要素の上マージンの指定は、ボーダー上辺を揃えるために無視されます。

提示された例の場合、h3要素を 'margin: 0' にして、
img要素に 'margin-bottom: 1em' を指定すると意図通りになると思います。

785775 :04/01/21 15:11 ID:TMb9LOEb
>>779
以前ソースをスレに張ったら「ここに張るな。どっかに上げろ」と言われまして・・。
申し訳ありませんでした。それと、凄く長いソースなので問題部分だけを張ります。

<table width="780" height="200" border="0" cellpadding="0" cellspacing="0" bordercolor="#000000">
<tr>
<td width="200"><img src="image/**.jpg" width="200" height="200"></td>
<td width="580" background="image/**.gif"><div class="a">
<div align="left"><img src="image/**.jpg" width="12" height="12">04.18-あいうえおかきくけこさしすせそ<br>
04.18-あいうえおかきくけこさしすせそ
</div>
</div> </td>
</tr>
</table>


786Name_Not_Found :04/01/21 15:22 ID:???
>>772
最終手段で DOM でなんとかするとか。
スレ違いではあるが…

window.onload = function()
{
  var tables = document.getElementsByTagName('table');
  for (var i=0; i<tables.length; i++)
    tables[i].cellSpacing = 0;
}

787Name_Not_Found :04/01/21 18:32 ID:???
初心者向けのcssの本ってあります?
解説付きの本が好きです

788Name_Not_Found :04/01/21 19:50 ID:???
>>785 なんだかひどいHTMLだが、で、CSSソースは? どんなスタイル指定したかがわからんよ。

789Name_Not_Found :04/01/21 19:51 ID:???
>>787
残念ながら初心者向けの良い書籍、ウェブサイトは余りありません。
私も書籍を買ったことがありますが、多くは残念な思いを致しました。
まず HTML をちゃんと理解してから CSS を学びはじめてください。
というかスレ違いです。優れた本を訊くスレではありません。

とりあえず 2ch Books 辺りを参照してください。
http://www.1point.jp/~book_2ch/web/

790Name_Not_Found :04/01/21 19:54 ID:???
>>787 >>4の解説サイトでは足りないのか? 無料で見られるし。

791京阪沿線マソ ◆0atqBUamHk :04/01/21 22:32 ID:I+5xZyzO
http://www.geocities.jp/koreyoro/
http://www.geocities.jp/koreyoro/menu_stlsht.css
すいません、以前ここで質問したものなのですが
メニュー上部の画像をすぐ下のテーブルに
引っ付けたいのですがどうすればいいのでしょうか?
以前は上部画像を<div>で囲むように言われ
解決したのですが。
<img width height>を指定したとたん元通りに
なってしまいました。

792Name_Not_Found :04/01/21 22:36 ID:???
>>791 margin

793京阪沿線マソ ◆0atqBUamHk :04/01/21 22:43 ID:I+5xZyzO
>>792
テーブル、画像のマージンを0にしたのですが
直らないのですが・・・・・・

794Name_Not_Found :04/01/21 22:47 ID:K09p6yvu
すみません、教えてください。
画像の枠指定をしているのですが、それをjpgのみに適用しgifには適用させないように
したいのですが、どう指定していいのか分かりません。
よろしくお願いします。

795Name_Not_Found :04/01/21 22:51 ID:???
>>794 拡張子だけで判別させるなんて無理。imgにclassを振るべし。

796Name_Not_Found :04/01/21 22:51 ID:???
>>790
どこの馬の骨が書いたかわからないような解説サイトなんて信用できん。
無料だからこそ余計に信用できない。
高い本こそ良い本に決まっている。

いままで何人かの初心者と接する機会がありましたが、
このように考える人がむしろ多いかと。

797Name_Not_Found :04/01/21 22:55 ID:???
だとしたら、どこの馬の骨が教えたか分からない本なんて買えないよな

798Name_Not_Found :04/01/21 22:56 ID:???
>>793 
ならばチト強引だがmarginにマイナス値でも設定すれば?
どうしてもピッタリくっつけたいならね。
IE以外のブラウザでも確認して見るとよいよ。

799京阪沿線マソ ◆0atqBUamHk :04/01/21 23:03 ID:I+5xZyzO
>>798
ちょっと他のブラウザでも調べてみます・・・・・
マイナスは最終手段にして。



画像のサイズ指定したとたんこうなるのは何でだろう・・・・・・

800Name_Not_Found :04/01/21 23:07 ID:???
>>786
Javascriptはじかれちゃった(´・ω・`)ショボーン。
<script>って書くと>script<ってエンコードされちゃうの。
はてなダイアリーの困ったちゃん。

801Name_Not_Found :04/01/21 23:15 ID:???
>>797
本は一応著者の名前が出てるし。
出版社の名前も影響するだろうし。

仕様書の存在を知らないアホが書いた紙クズでも
本になってれば人は信用して買っていく。

802Name_Not_Found :04/01/21 23:25 ID:???
内容では無くて価格に価値を求める人が多いんだよ。
そう思う方がわかりやすいからね。現状とは別問題で。

803794 :04/01/21 23:26 ID:???
>>795
ありがとうございます。
どおりでどう検索しても出てこないハズですね。
失礼しました。

804Name_Not_Found :04/01/21 23:27 ID:???
>>786,800
(´ι _`  ) Scriptもしょぼいがスレ違い


805 :04/01/21 23:27 ID:???
誤:どおりで 
正:どうり(道理)で

806800 :04/01/21 23:43 ID:???
>>800
>>script<

ぬを、&gt;と&lt;を反対に書いてしまった。しかもちゃんとデコードされちゃってるし。
さすがに<script>が>script<には成りません(´・ω・`)ショボーン。


>>804
うん。ごめんね。おわびにちんこあげる( ・ω・)ノ――――――――ω

807775 :04/01/22 00:13 ID:DQC9cjEt
>>788
よろしければ>>775にうpしてありますので、それを参照していただけますでしょうか?
長くて改行エラーが出てしまいました。

808Name_Not_Found :04/01/22 00:20 ID:???
要点を記せないのかねえ。
/*コメントアウト*/で絞り込んで実験すれば、どれが原因かわかるはず。

809Name_Not_Found :04/01/22 00:30 ID:???
line-heightは単位無しの実数値指定が一番だよな。
http://d-club.cside.ne.jp/mt/archives/line-height_test.html
http://pc3.2ch.net/hp/kako/1038/10384/1038437758.html の241・834参照。

810Name_Not_Found :04/01/22 10:38 ID:???
>>799
vertical-align:bottom;
にしてみ。IEでできる下の隙間はそれでとれる。
他のブラウザでは関係ないけど。

811775 :04/01/22 14:24 ID:DQC9cjEt
どなたもわかりませんでしょうか?

812Name_Not_Found :04/01/22 14:32 ID:NfyQIhL3
画像(その先にリンク有)を2枚並べたい時(横でも縦でも)、どうすればよいのでしょう。
HTML時代は、テーブル作ってその中に画像を組み込んでいたのですが、
CSSではこういうテーブルの遣い方はヨシとはされていないのですよね?

余りに初歩的な質問だったらならばごめんなさい。探し方が悪いのか
本も持っているのだけれど何だか載ってないし、色々なサイトも見たけど
見付からない(涙)。

よろしくお願いいたします。

813Name_Not_Found :04/01/22 14:36 ID:???
>>812
意味がよく分からない。普通に書けば並ぶと思うんですが。

814Name_Not_Found :04/01/22 14:40 ID:???
横に並べる  <img><img>

縦に並べる  <img><br><img>

815Name_Not_Found :04/01/22 14:41 ID:???
>>812
あと「CSSでは」じゃなくて「HTMLでは」です。

816Name_Not_Found :04/01/22 14:41 ID:NfyQIhL3
>>813 あ。そうなんですけど、普通に書いただけだと、例えばウィンドウを
大きくすれば2つ目の画像は1つの画像の横に、逆に小さくすれば1つ目の画像の下に
2つ目の画像が来てしまいますよね。そうではなく、いつでも横に2つなり縦2つなり
画像が並ぶようにしたいのです。

言葉が足りなくてごめんなさい。

817Name_Not_Found :04/01/22 14:43 ID:???
>>811
ソースがアレでショボーンとする。
ともかく、line―heightは効いてると思うのですが、何が問題か良くわかりません。
ひょっとして、12×12ピクセルの画像の配置?

818Name_Not_Found :04/01/22 14:45 ID:GFu/Z4oR
すいません。初心者すれでしつもんしましたが、
こちらのほうが適切かと思い再度質問させて下さい。
ながれをむししてたらごめんなさい

発言番号622
はじめまして。この板は初めてきました
MAC OS Xで、operaでスタイルシートでフォント指定したのですが
うまくいきません。mozilla、IEではうまくいきました。
日本語を等幅フォントで表示したいのです。よろしくお願いいたします


発言番号625
OSAKAの指定は一等幅が優先されるようなので
font-family:OSAKA;を指定しました。
monospace指定はnetscapeの古い4.xで化けるので避けました
特に、osakaにこだわりがあるのではないです、
等幅で表示したいのです
IEはデフォルト表示が等幅だったので、問題なしで、
mozillaではちゃんとosaka一等幅で表示されました。

819Name_Not_Found :04/01/22 14:51 ID:???
>>811 >>809は見た?

820Name_Not_Found :04/01/22 14:55 ID:???
>>818
>IEはデフォルト表示が等幅だったので、
そんなことは、ない。少なくともWinIEでは。

>monospace指定はnetscapeの古い4.xで化けるので避けました
等幅指定はmonospaceが必須。
NN4なんて駄目ブラウザには、CSS除けをかましておけばよい。
・ブラウザによる振り分け (JavaScriptを使用しない方法)
 http://east.portland.ne.jp/~sigekazu/css/boxm.htm#ua

821Name_Not_Found :04/01/22 14:58 ID:???
Opera CSSバグリスト
フォントファミリ指定で1フォントしか認識しない(6.0/7.0)
http://cssbug.at.infoseek.co.jp/detail/opera/b002.html

822Name_Not_Found :04/01/22 15:13 ID:???
>>818
>IEはデフォルト表示が等幅だったので
ユーザ側で自由にデフォルトフォントを設定できるのだが。
ユーザ設定が自分の環境と同じになっているとは限らない罠。

>monospace指定はnetscapeの古い4.xで化けるので避けました
要するに「MacOS以外の環境なんて知りません」ってことか。
Windows には普通、Osakaフォントは無いから等幅にならない罠。

823818 :04/01/22 15:15 ID:GFu/Z4oR
あ、わかりにくくてすみません
マックOSXでのはなしです。
ウィンドウズの方のスタイルシートはmonospaceで
していしています。

824818 :04/01/22 15:19 ID:GFu/Z4oR
うぃんどうずは、IEでもオペラでも
ちゃんと等幅になってることをかくにんしました

825Name_Not_Found :04/01/22 15:21 ID:???
というか font-family:OSAKA; では等幅にならんだろう。
そもそも “Osaka” と記述しないと Osaka にもならないし。
等幅にしたいなら font-family: "Osaka−等幅"; だろう。

826818 :04/01/22 15:25 ID:GFu/Z4oR
連続カキコすみません。

>>821
ありがとうございます。でもこのURLで紹介されてるのは
winですよね。

824につけくわえて、Winのモジラもだいじょうぶでした。

>>820のURL参考になりました。どうもありがとうございます!

827818 :04/01/22 15:27 ID:GFu/Z4oR
>>825
ご指摘有り難うございます。
Osakaの表記については書き込む時に間違えて大文字でうってしまいました。

828Name_Not_Found :04/01/22 15:35 ID:???
というか Opera の[ページスタイル]の設定は確認したのか。

829812 :04/01/22 15:58 ID:???
画像2つ並べるには?です。ちょっと色々分からなくなって来たので
また出直します。ご指摘ありがとうざいます。そうですよね。
何だか鬱になって来た・・・ダメソ

830818 :04/01/22 15:59 ID:GFu/Z4oR
>>828

ありがとうございます!ユーザーモードにチェックが入っていました!!!
はずしたら、オオサカフォントの表示になりました!!!

色々な指定を試してみたのですが、IEやモジラにくらべて
行間や字間や行末約物が狭めみたいですね。

831Name_Not_Found :04/01/22 16:00 ID:???
tableタグ使わないでdivで左にナビ、右にメインを表示するのってどうなんですか?
外国で主流っぽいけど、それのどこがいいんですか?

832Name_Not_Found :04/01/22 16:04 ID:???
ちょっくら、釣りのエサ買ってくるわ。

833775 :04/01/22 16:34 ID:DQC9cjEt
>>817
ソースに関しては、あまりにも長すぎるのでうpしようと思ったのですが
「面倒だから、いちいちうpするな」と言われましたので、一部分だけ張りました。
12×12の画像は普通に横に置いているだけなのですが、行間に影響してしまいます。

>>819
申し訳ないです。>>809さんは私へのレスだと思っていませんでした。
早速試してみようと思います。

834Name_Not_Found :04/01/22 16:41 ID:???
>>833
頭悪いのかな……。
ソースは全部でなく要点だけ記せばいい話でしょ。
わざわざ解凍の必要なzipファイルでよそのサーバーにアップしたのなんて大抵見る気しませんよ。
CSSソースだって、無駄な改行無くせば、充分ここにさらせる量でないの?

835Name_Not_Found :04/01/22 16:54 ID:???
・問題の切り分けが下手
・表現能力が低い
・流れが読めない
・自分の文章の客観視ができない
・要領悪い
たいていセットになっているから話が進まない罠。

836818 :04/01/22 17:02 ID:GFu/Z4oR
>>812さん

<nobr><img><img></nobr>
でどうですか??

837Name_Not_Found :04/01/22 17:05 ID:???
>>836
おい、貴様、ここがCSSスレッドとしっての狼藉か。
自働改行禁止はCSSなら white-space:nowrap; だろが。
初歩だよ、初歩。

838818 :04/01/22 17:07 ID:GFu/Z4oR
>>837
あ、ありがとうございます。
べんきょうになりました

うえのほうでhtmlでみんなアドバイスしてたのでついつられました!!

839Name_Not_Found :04/01/22 17:09 ID:???
責任をとって切腹せよ

840775 :04/01/22 17:17 ID:???
>>834
>ソースは全部でなく要点だけ記せばいい話でしょ
うーん・・・既に要点だけ張ってあるのですが(w


841Name_Not_Found :04/01/22 17:26 ID:???
まだわからんのか。要点だけ“ここに”記せ。>>840

842818 :04/01/22 17:31 ID:GFu/Z4oR
>>839

できないです。ごめんなさい!!

843Name_Not_Found :04/01/22 17:35 ID:???
>>838
>うえのほうでhtmlでみんなアドバイスしてたのでついつられました!!

それにしても、よりによって非推奨要素の<nobr>なんぞを持ち出すところがなんともはや。
知らないことに口を出してはいかんよ。

>>840
 >>788>>808


844775 :04/01/22 17:49 ID:???
>>841

>>785

845Name_Not_Found :04/01/22 17:51 ID:???
>>844

>>788

846Name_Not_Found :04/01/22 17:52 ID:???
788 :Name_Not_Found :04/01/21 19:50 ID:???
>>785 なんだかひどいHTMLだが、で、CSSソースは? どんなスタイル指定したかがわからんよ。

847775 :04/01/22 17:53 ID:???
>>845

>>775

848Name_Not_Found :04/01/22 17:54 ID:???
>>847

>>841

849Name_Not_Found :04/01/22 17:54 ID:???
>>847

834 :Name_Not_Found :04/01/22 16:41 ID:???
>>833
わざわざ解凍の必要なzipファイルでよそのサーバーにアップしたのなんて大抵見る気しませんよ。
CSSソースだって、無駄な改行無くせば、充分ここにさらせる量でないの?

850775 :04/01/22 17:57 ID:???
>>848

>>112

851Name_Not_Found :04/01/22 17:58 ID:???
>>775は文章が読めない人みたいだから、結局、解決策を教示してやっても無駄なのでは。

852Name_Not_Found :04/01/22 18:02 ID:???
>>850 「<dl class="example">」がどうかしたのか?(笑)

853Name_Not_Found :04/01/22 18:14 ID:???
ぐだぐだ言ってないで落とせばいいだろ。
アホか。

HTMLソース
>>785

CSSソース
td { letter-spacing: 0.2em; line-height: 15pt; font-size: 10pt; }
A:link { color:black }
A:visited { color:black }
A:active { color:black }
A{ text-decoration:none }
A:hover { text-decoration:underline; }
A { line-height: 20pt; }
.a { font-size : 10pt; padding: 10px; }

素晴らしいソースだな。
特にa要素周りが。

854Name_Not_Found :04/01/22 18:25 ID:???
>>853
わざわざ落として解凍してそれか。
ついでに「回答」もしてやれよ。



なんちゃって!!!!!!!!!

855Name_Not_Found :04/01/22 18:28 ID:???
809 :Name_Not_Found :04/01/22 00:30 ID:???
line-heightは単位無しの実数値指定が一番だよな。
http://d-club.cside.ne.jp/mt/archives/line-height_test.html
http://pc3.2ch.net/hp/kako/1038/10384/1038437758.html の241・834参照。

856818 :04/01/22 18:40 ID:GFu/Z4oR
>>843

ごめんなさい。これからきをつけます。
でも、べんきょうになりました。ありがとうございます!



>>846 >>855

デジャブ合戦?

857Name_Not_Found :04/01/22 18:48 ID:???
アホを相手にするのもなかなか骨が折れるという見本

858Name_Not_Found :04/01/22 20:56 ID:???
>>853
俺もa要素周りは同じ感じなんだがもしかして俺も糞ですか?
まぁcolorが全部同じblackってとこは意味わかんないが。

香ばしいな

859Name_Not_Found :04/01/22 21:05 ID:???
おまえら、質問はなんだったのか、もはや覚えていやがりませんよね。
漏れもです。

860Name_Not_Found :04/01/22 22:10 ID:???
>>853
何をしたいの?
何をいいたいの?
...

861ジャム襲来 :04/01/22 22:16 ID:???
要するに、最低限のhtmlどころか、最低限の日本語による論理的な
コミュニケーションが取れない方はお引取りください、ってこった。だと思う。

862Name_Not_Found :04/01/22 22:20 ID:???
リンクには下線引いてくれよ頼む

863Name_Not_Found :04/01/22 22:22 ID:???
>>775
落としたソースで>>773の状況が再現出来なかったんで、
やりたい事と現状が理解できないんだけどさ。
line-height:15ptとしてるけど、
これを30ptや50ptにしても行間は変化無しなんですか?
微妙でも変化するなら適用はされてるとおもうんだけど。

864Name_Not_Found :04/01/22 22:56 ID:???
字間を空けるために、letter-spacingを1pxで指定すると、
改行の1行分が詰まってしまうのは仕様ですか?

1行あけたところ→空きなし
2行あけたところ→1行分の空き

字間も空けつつ、行送りは元のままでっていうのは無理かな。

865Name_Not_Found :04/01/22 23:04 ID:???
>>864
IEのバグ。
http://members.at.infoseek.co.jp/cssbug/detail/winie/b022.html

866Name_Not_Found :04/01/22 23:17 ID:???
ちょっと小難しいこと聞きますが、普段リンクの下部に点線を表示させておいて
マウスオーバーで背景色を出すということは可能ですか?

点線:青色
マウスオーバー:点線を表示させたまま背景色を薄青で表示(その他の線は出さない)
IEでリンクを押した瞬間に出る黒い点線も出したくないです。

実現可能かわかりませんが、よろしくお願いいたします。

867Name_Not_Found :04/01/22 23:18 ID:???
>>865
ありがとう!

868Name_Not_Found :04/01/22 23:22 ID:???
866がムカツク

869Name_Not_Found :04/01/22 23:22 ID:???
>>864
「改行」っていうのは、連続brタグのことなのかよ。
漏れは改行というと CR か LF しか思い浮かばないんだけど。
ってか、連続<br>は「行送り」ではないだろう。line-height≒行送り。
<br><br> ってダサい。CSSの前にHTMLを理解しろよって感じ。

870Name_Not_Found :04/01/22 23:26 ID:???
>866

>点線:青色

a に border

>マウスオーバー:点線を表示させたまま背景色を薄青で表示(その他の線は出さない)

a:hover に background-color と text-decoration

>IEでリンクを押した瞬間に出る黒い点線も出したくないです。

WindowsIEではCSSではムリ(のはず)

871866 :04/01/22 23:26 ID:???
>>868
うお、何か気に触ること言ってしまったのでしたらゴメンなさい(;´Д`)

872Name_Not_Found :04/01/22 23:28 ID:???
>>869
今時<br><br>がダサいって奴も珍しいな。それは一昔前の話だろ。

873866 :04/01/22 23:29 ID:???
>>870
borderだと破線が出なかったんです。

874Name_Not_Found :04/01/22 23:30 ID:???
>>871
>>1読んだら解る事を「小難しい事」などと言うのがムカツク
>>872
どこのカスだお前は

875Name_Not_Found :04/01/22 23:30 ID:???
小難しいとか書かれてたのが小馬鹿にされたみたいで気に障っちゃったんだろ

876Name_Not_Found :04/01/22 23:32 ID:???
厨がいるねえ・・・冬休みまだ終わってなかったっけ。

877Name_Not_Found :04/01/22 23:39 ID:???
IE5.5以降だと

<a href="#" hidefocus>ほげ</a>

でリンク周りの点線が出ないんだなぁ。
標準でないのが気に入らんっちゅうなら

<a href="#" onmousedown="this.hideFocus=true">ほげ</a>

か。どっちにしてもCSSの話じゃないな。

878Name_Not_Found :04/01/22 23:39 ID:???
>>871
可能かどうかは、仕様書やリファレンスを読めば解かるだろ。
少しは自分で調べたり、学習したり、試しなさいよ。
何か疑問に思ったら、その度に人に訊くのですか貴方は。
自分で何の努力もせず、答えだけを要求するという怠慢な態度が許せん。

879Name_Not_Found :04/01/22 23:40 ID:???
いや、夏休みかもしれないぞ。

880Name_Not_Found :04/01/22 23:42 ID:???
>>879
さっきから何やってんの?

881Name_Not_Found :04/01/22 23:44 ID:???
きっと毎日が夏休みなんだろ。

882Name_Not_Found :04/01/22 23:45 ID:???
ゴールデンウィークかもしれないぞ

883Name_Not_Found :04/01/22 23:50 ID:???
>>873
これでどうだ
border-bottum:1px dotted blue

884Name_Not_Found :04/01/22 23:54 ID:???
bottumたん(;´Д`)ハァハァ

885883 :04/01/22 23:56 ID:???
すまん,漏れが悪かった
border-bottom:1px dotted blue

886Name_Not_Found :04/01/22 23:58 ID:???
今時<br><br>のが珍しい気がするが……
つーか破線ってdashedのことじゃないのか。ケツにセミコロンもないし。

887Name_Not_Found :04/01/23 00:04 ID:???
↑ネタは余所でやってくれ

888Name_Not_Found :04/01/23 00:13 ID:???
残念ながら<br><br>のような糞htmlのが圧倒的に多いけどね。
それがダサイ事には変わりないが。つーか、スレ違い。

889866 :04/01/23 00:22 ID:???
>>874
何かよくわかりませんがスミマセンでした。

>>877
win+IEでは無理というお話でしたので、その点についてはあきらめます。

>>878
自分で試してみて、どうにも破線が出なかったのでお聞きしたんです。
疑問に思ったのですが、どう検索すればよいのやらという感じでした。

>>883
ありがとうございます。早速試してみます。



890Name_Not_Found :04/01/23 00:35 ID:???
>>889
試してみますじゃなくて、できたorできなかったの方がいいと思うYO!

891Name_Not_Found :04/01/23 00:43 ID:???
>>773=775 >>818 >>889-890
もう来なくてイイよ。スレ汚れるから。

892Name_Not_Found :04/01/23 00:49 ID:???
っつーか<br><br>のサイトって多いだろ。俺もよく使うんだが
それ以外の指定方法でオススメってあるのか?

893Name_Not_Found :04/01/23 00:49 ID:???
>>892
あんたはなんでこのスレにいるの?

894Name_Not_Found :04/01/23 00:53 ID:???
>>893
スレタイをよく読め。

<style type="text/css">
<!--
div.test { margin-bottom : 2em ; }
-->
</style>
</head>
<body>
<div class="test">
<p>テスト用カキコテスト用カキコテスト用カキコ</p>
</div>
<p>テスト用カキコテスト用カキコテスト用カキコ</div>
</body>

例えばこれで2行分空けたとする。でも3行空けたい。1行しか空けたくない。
こんな場合はいちいちclassを作んないと駄目。わかるか?
<br>に勝るものがないだろ。

895894 :04/01/23 00:55 ID:???
しかも「単純な改行」に関しては<br>以外ない。4文字で済むタグに
勝るものがあれば教えてくれ。俺は無いと断言できる。

896Name_Not_Found :04/01/23 00:55 ID:???
>>894
>でも3行空けたい。1行しか空けたくない。
 見栄えだな。

897Name_Not_Found :04/01/23 00:55 ID:???
>>894
なんのためのstyle属性だ

898Name_Not_Found :04/01/23 00:55 ID:???
>>895
文字数でCSSが推奨されてるわけじゃない。つまらんからカエレ。

899Name_Not_Found :04/01/23 00:59 ID:???
要するに、根本的に、htmlもxhtmlもCSSも分かっていない、ということか。
「h1は文字を大きくするタグ」、とか思って、そこから脱却できないクチか
それと五十歩百歩の香具師。

900Name_Not_Found :04/01/23 01:05 ID:???
>>899
しかも「単純な文字巨大化」に関しては<h1>以外ない。4文字で済むタグに
勝るものがあれば教えてくれ。俺は無いと断言できる。

901Name_Not_Found :04/01/23 01:06 ID:???
>>899
「h1」って文字を大きくするタグじゃないんですか?

902Name_Not_Found :04/01/23 01:07 ID:???
>>901
ごめん。気の利いたボケが思いつかない。

903Name_Not_Found :04/01/23 01:10 ID:???
>>902
知らなかった。俺見出しの為の大きくするタグだとばっかり・・

904Name_Not_Found :04/01/23 01:11 ID:???
894がpについてmarginを設けたいのにわざわざ外にdivを作っているのとか
そもそもタグの対応がへんちくりんとか、誰も突っ込んであげないのね。

905Name_Not_Found :04/01/23 01:12 ID:???
>>903
> 知らなかった。俺見出しの為の大きくするタグだとばっかり・・

>見出しの為の
正解

>大きくする
それは結果論

906Name_Not_Found :04/01/23 01:13 ID:???
>>904
この程度の知識か、と思った段階でそいつの書くソースには興味がなくなるから見てない。

907Name_Not_Found :04/01/23 01:13 ID:???
>>905
あ、そういうことね(w

908Name_Not_Found :04/01/23 01:14 ID:???
( ・∀・ )! div厨ってコレか!?

909Name_Not_Found :04/01/23 01:15 ID:???
正確にはこうか

<style type="text/css">
<!--
div.test { margin-bottom : 2em ; }
-->
</style>
</head>
<body>
<div class="test">
<p>テスト用カキコテスト用カキコテスト用カキコ</p>
<p>テスト用カキコテスト用カキコテスト用カキコ</div>
</body>


910Name_Not_Found :04/01/23 01:16 ID:???
それはマジボケっすか

911Name_Not_Found :04/01/23 01:16 ID:???
間違えた。こうだった(w

<style type="text/css">
<!--
div.test { margin-bottom : 2em ; }
-->
</style>
</head>
<body>
<div class="test">
<p>テスト用カキコテスト用カキコテスト用カキコ</p>
</div>
<p>テスト用カキコテスト用カキコテスト用カキコ</p>
</body>


912Name_Not_Found :04/01/23 01:17 ID:???
<style type="text/css">
<!--
.test { margin-bottom : 2em ; }
-->
</style>
</head>
<body>
<p class="test">テスト用カキコテスト用カキコテスト用カキコ</p>
<p>テスト用カキコテスト用カキコテスト用カキコ</p>
</body>

こうだろ

913Name_Not_Found :04/01/23 01:18 ID:???
>909

>911

頼むから教える側には来ないでね。

914Name_Not_Found :04/01/23 01:18 ID:???
<p>属性にclassが指定出来たなんて、生まれて初めて知ったよΣ(゚д゚lll)

915Name_Not_Found :04/01/23 01:21 ID:???
ちょっと待ってくれ!ということは、ここの住人は「行間を空ける」はもとより
「通常の改行」すら<br>を使わないってことか!?

916Name_Not_Found :04/01/23 01:21 ID:???
>>914
汎用属性って知ってますか?
はい、もう一回。汎用属性。

917Name_Not_Found :04/01/23 01:22 ID:???
>>915
発言で改行するときくらいかな。
それすらも気持ち悪い、って人もいるけど、ここまでが俺の許容範囲。

918Name_Not_Found :04/01/23 01:23 ID:???
>>914がdiv厨の理由なのかも知れないとオモタ

919Name_Not_Found :04/01/23 01:24 ID:???
ネタレスとかマジでいらないっす。
本気で初心者なら>>4とか回ってくれ。

920Name_Not_Found :04/01/23 01:25 ID:???
>914
class指定はbody以下のほとんどの要素にできるぞい

ていうか>>4らへんのサイト回って勉強しれ

921Name_Not_Found :04/01/23 01:28 ID:???
はい。正直告白しますが、たった今までdiv厨でした・・。
じゃあ例えば>>912のソースを利用したとして

<p class="test">テスト用カキコテスト用カキコテスト用カキコ</p>

この部分の「テスト用カキコ」をある程度のところで改行したい場合
みんなはいったい何を使って改行するの?<p>タグ使っちゃったら
class指定が影響出る。かといって<br>は使わない。

俺には難しすぎる・・。誰か回答よろ

922Name_Not_Found :04/01/23 01:30 ID:???
>>921
> この部分の「テスト用カキコ」をある程度のところで改行したい場合
 いや、そもそも「改行したい」と思わないんだ。
改行はブラウザ任せ。
見辛い、ってのが原因で改行したいのならインデント入れるし。

923Name_Not_Found :04/01/23 01:32 ID:???
なんで改行の話で<p>タグ新たに入れるとかいう話が出て来るんだよ。
マジレスしちまうと、pか親要素で左右にマージンとって、あとは自動改行
にまかせるのが基本。強制改行は本人の環境では「ほどよい」かもしれないが
超高解像度や低解像度な環境では程よくならない。ていうか、>4のサイト回れって。

924Name_Not_Found :04/01/23 01:34 ID:???
>>922
なるほどなるほど。根本的な考えが違うわけですな。
>>4のリンク周って最初から勉強しなおします。

その前にこれだけ答えて欲しいんですが
改行をブラウザ任せだと、例えば文の頭に「っ」や「、」「。」がきたりする場合もありますよね?
そういうのって気になったりしませんか?

あと、その回避方法のインデントについてだけ教えていただけませんか?

925Name_Not_Found :04/01/23 01:35 ID:???
>>924
禁則文字、って最初に来なくない?試してないけど。

body{
margin : 0 5%;
}
とか。
左右に隙間を与えりゃ見やすくなるでしょ。

926Name_Not_Found :04/01/23 01:37 ID:???
ちと便乗質問

例えば箇条書きの場合は<br>なしでどう表現する?

927Name_Not_Found :04/01/23 01:39 ID:???
>>926
初心者スレ池
ul要素がなんで存在してると思ってるんだ。

928Name_Not_Found :04/01/23 01:39 ID:???
便乗質問とかいって、100%同一人物だろ。極端にレベルが低すぎるぞ
箇条書きならリスト項目使えよ。つうかいい加減>>4に逝ってくれ。

929Name_Not_Found :04/01/23 01:40 ID:???
>>926
箇条書きはリストだから ul または ol を使う

930Name_Not_Found :04/01/23 01:40 ID:???
どうしても、CSSでやるなら
--
span.dialogue:after { content:"\A";}
--
<p>すると、戸を開けた先には老人がいて、<span class="dialogue">「回れ右」</span>といった。</p>
--
でよいのでしょうか。
#対応ブラウザあるか知らないけど。

931Name_Not_Found :04/01/23 01:40 ID:???
>>928
便乗、って「俺も」って意味と「質問したついでに」という意味と解釈できるから、別人を装ってる、というわけでもなかろう、と。

932Name_Not_Found :04/01/23 01:43 ID:???
スマソ。欲張って質問したせいで別人装うってる感じになってしまいました。
聞きたかったのは「cssでどう表現するのか?」という意味でした。

>>925 >>930
ありがとん

933Name_Not_Found :04/01/23 01:43 ID:???
で、このまま1000まで行くわけ?

934Name_Not_Found :04/01/23 01:44 ID:???
>>932
CSSは正しいHTMLに適応させるべきだから、HTMLから勉強しなおした方がいいと思う。

935Name_Not_Found :04/01/23 01:45 ID:???
>>933
>>932で終わってるから、次の質問待ちだろ。

936Name_Not_Found :04/01/23 01:52 ID:???
>>932
>>4を100回読んで来い。

でもul使うと勝手に出る■とかがウザい。css使ってわざわざ画像にするのも面倒だしなぁ。
「>>」使いたいときなんかが困る。


937Name_Not_Found :04/01/23 01:56 ID:???
>936
ulのリストマーカーがウザいならCSSで消せよ

938Name_Not_Found :04/01/23 01:57 ID:???
>>936
>>4を100回読んで来い。

リストマーカーは消せる

939Name_Not_Found :04/01/23 01:59 ID:???
俺も>>4を100回読むの刑かよ・・。っつーか消せるのかよw

940Name_Not_Found :04/01/23 02:01 ID:???
>>939
list-style-type : none;

941Name_Not_Found :04/01/23 02:01 ID:???
>>939
消せるよ。

942940 :04/01/23 02:03 ID:???
>>939
あ、追記ね。
list-style-image : url(li.gif);
画像も使える。サイズは12*12くらいならOKだっけか。

943Name_Not_Found :04/01/23 02:04 ID:???
<br>の使い方に関して気になる事があるけど、タグの話はスレ違いよね。

944Name_Not_Found :04/01/23 02:06 ID:???
>>943
strictHTMLスレこいよ。相手してやるぜ。

945Name_Not_Found :04/01/23 02:17 ID:???
なんだこのスレの状態は _| ̄|○
無知な人間ばかりじゃないか _| ̄|○

946Name_Not_Found :04/01/23 03:08 ID:???
ここにいる香具師らは/.Jで中途半端な知識をひけらかしてうだうだ言ってる輩と同じ匂いがするな。

947Name_Not_Found :04/01/23 07:05 ID:???
なんかこう言う時代が来たのかなぁ、って感じ

948Name_Not_Found :04/01/23 08:40 ID:???
スレのレベルが極端に下がってんな…_| ̄|○

949Name_Not_Found :04/01/23 08:49 ID:???
強制ID激しくキボンヌ

950Name_Not_Found :04/01/23 08:51 ID:???
>>948
質問スレに高度さなんざ求めんな。

951Name_Not_Found :04/01/23 09:47 ID:???
そういう次元じゃないと思うぞ。
基本のキだし

952Name_Not_Found :04/01/23 12:34 ID:???
というか...
初心者に理解できるように説明してないからだろうな(w

953Name_Not_Found :04/01/23 12:49 ID:???
初心者スレじゃないしなぁ

954Name_Not_Found :04/01/23 13:23 ID:???
だが、初心者スレでCSSの質問をすると
ここに回されるのは事実だ。

955Name_Not_Found :04/01/23 13:37 ID:???

そろそろ次スレッドの用意を。

732 :Name_Not_Found :04/01/19 03:22 ID:???
>>6のFAQ
>overflow プロパティは擬似フレームも作成できる
> http://alt.s31.xrea.com/tips/overflow.html
> http://alt.s31.xrea.com/files/frame.html
またまた移転した。↓
 http://kobit.info/tips/overflow.html
 http://kobit.info/files/frame.html

956Name_Not_Found :04/01/23 13:50 ID:???
規格書の和訳見れる人いる?

957Name_Not_Found :04/01/23 14:00 ID:???
>>956
ちゃんと見られるけど?
http://www.y-adagio.com/public/standards/tr_css2/toc.html
http://www.swlab.csce.kyushu-u.ac.jp/man/rec-css2/cover.html#minitoc


958Name_Not_Found :04/01/23 14:01 ID:???
>>956

>>3の和訳ならOperaで見られたけど・・・?

959Name_Not_Found :04/01/23 14:08 ID:???
>>924-925
禁則処理はCSS3の課題です。
line-break:strict;はWinIEでのみ先取実装中。
cf. http://east.portland.ne.jp/~sigekazu/css/international.htm#line
他のブラウザではいまのところ<span class="NoLineBreak">――</span>とかやって
.NoLineBreak {white-space:nowrap;}とでもするしかない。

960Name_Not_Found :04/01/23 14:29 ID:???
>>957
http://www.w3.org/Consortium/Translation/Japanese
http://www.w3.org/Style/css2-updates/translations.html
のリンクが死んでますね。

961Name_Not_Found :04/01/23 14:57 ID:???
初心者が口にする紋切り型FAQ。

「〜はできますか?」
  仕様書やリファレンスを読んでください。
「〜ができません」
  できなくて当たり前だったり。
「〜のサイトみたいに」
  人の真似をして楽しいですか。
「これってバグですか?」
  仕様書やバグ辞典を読めば解かります。
「質問の仕方が悪かったようですね」
  レトリックを身に付けてください。
「初心者なんで」
  何時まで初心者でいるつもりですか。
「できました!」
  おめでとうございます。
「ひと通り調べました」
  ほとんどの場合は嘘。
「よくわかりません」
  まったくの思考停止状態。
「わかりました」
  本当にわかっていますか?

962Name_Not_Found :04/01/23 15:30 ID:???
>>961
お前さんは、そのうちどんな質問に対しても
「テンプレのリンク周れば解る」とか言い出しそうだな。

963Name_Not_Found :04/01/23 16:01 ID:YfdWu/1G
________
|    |
| 画像1 | aaaaaaa
| | aaaaaaa
|_______|

_________
| 画像2 |
| |
|________|

という事をしたいのですが、2点ほど出来ずに頭抱えています。
1つはテキスト(画像1の隣にくるaaaaの部分)なんですが、
テキスト部が画像1に対して中央に来るようにしたいため、画像1に
vertical-align:middleを指定、そして回り込み指定もしているので
同様に画像1にfloat:leftを指定しています。が、vertical-align=middleが
効きません。middleに限らず何も効いていないようです。floatとvertical-align
を2つ同時に使用する事は出来ないのでしょうか。尚、画像1はimg width/height
を使用しています。

もう1つは、white-space:nowrapを画像2に指定しているのですが、
windowが大きくなると画像2がテキスト部の下に表示されてしまいます。
因みに画像1/テキストの次に<br>を入れて画像2を入れています。

>>961さんの仰る事はごもっともだと思います。自分を鑑みてみても
正にその通り・・・自分でも鬱入ってしまっている位です・・・

964963 :04/01/23 16:03 ID:???
あぁ、画像ズレちゃっていますがもちろんキッシリ□画像の隣にテキストです。
念のため。

965Name_Not_Found :04/01/23 16:16 ID:???
floatとvertical-alignはその性質上相容れるものではない
BRで改行させてレイアウトを取っているようだが、当然正しい使い方ではない
今はたまたま思い通りに見えているだけ
解決策は色々あるが、具体的なソースを見ないとあまり適切は指示は出来ない
imgにdisplay:blockを指定したり色々試してみてね

966Name_Not_Found :04/01/23 16:42 ID:???
画像1を float した段階で、画像1は通常フローから切り離され
単独で浮動ボックスを形成するので、もはや画像1とは別のボックスと
化したテキスト部分には vertical-align が効かないってことじゃないかな。

2点目は↓こういう話だと思うんだけど
┌───┐
│      │aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
│画像1 │aaaa<br>
│      │┌───┐
└───┘│      │
          │画像2 │
          │      │
          └───┘
画像2に対して white-space:nowrap は意味がないでしょ。
やるなら、画像2を <div> か何かで囲んで、それに対して
clear: left を指定する。画像2を単に display: block しただけでは
この状態は解消されないと思う。

967Name_Not_Found :04/01/23 16:49 ID:???
>>963
とにかくHTMLソースを出して下さい。

vertical-alignはテキスト、即ちインライン要素に対して効かせるもの、ブロックレベル要素の垂直位置は動かせません。




968Name_Not_Found :04/01/23 17:07 ID:???
>>693
テキストはpadding-topかmargin-topで高さを調節してやればいいんじゃない?
画像のサイズはあらかじめわかっているわけだし、何px指定すればテキストが
中央あたりにくるかは予想できるだろうし。

969Name_Not_Found :04/01/23 17:20 ID:???
clear: leftってデフォルトで左に寄ってしまう仕様を解除するというタグですよね?
それ使うとどこに行ってしまうのでしょうか?

970Name_Not_Found :04/01/23 17:28 ID:???
/* CSS・スタイルシート質問スレッド【27】 */
http://pc2.2ch.net/test/read.cgi/hp/1074845459/l50

ローカル・ルールのCSSスレッドへのリンク、URL更新するにはどうしたらいいんだっけ?

971Name_Not_Found :04/01/23 17:31 ID:???
>>969
clearはfloatを解除するプロパティーです。(タグに非ず)
知らないことが出てきたら>>4を見て勉強しませう。

>それ使うとどこに行ってしまうのでしょうか?
訊く前に、自分で試したのかな。


972Name_Not_Found :04/01/23 18:26 ID:???
>>970
他のスレなんかもとっくにリンク切れになってるからほっとけば?

973Name_Not_Found :04/01/23 18:46 ID:???
ならば他のスレッドもリンク切れを直しませう。

974Name_Not_Found :04/01/23 19:19 ID:???
>>970
■ ローカルルール等リンク先更新総合スレッド 9
http://qb3.2ch.net/test/read.cgi/operate/1071312042/

975Name_Not_Found :04/01/23 19:39 ID:???
>>974
やってみた。
http://qb3.2ch.net/test/read.cgi/operate/1071312042/375


 /* CSS・スタイルシート質問スレッド【27】 */
 http://pc2.2ch.net/test/read.cgi/hp/1074845459/l50

976Name_Not_Found :04/01/23 20:06 ID:???
おつ。

977Name_Not_Found :04/01/24 15:29 ID:???
( ;´Д`)うめぇぇぇぇぇぇぇー!

978Name_Not_Found :04/01/24 16:15 ID:???
梅&梅

979Name_Not_Found :04/01/24 17:08 ID:???
梅('ж')すっぺぇ〜

980Name_Not_Found :04/01/24 18:08 ID:DZE2R2zM
このように書いて外部cssとしてhtmlに呼び出して背景画像を特定の位置に表示させた場合に、フレームページにて、スクロールさせると、内容がグチャグチャにひきづられたようになります。
解決策や、原因わかるかたお願いします。WinXP+IE6.0です
#main {
background-image:url(../images/main.jpg);
background-repeat: no-repeat;
background-attachment: scroll;
background-position: 240px 221px;
}

981Name_Not_Found :04/01/24 18:22 ID:???
>980
なんでbackgroundプロパティで纏めて指定しないんだ?
それはともかく、漏れが試した中では再現しなかったのでソースの要点と、
IEでだけなるのかMozillaやOperaでもなるのか
追記してくれるとありがたい。

982Name_Not_Found :04/01/24 19:41 ID:???
埋め。

983Name_Not_Found :04/01/24 20:04 ID:???
埋め炉!!!

984Name_Not_Found :04/01/24 21:21 ID:???


985Name_Not_Found :04/01/24 21:44 ID:???
小梅ちゃん

986Name_Not_Found :04/01/24 22:26 ID:8AAckLcO
{position:absolute; bottom:0px; left:0px;}
で左下に画像を配置してみたんですが、IE6、Mac版IE5.17、ネットスケープ7(Mac、Win両方)等で確認すると、どのブラウザでも何故か下に10ピクセル程度の隙間ができてしまい困ってます。BODYにmargin、padding共に0px指定してます。

IE6以外では{position:fixed}にすると解決するんですが、IE6ではfixedを認識してくれないようで、ムチャクチャになってしまいます(さすがにIE6を無視することもできません)。
何かいい方法ないでしょうか。

987Name_Not_Found :04/01/24 23:50 ID:???
膿め

988Name_Not_Found :04/01/25 00:29 ID:???
 /* CSS・スタイルシート質問スレッド【27】 */
 http://pc2.2ch.net/test/read.cgi/hp/1074845459/l50

989Name_Not_Found :04/01/25 01:32 ID:???
まだこのスレは終わってないわけだがw

990Name_Not_Found :04/01/25 09:41 ID:???
コソーリ梅

991Name_Not_Found :04/01/25 12:15 ID:???
http://pc2.2ch.net/test/read.cgi/hp/1074061533/996
の者です。良かったら教えてください!

ホストが規制されていてスレたてできなかった・・

992Name_Not_Found :04/01/25 12:21 ID:???
>>991
a hover{background-color:


993991 :04/01/25 12:25 ID:???
それだと文字の後ろの背景色しか変わらないんですよ。
DIVとかTDとかの横いっぱいに変えるにはどうするんですか?

994Name_Not_Found :04/01/25 12:29 ID:???
>>993
インラインとボックス


995Name_Not_Found :04/01/25 12:49 ID:???
マルチ梅

996Name_Not_Found :04/01/25 12:57 ID:???
uma-

997Name_Not_Found :04/01/25 14:55 ID:???
100000000000000000000000000000000000000000000000

998Name_Not_Found :04/01/25 14:56 ID:???
998個のうんこ

999Name_Not_Found :04/01/25 14:57 ID:???
             , -──‐- 、
                //⌒ニ二ニ´`\
            l L_ ─-、  ,.-‐:!   / ̄ ̄ ̄ ̄ ̄ ̄ ̄
             |r‐、!. ‐- ,  、-- |    |   >>all
              |!.__l|. _,ノ !._,ハ._ |    |  この暇人っ・・・・・・!
           /| /| ヾ三三三ヲ |   <  
    , _-─===/ .|/ ヽ、.___,.イ、._  \_______
   /     `ヽ,.-'ーー(⌒)  :::::::::::/l |   `'''-、
    ! 二ニ=,゙イ i l F='(_、__/ l  |    |ヽ
.   ト、   / ししL.j⊂二)\ / '´\.|.     |. l
.   !:::\./ ,.ヘ. ̄`7´ヘ「」「」    /~7   :| /l
   |::::::::: \.\ \/ /  |o-  / /-ー┤//!
   !::::::::::::: ` ー>  /    │  / ,.'-、o__,|///l /二二.ヽ
.  |:::::::::   / ./     |   ./  _ ヽ リ~7 |   _,) )
.   |:::::    (  ‘-----‐┐ |o-/ /l_ヽ. ~ /イ   'ー '′
  |::       ` ー-----‐┘.|  '─'    `ー1´ .| ○ O o


1000Name_Not_Found :04/01/25 14:57 ID:???
        _________
      /∴∵∴∵∴∵∴∵∴\
     /∴∵∴∵∴∵∴∵∴∵∴\
    /∴∵∴∵∴∴∵∴ .∵∴∵∵∴\
   /∴∵∴∵∴/  ゙^\. ,/゙ ¨\,∵\
  /∴∵∴∵∴「  ● | 》  l|  ● ゙》∴|
  /∴∵∴∵∴i,.    ,ノ .l|  《    ..|´∴|
  |∴∵∴∵∴\___,,,,,_/ .'″  ^=u,,,,_ v∴|
  |∴∵∴∵∴/     / ̄ヽ    \ ∴.|
  |∴∵∴∵/       ヽ_/      \ |
  |∴∵∴ /    ,,____ |_____    |  / ̄ ̄ ̄ ̄ ̄ ̄ ̄
  |∴∵∴|   | /┘┘┘┘┘┘┘|   | < 
  |∵∴∵|    | lllllllllllllllllllllllllllllllllllll〕  /   | うるせー馬鹿!
  \∵ |     |l;⌒ヽ⌒ ヽ|lllllllllll|   /  |
    \ |     |   \  ヽlllllllll|  /  \_______
      \    \┐┐┐┐┐┐/
       \________/

10011001 :Over 1000 Thread
このスレッドは1000を超えました。
もう書けないので、新しいスレッドを立ててくださいです。。。


2ch-Library
DAT2HTML 0.30a Converted.