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

1 名前:質問は他人にわかる日本語で :03/06/14 05:33 ID:???
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
cf. http://web2ch.s31.xrea.com:8080/index.php?CSSFAQ
  http://nira.s25.xrea.com/FAQCSS/ls_00.html

2 名前:Name_Not_Found :03/06/14 05:38 ID:???
【過去ログ】
 http://mentai.2ch.net/hp/kako/974/974934062.html
 http://natto.2ch.net/hp/kako/984/984113434.html
 http://natto.2ch.net/hp/kako/992/992992981.html
 http://pc.2ch.net/hp/kako/996/996828258.html
 http://pc.2ch.net/hp/kako/1005/10050/1005047493.html
 http://pc.2ch.net/hp/kako/1011/10113/1011358982.html
 http://pc.2ch.net/hp/kako/1015/10154/1015474859.html
 http://pc.2ch.net/hp/kako/1019/10198/1019881572.html
 http://pc3.2ch.net/hp/kako/1025/10253/1025346520.html
 http://pc3.2ch.net/hp/kako/1028/10286/1028646616.html
 http://pc3.2ch.net/hp/kako/1031/10317/1031773943.html
 http://pc3.2ch.net/hp/kako/1034/10349/1034922586.html
 http://pc3.2ch.net/hp/kako/1038/10384/1038437758.html
 http://pc2.2ch.net/hp/kako/1041/10416/1041641395.html
 http://pc2.2ch.net/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/test/read.cgi/hp/1053619342/l50

【関聯スレッド】
・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

3 名前:Name_Not_Found :03/06/14 05:38 ID:???
【仕様書】
・CSS1の仕様書の原文(英語)
 http://www.w3.org/TR/REC-CSS1/
・CSS2の仕様書の原文(英語)
 http://www.w3.org/TR/REC-CSS2/
・CSS1の仕様書の邦訳(日本規格協会訳/個人訳)
 http://www.y-adagio.com/public/standards/css1/toc.htm
 http://www.swlab.csce.kyushu-u.ac.jp/man/rec-css1/rec-css1.html
・CSS2の仕様書の邦訳(日本規格協会訳/個人訳)
 http://www.y-adagio.com/public/standards/tr_css2/toc.html
 http://www.swlab.csce.kyushu-u.ac.jp/man/rec-css2/cover.html

【CSS検証】
・W3C CSS 検証サービス
 http://jigsaw.w3.org/css-validator/

4 名前:Name_Not_Found :03/06/14 05:39 ID:???
【解説など】
・ごく簡単なHTMLの説明
 http://www.kanzaki.com/docs/htminfo.html
・ZSPC - Style Sheets Reference
 http://www.zspc.com/stylesheets/
・K@tsukun's PAGE! > CSS Reference
 http://hp.vector.co.jp/authors/VA022006/css/index.html
・とほほのスタイルシート入門
 http://tohoho.wakusei.ne.jp/wwwcss.htm
・ばけらの CSS リファレンス
 http://www.ne.jp/asahi/minazuki/bakera/html/css/reference
・Academic HTML::CSS2
 http://www.tg.rim.or.jp/~hexane/ach/
・ZSPC - CSS2対応状況ガイド
 http://www.zspc.com/documents/css2/
・CSS対応状況表
 http://hp.vector.co.jp/authors/VA022006/css/corrbrwser.html
・CSS1テストスイート http://www.doraneko.org/css1test/
・ブラウザのHTML4/CSS対応度テスト
 http://homepage1.nifty.com/emk/moz/browsertest.html
・CSS Laboratory対応表・一覧
 http://is.vis.ne.jp/charts/index.xhtml
・CSSバグリスト@CSSバグ辞典スレッド
 http://cssbug.tripod.co.jp/index.html
・Web標準普及プロジェクト (特に「HTML/CSSのよくある誤解・ミス」)
 http://www.mozilla.gr.jp/standards/index.html
・ブラウザによる振り分け (JavaScriptを使用しない方法)
 http://east.portland.ne.jp/~sigekazu/css/boxm.htm#ua
・( ´∀`)< CSS でイケてるデザインサイトリンク集2
 http://www.geocities.co.jp/SiliconValley-SantaClara/1308/
・* CSS { イケてるスタイルを:"作れ";} 発表所 (消滅?)
 http://strict.jp/~sappari/2ch/css.php

5 名前:Name_Not_Found :03/06/14 05:39 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

6 名前:Name_Not_Found :03/06/14 05:40 ID:???
【FAQ】
Q3: CSSで擬似フレームってどうやるの?
A3: 次のページを参考にして下さい。
overflow プロパティは擬似フレームも作成できる
 http://alt.s31.xrea.com/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/

7 名前:Name_Not_Found :03/06/14 05:41 ID:???
【FAQ】
Q5: なんかフロートの表示が崩れるみたいなんですけど?
A5: floatさせる要素にはwidth指定が必須(img要素以外)。抜かすとMacIEやOperaでの表示は保証できません。WinIEは勝手に補ってくれるだけです。
http://www.remus.dti.ne.jp/~a-satomi/nikki/tmp/floattest/float_not-specified-width.html
これに当て嵌まらなかったら「浮動要素の高さもheightに含めさせる方法」などを参考に。
 http://www.mozilla.gr.jp/standards/webtips0021.html#c1_2
  http://cssbug.tripod.co.jp/detail/winie/b079.html
   http://pc2.2ch.net/test/read.cgi/hp/991666454/683n

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

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

Q8.いままでHTMLでやってた××をCSSでやるにはどうすればいい?
A8.下記に書いてあります。テーブル・レイアウトは段組のFAQ(A4・>>6)をご覧あれ。
「いままでの HTML との対照」
 http://www.tg.rim.or.jp/~hexane/ach/fscs/fscsa1.htm
 http://www.tg.rim.or.jp/~hexane/ach/sfcs/sfcsa1.htm
 http://www.tg.rim.or.jp/~hexane/ach/tocs/tocsa1.htm

8 名前:Name_Not_Found :03/06/14 05:44 ID:???
行数オーバーで>>2から省いた。

CSSでイケてるデザインサイト 14
http://pc2.2ch.net/test/read.cgi/hp/1054115237/l50

9 名前:Name_Not_Found :03/06/14 06:36 ID:???
10くらい(σ・∀・)σゲッツ!!

10 名前:Name_Not_Found :03/06/14 10:59 ID:???
10くらい(σ・∀・)σオッツ!!

11 名前:Name_Not_Found :03/06/14 11:45 ID:???
>>1
乙。

12 名前:Name_Not_Found :03/06/14 15:59 ID:xIXD7C6B
>>1
乙です

過去スレで
word-break: break-all;
というのが出てましたが、Netscapeで
半角英数字をテーブル幅に合わせ自動改行させることって
現代の科学ではまだ不可能なんでしょうか?

13 名前:かおりん祭 ◆dzq80gWuas :03/06/14 16:04 ID:???
∋oノハヽo∈ / ̄ ̄ ̄ ̄ ̄ ̄ ̄
  ( ^▽^) < 新スレおめでとうございま−す♪
= ⊂   )   \_______
= (__/"(__) トテテテ...

14 名前:Name_Not_Found :03/06/14 16:08 ID:???
>12
max-width指定すればええんでないの?

15 名前:Name_Not_Found :03/06/14 17:17 ID:???
>12
寝助と言うかほとんどのブラウザで無理じゃないの?
スペース空けたところで改行するようになってるような。

max-widthが効いたとして欧文の折り返し不可とどちらが強いのか…。

16 名前:Name_Not_Found :03/06/14 21:04 ID:???
word-breakってCSS3じゃなかったっけ?

17 名前:Name_Not_Found :03/06/14 21:31 ID:???
>>16 WinIE5以降は先取り実装してくれてる。

International Layout in CSS
http://east.portland.ne.jp/~sigekazu/css/international.htm#word-break

18 名前:Name_Not_Found :03/06/14 21:47 ID:???
初めて気付いたんだがOperaってcolへの指定無視するのな…。

19 名前:Name_Not_Found :03/06/14 22:56 ID:???
>WinIE5以降は
勝手に
>先取り実装してくれてる
から困る。

20 名前:Name_Not_Found :03/06/14 23:02 ID:???
IEが先取り実装してくれないと
有用性なんかのテストが出来ないと思われ。
その点でIEのやってる事は評価できる。

21 名前:Name_Not_Found :03/06/14 23:31 ID:???
>>19
議論はこちらで。

独自拡張、草案段階のCSSについて語れ
http://pc2.2ch.net/test/read.cgi/hp/1019912046/l50

ハイ次の方、質問をどうぞ。

22 名前:Name_Not_Found :03/06/15 01:02 ID:???
すいません、質問させて下さい。

テキストエリアで、
{border-width : 1pt;
border-style : solid;
border-color : #FFFFFF;
color : #777777;
background-color : #777777;}
と指定したら、
文字入力のカーソルがbackground-colorに近い色になってしまって困っています。
文字入力のカーソルの色の指定って出来るんでしょうか?

23 名前:Name_Not_Found :03/06/15 01:13 ID:???
>22
cursorプロパティでカーソルごと変えるとか。
キャレット("|"みたいな奴)は変えられないと思う。

24 名前:12 :03/06/15 01:15 ID:???
>>14-15
ありがとうございます。
max-widthってのを調べて試してみます。
上手くいったらいいな・・・

25 名前:Name_Not_Found :03/06/15 01:16 ID:???
>22
カーソルって文字入力の〜って書いてることから察するにあの点滅してるやつだよねえ。
それなら無理。

あと関係ないが文字色と背景色が同じってどう言う目的でテキストエリアを使ってるのか気になる…。


余計ながら一つ提言しておくと、
そう言う観覧者の操作に直接関わってくる部分を無闇にCSSとかで色々指定するのは良くないかな…
操作に違和感があるとストレス溜まるしね。
#テキストエリアを別の目的で使っているなら話は変わるけど。

26 名前:Name_Not_Found :03/06/15 01:24 ID:???
>>20-21
以下はスレ違いの発言だが、このスレの利用者全般に
言って置きたい事があるので敢えて書くことにする。

考案中のプロパティと同じ名称で先行実装することは、
後の正式仕様と、先行仕様との間に食い違いが発生し、
後方互換性に問題が生じることになる可能性をはらむ。

実験目的であるのであれば、「-moz-*」の様に標準仕様と区別すべき。
Micro$oft の独自拡張は、次世代仕様の実験を目的としているのでは無く、
便宜主義による勝手な先行実装か、マーケティング的な戦略であるに過ぎない。
要は、商業的に利益になれば何でもするという M$ の謀略である。

27 名前:Name_Not_Found :03/06/15 01:24 ID:???
>>22
少し私なりに書き直してみました。

textarea {
  border: 1pt solid white;
  color: #777;// ←これは文字の色
  background-color: #777;// ←これは背景の色
}

近い色どころかまったく同じ色です。それと、カーソルとは普通
マウスにあわせて動くポインタ(矢印)のことを指します。

28 名前:12 :03/06/15 01:31 ID:???
max-widthは試した限りでは効かなかったんですが、
table {table-layout: fixed}
でNetscapeいけました。ただ、半角英数の部分が
テーブルから飛び出しますが・・・


29 名前:Name_Not_Found :03/06/15 01:40 ID:???
22です。
すいません。書き間違えてました。
color : #777777;ではなくて
color : #FFFFFF;の間違いでした。
打った文字は白で表示されるんですが
キャレットは#777777に非常に近い色になっている状態です。

>>23さん、>>25さん、>>27さん、
回答とご指摘(カーソルとキャレット)ありがとうございました。

30 名前:Name_Not_Found :03/06/15 01:50 ID:???
ページの一番上に文字がつく方法を教えてください。
ぴったりくっつくやつ。

31 名前:Name_Not_Found :03/06/15 01:53 ID:???
>>30
先にどっかで口の利き方覚えて来い

32 名前:Name_Not_Found :03/06/15 02:03 ID:???
>>26
スレ違いだが激しく同意
つーか、やるならcss2を完全にしてからやれって

33 名前:Name_Not_Found :03/06/15 02:13 ID:???
>>30
bodyのmargin-topとpadding-topを0にしろ。

34 名前:Name_Not_Found :03/06/15 02:17 ID:???
>>28
max-width乃至widthをmin-widthと組み合せてもダメ?

35 名前:Name_Not_Found :03/06/15 06:11 ID:???
overflow属性を弄って擬似フレームを使いたいのですが、
3分割の上、中、下のフレームがあるとして、
上、下のフレームのみ高さを固定したいのです。
heightを%指定しないで上手くいく方法はあるのでしょうか。

http://www.fromdfj.net/html/sample/overflowsample02.html
例えばこのデザインの上下のフレームの幅のみ固定したいのです。
後、弄るって漢字はエロイですね。

36 名前:Name_Not_Found :03/06/15 10:35 ID:???
>>26
スレ違いで堂々と同意できないが(藁)激同。
で、後にプロパティの名称が変わっても
それには対応しないで新たな「独自拡張」ができていく罠。

37 名前:Name_Not_Found :03/06/15 12:00 ID:???
>>26,36
おまえらバカか?
勝手に先行実装してるんじゃなくて、
草案の段階でも実装してフィードバックすることが求められるんだよ。
文句はW3Cに言え。

38 名前:Name_Not_Found :03/06/15 13:24 ID:???
>>37
Webの機能性と相互運用性を高める事がW3Cの目的。
その活動を妨害している M$ は極悪なの。
これぐらいの事も理解できない馬鹿は(・∀・)カエレ!!

39 名前:Name_Not_Found :03/06/15 13:32 ID:???
>>35
overflow を使わなくてもよいのであれば、

http://homepage.mac.com/mikihiro/md/web/model/

の model 2 と 3 を参考にしてみてください。

40 名前:Name_Not_Found :03/06/15 13:33 ID:???
何で議論してるバカが居るんだ?

41 名前:Name_Not_Found :03/06/15 14:43 ID:wjMRwnYl
とりあえずage

42 名前:Name_Not_Found :03/06/15 21:34 ID:???
http://www.interq.or.jp/rock/yuuloo/index.css
このスタイルシートどうでしょう?間違いとかあったら教えてください。

43 名前:Name_Not_Found :03/06/15 21:53 ID:???
";"の付け忘れがけっこうある。

44 名前:Name_Not_Found :03/06/15 21:59 ID:???
>>43
そのセミコロンは基本的にどこにつければいいんでしょうか?
ぜんぜん初心者なもんで(´Д`;)

45 名前:Name_Not_Found :03/06/15 22:06 ID:???
頭遺体

46 名前:Name_Not_Found :03/06/15 22:18 ID:???
>>44
>4にリストアップされたサイトで基本を勉強しましょう。

47 名前:Name_Not_Found :03/06/15 22:22 ID:???
>>46
そうですね

48 名前:Name_Not_Found :03/06/15 22:33 ID:???
arrow-colorとはスクロールバーのどの部分にあたるんでしょうか?

49 名前:Name_Not_Found :03/06/15 22:35 ID:???
>48
矢印の部分。

50 名前:Name_Not_Found :03/06/15 22:57 ID:dkdArOHE
質問です。
SELECTのボックスの
外枠およびプルダウンの色を変えることってできますか?

51 名前:nobodyさん :03/06/15 23:04 ID:???
http://www.geocities.co.jp/Playtown-Part/4519/

52 名前:Name_Not_Found :03/06/15 23:11 ID:3Asmwzps
>>50
背景や文字色はできる

53 名前:Name_Not_Found :03/06/15 23:59 ID:???
>>50
Border も使える。

54 名前:Name_Not_Found :03/06/16 00:14 ID:???
>>50
というかブラウザによる。

55 名前:50 :03/06/16 00:19 ID:???
ありがとうございます。
Border使えますか?
IE6なんですが、色変わらなかったんですよ。

56 名前:Name_Not_Found :03/06/16 04:09 ID:???
ボーダーの角を丸くする事って出来ます?
テーブル使えばボーダーを画像で丸める事出来るけど、CSSでしたいので・・・

57 名前:216 :03/06/16 05:02 ID:???
できますよ。
同じように画像で。

58 名前:Name_Not_Found :03/06/16 05:16 ID:???
つか、ここはテンプレのリンクのためにあるスレなんだよ!
質問するヤシはあらし回答するヤシもあらしだバカ!
以降、保守のみ書き込みを許可する。

59 名前:Name_Not_Found :03/06/16 06:30 ID:???
>>58
うるせーはげ

60 名前:Name_Not_Found :03/06/16 20:10 ID:???
>>56
独自拡張を、活用しませう。
Mozilla/NN7なら-moz-border-radiusで、できる。

61 名前:Name_Not_Found :03/06/16 20:26 ID:???
>>35
WinIEならダイナミック プロパティことexpression()関数を利用して、できる。
document.body.clientHeightを弄って。
http://www.microsoft.com/JAPAN/developer/library/jpwebwk/author/dhtml/dude061198.htm

62 名前:Name_Not_Found :03/06/16 20:48 ID:???
>>55
CSS2対応状況ガイド
http://www.zspc.com/documents/css2/box/border.html

63 名前:Name_Not_Found :03/06/16 22:06 ID:???
>>38
しったかぶりごくろう。
http://www.hotwired.co.jp/webmonkey/2000/22/index1a_page2.html

64 名前:2^6 :03/06/16 22:23 ID:z129NKbj
質問です.確認環境 win98 IE6

やりたいこと:
cgiでカレンダーをtableで作っていましたが,今まで各tdにおいって,
<td width="120" height="120">日付と内容</td>
としていましたが,これをcssを使って同様の効果を得たいです.

調べて理解したこと:
tdではwidthは効くがheightが効かない.inline要素では高さはline-heightで
決まるらしい.tdはblockでもinlineでもない.

知りたいこと:
tdの高さを固定することができるならば,どのように記述したらよいのでしょうか?
それともそうすべきでないのでしょうか?

現状の設定:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional// EN" "
http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style type="text/css">
<!--
tr{vertical-align:top;}
td{width:120px;}
//-->
</style>
<body>
<table border="1" >
<tr><td>内容と日付</td><td>内容と日付</td></tr>
<tr><td>内容と日付</td><td>内容と日付<br>改行</td></tr>
</table>
</body></html>


65 名前:Name_Not_Found :03/06/16 22:23 ID:???
>>63
革新的な技術を導入するのは結構だが、5年前の仕様くらいはそろそろ完全対応してもらいたいものだ。
せっかくDOCTYPEスイッチなる逃げ道を用意できたのだからね。


66 名前:2^6 :03/06/16 22:36 ID:???
>>64ですが,今自分でtdにheight:120pxと書いたらできました.
回線切って逝ってきます

67 名前:Name_Not_Found :03/06/16 22:36 ID:???
>>64
普通に効くけど…height
あと、vertical-alignはtdに指定しないとダメでしょ。

68 名前:Name_Not_Found :03/06/16 22:38 ID:???
>>60
確かにMozillaの拡張CSS使えば出来るけど、IEやOperaはどうする?
それに使っちゃいけないような事言ってたけど?

69 名前:Name_Not_Found :03/06/16 23:04 ID:???
>それに使っちゃいけないような事言ってたけど?

気にするな。害は無いんだから。

70 名前:Name_Not_Found :03/06/16 23:10 ID:???
あるとすれば、拡張cssが変更されて思い通りに表示されていない
スクリーンを見たときの作者の悲しみくらいだ。

害は無いな

71 名前:Name_Not_Found :03/06/17 00:51 ID:???
表を、ブラウザのウィンドウの大きさにかかわらず、常に右下にぴったりと
つけて表示させるためにはどうしたらよいでしょうか?
マージンの設定をいじってみましたが、上にしかくっつかないです。
お願いします。

72 名前:Name_Not_Found :03/06/17 00:57 ID:???
>> 71
スクロールしても同じ位置に表示させたいならば
CSS2では
table{
position: fixed;
bottom:0;
right : 0;
}
で指定できる。
ただし、IEは未対応なのでJavaScriptを用いるなどして代替手段を講じる必要がある。

/*
この質問に答えるの3度目ですが。
*/

73 名前:71 :03/06/17 01:19 ID:???
>>72
IE未対応ですか・・・。ありがとうございました。

74 名前:Name_Not_Found :03/06/17 01:23 ID:???
>>72-73
WinIEでも、position: fixed;の代りにoverflowとbody,html要素へのheight指定とでできる。

75 名前:73 :03/06/17 02:19 ID:???
>>74
ありがとうございます。
がんばってみます!

76 名前:Name_Not_Found :03/06/17 03:57 ID:???
>>69
害はないけどw
でもmozillaのみでしょ?表示されるのは

ieとoperaでも見れなきゃ意味ないし

それとも、トップの分かりやすい場所に 「このwebページはMozillaでしか見るな」とでも付け加えろってか?w


77 名前:Name_Not_Found :03/06/17 06:21 ID:???
ieとoperaで見られないことに意味がある。

78 名前:Name_Not_Found :03/06/17 07:55 ID:???
でもシェア率No.1 InternetExplorer

79 名前:Name_Not_Found :03/06/17 08:55 ID:???
しょうもなー!

80 名前:Name_Not_Found :03/06/17 11:40 ID:???
ブラウザの振り分け等の方法もかなりあるし、
-mozを使いつつも(何もしなくても)IEで特に問題なしに使えるページだってやろうとおもえばできるさ

81 名前:Name_Not_Found :03/06/17 13:17 ID:???
>>76 たかが角丸、丸くならなくても表の閲覧に支障は無いはず。
未対応のブラウザでもそれなりに見える、それが見栄えを分離したCSS設計のいいところ。

82 名前:Name_Not_Found :03/06/17 13:32 ID:???
>>76
>それとも、トップの分かりやすい場所に 「このwebページはMozillaでしか見るな」とでも付け加えろってか?w
角が丸くないと見る価値無し、と?
内容の無いくだらねぇページだな。やめちまえ。

83 名前:Name_Not_Found :03/06/17 13:33 ID:???
ulの丸を画像にして、更に横一列に表示させるのはできますか?
display:inline;を使うと画像が表示されずトホホです。

84 名前:Name_Not_Found :03/06/17 14:11 ID:???
>83
li {display:inline;}
li:before {content:url('hoge.jpg');}

だがIEでは聞かない諸刃の剣。

li {
display:inline;
background:url('hoge.jpg') no-repeat left center;
padding-left:XXpx; /*画像の大きさ分の余白*/
}

少し強引に。

85 名前:83 :03/06/17 14:43 ID:???
>84
少し強引な方を使わせて貰います。しかしoperaでは効かない罠。
ありがとうございました。

86 名前:Name_Not_Found :03/06/17 15:02 ID:???
>>85
>しかしoperaでは効かない罠。
インライン要素に背景画像を指定できない(6.0)
http://cssbug.tripod.co.jp/detail/opera/b022.html

Opera7.0からは対応してます。

あと、display:list-item;になってる要素をdisplay:inline;にしたら
リストマーカーが消えるのは当り前。
floatで横一列に表示させればよいのに。liにmargin-leftとpadding-leftを設置するも忘れずに。

87 名前:86 :03/06/17 15:05 ID:???
と思ったが、WinIEには別のバグがあるんだった。悩ましい……

絶対配置/フロート状態のリストアイテム要素のリストマーカーが消える(5.x/6.0)
http://cssbug.tripod.co.jp/detail/winie/b106.html

88 名前:Name_Not_Found :03/06/17 15:10 ID:???
>>83-87
つまり、横一列に表示させるのはfloatでやって、
後は左端に背景画像を配置。
これならブロック要素だからOpera 6でも問題ないはず。
Mozilla/N7向けにはlist-style:none;としておく。

89 名前:Name_Not_Found :03/06/17 15:15 ID:???
>Mozilla/N7向けにはlist-style:none;としておく。

display:block;の方がいいかも。
 cf. http://cssbug.tripod.co.jp/detail/mozilla/b047.html

90 名前:Name_Not_Found :03/06/17 16:43 ID:???
>89
floatした要素は常にdisplay:block;と扱われるはず。
実際どうだかは怪しいから指定しておいた方が良いと思うがナ

91 名前:Name_Not_Found :03/06/17 16:50 ID:???
>>90 >floatした要素は常にdisplay:block;と扱われるはず。
リンク先を読めって。それはErrataで修正されたんだよ。

>CSS2.1では、displayプロパティがlist-item値の要素は
>フロート化してもlist-item値のままであると定義されています。

http://bugzilla.mozilla.gr.jp/show_bug.cgi?id=3093
http://www.w3.org/Style/css2-updates/REC-CSS2-19980512-errata#s-9-7
http://www.w3.org/TR/CSS21/visuren.html#dis-pos-flo

92 名前:Name_Not_Found :03/06/17 17:50 ID:???
スタイルシートをランダムで変更して適用とかできませんか?

93 名前:Name_Not_Found :03/06/17 17:57 ID:???
>>92 できますが、JavaScriptスレッドに相談しなさい

http://east.portland.ne.jp/~sigekazu/css/javascript3.htm
http://east.portland.ne.jp/~sigekazu/css/javascript9_4.htm

94 名前:Name_Not_Found :03/06/17 18:00 ID:???
>>93
(´∇`)ありがとうございました
    ココはCSS関係なのですね

95 名前:リナ :03/06/17 18:37 ID:???
お聞きしたいのですが、
作ったホムペが、WINだとサイズ的に収まるんですが、MACだとはみ出してしまいます。

MAC側はIE5.1
WIN側はIE6.0

なんですが、関係しているのはOS?ブラウザ?でしょうか。
よろしくお願いします。m(_ _)m

96 名前:Name_Not_Found :03/06/17 18:43 ID:???
>>95
OSだと思われ。
てか
そんな作り方じゃIE以外は全滅と心得よ。

97 名前:Name_Not_Found :03/06/17 19:11 ID:YoG9dVuv
>>95
(*´Д`)ハァハァ探したぞ・・・・ハァハァ・・・ちかれた・・・・

最強ソフトを決めるスレで間違えてカキコしたろ。
きになって探しちまったよ。

そりゃソースの洗い直しだな。


98 名前:Name_Not_Found :03/06/17 19:18 ID:???
>>97
こ、こんちくしょぉー!
リナだから気になったんだな!?

リナタソ (*´Д`)ハァハァ

99 名前:リナ :03/06/17 19:42 ID:???
レスありがとうございます♪ヽ(´▽`)/

OSですかぁ。。
例えば、widthの数値なんかはパーセントで表したほうがいいのでしょうか?
馬鹿で ごめんなさい。。。

100 名前:Name_Not_Found :03/06/17 19:55 ID:???
>>99
ブラウザのウィンドウサイズにそって表示したいのならパーセントでイイが
そうでなければピクセルしていでいんでないの?

101 名前:Name_Not_Found :03/06/17 20:13 ID:???
便乗質問いいですがよろしくです。
もってるPCがWINのみでMACもってる知り合いはいないのですが、
MACでの表示を確かめる方法はありますか?

102 名前:Name_Not_Found :03/06/17 20:24 ID:???
>>101
自分の場合、
Gecko系、Operaは普通に確認。SafariにはKNOPPIX LinuxのKonquerorで確認。
どこまでちゃんと互換性があるか疑問だけど、まあこのくらいが限界でしょ。

MacIEはそのうち消える運命なので放置。

103 名前:101 :03/06/17 20:27 ID:???
なるほど。
最後の一文にワラタっす。
どうも。

104 名前:リナ :03/06/17 20:27 ID:???
>>100さん
Mac IE5で、「画像width="800"」が、はみ出てしまうみたいなんですが。。。

105 名前:Name_Not_Found :03/06/17 20:44 ID:???
>>104
テーブルを入れ子にしてレイアウトしてる?
だったら中に入ったテーブルの横幅などもきちんとあわせたほうがいいよ。

主な原因として全体の数値より入れ子になった数値のほうが大きいとか数値が
矛盾しちゃってるんじゃないかな?

OSやブラウザーによって<table>の横幅と<td>の横幅のどちらを優先にするかが違うから
<table>タグはもちろん<td>の「widht」もきちんとあわせないと崩れるよ。


106 名前:リナ :03/06/17 21:01 ID:???
>>104
うわぁ〜 その通りです。
テーブルの幅などをチェックしてみまーす。
ありがとうございました♪~♪ d(⌒o⌒)b♪~♪

107 名前:Name_Not_Found :03/06/17 22:20 ID:???
( ´,_ゝ`)プラットフォームの違いで同じ表現もできない
M$の糞ブラウザなんか捨てれ

108 名前:Name_Not_Found :03/06/17 22:32 ID:???
>>106
と言うか、テーブルレイアウトはスレ違いだ。

109 名前:じゃあ :03/06/17 23:05 ID:???
何処のスレや!?( ´,_ゝ`)

110 名前:Name_Not_Found :03/06/17 23:34 ID:???
初心者は初心者用質問スレッドへ行きたまへ。

111 名前:Name_Not_Found :03/06/17 23:41 ID:???
>>107-108
自分の思いどうりのレイアウトが出来ないヤツのぼやきだな。
利用者のシェア考えらればそれに対応して作るのは当たり前だろ。


112 名前:Name_Not_Found :03/06/17 23:55 ID:???
けれども「テーブルレイアウトはスレ違い」なのに変りはない。>>111
CSSスレッドなんだからね。CSSでのやり方を訊くならともかく。

113 名前:Name_Not_Found :03/06/18 00:00 ID:???
>>111 >思いどうりの
正しくは「どおり」ですね。歴史的仮名遣「どほり」→現代仮名遣「どおり」

114 名前:Name_Not_Found :03/06/18 00:02 ID:???
レイアウトなんぞおおよそでいいからコンテンツの中身をきちんとしろ

115 名前:Name_Not_Found :03/06/18 03:23 ID:???
まあそれ言ったらこのスレの存在意義もアレな感じだし。

きちんとマクアプしろって意味ならごめんよ。

116 名前:Name_Not_Found :03/06/18 05:13 ID:RFLSAg/4
<INPUT TYPE=text NAME="名前" STYLE="background:#DDDDDD;color:#000000;border:1 solid #007dff">
上記フォームのSTYLE="〜〜"をCSSでするにはどのように記述すればよいでしょうか?

117 名前:Name_Not_Found :03/06/18 06:28 ID:???
既にCSSだけど。
もちっと正確に言えばstyle属性にCSSを使ってるやね。
#まあ、もしかしたらCSSと互換性のある別のスタイルシート言語かも知れんがそれは兎も角

CSSでするって具体的にどうしたいん。

118 名前:Name_Not_Found :03/06/18 06:34 ID:???
>>113
通じてりゃ十分だろうが(ぷ

119 名前:Name_Not_Found :03/06/18 12:07 ID:???
>>116
> border:1 solid #007dff
数値指定は"1px"とか、単位をつけなきゃだめ。

>>118
通じるけど、あほっぽく見えるよ。

120 名前:Name_Not_Found :03/06/18 12:26 ID:???
>>116
※ hoge.css の内容
input.abc {
background-color: #dddddd;
color: #000000;
border: 1px #007 solid;
}

または、
input.abc {
background-color: #dddddd;
color: #000000;
border-width: 1px;
border-color: #007;
border-style: solid;
}

<html>
<head>
<meta http-equiv="Content-Style-Type" content="text/css" />
<link rel="stylesheet" href="hoge.css" type="text/css" />
</head>
<body>
<input class="abc"... />
</body>
</html>


121 名前:Name_Not_Found :03/06/18 12:29 ID:???
>>120
初心者相手に、なんでXHTMLにするかね……。

122 名前:Name_Not_Found :03/06/18 13:07 ID:???
>>121
文書型宣言ないし、ルート要素に名前空間もないし、
ただ空要素タグ使ってるだけで、XHTML ではないと思われ。

123 名前:Name_Not_Found :03/06/18 13:23 ID:???
整形式なXML文書?
でもないか。

124 名前:120 :03/06/18 14:13 ID:???
>>121-123
ああ、つい癖で空要素閉じちゃうんで(w
基本的なことだよ

125 名前:Name_Not_Found :03/06/18 16:41 ID:???
自己顕示欲満々ですね

126 名前:Name_Not_Found :03/06/18 16:48 ID:???
名前空間って何ですか?

127 名前:Name_Not_Found :03/06/18 17:50 ID:o5gY2Eao
WindowsのIEにおいて、
テキストと画像を1行に共存させて(iモードの絵文字のような感じ)
行間を設定すると、画像のある行間の設定が無効になってしまいます。

どのサイト調べても出てきませんでした。
どなたか解決策をご存じの方、お教え願います。

128 名前:Name_Not_Found :03/06/18 18:17 ID:???
>>127
画像に対しても文字と同じようにスタイルシート適用さたんじゃダメかね?
<img>の中にも「class=〜」を入れちゃうの。

129 名前:Name_Not_Found :03/06/18 18:28 ID:???
>>127
vertical-align:top;
vertical-align:middle;
vertical-align:bottom;
vertical-align:baseline;
vertical-align:text-top;
vertical-align:text-bottom;
vertical-align:super;
vertical-align:sub;
vertical-align: 実数値px;
それか、marginで調節

130 名前:Name_Not_Found :03/06/18 18:42 ID:o5gY2Eao
>>128さん >>129さん
回答ありがとうございます。

調べてみたところ、バグである事が判明しますた。
http://cssbug.tripod.co.jp/detail/winie/b075.html

>>129さんのやり方でやってみたものの、
画像のない行が次に来ると、そこだけ高さがline-heightの分も
プラスされてしまうので、その方法はダメでした。

しかし、天下のWindowsのIEのみでこんなバグがあるとは…

131 名前:Name_Not_Found :03/06/18 18:45 ID:???
実際IE糞だから。
シェアが大きいのは優れているからではない。

132 名前:Name_Not_Found :03/06/18 20:04 ID:za1jfAIR
スタイルシートで
カーソルが乗った時にフォームの送信ボタンの色を変える事って
できますか?

133 名前:Name_Not_Found :03/06/18 20:22 ID:???
>>132
聞く前に自分でやってみればいいじゃん。

134 名前:Name_Not_Found :03/06/18 20:28 ID:za1jfAIR
>>133
やり方が解らないから質問しました。
知ってるなら教えてください。

135 名前:Name_Not_Found :03/06/18 20:56 ID:???
>>134
聞く前に君はなにをやってみたの?
なにをやってできなかったか書かないと、教えるほうも手間がかかるし。

136 名前:Name_Not_Found :03/06/18 21:31 ID:???
>>134
こんな感じ?

<form name="form">
<input type="button" style="background:#ff0000" onmouseover="this.style.background='#0000ff'" onmouseout="this.style.background='#ff0000'">
</form>

137 名前:Name_Not_Found :03/06/18 22:36 ID:FKUo357M
どこで聞けばいいのかわからずここに辿り着きました…
ご親切な方、教えて下さい(願

htmlソースのことなのですが、
<a>タグのlink箇所を指マークに変化させず、
矢印のままでlinkさせる方法(ソース)はあるのでしょうか?

あるなら教えて下さい。
僕自身がわかる方法はmap以外にないので…



138 名前:Name_Not_Found :03/06/18 22:38 ID:dMnR2xWb
(・∀・)イイ懸賞、お小遣いサイトをピックアップして紹介してます 
月に1万円以上は厳しいけど、4000円ぐらいなら確実に稼げます!!
http://book-i.net/suikas

139 名前:Name_Not_Found :03/06/18 22:39 ID:8UkFiYer
最近スタイルシートやりはじめたばかりで何がなんだかわからんのですが
ちょっと教えてください。ちょっと急いでて過去ログとか見てる余裕がないんですわ。

テーブルの<td>の中のテキストを<table cellpadding="2">とかせずに2ピクセル
せるの端から離したいんですがこれってスタイルシートでなんとかなるんですか?

あとセルがいっぱいあるテーブルのなかにあるテキストにまとめて
文字の大きさ指定とかしたいんですけど
<span><table>(ry)</table></span>とか
やっちゃっていいんですか?
これやると郷ライブの4なんですけど編集とか保存とかするといつのまにか
<span>がなくなるんですけど。

あとぶっちゃけ<span>と<div>のちがいわかりません。
<span>はキーワードとか前後を改行したくないとき。
<div>はかたまりで改行しちゃっていいとき。くらいにしか思ってないんだけど
こんな見解でいいのでしょうか?

それからスタイルシートで文字の大きさ、色とか指定してあれば
<font>タグは要らないんでしょうか?
なんとなく入れてます。いまのとこ。

140 名前:Name_Not_Found :03/06/18 22:41 ID:???
>>139
急がば回れ。まずCSSの仕組みを一からじっくり勉強しましょう。>>4
これはマジレスです。

141 名前:139 :03/06/18 22:59 ID:8UkFiYer
厨房質問なのはわかってるんです。今も>>4必死に見てたんですが・・・
ちょっとHTML解ると言ったばかりに会社のweb担当にされてしまい
そんな業務ないのによその零細会社(社長の友達)のweb制作まで請け負う毎日。
なんとか自前の郷ライブ4でやってるんですがウイソでみたら崩れちゃうんで
明日までになおしとけや!ゴルアって状態なんです。
質問の点だけでいいのでささーと教えていただけたらすごいうれしいんですが


142 名前:Name_Not_Found :03/06/18 23:03 ID:???
>141
今回はcss使うのやめれや
使い慣れてから実戦投入

143 名前:Name_Not_Found :03/06/18 23:13 ID:???
罪悪感に蝕まれながらテーブルレイアウトで納品して後日CSSも習得したら
そんとき改善するか考えよう

144 名前:139 :03/06/18 23:13 ID:???
問題はすべてフォントの大きさから始まったんです。
とりあえず全部スタイルシートでpx指定にした。
テーブルとかも改めて全部幅とかきっちりチェックした。(変なとこけっこうあった)
テーブルに頼らざるを得ない部分もあるのはいまさら仕方ないけど
デザイン上どうしてもcellpadding 使いたくないんです。
どうか
>テーブルの<td>の中のテキストを<table cellpadding="2">とかせずに2ピクセル
>せるの端から離したいんですがこれってスタイルシートでなんとかなるんですか?

だけでも教えてやってくれませんか?

145 名前:Name_Not_Found :03/06/18 23:13 ID:???
>>137
ボタンにしてリンクを装っちゃう?

>>139
cellpadding="2"の代わりに使えるのは「padding」じゃないかな?
使い方は「padding:2px;」とかその他「padding-top:2px;」とかすると
上枠のみに余白がつけられる。

セルのたびにスタールシート適用させるのめんどくさいから
スタイルシートの記述で「td{ font-size:10px;}ってすることで
すべての「<td>」にたいしてフォントサイズ12pxが適用されるよ。

<font>の指定よりもスタイルシートの設定が優先されるとオモワレ

146 名前:Name_Not_Found :03/06/18 23:15 ID:???
フォントサイズ12px  ×
フォントサイズ10px  ○

147 名前:Name_Not_Found :03/06/18 23:22 ID:???
>>139
Q1: <td>の中のテキストを 2px セルの端から離したい
Q2: セルのテキストにまとめて文字の大きさを指定
td {
  padding: 2px;// A1
  font-size: 12px;// A2
}

148 名前:Name_Not_Found :03/06/18 23:37 ID:ZcKBi/5U
ちみたち、CSSの奥深さに吐き気がしてきたんだが、
いつもCSS使うときってどうやってんの?
暗記してんの?
それとも辞書代わりに誰かのホムページに逝って、書いているんですか?


149 名前:Name_Not_Found :03/06/18 23:45 ID:???
リファレンスがあるじゃん。

150 名前:Name_Not_Found :03/06/18 23:48 ID:???
大体覚えた上でCSS辞典

151 名前:139 :03/06/18 23:48 ID:???
>>147
> >>139
> Q1: <td>の中のテキストを 2px セルの端から離したい
> Q2: セルのテキストにまとめて文字の大きさを指定
> td {
>   padding: 2px;// A1
>   font-size: 12px;// A2
> }
さんくすです。できますた。A1の方がやりたかったのですよ。
A2だと画像と画像の間が離れちゃうから cellpaddingと同じ事になりますね。
頑張って精進します。


152 名前:Name_Not_Found :03/06/18 23:50 ID:???
>141

1. td {padding:2px;}
2. <table style="〜〜">
3. spanはインライン、divはブロックライン。

ビルダーに頼ってるくせにhtml判るなんてまあずいぶん傲慢ですね、
とメモ帳派の毒舌。
まあこれを機に勉強してくださいまし。

153 名前:Name_Not_Found :03/06/18 23:52 ID:???
>148
使ってれば自然と覚えていく。
まずは面白そうなプロパティをどんどん試していくのが良い。

154 名前:148 :03/06/18 23:52 ID:IMYp1sOw
そうですか。
まぁ、頑張れってことですか
ありがとんござんました

155 名前:Name_Not_Found :03/06/19 00:04 ID:eHZ3TqFM
>>137
cursor:default

156 名前:137 :03/06/19 00:05 ID:???
>145
違います。リンクの場所をわからなくしたいのです…

どうすればいいのですか??

157 名前:137 :03/06/19 00:07 ID:???
>156
それをスタイルシートに書けばいいのですか?

158 名前:137 :03/06/19 00:09 ID:???
↑>156×
 >155○


159 名前:Name_Not_Found :03/06/19 00:11 ID:zniG02fm
>>158
関係ない人間だがなったぞ
あとは、下線を消すだけ。
これは自分でCSSでカケルと思うから、まぁいいかと

<a href = "" style = "cursor:default;">(・∀・)ウンコ</a>

って漢字化

160 名前:137 :03/06/19 00:13 ID:???
>155,159
サンクス 助かりました!

161 名前:Name_Not_Found :03/06/19 00:23 ID:???
>>148
ほぼ暗記してるけど、細かい事とか忘れてしまった時は仕様書をみる。

162 名前:137 :03/06/19 00:25 ID:???
またまた問題発生!!
ウィンドウの一番下の通常インターネットゾーンって出ているところに
リンク先アドが出てしまい、やはりリンクされているのがバレバレ…

163 名前:Name_Not_Found :03/06/19 00:29 ID:???
>>162
JAVAかなんかで消せるだろう?


164 名前:Name_Not_Found :03/06/19 00:41 ID:???
JAVA 晒しアゲ!

165 名前:Name_Not_Found :03/06/19 00:44 ID:???
JAVA島

166 名前:163 :03/06/19 00:45 ID:???
>>164
いやいやJavaScriptとJavaは全く違うものだって知っているよ。
ただ入力面倒だから、省略したんや。
Java(ry
って書いたほうが良かった?

167 名前:Name_Not_Found :03/06/19 00:50 ID:???
>>166
面倒なら、JSと書けば?
2文字ですむよ。




ネタニマジレスカコワルイ

168 名前:Name_Not_Found :03/06/19 00:54 ID:eHZ3TqFM
Japan System?

169 名前:155 :03/06/19 00:56 ID:eHZ3TqFM
>>159
下線けすのって
text-decoration:none;
これだったっけ?うろ覚えだ・・・・

170 名前:159 :03/06/19 00:58 ID:???
>>169
俺に期間といて。
知らないから

171 名前:155 :03/06/19 01:01 ID:eHZ3TqFM
>>170
そか・・・

>>137
まーがんがってくれ

172 名前:Name_Not_Found :03/06/19 01:10 ID:???
>>169
あってる。

つーか、
碌な知識もないのに質問に答えてる香具師見ると、うんざりするんですが。
間違った知識を広められては困るんだが。
お願いだから止めてくれ。人に教える前に自分が学べ。

173 名前:Name_Not_Found :03/06/19 01:12 ID:???
>>172
黙りなカス

155はまともに質問にとりあってくれない137を思って答えたんだろうが、
それをごちゃごちゃ言うな

174 名前:Name_Not_Found :03/06/19 01:18 ID:???
なら知識ある奴は、絶対に答えてくれんのか?
ならお前らが24時間、この板に常置して質問に答えればいいさ。

何が間違った知識だよ。
お前の知識は100パーセント正解なのか?
神様かよ、お前は。

175 名前:Name_Not_Found :03/06/19 01:24 ID:???
(・∀・)ニヤニヤ

176 名前:Name_Not_Found :03/06/19 01:29 ID:JXP0Oc5B
>>175
(・∀・)(・∀・)ヤニヤニ

177 名前:Name_Not_Found :03/06/19 01:29 ID:???
2ちゃんなんだし嘘教えたりいい加減な知識で答える輩もいるだろう。
正しい知識を得たかったらこんなところで質問する前に仕様書読むなり
>>4のサイト巡るなり自分で調べろってことだ。



すいませんリンクの下線の消し方教えて下さい。

178 名前:Name_Not_Found :03/06/19 01:32 ID:???
>>177
>>4のサイト巡るなり自分で調べろってことだ。

179 名前:Name_Not_Found :03/06/19 01:33 ID:JXP0Oc5B
>>177
ただお前もちゃんとレスを読まないとな。
偉そうなこと言えんぞ。

>>169
>>172
答えがあるのに、読まないなんて、
それじゃ質問した意味も答えた人も、意味がなくなってしまうだろう?


180 名前:Name_Not_Found :03/06/19 01:34 ID:???
>>137
a {
cursor:default;
}


181 名前:Name_Not_Found :03/06/19 01:50 ID:???
>>177
a:link{
text-decoration:none;
}
a:hover{
text-decoration:none;
}
a:active{
text-decoration:none;
}
a:visited{
text-decoration:none;
}


182 名前:Name_Not_Found :03/06/19 02:04 ID:???
今作っているサイトは全てHTMLです。
でも、全てのコンテンツに同じデザインを使っているので、
友達に"CSSを使った方が楽だよ"といわれました。
今あるHTMLをCSSにするにはどうすればいいのですか?
どなたか教えて下さい。

183 名前:Name_Not_Found :03/06/19 02:06 ID:E71cQi28
>>182
CSS勉強して書き換える
これ最強

184 名前:Name_Not_Found :03/06/19 02:08 ID:???
>>162
本来ステータスバーに文字を流すものだが
とりあえず消えたよ。

<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT Language="JavaScript">
<!--
var msg=" ";
i=0;
function Start(){
if(i<=msg.length){
window.status=msg.substring(0,i);
i=0;
setTimeout("Start()",1);
}
}
// -->
</SCRIPT>
</HEAD>
<BODY onLoad="Start()">
<a href="http://www.yahoo.com">yahoo</a>
</BODY>
</HTML>

185 名前:Name_Not_Found :03/06/19 02:10 ID:???
>>182
どの部分にスタイルシートを適用させたいのかじゃないかな

186 名前:Name_Not_Found :03/06/19 02:11 ID:???
>>182

1.今あるHTML文書のレイアウトがfontやtableを使って作られている
→CSSで同じデザインになるように手動で調整。しかも、文書構造から見直す必要がある。

2.各ページごとにスタイルシートを用いてデザインしている
→外部スタイルシートにする。詳細は>>4のリンク先参照

187 名前:Name_Not_Found :03/06/19 02:21 ID:???
>182
HTMLのみの古いデザインをすっかりCSSに移行するのは
死ぬほど面倒で疲れる作業だ。
途中で「もうHTMLでいいよ何が楽なんだよバーヤ」と投げ出したくもなるだろう。

だがCSS、特に外部CSSを導入すれば、サイトの構築や衣替え等が
いかに楽になるか、今までいかに無駄な努力をしていたのかが判るだろう。


まあ要するに、>>4読んでがんがれ。
たぶんツールとか期待してるんだろうけどそんなもんオレは見た事無いしナ

188 名前:182 :03/06/19 02:21 ID:???
>>183 >>186
どうやら僕のサイトは
1.今あるHTML文書のレイアウトがfontやtableを使って作られている
なので、根本から作り直す必要があるみたいですね・・・。

>>185
とりあえず、メニュー部分をCSSにしたいんですが。

CSSというのはHTMLのデザイン部分だけを進化させたようなものだと聞いたのですが、
HTMLをCSSに変換できるソフトはありますか?
現在Macromedia DreamWeaver MXを使っているのですが、これでCSSを扱えるでしょうか?

189 名前:Name_Not_Found :03/06/19 02:24 ID:???
>>188
>HTMLをCSSに変換できるソフトはありますか?
そんなものはない

>現在Macromedia DreamWeaver MXを使っているのですが、これでCSSを扱えるでしょうか?
なぜマニュアルやヘルプを読まない?

190 名前:182 :03/06/19 02:24 ID:???
>>187
わかりました。
>>4を見て頑張ろうと思います。
色々とありがとうございました。

191 名前:Name_Not_Found :03/06/19 02:26 ID:???
>>188
すべてのレイアウトをスタイルシート化するのはたいへんだから
とりあえず文字の大きさ指定などからはじめてみては?

192 名前:Name_Not_Found :03/06/19 02:38 ID:izwJSAag
答えてばかりじゃつまらんので質問。

いままで手打ちだったんだけど、TopStyleでスタイルシート
書こうと思ったてインコしました。
ところが日本語文字が文字化けしてます。
これじゃ日本語フォントの入力ができません。
結局海外のエディタは使うなってこと?


193 名前:Name_Not_Found :03/06/19 03:08 ID:???
>>192
海外のソフトで日本語が扱えないのはよくある話だろ
PC初心者板へどうぞ

194 名前:Name_Not_Found :03/06/19 03:26 ID:???
>>193
そうでつか(。A。)⌒Y⌒ ヾ( ´_ゝ`) イラネ

ところでIDが「js」だ!!
IDのスレ行ってこよ;y=ー(´_ゝ`)サヨウナラ・・・

195 名前:Name_Not_Found :03/06/19 03:47 ID:???
>>162
自サイトで使用しているヤツを改造してみた。
外部JSにして使うとかしてくれ。
でも、こんなユーザビリティ最悪なサイトには行く気しないと思う。

//リンク先説明排除
var hrefs= new Array();
var titles= new Array();
var i=new Number();
function HideLinkHrefs(){
for(i=0;i<document.links.length;i++){
hrefs[i]=document.links[i].href;
document.links[i].onmouseover=new Function("window.status=\" \";return true");
document.links[i].onfocus=new Function("window.status=\" \";return true");
}
}
window.onload=HideLinkHrefs;


196 名前:Name_Not_Found :03/06/19 04:23 ID:???
ものすごく初歩的な質問でごめんなさい。HTMLとかCSSとかを初心者向きサイトや本で
勉強始めたばかりです。
<body>
<div align="center">
<h1 >見出し</h1>
<p>短い文章</p>
<p class="text">数回の改行タグがはいる、長めの文章</p>
</div>
</body>
というごく単純な構成のページを練習用に作ってみました。

headで
<style type="text/css"><!--
.text {width:60%;text-align:left}
-->
</style>
と指定してます。

これで、全部の要素をセンタリングして、かつ最後の長文は文章自体(インライン要素
で合ってますか?)を左寄せ出来ると思ったんですが。
マック版のIEではOSXで5.2、OS9.2で5、いずれも最後の長文がセンタリングされず、
左寄せになってしまいます。(winの方では大丈夫でした)
なにが悪いんでしょうか?
<div align="center">でセンタリングするのは非推奨だそうですが、そこのところはご容赦
ください。




197 名前:someone@meadownt :03/06/19 04:46 ID:???
>196
ttp://anslasax.net/css-make/t-a/index.html

センタリングするのはインライン要素っす。
pのインライン要素に対してalignをcenter,leftの両方を重複して指定している
(とMacIEは解釈してる)っすよ。
そんで(多分)詳細度が上の.textについての指定を優先して採用して、
左寄せになってしまう(´・ω・`)んだと思うっす。


198 名前:Name_Not_Found :03/06/19 05:02 ID:???
> 最後の長文は…左寄せ出来ると思ったんですが。
> マック版のIEでは…最後の長文が…左寄せになってしまいます。



199 名前:Name_Not_Found :03/06/19 05:25 ID:???
>198
分かりにくくてすみません。最後の<p></p>の長文は
     ああああああああ
       ああああ
      ああああああ
ではなく
     ああああああああ
     ああああ
     ああああああ

のように、インライン要素は左寄せにしたいんです。でもってそのブロック要素自体は
他のブロック要素とそろえてまん中にもってきたいということなんですが。
その<p></p>だけが左寄せになってしまうということです。

>197
text-alignでインライン要素は設定して、ブロック要素ごとの位置は
cssで設定するの大変だからhtmlタグの<div arign="center">でとりあえずは
やりなされ。
みたいなことを私が見た初心者用の本に書いてあったんですが、では、それじゃ
だめってことなんでしょうか。




200 名前:Name_Not_Found :03/06/19 05:36 ID:???
>>199
arignじゃなく
alignです。

201 名前:196 :03/06/19 05:46 ID:???
ごめんなさい。
実際はちゃんとalignとかきました。
何かばかなこと聞いてるのかもしれないので、しばらくあっちこっち回って
調べて来ます。

202 名前:Name_Not_Found :03/06/19 07:14 ID:???
フォントのサイズ指定で、pxやptよりも%で指定した方がいいのはなんで?

203 名前:Name_Not_Found :03/06/19 07:23 ID:???
>>202
ptやpxで指定すると
ユーザーがフォントの大きさを変えられなくなるため

204 名前:Name_Not_Found :03/06/19 07:57 ID:???
>>203
なろほど

205 名前:Name_Not_Found :03/06/19 08:46 ID:???
>>203

相対的の指定をしろって事?

em / ex /px /%

があるけど・・(相対的)

206 名前:Name_Not_Found :03/06/19 10:09 ID:???
( ´,_ゝ`) プッ



相対的 晒し age

207 名前:Name_Not_Found :03/06/19 12:56 ID:???
>205
pxは相対的な単位ではあるが
サイズ固定という意味では絶対指定と変わらない。

208 名前:Name_Not_Found :03/06/19 13:19 ID:JGPB5Ay5

allサンクス!!
解決しました(感謝

209 名前:137 :03/06/19 13:20 ID:???
↑ 
>137ですw

210 名前:Name_Not_Found :03/06/19 13:35 ID:???
>>137
どうせ「隠しページ」をやりたいんだろうが、痛いからやめたほうがいいよ。
それにaccessibility(略

# 解決したので

211 名前:Name_Not_Found :03/06/19 14:20 ID:???
tabで一発だしな

212 名前:Name_Not_Found :03/06/19 14:24 ID:???
ユーザーcssで(略

213 名前:Name_Not_Found :03/06/19 15:10 ID:???
cursor: crosshair はブチ切れ。
しかしユーザCSSを定義して使ってるヤシは0.0*%と(ry

214 名前:Name_Not_Found :03/06/19 15:19 ID:???
俺はユーザーCSSでカーソルとスクロールバー弄り無効にしてるぞ。

215 名前:137 :03/06/19 15:24 ID:???
>210
accessibility(略 ??
ユーザーcssで(略 ??

もともと半分隠しページのつもりだったんでけど
指マークになるから誰も彼もが来てしまい「半隠し」の
意味がなくなったもので…




216 名前:Name_Not_Found :03/06/19 15:48 ID:???
>>214
無効にするのってどうやんの
上書きなら解るんだけど、無効化させるやり方を知りたいです

217 名前:Name_Not_Found :03/06/19 16:04 ID:???
>>216
全部標準で上書きじゃないの?

218 名前:Name_Not_Found :03/06/19 16:33 ID:???
>>217
はい、なので私は「自分の好みの配色のスクロールバー」を設定しておく、くらいしか
対応策が無いように思ったのですが、そうすると、XPだと特に、バーの形状がデフォルトの
物と随分かけ離れてしまいます。
それを回避できる方法があるのなら、教わりたいのですが...

219 名前:Name_Not_Found :03/06/19 16:45 ID:???
つーかオメーら、クソIE使ってる時点で(略

220 名前:Name_Not_Found :03/06/19 16:53 ID:???
カーソルはユーザCSSで!importしとけばいいが、
製作者もやっていると・・・。

>>219
糞・IEのみでしか見られないサイト対策もかねて。
実際問題、Operaは広告がウザイし
Mozはリンクバーが外れたので没。
Lynxつかうなら(いまだにFlashの代替がなかったりもするし)、
IEコンポーネントで落ち着きましたが何か?

221 名前:Name_Not_Found :03/06/19 16:53 ID:???
Donutのような多段タブ実装して(それかOperaやMoz使ったタブブラウザ出てくるとか)
ちゃんと安定すれば乗り換えても良いんだけど…。

Operaは不安定だしMozもなんか微妙だし…。
IEも自分が使う分には悪くないし。

222 名前:Name_Not_Found :03/06/19 17:12 ID:???
ここでは自分が何使ってるかより一般的に何が使われてるかだろ。
だったら主な主要ブラウザに対応してつくるのは当たり前。
いくら糞ブラウザでもそれに対応できないヤツはもっと糞。
まあ自分のオナニーサイトだったら好きにしてもらったいいがな。

223 名前:Name_Not_Found :03/06/19 17:18 ID:???
>>222
糞ブラウザは何を言っても糞ブラウザ。
糞ブラウザの為だけに間違ったCSSを使う、正統なCSSを使えないのでは
困る訳なんだが?進歩&普及に繋がらない。
"赤信号みんなで渡ればこわくない"人間は史んで下さい。

224 名前:Name_Not_Found :03/06/19 17:19 ID:???
Operaはさっさとcolgroupとcolへのスタイル適用を実装汁ヽ(`Д´)ノ

225 名前:Name_Not_Found :03/06/19 17:20 ID:???
Opera 6以降は、list-style-image で読み込まれた
マーカー画像の位置が妙に上過ぎてダサくなるのが嫌。

それと、font-family の優先順リストに挙げられたフォントを、
各文字に対するグリフを含んでいるかどうかの順に検証しないから嫌。

更に、単バイト文字と2バイト文字で異なるフォントが採用された場合に、
ベースラインが揃わなくてダサくなるのが嫌。(英数字の位置が妙に低過ぎる。)

とか思ったりするのですが、皆さんどう思いますか?

226 名前:Name_Not_Found :03/06/19 17:23 ID:???
>>223
「糞ブラだからしょうがないんです。」
これで客が納得するのか?

227 名前:Name_Not_Found :03/06/19 17:33 ID:???
しかしアレだな。
IEなんつーのはアメリカを象徴してるようなブラウザだな。
勝手に突っ走ってエゴ丸出し。

228 名前:223 :03/06/19 17:39 ID:???
>>226
大切なお客様だからこそ、真実を教えてあげる。
それが本当の親切というものじゃないか?
赤信号を渡ってもし、車にひかれた場合を考えれば当然だろうね
それこそ詐欺だな(w

229 名前:Name_Not_Found :03/06/19 17:42 ID:???
何しろ、クライアントやユーザが無知・馬鹿過ぎるのが問題。
M$ にどっぷり浸かってやがるから、M$ の糞さ加減に気付きやしねぇ。

230 名前:Name_Not_Found :03/06/19 17:45 ID:???
>>229
ここでゴネても避けられないことだし
それが仕様だと思へ


231 名前:Name_Not_Found :03/06/19 17:48 ID:???
仕様無し
http://dictionary.goo.ne.jp/search.php?MT=%BB%C5%CD%CD&kind=jn&mode=0&base=1&row=2

232 名前:Name_Not_Found :03/06/19 18:32 ID:???
バカ野郎、mozillaが一番じゃ

233 名前:Name_Not_Found :03/06/19 18:38 ID:???
>>196-201
MacIEだけのバグではないか?
http://pc2.2ch.net/test/read.cgi/hp/1050844510/216-

234 名前:Name_Not_Found :03/06/19 18:46 ID:???
なぜ>>193はFAQ(>>5)を見なかったのかな。
 ブロックレベル要素をセンタリングする方法
 http://www.mozilla.gr.jp/standards/webtips0004.html

235 名前:Name_Not_Found :03/06/19 18:52 ID:???
>>233
それは質問者の勘違い。ウチではちゃんと表示されてたよ。

236 名前:Name_Not_Found :03/06/19 20:32 ID:???
>221
Operaはともかく、Geckoエンジンを使うタブブラウザはもうあるぞ。
スレ違いsage

237 名前:Name_Not_Found :03/06/19 20:50 ID:???
MacIE開発中止キター---!
一応5シリーズは続けるみたいだけどな。

ということはMacではMozやOperaが増えてくるってことか?

238 名前:Name_Not_Found :03/06/19 21:06 ID:???
このスレッドですべき話か? >>237

Apple-Safariのスレ
http://pc2.2ch.net/test/read.cgi/hp/1041996555/l50

239 名前:Name_Not_Found :03/06/19 21:16 ID:???
>>238
CSSの対応の面では(藁

240 名前:Name_Not_Found :03/06/19 21:20 ID:???
これで事足りる。あとは正式版が出てからの話だ。

CSSバグリスト > Safariメモ
http://cssbug.tripod.co.jp/misc/safari.html


241 名前:Name_Not_Found :03/06/19 23:36 ID:???
>>216
遅レスですまんがカーソルは
*{cursor: auto !important;}で無問題。
スクロールバーはシステムカラーをうまく使ってデフォルトのものに
かなり近い状態にはできる。自分はWin2kだからXPでいうところの
クラシックスキンでの話ね。ルナスキン?だかはわからんです。
自分はとりあえずスクロールバー消しさえ回避できればいいと思ってるから
適当でスマン。

242 名前:Name_Not_Found :03/06/20 01:36 ID:???
>>152
divはブロックライン

243 名前:Name_Not_Found :03/06/20 01:41 ID:???
>>242
ワロタ

244 名前:Name_Not_Found :03/06/20 01:50 ID:???
* {
scrollbar-arrow-color:buttontext !important;
scrollbar-face-color:threedface !important;
scrollbar-track-color:scrollbar !important;
scrollbar-highlight-color:threedhighlight !important;
scrollbar-3dlight-color:threedlightshadow !important;
scrollbar-darkshadow-color:threeddarkshadow !important;
scrollbar-shadow-color:threedshadow !important;
}

で良いのかな?

245 名前:Name_Not_Found :03/06/20 01:59 ID:???
というか
scrollbar-arrow-color:buttontext;
ってしたけど実際はどこの色使ってんだろ…
threeddarkshadowだったりしそうだなあ。


246 名前:Name_Not_Found :03/06/20 04:05 ID:8aoKv8ah
セルの背景を
style="background-color:#ffffde"
onmouseover="this.style.background-color='#ffffff'"
onmouseout="this.style.background-color='#000000'"
で指定したいのですが
.cssファイルで外部からの一括指定する方法がわかりません。
table{}内にどう指定すればいいのか教えてください


247 名前:Name_Not_Found :03/06/20 05:34 ID:???
>>246
おまい的にはJavaScriptもCSSなワケだ。

248 名前:Name_Not_Found :03/06/20 06:51 ID:???
>>246-247
WinIEだけなら、できるのでは。
ダイナミック プロパティことCSS関数のexpression()を利用して。
http://www.microsoft.com/JAPAN/developer/library/jpwebwk/author/dhtml/dude061198.htm

249 名前:Name_Not_Found :03/06/20 07:02 ID:???
外部シートで使用するんでしょ?
http://www.microsoft.com/JAPAN/developer/library/jpwebwk/author/dhtml/dude061198.htm
「現在提案されているCSS関数構文は、スタイルシートの中で使用した場合には機能しません。インラインスタイルでのみ設定するようにしてください。これについては近いうちに修正する予定です」
これってIE5から修正されてたんだっけ?

250 名前:Name_Not_Found :03/06/20 09:50 ID:???
んで一括指定できるの?できないの?

251 名前:Name_Not_Found :03/06/20 10:13 ID:???
>>250
CSSでの擬似クラスの中で動的なのは、:hover :active :focusしかない。
後は、JavaScript使うんだな

252 名前:Name_Not_Found :03/06/20 21:27 ID:???
すみません、
ttp://ff-11.com/ff10/
↑このページの「〜データベース」というところをクリックすると、
内容が引き出しのように出し入れできるのは、スタイルシートですよね?
調べてみたんですが、どうすればよいか分かりません。
これは何と呼ばれるスタイルでしょうか?
それだけ教えてもらえれば、あとは調べますのでお願いします。

253 名前:Name_Not_Found :03/06/20 21:41 ID:???
>>252
これは、JavaScript
getElementByIdで調べて勉強して下さい。

254 名前:252 :03/06/20 21:44 ID:???
>>253
Javaでしたか(汗)
ありがとうございました。
がんばります。

255 名前:252 :03/06/20 21:50 ID:???
>>254
> Javaでしたか(汗)
JavaScript と、Javaは別物

256 名前:Name_Not_Found :03/06/21 00:35 ID:???
>>255
>JavaScript と、Javaは別物

漏れ、これ今月に入ってから二十回くらい書いた。

257 名前:Name_Not_Found :03/06/21 00:53 ID:???
>>256
よく見るよ。

258 名前:Name_Not_Found :03/06/21 01:07 ID:???
もう『JavaとJavaScriptは別物です。』とか
>>1のテンプレに付け加えないか?

259 名前:Name_Not_Found :03/06/21 01:31 ID:???
>>258
いちいち突っ込みいれる必要ないんじゃない?
JavaScriptスレでも初心やスレでもないんだから。
それでも突っ込みたいやつは勝手に突っ込んどけと。
それに、テンプレにそんなこと書いたらJavaScriptの質問しだすアホが現れるかもしれんし。

260 名前:259 :03/06/21 01:32 ID:???
>>259
>初心やスレ
初心者スレ

261 名前:Name_Not_Found :03/06/21 01:39 ID:???
なんで254も255も252なのさ。

262 名前:Name_Not_Found :03/06/21 01:41 ID:???
253の誤りと思われ

263 名前:Name_Not_Found :03/06/21 01:45 ID:???
>>258
むしろ、板のトップに

264 名前:Name_Not_Found :03/06/21 07:36 ID:DZCrkLOU
IEの6以下使ってる人に質問なんですけど、
tdのwidth指定する時に%の単位使っても大丈夫ですかね?
知る限りpxで指定する仕様になってるんですけど、幅固定はしたくないもので

自分で調べたいけど戻すのめんどくさいよう。・゚・(ノД`)・゚・。

265 名前:264 :03/06/21 07:37 ID:???
誤爆…
別スレで聞いてくるので放置でお願いします

266 名前:Name_Not_Found :03/06/21 15:27 ID:???
自動的に広告が挿入されるところで
------------------------------------------
広告広告広告広告広告広告広告


ってできますか?

267 名前:Name_Not_Found :03/06/21 15:28 ID:???
え?

268 名前:Name_Not_Found :03/06/21 15:29 ID:???
リアルタイムでツッコミ見てしまってワラタ

269 名前:Name_Not_Found :03/06/21 15:33 ID:???
すべてが自演に見えてくる・・・





                    鬱だ・・・

270 名前:Name_Not_Found :03/06/21 15:54 ID:???
それが狙いの即レスです。

ってかわけわかんね。
単純に広告を沢山表示させたいのか?

自動挿入タイプは無理な気がする。
特定のタグ(body)の前後に入るタイプはそのタグを沢山書く事で
「もしかしたら」沢山出てくるかもしれんが個人的には勘弁。

271 名前:Name_Not_Found :03/06/21 15:55 ID:???
因みにCSSでは無理。
要素のコピーとかいうプロパティも無いし(あったら変だ)。

272 名前:これをテンプレに使ってくれ :03/06/21 16:45 ID:???



     【Java】 と 【JavaScript】 は 別 物



273 名前:Name_Not_Found :03/06/21 17:28 ID:???
>>272
放置しとけばいいだろ

>>271
俺は、そんなのほしいけどなぁ。

274 名前:Name_Not_Found :03/06/21 17:48 ID:???
>>272
ネタになってきたな(w


275 名前:Name_Not_Found :03/06/21 17:49 ID:???
>273
スタイルシートの役割からは外れてると思われ。
仮にCSSで要素がコピーされたとしても、
そのコピーされた部分は(CSSでやる場合に限れば)デザインと見なされちゃうしね。

例えばナビゲーション等のコピーはその部分だけSSIを使ったり
元ファイルをXMLでマクアプしてXSLT通して付け加えたりする方が比較的適切だしなあ。

276 名前:Name_Not_Found :03/06/21 18:04 ID:wN+7h/WZ
<html lang=ja>
<head><title>うんこ</title><base target="main">
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">

<style type="text/css">
body{
margin:0px;
}
main{
height:400px;width:100%;
border-top:2px solid #708090;
border-bottom:2px solid #708090;
vertical-align:middle;
}
</style>
</head>

<body bgcolor="white">
<span class="main">
うんこ
</span>
</body>
</html>
CSSが少しわかってきたのでこのようなページを作ってはみたのですが、
このようにして画面中央に横に細長いページ・・・というのを想像して作ってみたのですが全く反映されません。
どこがおかしいのでしょうか。

277 名前:Name_Not_Found :03/06/21 18:13 ID:???
>>276
<div class="main">うんこ</div>

span=インライン要素


278 名前:Name_Not_Found :03/06/21 18:14 ID:???
display:block;
をいれたらどうなる?

279 名前:Name_Not_Found :03/06/21 18:16 ID:???
あと、 main { に  
「*.」または「.」が抜けている


280 名前:Name_Not_Found :03/06/21 18:22 ID:???
>>276
width:100%っていうのはウインドウ幅に対して100%なので
横スクロールを出したいならpx指定をしたほうがイイとオモワレ
それからスタイルシートの中の「main」の始めに「.」がついてないので
「<span class="main"> 」にスタイルシートが適用されたません。
<html lang=ja>
<head><title>うんこ</title><base target="main">
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<style type="text/css">
body{
margin:0px;
}
.main{
height:400px;width:2000px;
border-top:2px solid #708090;
border-bottom:2px solid #708090;
vertical-align:middle;
border-style:solid;
}
</style>
</head>
<body bgcolor="white">
<span class="main">うんこちんちん♪</span>
</body>
</html>
な感じ。わかりやすいようにボーダーも表示しますた。
いらなかったら消してね。

281 名前:Name_Not_Found :03/06/21 18:29 ID:wN+7h/WZ
あああああああああああああすみません
.をつけるのをてっきり忘れてました・・・(;´Д`)
何度やってもできなかったのはこのせいだったんですね。
皆さんありがとうございました。色々やってみます。

282 名前:Name_Not_Found :03/06/21 18:34 ID:???
CSS関連にいけといわれて参りました。
質問なんですが、
背景画像はスクロールしても表示位置が変わらないタグありますよね?(一緒に
スクロールしてる)
背景じゃない画像はそのような表示方法はできないのでしょうか?
本で調べたのですが乗ってなくて…
環境は MSWIN IE6です。

283 名前:Name_Not_Found :03/06/21 18:44 ID:???
>>282
img {
position:fixed;
width:;
height:;
top:;
left:;
right:;
bottom:;
}
MSWIN IE6は知らんが

284 名前:Name_Not_Found :03/06/21 18:45 ID:???
まず、span (インライン) のかわりに div (ブロック) を使う。
それから .main { ← 注: ピリオドを忘れている。
中央よせは、body の padding か main の margin のどちらでもお好みで。

とりあえず、インラインとブロックの違いがわかっていないと思われ。

285 名前:Name_Not_Found :03/06/21 18:46 ID:???
position:fixed これってWINも平気なんですか?MACのIE専用
って本に書いてあったような…
でも試してみます!

286 名前:Name_Not_Found :03/06/21 18:51 ID:???
>>283
コラッ、MACのIE専用なんかじゃないよ
その本今すぐ窓から捨てろ

287 名前:283 :03/06/21 18:52 ID:???
>>285

288 名前:Name_Not_Found :03/06/21 18:58 ID:???
えっ?某HTML・CSSのHAND BOOKのP380に
 「WINDOWS版のIE・NNには対応していません」
って注意書きが…

289 名前:283 :03/06/21 19:03 ID:???
>>288
MSWIN IE6は知らんが、MACのIE専用なんかじゃない



290 名前:Name_Not_Found :03/06/21 19:12 ID:???
という事は…現状では不可能ということですかねぇ…

291 名前:Name_Not_Found :03/06/21 19:20 ID:???
糞ブラウザ使い続けますか?
それともCSSやめますか?

292 名前:Name_Not_Found :03/06/21 19:21 ID:???
WINでもIE以外は大抵対応してるがな…
どうしてもIEでやりたいならoverflowでも使えば?

293 名前:Name_Not_Found :03/06/21 19:24 ID:???
cssじゃなければできるのでしょうか??

294 名前:Name_Not_Found :03/06/21 19:28 ID:???
>293
簡単に言うと
「WinIEでは無理」

はい次の方。

295 名前:283 :03/06/21 19:37 ID:???
>>293
http://www2s.biglobe.ne.jp/~club_tom/java-kouza/sample/ja-sam_oa.htm

296 名前:Name_Not_Found :03/06/21 20:28 ID:???
├ほげ
│└むは
└ぴよ
といった感じのツリー状のメニューを表示しているのですが、
現在は"L"型の画像(img要素)と"|"型の画像(td要素の背景としてcssで指定)を重ね合わせています。
もっとスマートな方法をご存知の方、思いついた方は教えていただけると幸いです。m(__)m

297 名前:Name_Not_Found :03/06/21 21:15 ID:???
>>296
テーブルは使わなくてもできるんじゃないか?

298 名前:Name_Not_Found :03/06/21 21:30 ID:???
>296
貴方の例示した書き込み通りに、
普通に罫線で直接書けば良いのでは。
どうしたいのかちょっと良く判らん。

299 名前:Name_Not_Found :03/06/21 21:47 ID:???
何をスマートだと思っているのか解んないんだけど
list-style-image でも付けてやったら良いのでは?
あと、<ul><li>なんかでborderと上手く組み合わせるとかね

300 名前:Name_Not_Found :03/06/21 22:20 ID:???
XML

301 名前:Name_Not_Found :03/06/21 23:11 ID:???
>>296
スマートではない>>296がいくらスマートな方法を使っても、
どこかで粗がでてしまい、結局スマートにはならない罠。

302 名前:Name_Not_Found :03/06/22 00:42 ID:???
どこかで「CSSでul liのツリー構造を表現する」というテストがあったような

303 名前:296 :03/06/22 00:54 ID:brN8R43j
>>297-298
たしかに罫線文字を使う方法もありますが、
├1
│└2
└3
 └4
こうなった時に2と4の横方向の位置が揃うかどうかはフォント依存だったりしませんか?
(monospaceだといいのかな?)

>>299
リスト要素を使うのは非常によいと思うのですが、
上の例での1と3を繋ぐ線を出す方法が分かりませんでした。

304 名前:Name_Not_Found :03/06/22 01:05 ID:???
>>303
背景画像。

305 名前:Name_Not_Found :03/06/22 01:12 ID:???
>>303 >上の例での1と3を繋ぐ線を出す方法
li {margin-top:0;margin:bottom:0;}でul,liにborder-leftを設定すれば?

306 名前:Name_Not_Found :03/06/22 01:21 ID:???
>>302
CSSで表現するツリー表示
http://starry.night.nu/web/design/tips/css_tree.php
ツリー表示をCSSで
http://www.remus.dti.ne.jp/~a-satomi/nikki/2001/07a.html#day01num05
http://www.remus.dti.ne.jp/~a-satomi/nikki/tmp/tree/tree_css.html

307 名前:Name_Not_Found :03/06/22 01:27 ID:???
まあ、好みの問題だろうけど
ツリー風に線を入れるより、普通にリスト表示の方がわかりやすいんじゃないの?
どうしても強調したいところだけ、マーカーイメージやボーダーを使う
その方がスマートじゃないですか?

308 名前:Name_Not_Found :03/06/22 03:08 ID:???
>>306 の後者と同じ方法とかを採用して、
マーク付けを汚さない様にDOMで操作するとか。
そこまで拘る必要があるのかは甚だ疑問ですが。
>>307 に同意。

309 名前:Name_Not_Found :03/06/22 04:48 ID:VEquGkHi
文字色に透明を指定することはできますか?
display:none;でなくって、文字だけ表示させずに
ブロック要素の背景などはそのまま表示させたいのですが。

310 名前:Name_Not_Found :03/06/22 05:06 ID:???
無理。
やるなら背景色と同じ色を指定するしかない。

311 名前:Name_Not_Found :03/06/22 08:14 ID:???
>309
OperaだったかMozillaだったかで、
font-size:0;
とすると文字だけ消えた。
正しい挙動かどうか怪しいけどまあ一応。

312 名前:Name_Not_Found :03/06/22 09:35 ID:???
visibility:hiddenじゃぁ、ボックス自体が透明になってしまうしなぁ

313 名前:Name_Not_Found :03/06/22 09:35 ID:???
>>311
それじゃぁ、Operaなんかで最小文字サイズ(これ以上は小さくできないサイズ)を
設定しちゃうと悲惨だしな

314 名前:Name_Not_Found :03/06/22 12:12 ID:???
>>309
アフォだな。
それなら文字を書かなければイイだろ。

てか 何がしたいか知らんが JavaScript (゚Д゚)ピー.....

315 名前:Name_Not_Found :03/06/22 13:02 ID:???

<span style="width:100%; filter:Alpha(style=0,opacity=1)">透明文字</span>

opacityは1〜100までなので完全な透明ではないけどね。

316 名前:Name_Not_Found :03/06/22 13:44 ID:???
>>309
p { height: 1em; }
span { display:none; }

<p><span>表示させたくない文字</span></p>

でいいんじゃないか?

317 名前:Name_Not_Found :03/06/22 14:50 ID:???
>>316
スマートでない。
display:none;でなくvisibility:hidden;にすれば
わざわざheightを指定するまでもないのに。
http://hp.vector.co.jp/authors/VA022006/css/visualren.html#visibility

318 名前:Name_Not_Found :03/06/22 15:02 ID:???
まあ>>316みたいに無闇にタグ付けを増やすより、
{color:背景色と同色;} が一番だな。>>310で結論は出てる。

319 名前:296 :03/06/22 15:13 ID:???
>>304-308
時間がとれたらまた試行錯誤してみます。
どうもでした。

320 名前:Name_Not_Found :03/06/22 15:24 ID:???
>309の言う背景とは背景画像の事ではないだろうか。

321 名前:316 :03/06/22 15:33 ID:???
>>317
ああ、そうだね(w
>>318
意味も解らないのにほざくなよ

322 名前:Name_Not_Found :03/06/22 15:52 ID:???
>321 ヨシヨシ、悔しかったんだね。(ト頭を撫でる)

323 名前:Name_Not_Found :03/06/22 16:47 ID:???
>>321
近年稀に見る馬鹿

324 名前:Name_Not_Found :03/06/22 16:52 ID:???
>>322,323(318)
よっぽど悔しかったのか?

325 名前:Name_Not_Found :03/06/22 16:57 ID:???
>>324
悔しすぎます。>>316のスキルの低さが。

326 名前:Name_Not_Found :03/06/22 17:04 ID:qAwL3eBu
netscape7の1ピクセルって何ピクセルなんですか?
width:470pxと指定したのにIE6の1.2倍くらいの幅になります。
1pxって画面上の1ドットじゃないんですか? 
解像度とかの設定が必要ですか?

327 名前:Name_Not_Found :03/06/22 17:04 ID:???
とりあえず>>318は相当なバカ

328 名前:Name_Not_Found :03/06/22 17:06 ID:???
>>326
1ピクセル
恐らくボックス要素のサイズ問題を理解していないものと思われ
IEの方がおかしいはず>>5

329 名前:Name_Not_Found :03/06/22 17:07 ID:???
>>326
maegin paddingの問題じゃないのか?
IEは計算が変だった気がする

330 名前:Name_Not_Found :03/06/22 17:11 ID:???
とりあえず>>316スキルゼロ>>318読解力ゼロ

331 名前:Name_Not_Found :03/06/22 17:15 ID:???
>>330
わかったよ、オマエがアフォなのは

332 名前:Name_Not_Found :03/06/22 17:21 ID:???
♪喧嘩をやめて〜 二人をとめて〜

333 名前:Name_Not_Found :03/06/22 17:32 ID:???
          / :::::::::::::::::::::i"::::::.|:::::;,;;'イ     l , ':::::::|
.         / .::::::::::::::::::::::!;::::::::.!、:;;''::{       j.,;'::::::::::|
        / .::::::::::::::::::::::;':::::::::::.!i::::::::゙,    ,;';'::::::::;;;;;{,
       /  .::::::::::::::::::::::/:::::::::::::.l〉-::;,」   /::-‐:::::::::{,,
       ,!  .:::::::::::::::::::::/:::::::::::::::::.!:::::::::゙7rr':::::::::::::::ニ_::"{
       !  .:::::::::::::::::::;.'::::::::::::::::::::::゙!:::::::,','」l:::::::::::::::::::::::;;;;゙;,
      i  :::::::::::::::::::;."::::::::::::::::::::::::::L:;;;'」::l_l::::::::::::::::::::::::::::゙i
      i .::::::::::::::::;:' ::::::::::::::::::::::::::::::├z‐''ー-ニ、,二;;;;;;;;_==!
      !. .:::::::::::::::/| ::::::::::::::::::::::::::::::」;;j;;:::::::::::::/:::::::::::::::!|:~`''i
      l .::::::::::::::/!i.| ::::::::::::::::::::::;;.='"|/:::::..:::::''!i,.ィ''":::::::::!::::::;ヽ
      ! .:::::::::::::/l!l ,ト、.;;;;;:: ==''"   {,.‐'''"~ヾノi::::::::::::::;;:'!::::::;;ヽ
.      iニー、;;::::イ !l il|゙:, ̄        l::iiiiiiiiii ;!`''ー'''"゙`'ヾ,l::::::;;;;ヽ
      /    :::::::,リ!l i!.|';ヽ、       、.::::ぃ::/          ヾ、  ;;;;:゙i
.    /    :::,,ィ;!ヾj ヾ;;;;;`'i         '、::υ::             `'ヘ"ヾ
    j!    .ィ;;;;;l  ゙  `'''-`''=---‐='"~~ii |               l‐"
.   !l   ,ノ;!_ノ                 ゙"''U 、!  _,. ======、!
   l;;`'ー''";;;;;l         どろっ       F '"::::::::::::::::::::.. .::::::::}
   /:;;;;;;;;;;;;;;;;ノ!                  ∪ i}::::::::::::::::::::::::::::::::::::::l
  {:;;;;;;;;;;;;;;;;:';:''             (⌒⌒) |:::::::::::::::::::::::::::::::::::::::!


334 名前:316 :03/06/22 17:38 ID:???
漏れのミスは認めるが、何も>>318のような香具師のことを
巻き込むのはやめて欲しいのですが。

335 名前:Name_Not_Found :03/06/22 17:47 ID:???
321 {display:none;}
322 {visibility:hidden;}

336 名前:Name_Not_Found :03/06/22 17:49 ID:???
318 {color:背景色と同色;} が一番だな。

337 名前:Name_Not_Found :03/06/22 17:50 ID:???
ハイ次の方、質問どうぞ。

#質問の際は背景ってのは背景色か背景画像かはっきり書くこと。

338 名前:Name_Not_Found :03/06/22 18:00 ID:???
316きもい

339 名前:Name_Not_Found :03/06/22 18:07 ID:???
背景画像と仮定すると、どんな方法がある?

例えばAlternateStylesheetで<p>hogehoge</p>を

p{
background-color:white;
color:black;}

p{
background-image:url(hoge.jpg);}

と切り替えるとき、後者で背景だけ表示させて字を表示させない方法はある?

340 名前:Name_Not_Found :03/06/22 18:18 ID:???
>>339
ねえぞ。他の要素入れ子にするしか。
これ以上>>316>>318を晒し上げなさんな。

341 名前:Name_Not_Found :03/06/22 18:19 ID:???
>>339
その場合で文字を表示させないのなら、わざわざ
background-color:white;
color:black;
は指定する必要は無いと思われ


342 名前:昔の人 :03/06/22 18:23 ID:???
>>339
全く方法がないわけでもないでせう。
pにwidthを決めてから、paddingを目一杯取って文字列をボックスの幅の外に追ひやる。
で、overflow:hidden;を指定しておく。
これでどうです? 七面倒なので實用的ではありませんが。

343 名前:341 :03/06/22 18:23 ID:???
要は、文字を代替えとしてイメージを使用したい
場合のみじゃないのかな?
見出しとかをどうしてもイメージで表示させたいなど


344 名前:Name_Not_Found :03/06/22 18:26 ID:MVSCwHEN
>>343
「代替えとして」ってどう読むの?


345 名前:341 :03/06/22 18:29 ID:???
例えば、http://www.w3.org/の<h1>のようにイメージを使用しているが、
CSSで視覚的に背景画像で表示させるとか野意味だよね?

346 名前:341 :03/06/22 18:57 ID:???
例えば、http://www.w3.org/のタイトル画像、w3c_main.png 使用の場合
h1 {
background-image:url("w3c_main.png");
background-repeat: no-repeat;
background-position: left top;
//省略...
width: 315px;
height: 48px;
}
span {
display:none; //又は、visibility:hidden;
}
<body>
<h1><span>W3C WORLD WIDE WEB</span></h1>

CSS有効時:w3c_main.png が、タイトルに表示される。
CSS無効時:W3C WORLD WIDE WEBが文字として表示される。

347 名前: :03/06/22 19:00 ID:???
学校でホームページを作れといわれました。
期限は、明日までだそうです。
この板の皆さんで作っていただけませんか?

348 名前:Name_Not_Found :03/06/22 19:19 ID:???
>>346の例からすると>>316のやり方も理にかなっている。
文字は表示しないのでvisibility:hiddenにする必要も無くて、
background-imageに使用する画像の大きさを基準として height値が
必要になってくるからね、どうでもいいけど・・・
しかし、>>318はどうしようもない馬鹿だね(ry


349 名前:Name_Not_Found :03/06/22 19:41 ID:???
ああ、激しく遅レスで恐縮なのだが、
最小文字サイズを指定してても>>311は効いたよ。

それと、>>316はいわゆる「デザインの為の」「CSSの為の」マークアップと言わないかい?

350 名前:Name_Not_Found :03/06/22 20:08 ID:???
>>347
課題は自分でやるから意味があるんだよ。
ツーかスレ違いだ。

351 名前:Name_Not_Found :03/06/22 20:33 ID:???
ユーザビリティ考慮するならcssで背景画像にするより直接
<h1><img src="" width="" height="" alt="タイトル"></h1>とした方が
いい気がする。strictなやり方じゃないかもしれないけど。
>>346の例だと画像切ってしまうとタイトルが一切なくなってしまう。


352 名前:Name_Not_Found :03/06/22 20:39 ID:???
>>349
>「デザインの為の」「CSSの為の」マークアップ

それは問題があるのでしょうか?
僕自身は<span>はcssを設定する時以外に使ったことがないんです。厨房でスマソ

353 名前:Name_Not_Found :03/06/22 20:44 ID:???
>352
本末転倒だという事。
まずHTMLがあり、CSSはその体裁を整える為に使うものだから。

しょせんは理想論だけど。

354 名前:Name_Not_Found :03/06/22 20:55 ID:???
>>353
なるほど、了解しました。

実は、316氏の手法は自分も汎用しているので、不安になったんです。
ありがとうございました。

355 名前:Name_Not_Found :03/06/22 21:40 ID:???
>>351
画像表示切っているぐらいの香具師なら、その前にCSSも切っている

356 名前:Name_Not_Found :03/06/22 21:49 ID:???
>>355
俺はナローバンダーだったころ画像だけ切ったたが?

357 名前:356 :03/06/22 21:49 ID:???
切ってた

358 名前:Name_Not_Found :03/06/22 22:11 ID:???
>>355
そりゃ間違い

359 名前:Name_Not_Found :03/06/22 22:30 ID:???
>>351,358
基本はそうかもしれないけど
実際ブラウザに依存するんだよね?
CSSを有効にしておいて画像表示を切ってもaltどころか何も表示されない仕様、
(Mozilla等Gecko系)
CSSを有効にしておいて画像表示を切ってもCSSとして background-imageは
表示されるんだよね(MacIE5.2x)

なんだよね

360 名前:Name_Not_Found :03/06/23 01:12 ID:???
>>355
勝手に決めつけてはいけない。
私は画像表示切ってるが、CSSは有効にしてる。WinIE6とOpera7使用。

361 名前:Name_Not_Found :03/06/23 02:06 ID:???
今>360がイイこと言った。
漏れ的セッチングは
IEはオール有効。(Java以外
Operaは全て無効だがCSSは有効。(画像はケースバイケースでオン・オフ
誰もCSS無効にしてワザワザ見難くしない罠。


362 名前:Name_Not_Found :03/06/23 02:11 ID:???
>>361
JAVAなのかJavaScriptなのか(ry

タブブラウザなんかだと、画像がワンタッチで切り替えられる。
CSS関連の設定いじるより楽だからこっちの方がよく使う。

363 名前:Name_Not_Found :03/06/23 02:35 ID:???
俺もタブブラウザでワンタッチ切り替えかなぁ。
普段画像ありでなんか無意味な画像が多いサイトはぽちっと読み込み不可に。

364 名前: