/* CSS、スタイルシート質問スレッド【13】 */
Cascading Style Sheetsの事で尋ねたいことがあったらこちらへどうぞ。
関連スレやリンクは
>>2-5 あたりに。
■■■■■ 注意 ■■■■■
質問者 (特に「初心者」) は、
必ず
>>4 にある解説サイト (かなりわかりやすい) で
勉 強 してください。
質問の前に、まず
>>5 の【FAQ】を参照してください。
【FAQ】でわからなかった場合は、過去ログを検索しましょう。
WinIEの場合は、[Ctrl+F]で検索できます。
また、IE などではまだ対応できていない要素などやバグが多数存在します。
ですので、
>>2 (関連スレ)の「バグ辞典」に目を通しておきましょう。
また、「環境を書け」とか「ソースは?」と求められたときは
応じるようにしましょう。回答が早く返るようにするためです。
特にNetscapeについては、ヴァージョンについても必ず明記する
ようにしてください。ネスケは、4までと6以降でまったく別物です。
※ マターリ進行推奨 ※
>>2 【前スレ】【過去ログ】【関連スレ】
>>3 【仕様書】【CSS検証】
>>4 【解説など】
>>5 【FAQ】
なんかIEがまちがってるとか勝手に補ってるとかおおいけど、 IEが一番多くつかわれてるんじゃんあないの?? よくわかんね。
>>9 IEは「多」であるが「全」ではないということ。
>>9 一番多く使われてる=間違ってない
なの?
よくわかんね。
12 :
Name_Not_Found :02/11/29 08:19 ID:zO780MwT
>>11 間違っていても、使用されてるなら無視するわけにもいかないでしょ、って意味じゃないの?
誰もIEを無視するなんて言ってないヨ。しようたってできない。 しかしNN7やOperaを無視してWinIEが全てだと思ってる人なら沢山存在しますネ。
>>13 CSS講義の本質から離れつつあるようにみえるけど、
「どのブラウザでも一応見れるものにする」ってのはCSSに肝心な要素とも思えるよな。
マイノリティは切り捨て!
16 :
Name_Not_Found :02/11/29 10:06 ID:LjNoxUDA
質問します。 <p id="test01">…</p> <p id="test02">…</p> (中略) <p id="test10">…</p> のようにしたとして、test01からtest10まで同じスタイルを適用させたい場合は、 p#test01,p#test02,(中略),p#test10 {color:#000000} とせずに、 簡略化して指定する方法はありますでしょうか? p {color:#000000} は他のpにも適用されてしまうので、 この他の方法をお教えください。よろしくお願いします。
>16 idとclassを併用する. 共通するってことは何らかのclass付けができるってことでしょ?
18 :
16 :02/11/29 12:16 ID:???
>>17 レスありがとうございました。
ご教示の件を試したところ、うまく実現できました。
19 :
16 :02/11/29 12:23 ID:???
>>17 喜びのあまり書きそびれてしまいました。
< 共通するってことは何らかのclass付けができるってことでしょ?
おっしゃる通りで、適当なclass名が指定できました。
大変失礼しました。
20 :
hp :02/11/29 14:27 ID:E1wkz9oR
先ほど忠告を受けたのでこちらで質問です。 たとえば <DIV style="margin-left:50px; margin-top:5px"> で、この中にtableを入れてtableの中にテキストを流し込むと ブラウザで、テキストが切れてしまうんですが これを防ぐ方法はないのでしょうか? それともこのやり方は間違ってるんでしょうか?
>>20 ごめん、その説明では、
・どのようなソースなのか
(tableの中にテキストを流し込む、というのがよくわからない)
・問題になっている症状
(テキストが切れてしまう、ではどんな状態かよくわからない)
・どのブラウザのどのヴァージョンで見た時に、その症状が発生するのか
・結局、どのような見栄えを実現させたいのか
がわからないので、助言しづらい。
文章全体の左に50px、上に5px分の余白をもうけたいだけなら、divやtableは
不要で、bodyにmarginを設定してやればよいと思う。
ロボット検索を回避するためBBSの各ページに <META NAME="ROBOTS" CONTENT="NOINDEX,NOFOLLOW"> を入れてるのですが、ページが生成される度に入れるのは大変なのでスタイルシートに 入れたいのですが、どういうタグを入れたら良いのでしょうか。 また、これはCGIファイルに入れるものなのでしょうか? どうぞよろしくお願い申し上げます。スレ汚しすいません。
>>22 cgiのほうに入れてください。
スタイルシートではどうしようもありません。
>>23 どうもありがとうございます。ありがたいです。
ずうずうしいのですが、ここのどこに入れれば良いのか教えていただけないでしょうか。
本当にどうもすいません。
<head>
<meta http-equiv="content-type" content="text/html;charset=shift_jis">
<meta http-equiv="content-style-type" content="text/css">
<link rel="stylesheet" href="diary.css" type="text/css">
<title>琵琶湖の写真</title>
</head>
なんでCSSスレで聞いてるんだろう・・・? head内だったら別にどこでもいいよ
>>24 <head>〜</head>間ならどこでもどうぞ。
>>26 これでいいわけですね。本当にどうもありがとうございました。
<head>
<meta http-equiv="content-type" content="text/html;charset=shift_jis">
<meta http-equiv="content-style-type" content="text/css">
<link rel="stylesheet" href="diary.css" type="text/css">
<META NAME="ROBOTS" CONTENT="NOINDEX,NOFOLLOW">
<title>琵琶湖の写真</title>
</head>
>>25 どうもすいません。どこで質問すればいいのかわからなかったものですから。
どうもありがとうございました。
>>17 質問者とは別人です。
idとclassを併用するの意味がわかりません。
どう記述すればいいのでしょうか
教えてください!
教えていただいたのですが、いまCGIファイルを見てみたら 前に「print」が付いていて、このように変更したのですが、 まったく表示しなくなってしまいました。何度もすいませんが これはどういうことなのでしょうか。なんだかすいません。 print "<html><head>\n"; print "<meta http-equiv=\"Content-Type\" content=\"text/html; charset=Shift_JIS\">\n"; print "<style>\n"; print "<!--\n"; print "body,tr,td{font-size:10pt}\n"; print "-->\n"; print "</style>\n"; print "<META NAME="ROBOTS" CONTENT="NOINDEX,NOFOLLOW">\n"; print "<title>琵琶湖の写真</title>\n";
>>29 悪いことはいわない、CGI スレに行きなさい。
31 :
Name_Not_Found :02/11/30 21:02 ID:zajM29TK
>>29 どうでもいいけど、
>print "<style>\n";
で、MIMEタイプの指定をすれ。
32 :
28 :02/11/30 21:06 ID:???
早く教えてください 今日完成させないといけないので。
>>29 ほかのスレにもベタベタと同じ質問を貼られても困るんでとりあえず回答するが、
この質問はCSSとはまったく関係がないので今後その質問に関することは
Webサイト制作初心者用スレッドか、WebProg板の初心者スレッドに行ってください。
誤り
print "<META NAME="ROBOTS" CONTENT="NOINDEX,NOFOLLOW">\n";
正解
print "<META NAME=\"ROBOTS\" CONTENT=\"NOINDEX,NOFOLLOW\">\n";
print " 〜〜〜 "; の中に NAME="ROBOTS" のように " を書く場合は、この " が
閉じる意味の " ではないですよという意味で前に \ を書いて \" としないといけない。
>>32 右斜め下に一発ガツンとやるといいそうな。
がんばってください。
>>28 class っていうのは、Java の予約語です。
オブジェクト指向を極めないと使えないし、
資格制度があるので貴方は id を列挙したほうがよろしいかと思われます。
36 :
31 :02/11/30 21:17 ID:zajM29TK
htmlとcssしか知らないため、これに限ってレスします。 ><meta http-equiv="content-style-type" content="text/css"> を >print "<style>\n"; >print "<!--\n"; >print "body,tr,td{font-size:10pt}\n"; >print "-->\n"; >print "</style>\n"; の前に入れてください。 また、 >print "<style>\n"; は、 print "<style type='text/css'>\n"; と直してください。 cgiについては知りませんが、少なくともhtmlの記述はこのようにしてください
>>33 これの間違いじゃないか?
<META name=\"robots\" content=\"noindex,nofollow\">\n";
38 :
31 :02/11/30 21:24 ID:zajM29TK
訂正 ><meta http-equiv="content-style-type" content="text/css"> >print "<meta http-equiv="content-style-type" content="text/css">\n ";
>>36 \が付いてないし、cssが別にあれば必要ないでしょ?
print <<End_Of_HTML; <html><head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <style> body,tr,td{font-size:10pt} </style> <meta name="robots" content="noindex,nofollow"> <title>琵琶湖の写真</title> End_Of_HTML のほうが楽じゃない? print << 'End_Of_HTML'; #でも良いけど。
41 :
31 :02/11/30 21:32 ID:zajM29TK
42 :
28 :02/11/30 21:35 ID:???
>>35 classはjavaの予約語って本当ですか?
スレ違い質問よりこっちの質問を優先してください。
43 :
31 :02/11/30 21:35 ID:zajM29TK
classってC++でも予約語だよな?
45 :
28 :02/11/30 21:36 ID:???
>>43 content="text/cssは不必要
>>42 嘘です。C# の予約語です。
よって、IE 以外の UA で class が正常に認識されることを期待するのは犯罪です。
48 :
31 :02/11/30 21:48 ID:???
content="text/cssは必要
50 :
28 :02/11/30 21:51 ID:???
皆さんスレ違い質問に優しすぎます 僕に優しくしてください
いやです
初心者スレみたいだな
53 :
28 :02/11/30 21:56 ID:???
土曜日なので皆さん暇なんですね 僕をからかって暇つぶししてるんでしょう でも僕は忙しいので さっさと教えて下さい
54 :
28 :02/11/30 22:00 ID:???
おいとっとと教えろつってんだろ このメモ帳手打ちど暇人野郎ども こっちはDreamweaver MXで作業してて超忙しいんだ!! さっさとしろさっさとーーーー!!
55 :
28 :02/11/30 22:00 ID:???
しょうがねえから55でもゲットしとくか
放置決定
ウケルーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
>>36 print "<meta http-equiv=\"Content-Type\" content=\"text/html; charset=Shift_JIS\">\n";
と指定してるのにわざわざ重複する
print "<meta http-equiv=\"content-style-type\" content=\"text/css\">\n ";
を入れる必要あるのかよ?
59 :
28 :02/11/30 22:46 ID:???
いつまでスレ違い質問に答えてんだよ 学習能力のない野郎どもだなくそが こっちはDreamweaverで作業してんのよ グループ機能使って。 あーーーメモ帳使ってるお前らに言っても無駄か(笑 とにかくグループで一つのサイト作り上げてるわけ これは日本語だから分かるよな んで俺がCSS担当なわけよ だからさっさと教えろつってんだろ じゃねえと他の奴らに示しがつかねーだろ? さっさと教えろよな
>>58 あるんです。
それが定め(仕様)なのぢゃ。
訊く前にちっとは検索してほしいものだ。
>>4 のリンク先は見たのかな?
>>28 id っていうのは、xhtml でnameアンカーの代わりになるものです。
ページのアウトラインを極めないと使えないし、
同じidは二度と使えないので貴方は class を列挙したほうがよろしいかと思われます。
63 :
28 :02/11/30 22:53 ID:???
やっと、 釣れた(w
64 :
28 :02/11/30 23:10 ID:???
さて、糞して寝るか(w お前らご苦労さん(プププ
65 :
Name_Not_Found :02/11/30 23:13 ID:yOP/Svlu
必死だな。
うん、必死だね。
何と必死であることよ。
「釣れた」 今まで劣勢だった状況を全て覆すと厨房達に信じられている、伝説の台詞。
69 :
Name_Not_Found :02/12/01 00:40 ID:8Gpke8Q3
どうでもいいです。
そんなことないです。
72 :
Name_Not_Found :02/12/01 02:15 ID:+zv7jvTK
すいません、リンクの色のセットを2つ作るのにはA.externalを使うというのはわかったのですが、 3つのセットを作るにはどうしたらいいのでしょうか? おねがいします。
73 :
Name_Not_Found :02/12/01 02:57 ID:pGWXOPcZ
>>72 1から勉強やりなおせ。
externalはクラス名にすぎません。
>4のリンク先全部見てみたけど自分が初心者過ぎるためかよくわかりません。
以下のようなレイアウトにするためにはどのようなCSSを使えばよいのでしょうか?
<TABLE>
<TR>
<TD></TD> <TD></TD>
</TR>
</TABLE>
ttp://homepage1.nifty.com/~yoshi-s/home/ ここみたいなレイアウトにしたいのにソース覗いてもわかりません…
どなたかよろしくお願いします
>>74 そこは文字列選択するときもちわるいことになるな。
"css 段組" で検索すれば丁寧に解説してるサイトがいっぱい見つかるぞ。
76 :
74 :02/12/01 03:40 ID:???
>75 テーブルという単語にとらわれていたため うまく検索でたどり着けないでいたようです。 どうもありがとうありがとう。
77 :
Name_Not_Found :02/12/01 05:50 ID:MZJEuwVB
ユーザースタイルシートを使って、 リンクは必ず別窓で開くようにさせたいのですが、 どのように記述すればできますか?
cssっていつできたん?
>>77 ウィンドゥの操作はスタイルと関係ないぞ
>>78 W3Cのサイトに版歴が載ってたとおもう
>>77 ただ、別窓はウザがられると知っておいた方がよい。
81 :
77 :02/12/01 13:09 ID:???
回答どうもです。
>>79 出来ないのか。
調べても判らない筈だよ。
>>80 いえ、ですからIEのユーザー補助で設定するスタイルの方で、
やりたかったのですが。
やぱりシフトキーを押しながら、廻るしかないのか。
上記利用形態を想定してたので
製作するサイトの方では、別窓は基本的に使いません。
>>81 なるほどそういう使い方か。
ブラウザでそういう設定できるやつとかないかな?
洩れはそういうのん見たこと無いのでなんとも言えんがありそうじゃない?
スレ違いになるからこれ以上は書かないけど。
>>82 漏れDonutP使ってるが、ナビゲートロックすると全部新しい窓(つーかタブ)で
開く。
ブラウザを変えてみるのもいいかもよ
>>81
Donutならマウスのホイールクリックで新規で開くようにするって手もある。
たしかに、タブブラウザになってから別窓もそんなにうざくはなくなったな… 間違って記事中の別サイトのリンククリックしたら 別タブで開いて「気が効いてるじゃん」とか思っちゃったよ。 でもまあ、選択権はユーザサイドに欲しいよね…
見ながら作業するようなヘルプ系のページは 別窓じゃないと逆に不便だしね。 ってスレ違いだな。これ以上はユーザビリティスレで。
そう言えばここはCSS質問スレだった(w
「shift+クリック」という操作法は知らなくても、 「右クリック→新しいウィンドウを開く」なら誰でも知っているだろう。 ユーザビリティスレに行くまでもなく別窓が開くのは糞。
90 :
Name_Not_Found :02/12/01 20:45 ID:p6q93bjb
>>89 右クリック禁止にしている糞サイトもある罠
>>92 禁止してても関係ないよ。
左ボタン押しっぱで右クリックすれば。
って言うかそんな糞サイトに行くなよ
>>93 そんなの通用しないし
そもそも問題は禁止する馬鹿の方
えー質問ありませんか〜質問〜
は〜い、質問質mドガッバキッ!!ぅわぁっ!!な、何するんだ!?わっや、やめろっ!やめてくれっ!し、死ぬっっっ!!死ぬ〜〜〜!!!ぎやゃぁぁぁぁっぁぁぁぁぁぁぁぁぁぁ!!!!
HTML4.01strictでサイトを作ってます。(まだ鯖上げはしてません これからCSSでレイアウトを整えていこうと思ってるのですが、 閲覧者側から見て、「こういうCSSの使い方は嫌だ」という ものがあれば是非ご教示ください。 #ちなみに、僕のサイトはテキスト主体で、画像はほとんどありません。
101 :
Merry_Go_Round :02/12/02 01:25 ID:h3sV8UiN
普通のサイトでいやだ!って思う点といっしょかと。 色使いとかね。 とりあえず文字ポイント固定はやめといたほうが無難でしょうね。 ユーザビリティの観点もあるけど、それ以上に叩かれる。 あと、div 使いまくりもちょっとかっこわるいかも。 凝ったことしようとすると使わざるをえないけど そこまでするなら黒い帽子をかぶりなおして table レイアウトってのも ありかもなーって思う。 まあ、普通のユーザはソース見ないだろうから どうでもいいっていえばどうでもいいことだけど。
>>101 (#´゚д゚`) <人の名前勝手にパクってんじゃねぇぞコラ
>>100 十時カーソルだけはやめて欲しい。
行間は広く取って欲しい。
ここからこのスレの名無しデフォはMerry_Go_Roundになりました
CSSのみでレイアウトをするサイトってどんな印象を受けますか? ユーザーの事を考慮していない厨房でしょうか?それともなんとも思わないのか。 正直自分が入れているUAに関しては全て正常に閲覧できるのを確認したのですが、 やはりちょっと、不安ではあるのです。 どうなんでしょうか。
>>108 最近珍しくなくなってきたからなんとも思わないかなあと。
css で書いてあることをやたら誇示してるサイトはどうかと思うが。
古代の "Netscape Only" と同じ匂いを感じる。
>>108 CSS切ってもまともに閲覧できればOK。
>>108 >ユーザーの事を考慮していない厨房でしょうか?それともなんとも思わないのか。
アフォか。逆だろ。
「正常に閲覧できる」ってのは「どの環境でも同じように表示される」ではなく、
「どの環境でも内容を読むことができる」ってこと。
そのための「論理構造と見栄えの分離」がHTMLとCSSのそれぞれの仕事。
113 :
112 :02/12/02 02:18 ID:???
CSS切るとまともに閲覧できなくなるサイトなんてあるのか?
115 :
Merry_Go_Round :02/12/02 02:23 ID:h3sV8UiN
いや、CSS で書いてますって鼻息あらいところって 意味無く代替スタイルシート多かったりして スタイルがコンテンツだったりするじゃない。 そういうのって結局そういうことなんだと思う。
>>114 見栄えのためのCSS配置、なら切ってもいけるだろうけど、
見栄えCSSのためのソース、だったらコンテンツの位置がめちゃめちゃだったりする。
>>114 デフォの状態をまともに閲覧出来てないって思う人もいるだろうね。
118 :
Name_Not_Found :02/12/02 02:28 ID:jDH/92ft
左側にリンクの柱つくってめいっぱい並べてるところとか CSS非適用時にめいっぱいスクロールしなきゃ ページのコンテンツにたどり着けなくなる。 あれは勘弁。
>>118 あれはテーブルでやって欲しいね… summary="for layout" の免罪符付きで。
もしくは、右の柱を上にやるとかさ。
テキストブラウザでも せめて display: none ぐらいはサポートして欲しいって思ってる奴は 結構いるに違いないと見た。
リンクのページ作れよ。
>>121 文章中のナビゲーションリンクじゃないの?
position: absolute; top: 1; left: 20; ↑のtop、leftにはなにか単位を指定した方がよかろうか。
当然でござる!
さようでございますか!
Webサイト制作初心者用スレで聞くか、こちらで聞くか 迷ったのですが、line-heightは何%で指定されているのが一番読みやすいですか?
>>126 見易さ、ならここでもあっちでもなくユーザビリティ関係じゃないの?
>>127 申し訳ない。ユーザビリティスレへ逝ってきます。
さようでございますか!!
positionにpadding指定するとネスケの表示がおかしくなります。 大きく幅取りすぎ。氏ねよネスケ。
position: fixed するとIEは指定を無効にしてくれちゃいます。 せめて absolute と同じ動作くらいしろよ。くたばれIE。
130 131 で、その結果、何使えばいいんですか? ソース見て脳内イメージ?
テーブルを使えばいい。
おいおい今日のこのスレやたら気持ち悪いな
>>134 なら去れよ。肥溜めの近くに自分から歩み寄って「クッサーーーー!」って
言ってるのと同じだぞ。それがどんなに不毛な事か。
テーブル歯糞
CSS目糞
鼻糞募集中
JavaScript鼻糞
目糞鼻くそのカテゴライズ
142 :
77 :02/12/02 05:58 ID:???
遅いレスになりましたが、 皆様回答ありがとう御座います。 デフォルトを「別窓で開く」にできる ブラウザを捜してみます。
冬休みはまだだよな こんなん序の口?
144 :
Name_Not_Found :02/12/02 09:37 ID:w67Xiv53
145 :
130 :02/12/02 14:08 ID:???
>>144 リンク先見たが、意味わかんなかった。
要するに糞なのはネスケじゃなくてIEって事すか?
というかMacIE5用に内容領域の幅指定しても確認できないし、
不安なんですけど。
>>145 ちょっと話はそれるが、
IEは「解釈がアバウト」というサイト制作者に甘い側面と、
ボックスモデルについての問題があって、
ユーザビリティとかアクセシビリティを語る上で、
「IEでの見栄え」は無視できないものではあるが、
必ずしもIEの判断が正しいと妄信してはいけない、というのは肝に銘じなければならない。
ちなみに、横幅の問題は、結果論になるが、
大きく幅を示すブラウザで調整するとよいと思われる。
IE:ぴったり
NN:はみ出る
よりも、
NN:ぴったり
IE:小さい
の方がいい。
147 :
130 :02/12/02 14:27 ID:???
とりあえず、IEを基準にするよりもネスケを基準にした方が、 各ブラウザで正常に表示される可能性は高いという事すか?
>>147 これは、漏れが収集した情報での結論だから間違ってるかも知れんが、
多分一番厳しいのがNNだと思うので、取り敢えずNNでいければ合格、くらいに構えててもいいと思う。
特に、テキストボックスとか混じったページでのCSSは、送信ボタン消えたりとかマトモに機能しない可能性まで孕んでるからね。
#おかしかったらフォローきぼん
幅が広がりまくって重なって見えないよりも 少し小さな幅でも読めたほうがいいってことじゃなかろうか
ブラウザ語るときはバージョンも書かないと。
>>150 スマソ。当たり前のような気分で記述し忘れてた。
>>147 NNの4.xで見れればOK、って感じで。
152 :
130 :02/12/02 15:09 ID:???
NNの4.xなんて入れてませんです、はい。
153 :
Name_Not_Found :02/12/02 16:49 ID:6aHUr9Pc
入れれば。
いや。
NN4.xは文法が厳しいのじゃなくて実装が糞なだけ。
web制作&管理者以外はむしろアンインストールすべき。
今の世の中「NNの4.xで見れればOK」って感じ。
webを運営しているが、アンインストールしました。
またNN4の話題か… もういい加減にしてくれ。
>>160 脳内からNN4の話題をアンインストールするんだ!
41℃がいい加減
ふと思ったんだけど、CSSを正しく使っているサイトって文字サイズ最大で見るのが 一番格好良くないかい?普段は中だけど。
164 :
Name_Not_Found :02/12/02 20:02 ID:yerWwdXx
質問です。 NN6/7とMozillaはGeckoエンジンを搭載しているということは、 CSSの解釈もほぼ同じものだと考えても良いのでしょうか? それとも全く別物と考えた方が安全でしょうか? 自分で確認したところ差異は感じなかったものの少し不安です。
>>164 バージョンが違うから多少の差異はあるがほぼ同じと考えて良い。
166 :
164 :02/12/02 20:30 ID:???
>>165 早いレスありがとうございました。
お陰で安心しました。
Mozilla で確認してると before after とか隣接セレクタとか使いたくなってきて 結局 IE で見ると微妙に変になる罠。
170 :
Name_Not_Found :02/12/03 13:42 ID:qR/4wMcu
#Winを使っていて、確認できないので質問させて下さい。
Macはmarginの一括指定にバグがあるから、top,right,left,bottomで
指定するようにと言うのを何処かで見かけたような気がするのですが、
知ってる方はいらっしゃいますか?そしてそれは本当の事でしょうか?
>>2 や
>>4 を見てもそのような事は載っていないので勘違いかも知れない
のですが、本当だったらきちんと対応したいので教えて下さい。
>>170 漏れマクユーザだけど、多分デマではない。
たしか一部の要素(tableとか)に一括指定でauto使うと
IEでセンタリングができなかったように思う。
それ以外普通に数字とかを入れる分には一括指定で全然かまわんよ。
自信ないんで調べてみて。
173 :
170 :02/12/03 15:25 ID:???
>>4 にあるサイトで確認しました。
>>172 さんの仰る通り、全ての要素で
バグがあるって訳では無いんですね。該当する要素でautoを使う場合は
一括指定しないように気を付けます。どうもありがとう御座いました。
174 :
Name_Not_Found :02/12/03 20:17 ID:t5vHvBON
border の一括指定で何か不都合があるってきいた事があるなあ。 NNじゃなくてMozillaやOperaの話だったかもしれないけど。
NNでもIEでもなんでもいいからマジで一つ残して全部消えてくれよ。
NNは嫌だな、NSならOK。
Netscape6以降に入ってるブラウザってNavigatorだよね? じゃぁNNでいいんじゃん? NSって何?
NCSA Mosaic?
日本でNSつっても通じねえよ このスレでさえこれだもん
No Smoking, Name Server, Named Storms (hurricanes), Nanosecond, Narrow Sample National Seashore (National Park Service), National Security, National Service National Standard, National Stanine (educational testing), Naval Sheltered (environment) Naval Station, Navy SEALS, Near Side, Neck Strap, Nederlandse Spoorwegen (Dutch Railways) Nervous System, Netscape, Network Selector, Network Series, Network Services Network Supervisor, New Spring (Wheel of Time short novel), Newsstand Nice Shot, Nice Shot (Quake), Night Stand (TV Show), Nimbostratus (cloud formation) No Show, No Soliciting, No Stuff (polite form), Node Switches, Non Stop, Non-Smoker Nonstandard, Non-Status, Norfolk Southern (railroad), Normal Saline, North South North Star (District in the Heart of America Council, Boy Scouts of America) Northsouth, Not Specified, Nova Scotia, Novi Sad (Vojvodina Province, Yugoslavia) Nuclear Ship, Number of Stations, Number of Suspensions, Nut Shot, Suriname
182 :
Name_Not_Found :02/12/04 02:26 ID:xmGbCp5R
そんなこんなで lynx が生き残ってしまった。 わびしいのう。 せめて w3m。
ネイチャー三田だろ
では次の話題をどうぞ
line-height以外で「単位無し」で値を設定した方が良いものってありますか?
187 :
Name_Not_Found :02/12/04 15:12 ID:0TfR5U22
今 中身のテキスト全部に700pxの幅の指定をしたいのですが、 widthではbodyタグでもpタグでも使えません。 すべての文章にh要素をつけるのも嫌ですし、マージンでは外側からの指定で 内容の幅が可変になります。 ネットで調べても、本で見ても探し出せません。 なにかヒントがあれば、教えていただけると助かります。 このような質問で失礼ですが、>186さんも質問されているので上げさせていただきます。
>widthではbodyタグでもpタグでも使えません。 ?BODYにWIDTHはそりゃ無理だがPになんで使えないんだ?
189 :
187 :02/12/04 15:35 ID:???
>198 pタグでは使えるのですね。 もしかしたら、自分はどこか間違いをしているのかもしれません。 それだけで十分助かります。 どうもありがとうございました。
>>187 そもそも、テキストの幅を固定すると、閲覧者の環境によっては見づらく
なるので、あまりおすすめできません。
それでも、どうしてもやりたいということであれば、幅を固定したい要素
に、cssでwidthを指定してやることによって固定できます。
とりあえず、
>>4 に挙げられている参考サイトをじっくり読んで、一から
勉強してみることをおすすめします。
>>187 >すべての文章にh要素をつけるのも嫌ですし
h要素って見出しのhn要素か?
何か勘違いしてるっぽい
>>187 なんで700pxの固定をしたいの?
640x480のディスプレイを使ってたら横スクロールバー出るし、
逆に1600x1200のディスプレイを使ってる人だと小さすぎる。
したいなら勝手にすればいいけど、見る側からすれば迷惑、だと思う。
なんて言うか、スレ違いだよな
文字に色々な色をつけたいんですけど em.red{ color: #f99; } em.yellow{ color: #ff3; } とかでいいんでしたっけ? どこかで.redとかはカッコ悪いよとかいうレスを見たのですが
197 :
194 :02/12/04 20:43 ID:???
CSSはページのデザインを担う役割をするという点で em.red em.yellow等は正しいと自己判断しました。 ありがとうございました
( ゚д゚)ポカーン
200 :
186 :02/12/04 21:10 ID:???
どなたかおながいします
>>186 >line-height以外で「単位無し」で値を設定した方が良いものってありますか?
たぶん、無い。
202 :
186 :02/12/04 21:54 ID:???
ありがとうございます
background-color background-image background-repeat これらを一括で指定する方法はありませんか?
はいネタ〜
background:url(〜) #000; で背景に画像を適用できますが、 文字に forwardground:url(〜) #fff; みたいに 画像を 使えませんか。 color:url(hoge) #fff;とかできたら便利なんだけどなぁ
207 :
203 :02/12/04 22:48 ID:???
はっはっは!やっぱネタってばれたか! やっぱネタってばれたか!そうだよネタだよ! へい!寿司食いねぇーーー!!(笑
メル欄で既にばれてる罠。
つか、(略)だよ、なぁ。
文字を単色ではなくて模様みたいので塗り潰ししたいのではないかな?
すればイイジャン?
Σ(゚д゚lll)できるんでつか!?
214 :
Name_Not_Found :02/12/04 23:20 ID:iwVhm74g
h1{ font-size: 25px; } #main{ position: absolute; top: 100px; } <h1>page title</h1> <div id="main"> <p>今日も良い天気だった</p> </div> としてるんですが ブラウザーの幅を極端に狭めた時に h1の文字が#mainの中に入り込んでしまいます これを回避するにはどうすればいいでしょうか?
ハァ?背景を画像にしたいんだろ?しろよ。
いえ、文字の中を画像にしたいんでつ。
だから意味がわからねぇよ
218 :
214 :02/12/04 23:33 ID:iwVhm74g
>>206 さん
「便利なんだけどなぁ」
じゃないっすよ。ここは理想を語るスレじゃありません。
とっとと消え失せて下さい。
僕の質問にご回答よろしくお願いします!
(´-`).。oO(もうネタしかないのか
>>217 (゚Д゚)ハァ?意味が分からんのはおまいがDQNだからだろ?
市ねよ。
222 :
214 :02/12/04 23:38 ID:iwVhm74g
ぼ く の し つ も ん に こ た え て く だ さ い ! !
だーかーらー。グラデーションの画像用意しといて、 それを文字に適用すると、文字がグラデーションになるの? 分かるっしょ?
224 :
214 :02/12/04 23:44 ID:iwVhm74g
>>223 おいキチガイしつけーぞ
ならねーよ
質問する前に自分でやってみろや
クソが
てめえのせいで俺の質問シカトされっぱなしじゃねえか
マジでお前のこと知り合いだったら
どつき回してる
こんなキチガイほっといて
僕の質問にご回答よろしくお願いします!!
>>214 回避する方法はね、id="main"の記述を削除するんだよ。
>>224 (゚Д゚)ハァ?(゚Д゚)ハァ?(゚Д゚)ハァ?
おまいこそ自分でやってみりゃいーだろーが。
この脳みそうんこDQNが!
クリスマスツリーで首津って市ね。
227 :
214 :02/12/04 23:53 ID:iwVhm74g
>>225 やっぱりそれしかないんですね
残念です
>>226 今まさに作成しながら言ってんだよ
あんまり生意気言ってっと
文字じゃなくてお前の体全身油性マジックでグラデにするぞ!!
>>214 ん?つまる話は<h1>内の文章を改行させたくないって事じゃないのか?
だったらwhite-space:nowrapな。
違うんなら知らんが。
あとな、id="main"はDIVじゃなくてPに入れろ
>>214 回避する方法はね、おまいの存在を削除するんだよ(ワラ
結論 215は、214の回答者じゃないのに、こんがらがっている。
>>230 まだションベンが出そうにないので寝ません。
233 :
214 :02/12/05 00:10 ID:???
>>228 僕がしたかったのはまさにこれです!
>>214 の説明ではたしかにdivよりpの方が正しいですね!
勉強になりました!ありがとう!
芳ばしいスレになったもんだな。
ぽっくんのしつもんにもこたえてほしいのー^ ^..
おい、おまえらおもしろすぎですよ。
line-heightには何故単位を指定しない方がいいのですか?
>>237 ぽっくんのしつもんのこたえがでるまではだまっててほしいのー^ ^..
ぽっくんの質問はどれだよ
>>239 もじにがぞうをていようしたいのー^ ^..
>>237 h1{
font-size: 25px;
line-height : 2;
}
この場合は行間が自動的に50pxになる訳よ。
下手に単位つけると行間が小さすぎて文字と文字が重なる訳よ。
けっ、分かんねーんなら分かんねーって言えよ。 バカに限ってプライドだけは高くて困るの〜^ ^..
(´-`).。oO(釣り師気取りが一人。満足なんだろうな。
カワイイものだな。
>>245 括弧閉じてないの〜
冷静装ってもあせり過ぎなのバレバレなの〜^ ^..
>>248 釣れたって言えばごまかせると思ってるの〜。
典型的な厨なの〜^ ^..
あせってる人は、相手があせってる、と思いたいものなんだね。
253 :
Name_Not_Found :02/12/05 01:51 ID:wbvTP+0h
アダルトサイトをhtml4.01strictで作っています。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "
http://www.w3.org/TR/html4/strict.dtd ">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=Shift_JIS">
<link rel="stylesheet" href="2ch.css" type="text/css" media="all">
<title>エッチサイト</title>
</head>
<body>
<h1 id="welcome">○○へようこそ!</h1>
<p>このサイトはアダルトコンテンツを含んでいます。</p>
<p>あなたは18歳以上ですか?</p>
<ul id="navi">
<li><a href="index2.html">[はい]</a></li>
<li><a href="
http://pc3.2ch.net/test/read.cgi/hp/1038911361/l50 ">[いいえ]</a></li>
</ul>
<p id="validator">
<a href="
http://validator.w3.org/check/referer "><img src="image/valid-html401.png" width="88" height="31" alt="Valid HTML 4.01!"></a>
<a href="
http://jigsaw.w3.org/css-validator/ "><img src="image/vcss.png" width="88" height="31" alt="Valid CSS!"></a>
</p>
</body>
</html>
このように記述して、見栄えはh1からulまでをだいたいまんなからへん、
validatorのアイコンだけはページの一番下に表示したいのです。
いろんな表示面積のブラウザでもかっこよく見えるように、どのようにスタイル指定すればよいでしょうか?
254 :
253 :02/12/05 01:53 ID:???
あ、validatorのアイコンはページの一番下右隅でお願いします。
>>253 ぽじしょんあぶそりゅーと で うはうは
ていうか、てーぶる つかってろ ぼけ
256 :
253 :02/12/05 02:25 ID:???
希望としてはこんな感じの見栄えです。
<body>
<table border="0" cols="1" width="100%" height="100%">
<tr><td><center><h1> エッチサイトへようこそ!</h1></center></td></tr>
<tr><td><center><p>このサイトはアダルトコンテンツを含んでいます</p></center></td></tr>
<tr><td><center><p>あなたは18歳以上ですか?</p></center></td></tr>
<tr><td><center><p>[はい] [いいえ]</p></center></td></tr>
<tr><td><div align="right"><a href="
http://validator.w3.org/check/referer "><img src="
http://www.w3.org/Icons/valid-html401 " width="88" height="31" alt="Valid HTML 4.01!"></a>
<a href="
http://jigsaw.w3.org/css-validator/ "><img src="
http://jigsaw.w3.org/css-validator/images/vcss " width="88" height="31" alt="Valid CSS!"></a></div></td></tr>
</table>
</body>
このように<table height="100%">とするとブラウザのウィンドウがいくら小さくなってもぜんぶウィンドウ内に入りますし、大きいウィンドウにすると、うまい具合にvalidatorのアイコンが下の方に来ます。
しかしこれではstrictではないので却下となりました(笑)
CSSだけで同じような事は可能でしょうか?
>>256 strictに徹しようとするその姿勢、賞賛に値するぞ!!
_/_/_/_/_/_/_/_/_/_/_/_/
次の質問どうぞ。↓
W3Cのアイコンはダウンロードして使おうね。
>>258 なんで?使われたくない物はwebにUpしなければいいじゃん。
ばっかじゃねえの(藁
>>259 つまらんネタはやめようね。
本気で言ってるんなら、まあ、それはそれで。
このスレを警視庁にメールしますた
なんでやねん
今日辺り厨房メールスレで
>>263 のメール内容が晒されることでしょう。
初めまして。 既出かもしれないですけど… <span class="upperRoman" title="3">III</span> とした時に、 読み上げソフトでtitle内の文字を読み上げさせるには どうすれば良いんでしょう? span.upperRoman { speak : none } だけだと読み飛ばすだけだと思いますし…
267 :
206 :02/12/05 21:05 ID:???
やっぱ無理なのか。過去ログ見たところでは。 M$ wordなんかにある、文字にテクスチャを適用するようなことがしたかったけど、 素直に文字自体を画像にするしかないのね。 代替stylesheetに萌えてたのに藁
スタイルシートを何だと思ってるんだか
269 :
Name_Not_Found :02/12/05 21:59 ID:QUCh/XwM
>>266 <head>
<style type="text/css" media="aural">
.upperRoman { display: none; speak: none; }
p[title]:before { content: attr(title); }
</style>
</head>
<body>
<p title="3.">
<span class="upperRoman">III</span> hogehoge
</p>
</body>
>>206 フィルターを使えばできるよ。IE専用になるけど
>>266 span.upperRoman{speak:none;}
@media aural{/*音声による出力*/
.upperRoman:after {
speak:normal;
content:attr(title)}
}
でないかと。
自信無いので詳しい人おながいします。
272 :
266 :02/12/05 22:56 ID:???
>>269 >>271 有難うございます。
>>269 のやり方だと、display:none しちゃってるので
見えなくなっているのではないかと…
それで、p要素の前に「title」を出力してるわけですよね?
そうすると、「III」が表示できなくなるのでは…
と言う事で、
>>271 を採用させていただきます。
有難うございました。
>>272 実際にそこまでのレベルで音声スタイルシートに対応したUAって現存してるのかな?
274 :
272 :02/12/06 00:09 ID:???
>>273 いや、知らないですけど…
機種依存文字でローマ数字を書くよりも良いかな?と思ったので。
し!し!し!知らねーのかよー!
>>268 なんだとおもってるんだかっていわれても、
装飾担当なんだからそれぐらい融通効いてもいいと思うんだけどね。
背景が出来て前景が出来ない必然性がないじゃない。
W3C信者のレス読んでると頭が痛くなってくる。 あの人達恐いよ。
>>276 まあもっともな理屈なんだけど、事実としてCSS2までの段階で仕様にそういうフィーチャーが取り入れられていないのだから仕方がないね。
スタイルシート自体、よく分からないんだけど 適当にタグの中に埋め込んで使ったりしてるけど、ヤバイ? 例えば <FONT SIZE=2 STYLE="font-size=12px;line-height:10mm;">××××</FONT> こんな感じで。 今の所、IEでもNNでもエラーにはならないんだけど もしかして危険な事してる?
あ。間違い <FONT SIZE=2 STYLE="font-size:12px;line-height:10mm;">××××</FONT> ね。
pxとmm、単位をどっちかに統一したほうがいいのでは。
>>280 それ、CSSのメリットを殺す使い方だよ。
ブロックレベルで中央寄せにしようと margin-right : auto;margin-left : auto; にしたら、winIE6では動かないことがわかりました。しくしく。
お前はDOCTYPEスイッチも知らないのかと小(
>>280-281 style属性を使うより、HTMLとは別にCSSのファイルを作ってlink要素で呼び
出してやった方が、複数の文書に統一した見栄えを持たせたり、見栄えを
変更するときにいちいちすべての文書のソースをいじらなくても、CSSの
ファイルだけ変更してやればよかったり、といった利点がある。
詳しいことは、
>>4 で勉強してください。
>>280 サイト作ろうって思って、まだ、タグはじめて2週間くらいしかたっていない若輩者で
やっと最近CSSファイルを弄りはじめた、こんな私が言うのもなんなんですが、HTML
を記述のみに徹して、装飾の一切を外部CSSファイルにまかせちゃうってやり方は、
非常に楽だよ。
自分も最初、CSSってなんだか難しいなあ、と思ったけど、如何にこの方法が合理的な
のか日々、着実に思い知ってるって感じだな。280さんの方法だと、更新の度ごとに、
削除して、また、新たに膨大になっていくだけだよ。
切り替えるってのは大変な事かもいれないけど、検討してみて!
生意気言ってすみません。
ぜひそうしてみて!
いれない→知れない
id,class名にスペースを開けたい場合は どう記述すればいいんですか? _ですか?-ですか?
display : none ってどういう場合に便利なんですか?
>>295 表示させたくないとき
うちは、hr{display:none}にしている。cssが効かないブラウザとかoffの時だけ表示されように
ほかにもいろいろ使い道があると思う
>>296 なるほど。<hr>に指定しておいて、cssが利かないUAで表示した時だけ
線をひくとかできるわけですね!
NN4.xでチェックしたいんですが、どこかにありませんか?
FAQだな。
<h1>うちのおみせ</h1> <h2>価格表</h2> <h3>パソコン</h3> <table> パソコンの価格の表 </table> <h3>ゲームソフト</h3> <table> ゲームソフトの価格の表 </table> っていうか価格表なんて見りゃわかるし邪魔。 でもh3以下をまとめる見出しが無いと困る。 ↓ h2{display:none;} ↓ ウマー(゚д゚)
>>299 有難う御座います。
でも、見れないんですが・・・
>>302 なんだ見れないって。
今行ったが普通に見れるぞ。
>>299 Ver'6.0はやっぱ忘れたい過去なんだな(w
6ってなんかあったの?
>>303 ページを表示できません、ってなるんです
>>298 俺は自分でソフトウェア板のネスケスレを検索してダウンロードしたけどなー。
聞く前に自分でなんとか調べてみるとかしないの?
>>307 普通に見られるぞ
>>308 調べて、見付けられなかったんですけどね。
やはり、何度リロードしてもサーバーが見付かりません、になりますね。
俺も見れない・・・なんでやろ?
串とかかね。
ああー!恥ずかしい。 神埼氏のサイトスタイルシートの基本をなる項目を読んでみたら 自分が基本すらも理解してないdiv厨、class厨だった事が判明。 ハズ過ぎる。
313 :
312 :02/12/07 10:13 ID:???
余程錯乱していたのだろうか、文章がメチャメチャだ…(鬱
314 :
295 :02/12/07 10:13 ID:J4AtL8Ba
>>296 ありがとうございます。
たとえば
<P>CSSをサポートしているブラウザをお使いください</P>
という文にdisplay : none を指定すれば、CSSが適用されてない
閲覧者にだけこの注意文が表示されるというわけですね?
>>295 うん、そーゆーことも出来る。
あと、ジャバスクリプトと組み合わせて使うこともある。
クリックしたら表示することにすれば、折りたたみメニューになるっしょ。
あのメニューってそういう原理だったのか。
317 :
Name_Not_Found :02/12/07 10:41 ID:R0vCiwFY
>>314 ユーザースタイルシートで、
p { display: block !important; }
とか指定されているとお間抜けなことになるので不許可。
むしろJavaScriptで使うものかと思っていた。
こういう使い方(
>>314 )もアリか。見たことないけど(笑
319 :
Name_Not_Found :02/12/07 11:47 ID:CxLg7fnG
ちなみに(IE以外で使えるかは知らないが)position:absolute と、 display:none (or block or inline) を組み合わせて、Scriptでblock要素を 操作すると、いわゆる「コンテクストメニュー」のような物も作れるよ。
>>318 hr要素辺りではお約束的使い方のような。
321 :
Name_Not_Found :02/12/07 14:36 ID:fu0p6OwI
width: 300px; としたら根スケ6で300pxにしてくれません。IEは300pxです。どうすればネスケ6でも300pxにできま すか? スクリーンショット撮ってPhotoshopで確かめたので絶対に見間違いではありません。 というかネスケはピクセルの計算くらいちゃんとできないのでしょうか?
ネスケは7からマトモに表示されるよ…
324 :
Name_Not_Found :02/12/07 14:46 ID:RzcxYet9
>>321 ネスケやIEに限らずにあらゆるブラウザで同じように表示させたければ、
marginとpaddingとborder-widthは0pxに。
そうはいかんざき
そもそもwebで(新聞や雑誌など紙の媒体と同じような)見栄えの統一を(以下略)
327 :
Name_Not_Found :02/12/08 09:49 ID:BX6lKNTG
CSSでインライン要素の横幅を指定できますか?
>>328 ども、そうですか。できると便利なんだけどなぁ。
>>326 web で、ってのは変ないいかただ。
HTML + CSS で、にしてくれ。
web 経由の PDF とかあるし。
SVG だって Flash だってあるし。
331 :
Name_Not_Found :02/12/08 13:37 ID:yCarHnLP
余裕で効きますね。
ブラウザの標準モードの方で、 ウィンドウ(正確にはフレーム内だけど)の右下に要素を表示する方法はありませんか? そのページの内容自体はウィンドウの高さよりも短いので、 position:absoluteでやると、ページ内容の一番下にくるだけで、 ウィンドウの下付近には来てくれません。 後方互換だと意図した表示になるのだが。 やっぱし標準では無理だということなのでしょうか? あと、background-positionって、原点が左上みたいだけど、 右端から10pxとかできますか?
position:absolute; right:0; bottom:0; background-position:right bottom;
右端から10pxなら画像の右に10pixel透過部分入れて、 background-position:right bottom; かな?
>>333 position:fixed;みたいな効果を狙ってるのかな?
position:absolute;とJavaScriptの.pageYOffset(IEなら.scrollTop)とを
組合せてやれば、たいていのブラウザで常駐は可能。
固定したいもの以外をoverflowでスクロールさせればいい。
>>337 overflowはOperaには鬼門なり。(ver7では改良されたのか?)
Opera6のoverflawは仕様通りの振る舞いなの?それともただのバグ?
>>338 改善済み。Opera7のCSS実装はmozilla以上だと思う。
font-sizeの継承問題とかは残ってるけど。
>>339 「overflow未対応」は最初から公式情報として出ているから
仕様と言えば仕様。バグと言えばバグ。
341 :
Name_Not_Found :02/12/08 18:31 ID:a0dmcEIu
例えば一つ共通のメニューのようなものを作っておいて、各ページで そのメニューをインクルードするようなことをCSSでやることは可能 でしょうか。 それともSSI使ったほうがいいのでしょうか。
>>341 CSSでは無理.もともとそーいうものじゃないし.
やるならJavascriptじゃない?
>>341 CSS でデザインされたメニューだけ書いた html を iframe で各ページに配置
・・・何か違う(w
>>344 それならメニュー等の共通する項目だけ書いたHTMLの中に
他のページをiframeで表示した方がいい。
つーかスレ違い。
なんだこいつ
「できない」で片付けろよ
348 :
Name_Not_Found :02/12/08 22:37 ID:8LDHk0Uj
見た目的にどれだけ大きくしても縦1cm 横は元画像の大きさにしかなりません。 元々は縦5cm横7cm位の画像です。 背景をリピート無しで固定したいのですが background-image: url(jpeg); background-attachment: fixed; background-repeat: no-repeat; background-position: left top; こんな感じでどこが問題でしょうか?
なんだこいつ
漏れに聞くなよ
ABCD EFGH IJKL という画像を背景にしようとすると ABCD になっちゃうよ〜ゴルァ ってことですか? だとするとわからん。 とりあえず質問を整理しる
352 :
341 :02/12/09 00:54 ID:pwACi7eg
大変参考になりました。 親切なご返答、本当に有難うございました。
そもそも画像の大きさをcmで表すこと自体が間違ってる
divとspanの使い方を教えろよ。
blockかinlineか
356 :
Name_Not_Found :02/12/09 03:22 ID:Ry6leofi
インラインstyle属性によるスタイルの設定とはどういう事を指すのですか?
>>356 検索してすぐわかるようなことを聞くなよ。
「調べたけどわかりませんでした」は却下。
358 :
Name_Not_Found :02/12/09 03:47 ID:Ry6leofi
>>357 答える気が無いなら黙ってろよ。
大した知識もない分際で初心者の質問を突っぱねて
自己の欲求を満たしているだけの低俗なカスが。
おまえみたいな低俗な奴とは会話を交わしたくないので、
これ以降のレスを一切禁ずる、消えろ。
望む答えが得られなかったら「知らないんだろ」というのは何か暗黙のルールでもあるんですか?
> 大した知識もない分際で初心者の質問を突っぱねて そういうお前こそ大した知識もない初心者の分際で横柄な態度をとっているわけだが。
と言うかそんな簡単に釣られるのはいい加減よせ
>>356 タグの中に直接スタイル属性ブチ込むことじゃないの?
よく判らんけどそれっぽい
>>356 要素のタグに style属性としてスタイル情報を埋め込むこと
<P style="color: blue">
こんなかんじ。
185問題再燃の股間
368 :
Name_Not_Found :02/12/09 04:01 ID:Ry6leofi
>>362-363 分かり易く解説していただきありがとうございます。理解できました。
つい感情的になってしまいまして、失礼な発言を行なってしまいました。
>>357 氏、また私の発言を読んで不愉快な気持ちになられた方々にお詫び致します。
申し訳ありませんでした。
>>366 サンクスコ&なつかすい。
いや、Ry6leofiを真似てみただけだったんだけど。
なんか嬉しかったよ。
>>367 全然関係ないけど
>セレクタなどの名前にアンダースコア( _ )が使えないという制約は、修正されることになるようです(2001-07-30付の仕様書4.1.3に関する修正)。
〔以上補足〕
これは現在はどうなの?
俺アンダースコア使っちまってる。
>>368 「検索しろ」であそこまで熱くなる奴は、2ちゃんに向いてねえよ。もう来るなよ。
おまえも熱くなり過ぎ。
>>373 笑ってる場合じゃないっしょこれは
どうなの?マジで
375 :
Name_Not_Found :02/12/09 04:21 ID:REou2e/U
>>370 というか、アンダースコアが二つ以上あると、
リンクのフラグにもならん UA があるので、
俺もその辺の制約がないハイフン使ってるぜ(藁
378 :
Name_Not_Found :02/12/09 04:47 ID:NmoPa90k
ネットサーフしててあるところの掲示板で見かけたのですが
掲示板の書き込みである用語が出てくると
強調されたり
”>”のような引用を使うとその一文に背景色がつけられて
目立つ
ようなのをスタイルシートで見かけたのですが
このような場合外部スタイルシートに何と記述すればいいのでしょうか?
また一応
>>4 を中心に調べてみたのですが上記について詳しくやり方紹介している
サイトはないでしょうか?
>>378 「行頭に>の有る段落は引用と見なし<blockquote>でマークアップさせ、>を削除する」
という動作をCGIにやらせ、スタイルは<blockquote>に指定。 以上。
強調は
$_="(投稿記事)";
$a="ある用語";
s/($a)/<strong>$1</strong>/g;
な感じで
>>379 ">"は削除しないほうがよさげ
まぁ、その辺は
>>378 が好きにするだろ。
次の方どうぞ。
383 :
Name_Not_Found :02/12/09 11:54 ID:dzA2C1ZY
p要素をまとめて指定するために、div要素で囲ったあと div.aaa p { style: hoge } として指定しています。 このdiv.aaa自体には何かスタイルを指定しておいた方がいいのでしょうか? 不具合が出るのが怖いので、div.aaa { color: black; } などと 指定してもしなくても同じ内容を書いておいてます。 指定してない場合に、Win2kでNN4, IE6 ,Opera6.05で大丈夫だったのですが、 こちらで揃えられない環境のことを考えて質問させていただきました。 よろしくお願いします。
>このdiv.aaa自体には何かスタイルを指定しておいた方がいいのでしょうか? WinでもMacでも、指定しないと不具合が出るブラウザーは見たことがありません。 まったく問題なし。
385 :
383 :02/12/09 12:15 ID:???
>>384 ありがとうございます。すっきりしました。
CSSファイル内でfontの指定って {font-family:フォント名、フォント名;} ですよね。 指定しても変化してくれないのはなぜなんでしょうか? フォントも入っているし、htmlファイルの方でfontを指定してやると きちんと表示されるのです。そんな基本を聞く奴って逝ってよしですか? @importの扱いもさっぱり判らないし、CSSってかなり難しいですね。 理解出来ない人は、能力の無さを認めて、htmlの方に記述しちゃっていいですか?
388 :
386 :02/12/09 16:29 ID:???
ありがちなのはフォント名の指定が正確でないこと。 MS Pゴシックの場合 {font-family:"MS Pゴシック"} となります。「MS P」は全角、「MS」と「P」の間は半角スペース、そしてフォント名全体を「"」〜「"」で囲みます。 具体的にどう指定しているかを出してくれれば、もっといい回答が出るかも。 ガンバレ!
これでCSSファイル名やディレクトリが違ってるとかだったら笑える
>>389 英語で"MS PGothic"の方が良くない?
392 :
Name_Not_Found :02/12/09 16:45 ID:AFl/dsFd
CSSでボックスを中央に持ってくる時は、どうすればいいんでしょうか? align だとボックス内のテキストが中央になってしまうし、 TABLE使わずにやりたんですが、方法がわかりません。
394 :
389 :02/12/09 16:49 ID:???
あれ。今IE6で検証していて気づいたのですが body{font-family:"MS Pゴシック";} としてもページ内の文字に適用されないですよ? font-familyプロパティは継承するはずなのに。なにが間違っているのかわかりますか? h1{font-family:"MS Pゴシック";} p{font-family:"MS Pゴシック";} とか *{font-family:"MS Pゴシック";} は効きました。
395 :
386 :02/12/09 16:51 ID:???
>389さん どうもありがとう。 変らないのは何かが間違っているんでしょうね。 ごちゃごちゃしていない時に、CSS自体を一から見直してみます。
396 :
386 :02/12/09 16:56 ID:???
ファイル名は大丈夫ですよ〜。基本ですから。 他の要素は変るんですけど、なぜだかfont-familyだけ変化しないんですよ。
397 :
392 :02/12/09 16:57 ID:AFl/dsFd
>>393 過去ログがありすぎてどこに書いてあるのかわかりません。
そういわずお願いします。
398 :
392 :02/12/09 17:03 ID:AFl/dsFd
左からの絶対位置とか適当なボックスからの相対位置の指定なら わかったんですが、一発で中央指定ってできないんですかね。
>>1 も読めない>392へ
>>5 の
>Q: Netscape6(or7)では、text-alignにcenterを指定してやっても、table(や、その他のブロック要素)をセンタリングできません。IEではセンタリングされるのに……
を見ろ。
以上
401 :
392 :02/12/09 17:15 ID:AFl/dsFd
□□□□■□□□□□■□□□□□□□□□□□□□□□□□□□□□ □□□■■□□□□□■□□□□□□□■■■■■■■■■■■■□□ □□■■□□□□□■■■■■■□□□□□□□□□□□□□■■□□ □■■□□■□□□■□□□□■□□□□□□□□□□□□■■□□□ □□■□■■□□■■■□□■■□□□□□□□□□□□■■□□□□ □□□■■□□■■□■■■■□□□□□□□□□□□■■□□□□□ □□■■□□□□□□□■■□□□□□□□□□□□■■□□□□□□ □□■□□□■□□□■■■■□□□□□□□□□□■□□□□□□□ □■■■■■■□□■■□□■■□□□□□□□□□■□□□□□□□ □□□□■□□□■■□□□□■■□□□□□□□□■□□□□□□□ □□■□■□■□□□□■■□□□□□□□□□□□■□□□□□□□ □□■□■□■□□□□□■■□□□□□□□□□□■□□□□□□□ □■■□■□■□□□□□□□□□□□□□□□□□■□□□□□□□ □■□□■□□□□■■■□□□□□□□□□□□□■□□□□□□□ □□□□■□□□□□□■■■□□□□□□□□□□■□□□□□□□ □□□□■□□□□□□□□■■□□□□□□■■■■□□□□□□□
403 :
386 :02/12/10 01:11 ID:???
あれから試行錯誤の結果、CSSファイルでのfont-family指定は 諦めまして、HTMLファイルの方で、head内にfont-familyだけ 埋め込む事にしました。なんだかカッコ悪いですが。。。 みなさんどうもです。
>>403 ところで@charsetは試してみたかい?
もしかしたらこれが原因かも知れない。
405 :
386 :02/12/10 02:15 ID:???
>>404 @charsetって何ですか?
手持ちの本に出てないんだけど。。。
そのくらい検索して調べましょう。
407 :
386 :02/12/10 02:36 ID:???
head内の <meta http-equiv="Content-Type"content="text/html:charset=Shift_JIS"> ってところのcharset以下を消したらfont-familyが動き出しました!! 検索で見たのですがよく理由が判らないのですが、charsetは意味がないのですか? 間違ってますか?
408 :
386 :02/12/10 02:41 ID:???
>>all もう、一から出直してきます。 こりゃあ、タグが打てればOKって問題じゃないですね。 根底から虱潰しで見ていかんといけんですね。 なんで、この本に説明されていないんだろ? うわあ難しい。
409 :
386 :02/12/10 02:50 ID:???
あらためて、ありがとうございました。
どの本よ?
411 :
386 :02/12/10 03:08 ID:???
よくよく見たらありました、が私にはかなり理解不能なだけみたいです。 理由らしきものも書いてあるよう(どの部分なのか判らないです。)ですが 何度読んでも判らないです。 charsetは指定してはいけんがですか? 「ひとりでつくれる ホームページHTML入門 成美堂出版」 の46ページです。
412 :
386 :02/12/10 03:22 ID:???
やっぱり読んでも判らないですね。ググっても理由が判らないです。 すくなくとも本のせいではない事だけは確かなようです。 お騒がせいたしました。 バカな私の事など忘れてください。
くじけるな。がむばれ。
>>407 とりあえず text/html の後ろは コロンじゃなくてセミコロンなわけだが、そこはどう?
>>407 おーい、書き方間違ってるぞ
text/html:charset=Shift_JIS じゃなくて
text/html;charset=Shift_JIS
(コロンじゃなくてセミコロン)
これないと文字化けするときあるから書いておけ
417 :
416 :02/12/10 10:12 ID:???
5時間も前にがいしゅつだった… (´・ω・`)
418 :
Name_Not_Found :02/12/10 16:00 ID:ddgwXClr
マウスオーバーで画像を半透明にし、背景画像をみせたいのですが、 WIN(IE、NN)MAC(IE)に対応できる記述はありますでしょうか? どなたかお教えいただけると助かります。 よろしくお願い致します。
419 :
Name_Not_Found :02/12/10 16:56 ID:rrDj1ZzA
>>418 PNG のアルファー値指定で出来るといいね。
>>418 IEは独自拡張のfilterを使うわないといけないだろうから
記述を分けるしかないと思う。
filterを使うこと自体あまりオススメできないが。
424 :
Name_Not_Found :02/12/10 18:51 ID:ddgwXClr
>>420 >>423 ご親切にありがとうございます!
結果的にfilterを使わない方法にしました。
便利な機能ですが、MAC、NNに関しては不便ですね。
425 :
419 :02/12/10 19:06 ID:???
426 :
419 :02/12/10 19:08 ID:???
下の方で 421=422です。
427 :
Name_Not_Found :02/12/10 19:10 ID:7c8pMJYu
すみません、質問です。わかる方がいらしたら教えて下さい。 OSはWin98、IE6(サービスパック導入しています)で 閲覧しているのですが、突然 フィルターが私のブラウザでは表示されなくなりました。 たとえば style="border:none;filter:Alpha(opacity=60)" のように指定されているのに、透過されない、ということです。 前日までは問題なく見えていたのですが、何か原因はありますでしょうか? 他のスタイルシートは問題なく表示されています。
428 :
Name_Not_Found :02/12/10 19:15 ID:1xN4/7F0
【ニューヨーク9日=夕刊フジ特電】ヤンキース、 メッツというニューヨークの2球団が、日本人欲しさに かなり荒っぽいリストラを断行中だ、と9日、 ニューヨーク・タイムズ紙が報じた。 ゴジラこと松井秀喜外野手が欲しいヤンキースは ベテランの救援投手、マイク・スタントン(35)と ラミロ・メンドーサ(30)を相次いで解雇した。 メンドーサは平均年俸400万ドル(4億8000万円)で 3年契約を希望。スタントンも3年契約で計1050万ドル (12億6000万円)を希望したが、球団が用意した額とは はるかにかけ離れていた。 ヤンキースはさらに右翼手のラウル・モンデシー、 ロンデル・ホワイト、さらにはスターリング・ヒッチコック投手ら との契約を見直したい意向。
429 :
386 :02/12/10 22:28 ID:???
CSSファイルfont-familyの件にて。
charset=Shift_JISを消すときちんとfont-familyが動作するというのも腑に落ちないので
いろいろ試してみたところ、
その1、content="text/html"; charset=Shift_JIS>
その2、content="text/html"; charset="Shift_JIS">
その3、content=text/html; charset=Shift_JIS>
で、記述するとfont-familyが動いてくれるようでした。しかし、依然として、
content="text/html;charset=Shift_JIS">
という本来の記述では、動いてくれません。先の本にも
「記述する際やってしまいがちなのは、conten="text/html;"charset="Shift_JIS"なんていう
ミスですが、text/html;charset=Shift_JISがcontentの属性の値です。charsetという属性で
はありませんのでご注意ください。」
とあります。まさに、その2がそうした、例なのですが、なんだか本来の記述をしているのに、
作用してくれず、ミス通りにすると作用する、ので戸惑っています。
>>414 ,416さん
「;」はきちんと記述していましたが、レスする時にミスをしてしまいました。
申し訳ございません。
レスをしてくれたみなさんありがとうございます。
その2と先の本の、やってしまいがちなミスの表記で「”」の位置が違っていました。 申し訳ありません。が、その2でも、やってしまいがちなミスの例でもfont-familyは 作用しています。
HTMLでなくてCSSシートに@charset指定してるのが間違ってるんでないかい?
HTML と CSS のファイルの文字コードが違うとか。
>>429 >その1、content="text/html"; charset=Shift_JIS>
>その2、content="text/html"; charset="Shift_JIS">
>その3、content=text/html; charset=Shift_JIS>
のように半角スペースを入れて
content="text/html;charset=Shift_JIS"> ではなく
content="text/html; charset=Shift_JIS"> にはしてみたか?
半角スペースを入れないとブラウザによっては作用しないCSS記述があるので
これも それと同じで半角スペースが必要なのでは
>>429 ソースを晒してくれるとありがたいんだけど…
429さんの半角スペースでは変化しなかったのですが、ちょっと応用してみて、 content="text/html; charset=Shift_JIS" と、全角一個を間に入れたら外部CSSファイルによるfont-familyを読み込んでくれました!! それから、いろいろ試してみたのですが、他の要素は全半角を問わないようで、metaの 中でもココだけ全角が必要なようでした。 こんな理解でいいのでしょうか?
あ、検証結果なのに下げてしまいました。
適用されない=実は適用されてる 適用された=実は適用されてない という説
>>435 全角のマークアップは無効。charsetが書かれていないのと同じ。
>>439 さん
はあ、無効ですか?
それでも表示されるって事はどこかがおかしいって事ですよね。
余裕のある時に、プリントアウトして一から検証してみます。
今日は、手一杯です。まだまだ道は長そうです。
レスをくれたみなさん、どうもありがとうございました。
今日はおやすみなさいです。
また明日も来るのかよ! 勘弁しやがれ!
>>441 さん
明日も、明後日も来ないから大丈夫ですよ。
考えたら、スタイルシートの問題じゃないですよね。
すいません。
せっかくの貴重な板を汚してしまい申し訳ありませんでした。
まあ、ガンガレ
444 :
441 :02/12/11 06:07 ID:???
>>442 いや、ほんの冗談だぞ。いつでも来いよ。
このネタはもういいけどな
446 :
Name_Not_Found :02/12/11 11:25 ID:nE0Siy+P
文中にソースコードのサンプルを置くことがあります。 改行やインデントをそのままにしたいためpreを使っているのですが、 横に長いコードがあると、当然ながら横スクロールがでます。 ソースコード部分はこれで問題ないのですが、本文まで同じ幅になってしまい かなり鬱です。 ↓のような表示にしたいのです。助けてください。 |-------------|ウィンドウ幅 |あいうえおあい| |うえおあいうえ|←本文はウィンドウ幅で自動改行して欲しい | aaaaaaaaaaaaaaaaaaaaaa ←この部分ははみ出して良い | bbbbbbbbbbbbbbbbbb |あいうえおあい| |うえおあいうえ|
>>446 それはcssの仕様、というよりもpreの結果だからな、
テキストエリア作って放り込んだほうがよくない?
自動改行じゃなくて「折り返し」ね。
ソースコードは<code>
>>446 タグの閉じ忘れの可能性もあるので、もう一度確認すべし。
(終了タグのスペルミスとか)
それでもだめだったら、ソースをさらしてみて。
>>450 codeはインラインだからbody直下には書けないだろ。
まとまった分量のコードを書く場合、<pre><code>〜</code></pre>
とやるのは妥当だと思うが。
<ol> <li><code>*****</code></li> <li><code>*****</code></li> <li><code>*****</code></li> </ol>
454 :
447 :02/12/11 12:48 ID:???
>>449 スマン。読んで、その通りだと思い込んでしまってた。
>>446 試してみたら、pre掛かってないところは折り返されたよ。</PRE>って入れてる?
455 :
Name_Not_Found :02/12/11 15:13 ID:Ezr+Zt5k
はじめまして テーブル内とテーブルの外にスタイルシートを適用したいときの話です。 ↓これでいいと思うのですが・・・本当にそうなんでしょうか? 一行だけで内外の両方に指定できたりしますか? なにかまずいことありませんか? <p>.mozi { font-family: "MS Pゴシック", "Osaka"; font-size: 20px}. table { font-family: "MS Pゴシック", "Osaka"; font-size: 10pt; } </p>
>>455 もうちょい基本を勉強してからまた来てね。
455はどこで勉強したんだろう?
459 :
455 :02/12/11 16:02 ID:Ezr+Zt5k
・・・もしかしてすごくおかしいですか・・・。。? 誰か回答をかいてくれると、すごく嬉しいです。 作成ソフト(DW)つかっていてうまくいかず、 txtでやっています。。作成ソフトとtxtのやりかたが いまいちリンクしなくて大混乱中。。 簡単そうでいまいちよくわからない。。
>>459 激しくおかしい
何がおかしいのか理解できるように
お勉強してください
>>455 DW>テキスト>新規CSSスタイル作成>名前=P>クラス名だけど?>OK>フォント&サイズ指定>OK
その後ソース見れ
以上
462 :
446 :02/12/11 16:51 ID:???
>>447-454 さん、ありがとうございます。
日記用のCGIを使っていたので確認が遅くなりました。
日記本文が1日毎にテーブルになっており、
その中でpreを使っていたのが原因のようです。
CGIが出力したHTMLからtalbe関連のタグを削除したところ
望むとおり&みなさんが書かれていた通りの状態になりました。
これからCGIの改造をしますです。
ありがとうございました。助かりました。
463 :
Name_Not_Found :02/12/11 17:06 ID:HNhzrkDp
inline要素にはwidth指定できないとのことですが、 わたしは<dt>と<dd>をinlineにして、<dt>にはwidth指定していました。 IE5,6だとうまく表示してくれていたので安心していたのですが…。 compactとかいう指定がhtmlでできたような気もしますが、 あまり推奨されていない印象です。(NN独自でしたか?) スマートな解決策は何でしょうか。 <dt>をinlineにせず、flort:leftでしょうか?
遅レスですが、display:noneについて。 カウンタのPHPスクリプトを<object>を使って設置しているのですが、 .counter{display:none}にしています。
>463 さらに、ddにmargin-leftをたっぷりとってあげればOK…だと思うけど嘘かも
>>455 まず、なんでスタイルを段落で囲むんだ?と。
BODY {
font-family: "MS Pゴシック", "Osaka"; font-size: 20px
}.
table {
font-family: "MS Pゴシック", "Osaka"; font-size: 10pt;
}
このままtxtに貼り付けて、拡張子を.cssにしる。
htmlファイルと同じディレクトリにぶち込んで、
<LINK href="つけた名前.css" rel="stylesheet" type="text/css">
をhtmlファイルのhead内にぶち込め。
世話好きなひとですね。いいお嫁さんになれます。
わざわざ外出しせずとも、嫁さんなら中出し可なのではないか。
>>468 まぁ、外出ししておけば夫婦水入らずで過ごせる期間が延びるわけで。
外出ししちゃうと、出したものが見当たらないとか言って怒られたりすることも新婚さんには多いわけで。
471 :
455 :02/12/11 18:30 ID:Ezr+Zt5k
>>461 >>466 ありがとうございます。できました(^-^)
たくさん勉強しますので、中出しは・・・・・勘弁してください*^^*;
472 :
Name_Not_Found :02/12/11 22:45 ID:GzAmL7fH
471の口調に萌え(*´∀`*)
(´`)キモッ
476 :
Name_Not_Found :02/12/11 22:54 ID:uXi5t+wO
dt{float:left}にしたり、dd{clear:both}にしたり、 <br clear="all">を付けたり、いろいろ試しましたが、 IE5,IE6,NN6のすべてで満足いく結果…にはなりませんでした。 やはり、dt{display:inline;width:Xem}でいこうと思います。 NN6だけはwidthが効いていませんが、致命的というわけではないので…。 それにしても、em{background:red;width:4em}とか、 まあこの例はうまくないかもしれないけど、 inline要素のwidthにも意味はあると思うんですが、 こういう見栄えを実現したいときはいい方法はあるのでしょうか…。
>>476 dt { width: 10em; float: left; }
dd { margin-left: 10em; }
とかでは、ダメなのか?
>>476 サンプルソース…
-------------------------------
<dl>
<dt>(゚Д゚,,)</dt><dd>(,,゚Д゚)</dd>
<dt>(゚Д゚,,)</dt><dd>(,,゚Д゚)</dd>
<dt>(゚Д゚,,)</dt><dd>(,,゚Д゚)</dd>
<dt>(゚Д゚,,)</dt><dd>(,,゚Д゚)</dd>
<dt>(゚Д゚,,)</dt><dd>(,,゚Д゚)</dd>
<dt>(゚Д゚,,)</dt><dd>(,,゚Д゚)</dd>
</dl>
<p class="abc">(´∀`)</p>
-------------------------------
dt{border:1px solid red; /* 枠線つけて分かりやすくしてみるテスト */
float:left;
clear:left;
width:30%;
height:3em;
overflow:auto;
}
dd{border:1px solid blue; /* 枠線つけて分かりやすくしてみるテスト */
margin:0;
height:3em;
overflow:auto;
}
p.abc{clear:both;}
-------------------------
こんなんじゃだめ?
>>476 tableじゃ駄目なの?
<table summary="蹴り技を紹介する表">
<caption>蹴り技一覧</caption>
<thead>
<tr>
<th>技の名前</th>
<th>技の説明</th>
</tr>
</thead>
<tr>
<th>ローキック</th>
<td>足を蹴る</td>
</tr>
<tr>
<th>ミドルキック</th>
<td>脇腹を蹴る</td>
</tr>
<tr>
<th>ハイキック</th>
<td>頭を蹴る</td>
</tr>
</table>
見出し(蹴り技一覧)と1行目(技の名前、技の説明)が見栄え的に要らない場合は、
caption,thead { display : none; }
の方向で。
480 :
478 :02/12/11 23:40 ID:???
dtのclear:left;は要らないです。(´Д`)
<dt>名前</dt><dd><input type="text" name="namae"></dd><br clear="all"> ---- dt{float:left;width:3em} dd{display:inline} これで成功しました。 ddにmarginは必要ないです。 仮に付けると、10em分の間隔が開いてしまいます。 ひょっとしたら実現したいレイアウトがうまく説明できていなかったかもしれません。 こんな感じで、フォームアイテムを並べています。 名前 [ ] mail [ ] 名前やmailなどの幅を統一の3emで指定することで、 テーブルを使わずにinput要素の左揃えを実現したかったのです。 テーブルでもマークアップ的にはいいと思うんですけど、 テーブルは、テーブル自体の横幅の指定がうまくいかないので避けたかったのです。 ありがとうございました。
なんだフォームか… dtかddの中に数行の文章が入るのかと思って overflowとか色々考えちゃったよ。
>>481 </dd>のあとに<br>とはこれ如何に。
あるべきは</dd></dl>で、その間には何物も挾むことを許さず。
あと、floatしたのならddへのdisplay:inline;指定は不要のはずだが。
>>481 定義リストを表化するには、これでいいハズ。
DT {
clear:left;
float:left;
width:3em;
margin:0;
padding:0;
}
DD {margin:0 0 0 3em;padding:0;}
>>481 CSSを覚える前にHTMLの仕様書読め。
486 :
481 :02/12/12 02:14 ID:???
>>483 dd{display:inline}がないと、
ブロック要素と<br clear="all">の解釈の違いによって、
NN6で1行空いてしまうのです。
まあ、IEの解釈のほうが間違っている気がしますが。
>>484 ダメですた。
<dd>にマージン指定すると、どうしても<dt>との間に
まるまる3emの空隙ができてしまいます。
>>485 フォームにリストがダメですか?
津波荘など色々参考サイトを見て回ったのですが…。
それとも、<br clear="all">を使ってるのがまずいですか?
しかしこれはIEのシェア的に無視できず、勘弁していただきたいところです。
display:inlineが許されるならば、<br>も必然的に許される気もします。
スレ違い?スマソ。
> display:inlineが許されるならば、<br>も必然的に許される気もします。 全然違うし。もうすこし頭を冷してよく考えてみ
488 :
481 :02/12/12 02:21 ID:???
間違い訂正。
>>483 dd{display:inline}がないと、
IE6でなぜか最初の<dd>の手前で改行されてしまいます。
また、NN6では各<dt><dd>のセットの間にそれぞれ1行の間隔が開いてしまいます。
>>486 <!ELEMENT DL - - (DT|DD)+ -- definition list -->
DL要素の内容モデルは、DT要素或いはDD要素の一回以上の繰り返し。
その他の要素は包含できない。それぐれらい知れ。
490 :
481 :02/12/12 02:34 ID:???
dt{clear:left}を追加して、<br>をなくしてみたんですが、 IEで、2行目以降にインデントがついてしまいました。 名前 [ ] mail [ ] url [ ] こんな感じです。 もちろん、{margin:0;padding0}です。 け、結局、テーブルですか。(゚Д゚;
491 :
481 :02/12/12 02:35 ID:???
毎回タイプミスがあるので鬱です。 padding:0ですね。":"が抜けてました。
<head> <title>これでいいだろうがボケ。</title> <style type="text/css"> dt { width: 3em; float: left; clear: both; } dd { margin-left: 3em; } </style> </head> <body> <dl> <dt>名前</dt><dd><input type="text"></dd> <dt>mail</dt><dd><input type="text"></dd> </dl> </body>
最近しつこい奴が多いけど 同一人物?
あ、はい、全部俺です
495 :
481 :02/12/12 03:44 ID:???
>>492 さん、ご丁寧なソースありがとうございます!
結局、親要素のline-heightなど、わたしのサイト固有の原因がありました。
色々調整した結果、<br>はなくすことができました。inlineも使っていません。
まことにおさわがせしました。すみません。
>>3 に、HTMLの仕様書や HTML Validator も追加した方が良くないか。
> CSSスタイルシートを意図した通りに機能させるには、正しい文書解析木が必要です。
> つまり、正当(valid)なHTML文書と共に、CSSスタイルシートを用いる必要があります。
HTMLを知らなくては、CSSの利点は活かされない。
CSSを知らなくても、HTML文書は書ける。
>>497 その場合、
>>1 に、
「CSSを意図した通りに機能させるには、CSSを適用するHTML文書も正しく
書く必要があります」
という旨の文章をつけくわえた方がいいと思う。
しかし、こうなると本当にFAQサイトを別に作った方がよさそうだね。
俺がやってもいいんだけど、仕様書もきちんと目を通したことのない
ヘタレだしな……
dtなどをdisplay:list-item;にした場合、IE6ではきちんとリストマーカーが表示されるでしょうか mozillaでは表示されましたがIEはバージョンアップできないので確認が取れませんでした。
>>499 されるよ。
そしてなめらかに500ゲト
>>500 どうもです。確認取れなかったので安心しました。
>499
まだ見てるかな?
>>4 のあたりに、ブラウザごとの対応状況を調査しているサイトが紹介されてますよん。
次回はそのあたりが役に立ちそう
>>502 すんませんでした。こんどちゃんと読んできます
504 :
ネスケ逝ってよし。 :02/12/13 00:55 ID:2WpsAB3m
ズバリ! 「ネスケ4以下の時はCSSを読み込まないようにする」 やり方を教えていただけないでしょうか。 以前、公共のサイトを作った時は、ネスケ4.7でも綺麗に表示されるように BODYには行空け(line-height : 1.5em )をつけないで いちいちタグにつけるとか、 画像と文字が重ならないようにテーブルに入れるとか、気を使ったのですが やはり限界があるので…。
ネスケ4ユーザを物理的に壊滅する
自己完結する奴、ウザ・・・
これでいい?(゚∀゚) <link rel="stylesheet" type="text/css" href="ほにゃらら.css" media="all">
>>509 験せばわかるだろ。
NN4をインストールできない環境でもあるまいに。
>510 いや。試してる。NN4はインストール済。 ただインポ音を使う方法が読んでもよくわかんなかったので、 メディアなんとかでやってみている。 :@import :
>media="all" 全てのメディアに対象なんて迷惑だよ。 これでいいだろ。(゚∀゚) <link rel="stylesheet" type="text/css" href="ほにゃらら.css" media="screen,"> メディアタイプの最後のコンマがミソ。 Netscape 4 のアフォは解析できないのだ。
ほんまアッフォやなぁ!(快笑)
>>4 「とほほのスタイルシート入門」の削除きぼーん。
杜甫々は逝ってよし。参考にならん。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//JA"> ↑あってる?
JA?
ENでした?
ENじゃないとダメだよ。 そこはDTDの言語指定だから。
とほほ信者VSアンチ ファイッ!
とほほ信者VSボブ・サップ ファイッ!
ボブ・サップVSアーネスト・ホースト ファイッ!
ならばJAに対応させた日本語版DTDを作ろう という気にはなれない。
<li>のfloatがうまくいきません。例えば、 <div class="section"> <h2>ほげほげ</h2> <ul> <li>ほにゃらら</li> <li>ほにゃらら</li> ... </ul> </div> のようにし、<li>にwidth:15em;float:left を適用させたところ、 <div class="section">のボックスサイズがおかしくなってしまいました。 WinME + IE5.5sp2・Netscape7で表示を確認したんですが、共に若干の違い があるものの、<div>のボックスの縦幅が<ul>よりも狭くなり、結果的に <ul>が<div>をはみ出すような形になってしまいました。 うまく回避する方法はないでしょうか。
534 :
533 :02/12/13 17:01 ID:WDr+7rKQ
age忘れました。 あと、Opera6.05ではとりあえず意図した通りに(?)表示されてました。
>>533 ulに適当なwidthを与えてみてください
536 :
533 :02/12/13 17:46 ID:???
>>535 ulにwidth:100%を与えてみましたところ、IE5.5で表示が改善されました!
Netscape7では変わらないみたいなんですが、IE5.5が改善されただけでも
うれしいです。ありがとうございます!
537 :
Name_Not_Found :02/12/13 18:04 ID:mbeKMtqO
外部CSSファイルを読み込んでますが、 <p class="aaa">あああああ</p> などと指定したとき、aaaというクラスがCSS内になかった場合って 大丈夫なんでしょうか?
>537 それはいけません!OSがクラッシュして再インストール必須です! なわけがなくて、特になにも起きないんでは…自分でやってみれば?
540 :
537 :02/12/13 18:14 ID:???
>>538 ,
>>539 サンキューです。
一応、Win2kで一番タチの悪いネスケ4で大丈夫だったのは確認してましたけど、
macとかどうなのかなーと思って。
言葉足らずでごめんなさい。
>>4 「とほほのスタイルシート入門」の削除きぼーん。
杜甫々は逝ってよし。参考にならん。
お、どうした、粘着だな!
543 :
542 :02/12/13 20:36 ID:???
>>4 「とほほのスタイルシート入門」の削除きぼーん。
杜甫々は逝ってよし。参考にならん。
お、どうした、粘着だな!
546 :
545 :02/12/13 21:12 ID:???
547 :
545 :02/12/13 21:12 ID:???
とほほはどかが(・A・)イクナイ!!の? おせーてPLZ
>>4 「とほほのスタイルシート入門」の削除きぼーん。
杜甫々は逝ってよし。参考にならん。
自作自演の嵐だな・・・
553 :
552 :02/12/13 21:44 ID:???
荒らすなら糞スレでやれリア厨ども
555 :
554 :02/12/13 22:14 ID:???
556 :
べに :02/12/13 22:22 ID:eOeYBXQD
以下のhtmlで”名 称:”と”−−−−壱” 同じく”所在地:”と”−−−−壱” の間が、微妙に空いてしまいます。 name-addressに負のmarginを指定してあげたら空かなくなるのですが、 印刷時に文字ずれが生じました。 どのようにすれば、隙間がなくなるでしょうか? 教えてください。 <html> <head> <style type="text/css"> body.plain {font-size:0.4cm; font-family:MS 明朝; line-height:150%; margin-left:2em; padding-top:0.5em;} div.plain {width:15cm;} span.name-address {width:7em; height:4em; float:left; text-align:right; margin:0cm; padding:0cm border-style:none;} </style> </head> <body class="plain"> <div class="plain"> <p>1.事業所の名称及び所在地<br> <span class="name-address">名 称:<br>所在地:</span>−−−−壱−−−−1−−−−壱−−−−2<br> −−−−壱−−−−1−−−−壱−−−−2−−−−壱−−−−3−−−−壱−−−−4−−−−壱−−−−5</p> </div> </body> </html>
width:7em
>>556 名称と所在地を<span>で括るのがおかしいだろ……
かなり不思議マークアップな気がする。
っていうか、リストなり表なりにしてくれ。
559 :
Name_Not_Found :02/12/13 22:33 ID:fH3KC67e
スタイルシートのリファレンス本ほしいんだけど、たくさんありすぎてようわからん。 ショウエイシャとかソフトバンクとか秀和システムとか。 おすすめとか定番ものってのがあったら教えてください
>>556 つーか,これこそtableとかでレイアウトすべきじゃない?
もしくはdl,dt,ddかなぁ.
わざわざスタイルシート使ってまでAccessibility下げてる理由がわからん.
lynxとかでみると,
名 称:
所在地:
−−−−壱−−−−1−−−−壱−−−−2
−−−−壱−−−−1−−−−壱−−−−2−−−−壱−−−−3−−−−壱−−−−4−−−−壱−−−−5
ってなるのかな?
音声ブラウザだともっとひどいことになりそ.
564 :
Name_Not_Found :02/12/13 22:42 ID:fH3KC67e
>>561 >>562 親切にありがとうございます。氏ねとか言われるかとちょっと不安だっただけにうれしいです
563は阿呆
>>563 いや、こうじゃないか?
名 称:
所在地:−−−−壱−−−−1−−−−壱−−−−2
−−−−壱−−−−1−−−−壱−−−−2−−−−壱−−−−3−−−−壱−−−−4−−−−壱−−−−5
あれだよな、普通にスタイルシート切ればこうなるわけで。
考え直せ
>>556
567 :
べに :02/12/13 22:50 ID:eOeYBXQD
すごい早いレス、ありがとうございます。 I.E. 6.0の表示では、 名 称:−−−−壱−−−−1−−−−壱−−−−2 所在地:−−−−壱−−−−1−−−−壱−−−−2 −−−−壱−−−−3−−−−壱−−−−4−−−−壱−−−−5 となります。 テーブル使うと早いと思うんですが、 どうしても隙間が気になるんです。 margin、border-style、border-width、padding とう色々変えてみたのですがなんともなりません。 cssをせっかく覚えたのにテーブル使いたくない、 というのももちろんですが。
ん?なんで荒れてんだ
569 :
563 :02/12/13 22:53 ID:???
阿呆っていわれちゃったよ (´・ω・`)ショボーン
って思ったら
>>566 ああ,ほんとだ.鬱だ氏のう.
570 :
べに :02/12/13 22:53 ID:???
>558 確かにspanはおかしいような気がします。 span、p、divの使い分けがわかってないです。
>cssをせっかく覚えたのにテーブル使いたくない、 表をテーブルでマークアップするのは何も悪くないと思うが。 CSSをいじるのは、ValidなHTMLを書けるようになってからにしれ。
table を使うべき時は使うんだよ。 <style> td{padding:0;margin:0;text-align:left;} th{padding:0;margin:0;text-align:right;width:7em;} </style> </head> <body> <table> <tr> <th>名称</th><td>−−−−</td> </tr> <tr><th>所在地</th><td>−−−−</td> </tr> </table> </body> つーか、もうちょと勉強して下さい。
574 :
べに :02/12/13 23:22 ID:eOeYBXQD
575 :
563 :02/12/13 23:29 ID:???
阿呆の563ですが,おわびに. −−−−壱−−−−1−−−−壱−−−−2 がどこで区切れるのかわからんが,区切らずテーブル使わないんだったらこんな感じ? <html> <head> <style type="text/css"> body {font-size:0.4cm; font-family:'MS 明朝',serif; line-height:150%; margin-left:2em; padding-top:0.5em;} dt {float: left; clear: left; width: 4em;} </style> </head> <body> <h1>1.事業所の名称及び所在地</h1> <dl> <dt> <span style="letter-spacing: 1em;">名</span>称: </dt> <dd> −−−−壱−−−−1−−−−壱−−−−2 </dd> <dt> 所在地: </dt> <dd> −−−−壱−−−−1−−−−壱−−−−2−−−−壱−−−−3 −−−−壱−−−−4−−−−壱−−−−5 </dd> </dl> </body> </html> つーか,テーブル嫌がる理由って何?
>>575 css覚えたての頃は、テーブル使ってた時代の反動で、
テーブルを(レイアウト目的だとかにかかわらず)毛嫌いしてしまうんです。
使っちゃダメなマークアップだと、無意識に。
577 :
べに :02/12/13 23:41 ID:???
このページをそのまま印刷して、帳票として使います。 大体、ページ幅が30文字程度で、 所在地の項目(最大50字)は可変長です。 ので、1行のときも2行のときもあります。 今のcssだと、”:”と”−”の間の空白分、”−”以下の文が タイトル(”1.事業所の名称及び所在地”)と微妙にずれています。 ちょっとでもずれると客がうるさいので、困ってます。 テーブル使えばいいとは思うんですが。 >tableが嫌がる理由 このシステムの他の所では全然使ってないからかな? 576さんの言うとおりだと思います。 覚えたてなんで。
印刷目的ならPDFとかの方が…
579 :
576 :02/12/13 23:47 ID:???
>>577 帳票ならテーブル使っても間違ったマークアップじゃないと思うよ。
580 :
563 :02/12/13 23:47 ID:???
>>576 ほーう.
おじちゃんは,テーブルをレイアウトに使う発想が無かった時代からHTML書いてるから,
その辺の感覚わからんなぁ.
てーか,HTML書き始めた頃(1996年4月位)って,tableタグって無かったかも(w
581 :
576 :02/12/13 23:50 ID:???
>>580 「テーブルはレイアウトに使うな」
って意識が肥大してる、というか、そんな感じですね。
未だに漏れもそういった感覚があります。
普通の表なのに、cssでやらねば、という強迫観念みたいな。
むしろ、意識的にtableを使うチャンスを探すぐらいが丁度いいのかも。 今更レイアウト目的に使うなんてことにはならないだろうしね。 無理矢理こじつけてulとかdlに落してるケースは結構多いかもしれないし。
テーブルレイアウト卒業したばかりなんですけど、 書いたものがあっているのかどうか不安です。 添削して欲しいけど、でも、修正してくれるスレってのはちょっと怖いし、 そんな時はどうしたらいいんでしょうか。
584 :
べに :02/12/13 23:58 ID:???
ここで原因が解決してもcss 使うかわからないけど、後学のために、 ぜひ、教えてください。せめてヒントだけでも。 ”:”と”−”の隙間はどうやったら消せるでしょう?
585 :
べに :02/12/13 23:59 ID:???
>583 確か、上の方のリンクにcssをチェックしてくれる サイトがあったですよ。 今日そこでチェックしたら、結構ミスがありました。
>>583 虎穴に入らずんば虎児を得ず、って知ってる?
晒したくないなら、自分で参考サイトなり本なり見て確かめればいいのでは?
>>584 素直に tabele つかっとけ。
多分spanのせいだろうとは思うが。
588 :
587 :02/12/14 00:02 ID:???
あ、ちなみに Mozilla だとスペース空いてないみたいですよ。
>>586 晒したいんですが、まだまだstrictじゃないので。
たしか、あっちのスレでは「出来る限り最大限の努力を終えてから」みたいなノリだったし。
>>583 逝ってみます
591 :
べに :02/12/14 00:08 ID:???
>587 とすると、I.E. のバグなんですね。 I.E.のバグで片付けると、 なんでこんなに気分がすっきりするんだろう・・・ 関係ないけど、大盛りの美学100回記念らしい。
592 :
563 :02/12/14 00:10 ID:???
>>589 丁寧に有難う御座います。勉強してきます。
>とすると、I.E. のバグなんですね。 どんな理論展開をした結果なんだ
関係ないけど >587 >588 の口調の変化にワロタ
595 :
563 :02/12/14 00:25 ID:???
>>592 俺の名を語るな.そんなに阿呆になりたいか.
563で間違えたのって,そーいうところじゃないし.
どちらかというと,脳内レンダリングエンジンに重大なバグがあったのが問題なわけで.
つーか,じつは563=589で,話題が違うから名前切っただけだし.
2chてほんとに偽物出るのね┐(゚〜゚)┌
596 :
583 :02/12/14 00:27 ID:???
なぁ、明らかにケアレスミスなのが解り切ってる事なのにそんな必死になってキれるなよ、少年
598 :
563 :02/12/14 00:31 ID:???
>>595 ああ,単純に間違えただけか.
こちらこそそーとも知らず偽物扱いしてスマソ.
おじちゃんみたいに阿呆にならないよーにねー.
599 :
563 :02/12/14 00:34 ID:???
ワラタ
化石レスだが、border-collapse使えばtableも隙間詰められるぞ。 IEならね。他はしらん。
>>601 Netscape7, Opera6 も実装している。
>>550 しちゃえとかしちゃおうとか、
良い歳をしたをぢさんの文體としてはふさはしからざるものだと思ふが如何。
どうやら、わざと氣持ちの惡い書き方をして、
スタイルシートに對する嫌惡感を煽らうとしてゐるものと見受けられる。
ノジタン・・・。あなたの文章の方が気持ち悪いですYO。
野嵜がキモイとは思わんが。
読みにくくはある。それもこっぴどく。 すげー高度な日本語だな俺。
まぁあれだ。野嵜の文章が読みにくいのは誰もが認める事実なわけでむしろ(以下略
わかりづれー以下略だな
読みにくい読みやすいの問題以前によ
あの文体みただけで頭痛・吐き気・怒張がおきます。
おまいらスレタイ嫁
文体までスタイルシートでコントロールできれば あのサイトもちょっとは見る気おきるんだが。 これでいい?
まだ引っ張るつもりか
誰か質問しる!
616 :
Name_Not_Found :02/12/15 07:23 ID:kq0ZEUiY
質問します。 スクロールバーの色を変えたいのですがどうすれば良いですか。
↓↓↓ハイ、次の人どうぞ。↓↓↓
下痢が止まらないのですが…。
↓↓↓ ハイ、次の人どうぞ。 ↓↓↓
622 :
Name_Not_Found :02/12/15 15:36 ID:1IlP3ovf
<h1>今日のお買い物リスト</h1> <ol> <li>蜜柑</li> <li>檸檬</li> <li>縄</li> </ol> というリストは > 今日のお買い物リスト > 1.蜜柑 > 2.檸檬 > 3.縄 と、レンダリングされると思うのですが、 「1.」〜「3.」のフォントの種類と 大きさや色を変更するにはどうしたらよいのでしょうか?
>>622 色と大きさは無理だけどな。
LI{
font-family : sans-serif;
}
こういうかんじなら数字のフォントは変えられる。
あと、マークを変える場合は、
<STYLE type="text/css">
<!--
LI{
list-style-type : disc;
}
-->
</STYLE>
discの部分を変更したらいろんなのになる。
黒丸 disc
白丸 circle
四角 square
数字 decimal
ローマ小文字 lower-roman
ローマ大文字 upper-roman
アルファベット大文字 lower-alpha
アルファベット小文字 upper-alpha
無し none
マーカーの色はliのcolorが反映されるんじゃなかったっけ?
<head> <title> Q. カウンタってどうなのよ(゚д゚) A. Opera6 は対応してるらすぃよ(・∀・) </title> <style type="text/css"> ol { counter-reset: item; } li { display: block; } li:before { font-family: serif; font-size: 200%; font-style: italic; color: blue; content: counters(item, ".") ". "; counter-increment: item; } </style> </head> <body> <ol> <li>hogehoge <li>hogehoge</li> <li>hogehoge</li> </ol> </body>
626 :
Name_Not_Found :02/12/15 23:57 ID:yrLaCbA1
こんばんは。 HTML+CSSを使ってStrictなページを作ろうと思っています。 その中でフォトアルバムのページがあるのですが、これの作成に苦戦しています。 そのページは中央に写真が一枚あって、その下にページ移動のナヴィゲーション があります。 ナヴィゲーションのマークアップは <ul class="navi"> <li><a href="../">一覧に戻る</a></li> <li class="next"><a href="003.html">次のページを見る</a></li> <li class="prev"><a href="001html">前のページを見る</a></li> </ul> と、なっています。 望む表示結果は 前のページを見る 一覧に戻る 次のページを見る で、一覧にも戻るが中央、前のページを見るが左揃え、次のページを見るが 右揃え、となるようにしたいのです。 bodyは40emで幅固定、2emのpaddingとセンタリングのため左右のmarginを autoにしています。 よりしければ、先輩方のお知恵をお貸し下さい。
おいおいスレ違いだろ
>>626 マークアップを素直に、
<ul class="navi">
<li class="prev"><a href="001html">前のページを見る</a></li>
<li class="list"><><a href="../">一覧に戻る</a></li>
<li class="next"><a href="003.html">次のページを見る</a></li>
</ul>
としなされ。
そしたらliを左右にfloatしてwidthを付与し、li内の文字列をtext-alignで文字揃すればいいわけだ。
>>626 こんばんは。
.navi{
text-align : center ;
}
.next{
float : right ;
}
.prev{
clear : right ;
}
なら
一覧に戻る
前のページを見る 次のページを見る
になるかも
630 :
626 :02/12/16 00:53 ID:???
>>627 すいません、ここじゃ駄目でしょうか?
>>628 さん、
>>629 さん、レスありがとう!
<ul class="navi">
<li class="list"><a href="../">一覧に戻る</a></li>
<li class="next"><a href="003.html">次のページを見る</a></li>
<li class="prev"><a href="001html">前のページを見る</a></li>
</ul>
マークアップをこのようにして、
.list{
text-align : center ;
}
.next{
float : right ;
}
.prev{
float : right ;
}
のようなCSSにしたらできました!
お二人のお知恵のおかげです。
floatにはボックスサイズがいるみたいですね。あとで足しておきます!
今から他の色々なブラウザで表示確認してきます!
ありがとうございました!
631 :
626 :02/12/16 02:03 ID:???
と、思ったらMac IE 5.22ではfloatしたnextとprevのリンクのアンダーラインが 消えるし、Mozillaでもprevの左になぜか3emほどの空白ができるし。 もーこのうんこブラウザたちめ! もう少し頑張ってみます。
がんがって!
633 :
626 :02/12/16 02:21 ID:???
>>632 どうもありがとう!
うまくいったらまた報告します。
634 :
ディ :02/12/16 09:52 ID:+2UYGsmC
>>634 質問の意味がわからん。table同士の間隔を広げたいのか?
>>634 ><TD><FONT STYLE="LINE-HEIGHT:130%">
>ああああああああああああああ<BR>いいいいいいいいいいい</TD>
これでは、セル内のフォント要素の高さを指定しているだけ。
line-heightは行の高さ(非置換インライン要素のボックスの高さ)を指定するもの。
行間とは、line-heightとフォントサイズの差のこであり、
フォントの上下に半行間分のスペースを挿入されるのである。
ボックス間の空白は、マージンのプロパティを使用する。
table { margin-top: 1em; }
CSSでできるかわからないので、スレ違いかもしれませんが掲示板の テキストフィールドなどのフォームをemをつかって相対指定したいのですが どのようにすればよろしいのでしょうか?
638 :
634 :02/12/16 16:14 ID:???
>>635 そうです。そういうことでした。
>>636 丁寧なご説明ありがとうございます。勉強になりました。
text-align : center; でテキストの中央寄せは出来るのは分かるのですが 高さの中央揃えはどうやるのでしょう? v-align="middle" みたいなものを したいのですが。
>>639 テーブルだったら、何もせずに高さ真ん中じゃない?
vertical-align: middle
643 :
Name_Not_Found :02/12/17 09:49 ID:8ZucsHJw
さくらどおりさんのCSS切り替えスクリプト使ってますが設定を間違えたのかスタイルを切り替えてから別ページに行くと元のスタイルに戻ってしまいます。どうしたら別ページに飛んでも切り替えたままのスタイルで表示できるか教えて下さい。
>>643 さくらどおりさんて誰?
cookie使えば?
646 :
Name_Not_Found :02/12/17 10:31 ID:V4LkSZLX
<div><p>本文</p><p>本文</p></div> とあって、このdivやpにlist-itemを指定してもリスト表示されないのですが、 リストのタグを使わなければいけないのでしょうか。
>>646 list-〜は、リストタグに対して反映させるcssでリスト化するcssじゃあないよ。
>これのことだろう。 意図を汲めよ
650 :
647 :02/12/17 10:40 ID:???
>>646 下記の様にすれば、IE6 や Opera6以上、Netscape6以上ならリストアイテムになる。
>>648 は無知。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<head>
<style type="text/css">
p {
margin: 0 0 0 2em;
display: list-item;
list-style-type: disc;
}
</style>
</head>
<body>
<div>
<p>本文</p>
<p>本文</p>
</div>
</body>
あぅできました。marginが必要だったようです。謝謝。
654 :
643 :02/12/17 12:12 ID:SNzmLH2J
スレ違いすみません。 誘導ありがとうございました。逝ってきます。
655 :
648 :02/12/17 12:26 ID:???
>>651 無知ですまんかった。ほかのんと勘違いしてた。
>>646 適当な事書いてすまんかった。ほかのんと勘違いしてた。
ほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのん言いやがって 関西人は糞
ほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのん ほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのん ほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのん ほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのん ほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのん ほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのん ほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのん ほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのん ほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのん ほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのん ほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのん ほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのんほかのん
関西人はほかのん
使い捨てカイロみたいだなw
(´-`).。oO(関西人にいじめられたか?
確かに糞だな
(´-`).。oO(都会への憧れ→嫉妬…。
(´-`).。oO(Identityの喪失→方言使う香具師への嫉妬…
(´-`).。oO(「ほかのん」へ募る想い…
そんなん展開してどうするよ
(´-`).。oO(関西の民度の低さ→…←関西人は野蛮人)Oo。.(´-`) . (´-゚).。oO(糞!!)Oo。.(゚-` )
(´-`).。oO(文明を恐れる事は無いんだよ
(´-`).。oO(文明に埋もれて自己主張できない哀しさ…
(´-`).。oO(つまり、村にもネットが繋がった、という事か。
伸びていると思ったら… | ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄| | 何事もなかったかのように | | 次の方どうぞ!!! | |_____________| ∧∧ || ( ゚д゚)|| / づΦ
一般フォントファミリー名って、どういうものを指しますか?
関西人はほかのんでも食ってろ
>>672 一般フォントファミリー名って、どういうもんを指しますか?
ほそろしい・・・・・
(´-`).。oO(田舎の人って、知らない言葉=食べ物って思うんだね。
>>671 一般フォントファミリーって論理フォント名のことみたいね
serif, sans-serif, monospace, ...
関西人は糞
679 :
671 :02/12/17 14:26 ID:???
>>677 有難う御座います。
フォントファミリーを指定したら、CSS Validatorで、
>一般フォントファミリー名(generic font family)を最後の選択肢として付け加えておく事を推奨します
って言われたんですけど、つまり機種依存しないようなフォントですよね?
論理フォントとそうでないものの見分け方がわからないです。
681 :
671 :02/12/17 14:28 ID:???
>>677 あ、すみません。
最後の行が、それだったんですね。
有難う御座いました。
CSS2.1って何が変わったの?エラッタだけじゃないよね?
>>683 グリッドって?レイアウトグリッドのこと?プロパティ見たけど内みたいだけど。。。
ネタですか?ネタですよね?
>>682 これ見てみ。
http://www.toybox.jpn.org/studio/css2.1spec-appendixC/ 削除された仕様がタプーリあるよ。
>Chapter 12 生成内容,自動採番, そしてリスト
>名前付きカウンタはCSS 2.1から削除された, また'marker'値が'display'プロパティから削除された.
>Section 12.2 'content'プロパティ
>'<uri>'値と<counter>値が削除された.
>Chapter 15 フォント
>'font-stretch'と'font-size-adjust'プロパティはCSS 2.1から削除された.
>フォント記述子と'@font-face'記述子はCSS 2.1から削除された.
>Section 18.1 カーソル: 'cursor'プロパティ
>'<uri>'値は削除された. そして'progress'値が追加された.
>Chapter 16 テキスト
>'text-shadow'プロパティはCSS 2.1から削除された.
エラッタなあ
>>685 THX!のどのつかえがとれたよ。
ところでCSS2.1 WDの邦訳ってあるのかな?英語駄目なんだよね〜
お前喉ポリープだろ
691 :
Name_Not_Found :02/12/18 00:48 ID:utV1t1ob
UTF-8 で記述した HTML + CSS だと font-family : 'Century Gothic' とか(一例) が効かないだけど、どうして?S-JIS だとフォント変化するのに。 日本語フォントは反映されるんだけどな。
文字コードとの対応が取れなきゃ使えないでしょ UTF-8はS-JISより表現できる文字数多いのよ
694 :
おしえて :02/12/18 02:24 ID:2AS3hrRX
<HTML> <HEAD> <TITLE>教えてください</TITLE> <LINK href="test.css" rel="stylesheet" type="text/css"></HEAD> <BODY> <DIV class="topic">見出し1</DIV> <UL> <LI>aaaaaa <LI>bbbbbb </UL> <DIV class="topic">見出し2</DIV> <UL> <LI>cccccc <LI>dddddd </UL> </BODY> </HTML>
695 :
おしえて :02/12/18 02:25 ID:2AS3hrRX
続き ////// test.css /////////////////////////////////////////////// BODY { margin : 10px 40px; background-color : mintcream ; color : black ; } DIV.topic:first-letter { color : red ; font-size : 140% ; } DIV.topic { font-size : 90%; } LI { font-size : 80%; } 二つ目のリストにマージンが効きません。 なんか根本的に間違っているのでしょうか? 確認はIE5.5で行いました。
妙な挙動するねー。とりあえず ul{ margin: 1em 0; padding-left: 40px; } を追加しちゃえば。ul,ol周りはバグの有無に関わらずきっちり指定するが吉。 つかその見出しは素直にh1とか使(略
>>695 UL要素にボーダーを指定したら正常になりました。
ul { border: solid 1px #f5fffa; }
>background-color : mintcream ;
つかその色指定はCSSで定義されていません。
699 :
Name_Not_Found :02/12/18 12:57 ID:WR53u+nM
贅沢な骨だねぇ
ご飯の固まりを噛まずに飲み込むといい
>>695 CSSを適用するなら、<li>は</li>で閉ぢた方が安全ですよ。
</p>も省略可能だけれど、省略しない方がいい。
以上、経験則から。
余計なお世話だねぇ
dashedの点線が上手く表示されずに途切れたり、線になってしまう事があります。 これは回避出来ないのでしょうか?
リロード
>>703 太さが関係してるよ。
太くしすぎるな。
勃起すんなと
707 :
xxx :02/12/18 14:31 ID:q2qJoQd4
-------変態・MTTどこでも-------
---●●●変態痴女を紹介致します。●●●---
例えば>欲求不満オマ●コヌレヌレ女・露出オナニー痴女・
フェラチオおしゃぶり女・ミニスカ・ノーパン娘・巨乳パイズリ娘・
アナルSEXおねだり娘・オマ〇コ弄られマン汁グチョグチョ女・
SM牝豚・緊縛・浣腸・スカトロ・等・・・刺激を求めています。
●●●学生・OL・主婦・モデル・牝豚・女王様・オカマ等・多数!●●●
090-8002-8356番
下のカタカナを小文字に変換してください。
http://www.エムティーティー.jp/i -
708 :
703 :02/12/18 15:37 ID:???
>>705 太くはありません、1pxなのですが。
細いのも駄目なんでしょうかね。
細いと歓迎されませんよね。
ページの下に行くほどレイアウトがずれるとこありますよね ダサすご(藁
>>693 仕様書の構文を見てから物を言え。
シングルでもダブルでもいいのだ。
シングルだとバグるブラウザがあるだけだ。
TABLEタグのcellspacingに当たるCSSとしてpaddingを使っても変化がありません。 どうしてでしょうか??
link要素やstyle要素でmedia属性が省略された場合、 HTMLの仕様書では「screen」として扱われると定義されていますが、 CSSの仕様書では「all」扱いになるとしていると聞きました。 実際はどうなんでしょうか?
>691 まだバグだと確定したわけじゃないのでこっちに書くよ <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>test --- test</title> <style type="text/css"> * {font-style: normal; font-weight: bold; font-size: 100%;} p {font-family: Arial;} em.osaka {font-family: Osaka;} em.comicsans {font-family: "Comic Sans MS";} em.verdana {font-family: Verdana;} </style> </head> <body> <p>This is a test.</p> <p>This is a <em class="osaka">test</em>.</p> <p>This is a <em class="comicsans">test</em>.</p> <p>This is a <em class="verdana">test</em>.</p> </body> </html> WinのIE6 SP1とMoz1.2.1でちゃんと変わるけど? (Century Gothicはインストールしてないので試せませんでした) というわけで,OS,ブラウザ,バージョン,実際に書いたスタイル指定,がないと 誰にも正しい答がわからないと思うよ.
>試してみればいいのに IE6, Opera6, Mozilla で試してみました。 <style type="text/css"> body { color: red; } </style> とした場合に、何れの印刷プレビューで前景色が赤になりました。 ということは「all」として認識しているといことですね。
filterってW3Cだとダメダメって言われるんですが、 それ以外で文字をいい塩梅に出来る方法ないですか? タイトルロゴですら画像は使いたくないんです。
721 :
Name_Not_Found :02/12/19 13:15 ID:5MXxS9sn
>>718 Arial はこちらでも変化しました。変化しないのは
Century Gothic , Osaka の2つです。日本語フォントも変化するフォント指定だと反映されないようです。
Verdana や Arial のアルファベットのみ変化するフォントは反映されています。
閲覧環境は Win2K IE6 SP1 と Moz1.2.1、Opera6.05です。
Shift_JIS、EUCでの文字コードだと反映されました。…うーん。
>>720 なんで画像を使いたくないの?
ちゃんとALT入れとけば画像OFFでも問題ないし、
文字主体の画像なんてたいしたサイズにもならないはず。
>>722 filterと画像ではやっぱり画像の方がいいですかね。
今、strictでクリアできていないのがそれだけなんです。
妙なこだわりですよね。タイトルも文字だけにしたい、って。
有難う御座いました。検討してみます。
725 :
Name_Not_Found :02/12/19 13:38 ID:y6RQ+veC
SVGのことか?
>724 >725 む、無理です。こんな複雑なものを作ろうとしたら頭パンクします。
>>727 CSSで背景指定とかではダメなの?画像自体が使いたくないのか…。
で、質問。
5文字目とか指定文字数で自動的に改行っていうのって出来ますか?
印刷だと出来るんだけど、WEBだと無理なのかな?
729 :
Name_Not_Found :02/12/19 15:07 ID:ayAui0YY
>>728 ブロック要素に幅を5emで指定してその中に文字列を入れれば当然5文字で改行されるがそう言う意味ではないのか?
>>729 >1読め。お前に一からCSSを教えるスレではない。
>>730 プローポーショナルフォントだとアウトなので、
br を挿入するしか無い。
等幅フォントを指定
733 :
731 :02/12/19 16:00 ID:???
×プローポーショナル ○プロポーショナル 我ながらアホだった...。
ところでOpera 7のβ2が出たようですが、使ってみた方いらっしゃいます?
font-size:100% 継承のバグとかも直ってたよ。
738 :
Name_Not_Found :02/12/19 20:43 ID:QmxeEOz5
フレーム使った時のように ページ内の或る特定のボックス内にだけ更新をかけて 1ページ、2ページ、、、といった風にやりたいんですが そういうのって、CSSで可能ですか?
739 :
Name_Not_Found :02/12/19 21:06 ID:+MLWuQZe
<img src="01.jpg" width="200" height="200" style="float:left"><p>文字列ABC</p> <hr style="clear:left"> <img src="02.jpg" width="200" height="200" style="float:left"><p>文字列ABC</p> ↑の記述ではWinNN7に於いてhrのclearが働いてくれません。(IEやOperaではclearが働きます) どうすれば期待の効果を得られるでしょうか?
741 :
739 :02/12/19 21:34 ID:???
ズバリそれっぽいです。
DOCTYPE宣言を<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "
http://www.w3.org/TR/html4/loose.dtd ">
に変えるとhrのclearが正常に働きました。
バグなんですね、hr以外の要素でのclear指定で代用できるよう検討してみます
CSSで画像を固定すると、文章や画像はその上を通過していくんですが、 逆に、文章や画像が下を通過していく、つまり、くぐっていくという風な やり方はあるのでしょうか?ご指導のほど、よろしくお願いします。
743 :
Name_Not_Found :02/12/19 22:03 ID:opCI5foX
>>742 positionとz-indexプロパティを応用しなさい。
詳しくは
>>4 。
744 :
742 :02/12/19 22:08 ID:???
>>743 ありがとうございます。五里霧中の状態だったので、助かりました。
あとは全部自分で調べてみます。
>>727 SVGは、Illustrator9以降とかのドローツールで書き出すものだと思った方がいいと思う。
>721 ええと,>718の例にはOsakaもあるよ.で,こっちではちゃんと変わるように見える. さらにやってみた. <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <style type="text/css"> * {font-style: normal; font-weight: bold; font-size: 100%;} p {font-family: "MS Pゴシック";} .osaka {font-family: Osaka;} </style> <p>日本語を入れてテスト.</p> <p>日本語を入れて<em class="osaka">テスト</em>.</p> ちゃんと変わるけどなあ.charset=shift_jisにしても同じように変化して見えるよ. CSSが外部ファイルで,HTMLとCSSが違う文字コードで書かれてて, CSSの先頭で@charsetを指定していない,っていうありがちな話ではなく? shift_jisやeucでは変わるっていうから違うんだろうけど.
>>746 私も試してみました。Osakaは確認。ちゃんと反映されていました。
ただ、Century Gothicは反映されず。このフォントってWindows2kに標準で入っている?
私自身では入れた覚えがないから、入っていると思うんだけど。Centuryっての。
どうもUA自身のバグってわけじゃなさそうです。
>747 的はずれなこと言ってたらスマン。 'Century' と 'Century Gothic' は全く別のフォントだよ。
>>736 Opera7β2
tfootは直ってるね。でもCSSは前よりひどくなっているような・・・
list-style-imageとマーカーが一緒に表示されてる!?
ほかにもちょくちょくと・・
750 :
749 :02/12/20 22:34 ID:???
補足 tableまわりのCSSがひどくないか?
マーカーのバグはβ1の時にはなかったよな。 何をやっとるんだ。
752 :
Name_Not_Found :02/12/21 14:57 ID:UlILeLwX
floatについて質問させてください。 <div style="border:1px blue solid;"> <img src="./hogehoge.jpg" width="100" height="100" alt="test" style="float:right;"> 〜〜〜〜〜<br> ここにいろいろ文章をかく。<br> 〜〜〜〜〜 <br clear=all> </div> のようにすると画像が枠からはみ出してしまいます。 テキストが画像の高さ以上に長くなるように 改行をたくさん挿入すれば綺麗に収まって表示されますが 他にBOXの中に画像を納めて、かつ テキストを左へ回りこませる方法はないでしょうか?
ボックス要素にheight指定
754 :
Name_Not_Found :02/12/21 15:06 ID:GUXvpypM
755 :
752 :02/12/21 15:18 ID:UlILeLwX
ありがとうございます。 <div style="border:1px blue solid;width:100%"> で解決しました。
お節介かもしれんが、
インライン・スタイルシートや<br>の多用は好ましくないぞ。
>>752
brはともかくインラインは例示しやすいように書いただけだろ・・・
その内気付くときが来るさ
>>749 マーカーはベータ故のちょっとしたミスだろう
それよりbox-sizingに対応したようだ
これはかなり助かる
なくなる仕様っぽいのにねえ。
<ul> <li>あ</li><li>い</li><li>う</li> </ul> ul li {border-right:1px solid #000000;} にして、文字の間に線を表示させたいのですが、 うの右には線を表示させたくありません。 この場合はどうすればいいですか?
>>761 言ってることとソースがかみ合ってない気がするんだが…
floatとかdisplayを指定してるもんだと思って答えるけど、
border-leftにして、最初のliのborderをfirst-childを使って消す。
IEは多分対応してない。
763 :
762 :02/12/22 11:28 ID:???
当然わかってるもんだと思って端折ってしまったけど一応。 IEならclassで指定。
764 :
761 :02/12/22 11:52 ID:???
ul li {display:inline;} が抜けていました。
765 :
761 :02/12/22 20:36 ID:???
クラス名にアンダーバーを使用することが出来ますか?
767 :
Name_Not_Found :02/12/22 20:43 ID:yC2zEx9z
すいません、ウィンドウの左下に画像をぴったりくっつけたいんで、 テーブルを縦横100%にしてtdのalign属性で左、下に設定すると上手くいきました。 しかし、yahooの無料スペースに上げると一番上に勝手にテーブルの中に入った 広告がついてしまい、自分で作ったテーブルの縦横100%指定が矛盾をきたして、 スクロールバーが出現して下に画像が隠れてしまいます。なので cssでやろうと .test { position: absolute; right: 0px; bottom: 100px; left: 0px; } みたいにしたのですが同じ結果になってしまいます。 何かいい方法があればよろしくお願いします。
768 :
767 :02/12/22 21:02 ID:yC2zEx9z
すいません、できmした
>765 普通に .className{text-decoration:underline} ってするだけでしょ。 Opera7 β2 div:first-line{text-decoration: 値 } <div> テキスト沢山 テキスト沢山 テキスト沢山 </div> :first-lineを使った時、text-decorationが次行以降にも効いてしまうことがある。 font-sizeとかでも試したけど、他のプロパティではそういう症状はでなかった。 なんかスクロールしてるうちにアンダーラインが出たり消えたりするんだよね。 うざぃ(; ´Д`)
>>769 .nanashi_san{text-decoration:underline}
こういう意味じゃないの?
>>765 使えないことも無いが、正しい記述じゃない、はず。
逆だろ 正しい記述だけど使えないこともある
>>771 そうなん?
行番号: 1 コンテキスト : .nanashi
文法解析エラーが発生しました - nanashi_san{text-decoration:underline}
ダメだと思ってた。
775 :
Name_Not_Found :02/12/23 03:05 ID:8FR3mwMQ
何%以上とか何px以上とかって指定できたっけ?
width/heightの話なら、min-width/min-heightがそれにあたります。
777 :
Name_Not_Found :02/12/23 04:22 ID:HHShCO9E
スタイルの一部を変数(というかデータ領域)として使うのは邪道ですか?
Opera6だと@importが無効になるんですが?
>778 それは前に俺もなった。けど条件がわからない。 その時は何故か鯖上では動いて、ローカルでは動かないという症状だったな。
780 :
Name_Not_Found :02/12/23 15:40 ID:M9y91tM/
>780 いや、それじゃないな。 main.cssが @import url("sub.css"); p{color:red} sub.cssが p{font-weight:bold} の時、ローカル環境ではsub.cssが無効になるという症状だった。 今もう一度試したけど再現できた。ver.7β2では直ってる模様。
テーブルごとに中に書いたリンクの色を変えたいのですが、 これってスタイルシートでできますか?。
>>783 テーブルごとにクラス指定して
table.hoge1 a{color:#******;}
table.hoge2 a{color:#******;}
table.hoge3 a{color:#******;}
・・・・
aはa:hoverとかa:visitedとかで もちろんOK
785 :
778 :02/12/23 22:29 ID:???
エディタでcssファイルをUTF-8で保存してて、上の症状になったんだけど、 それをShift_JISにして保存したらちゃんと表示されるようになりました・・・。
IDや、class名の最初に数字を使ってはいけないのはなぜですか?
クラスとIDは、どのように使い分けるんでしょうか?
(´-`).。oO(ここって【CSS、スタイルシート初心者質問スレッド】だっけ?
>>788 このスレッドでも既出です。質問は検索してから。
>>789 初心者から熟練まで、CSSのことなら何でも受けつけて居ります。
>>791 >
>>789 初心者から熟練まで、CSSのことなら何でも受けつけて居ります。
そのスタンスはよいかもしれないが、あんな質問で埋め尽くされるのも辛いなあ。
>>792 かといって初心者用だけスレッドを分離独立させるほどの需要は無いし。
>>793 いや、
>>1 嫁でいいんじゃねえ?
それでわかんねえ香具師に教えるのは無理だろ。
796 :
Name_Not_Found :02/12/24 15:55 ID:PngFLr3v
質問です。 <STYLE type=text/css> <!-- BODY { MARGIN: 0px ;} --> </STYLE> ↑ので隙間が無くなって、左上にピッタリくっついた状態から編集できますが、上の隙間を0にして、少し右にずらしたいんです。 そういう場合は、どうしたらいいのでしょうか?
>>796 marginやpaddingは四辺一括指定ばかりにあらず。
左辺だけや上辺だけに対して指定できます。
初歩なので
>>4 を見て下さい。
>>796 body {
margin:上 右 下 左;
}
上右下左を適当な数字に変えてみ
801 :
796 :02/12/24 16:10 ID:PngFLr3v
ウヒョーこのスレの人優しい! 有難う御座いました。
802 :
_ :02/12/24 16:15 ID:h4LI5rER
簡単な質問には皆で答えるのね
みんなとか言いつつ答えてるのは一人か二人な罠。
806 :
796 :02/12/24 16:21 ID:PngFLr3v
<STYLE type=text/css> <!-- BODY { MARGIN: 0px ;} --> </STYLE> <STYLE type=text/css> <!-- BODY { margin-left: 10px ;} --> </STYLE> これでOK?だよね? 一応出来たんだけど、一つにまとめられないのかな・・・
>>806 <STYLE type=text/css>
<!--
BODY {
MARGIN: 0px;
margin-left: 10px;
}
-->
</STYLE>
body {margin: 0 0 0 10px;}
>>807 それだと margin-left 再定義になってしまうよ。
811 :
807 :02/12/24 16:31 ID:???
812 :
809 :02/12/24 16:31 ID:???
813 :
807 :02/12/24 16:33 ID:???
814 :
796 :02/12/24 17:23 ID:PngFLr3v
ウヒョー
皆さん。ごめんなさい。
>>809 同士の通りにしたら、出来ました。
有難う御座います。
>796 答えだけ教えてもらって終わらずに、どういうしくみになっているかの勉強もぜひしてネ。 もっといろいろ見栄えをコントロールできることがわかって楽しくなるハズ
まったくだ。
>>816 (だけどリンク先まで示されても読まない者には言っても無駄なのかな)
818 :
Name_Not_Found :02/12/24 18:54 ID:hlp4o2gL
質問があるんだけどさ、 2chのような掲示板ってさ、 掲示板のところでさ、右クリックしてさ、 ソースの表示ってところでさ、 ソースパクってそれをホムペ作成ソフトで作ったら ちゃんと動作するのですかぁ?
>>818 無理、つーか激しくスレ違い。HTMLとかCGIを1から勉強してください。
ネタのつもりだろうがこういうスレでやられると激しくウザい
821 :
Name_Not_Found :02/12/24 19:01 ID:hlp4o2gL
本当に分からんから言ってるのさ。
>818 はマルチ
P { line-height: 150%;} .note { font-size: 75%;} ----- <p>hoge hoge hoge hoge</p> <p><span class="note">hige hige hige</p> としたときに、最初の段落と2番目の段落の行の絶対的な高さが同じで、 2番目の段落が凄く間延びしちゃうのですが、
825 :
Name_Not_Found :02/12/24 20:47 ID:am8Iz6XV
>>824 line-heightは単位なしで指定する方がよい。line-height:1.5;とかね。
これ既出。
あと、閉ぢタグ</span>を忘れてませんか。
>line-heightは単位なしで指定する方がよい。 こんなこと何処に書いてあるんだ?
>>826 別に仕様とかには書かれてないと思うけど、単位無しの数値指定の方が何かと便利だというのは
自分は「スタイルシートWebデザイン」で教え込まれたな。
828 :
826 :02/12/25 04:45 ID:???
P120に書いてあるね。マジメに勉強になったなぁ。 どうもありがとう。
>>827-828 いや、line-height以外のプロパティでは単位は必須ですよ。ご承知かもしれんが。
単位無しで済むのは数値が0の場合のみ。
>多くの場合継承には算出値が用いられるが、中には指定値を継承するプロパティもある。 >たとえば'line-height'プロパティに実数値を設定すると親要素の指定値が継承される。
832 :
826 :02/12/25 15:02 ID:???
>>830 ということは、emだとか%で指定している場合でも、
重なる場合が有るって事?
%で指定していると、何かとバグがあるのはバグスレで見掛けた
(とはいえ最新版は直っているらしい) ので、
普段はem (IE3でのバグは無視) で指定しているのだけれど。
>>832 emや%の場合は「line-heightを指定した要素のfont-size」
に対する比率でline-heightが決まる
だから小要素で
em { font-size: 200%; }
とかしてあると、そこだけ行間が狭くなる or 重なってしまう
単位なしなら最も大きな文字に対する比率でレンダリングしてくれる
835 :
826 :02/12/25 15:28 ID:???
>>833 ああ、嘘ついてました。mozillaの方だけを見てました。
とはいえ、XHTMLを使っているので、
標準モードの動作は興味無いんだとか言い訳してみる。
836 :
エノキ :02/12/25 15:33 ID:???
言い訳は聞きたくなーい! エノキ、ボンバイエ
strictな人は、新しいウィンドウで開くリンクは絶対設定しませんか?
スレ違い
select のスクロールバァはCSSで色の変更できたっけ?
スレ違い
841 :
839 :02/12/25 16:18 ID:???
>>839 できない。textareaならIEの独自拡張でできる。
844 :
Name_Not_Found :02/12/25 20:09 ID:lATIVZvW
質問です これまでテーブルで外枠作ってたんですけどCSSにチャレンジ中です。 中央に寄せるのにMacだと以下の通りでできたんですが ウィンではなんだか左に寄っているという指摘を友人より受けました。 ディスプレイの解像度がまちまちなのでマージンを数値で 設定することもできずにいます。 お知恵を拝借したくてきました。 お願いします。 .sotowaku { background: black; margin-top: 10px; margin-right: auto; margin-left: auto; border: none 0px; width: 720px }
846 :
844 :02/12/25 21:32 ID:7XlJsILW
すいません
MacIE5.22と5.16では中央に配置されたのですがwinのIE6では左に
配置されてしまうのです。
>>5 を見てみたのですがどうもよく分かりません
MacIEだとこんな感じ↓
背景画像背景画像背景画像背景画像背景画像背景画像背景画像
背景画像 背景画像
背景画像 背景画像
背景画像 背景画像
背景画像 背景画像
背景画像 背景画像
背景画像背景画像背景画像背景画像背景画像背景画像背景画像
でもwinIE6だと
背景画像背景画像背景画像背景画像背景画像背景画像背景画像
背景 背景画像背景
背景 背景画像背景
背景 背景画像背景
背景 背景画像背景
背景画像背景画像背景画像背景画像背景画像背景画像背景画像
848 :
844 :02/12/25 22:08 ID:bgzKYKud
ご丁寧にリンク先をご紹介いただきありがとうございます。 これからはいろんなところで調べてから、この程度の質問で こちらのお世話にならないように勉強していきたいと思います。
849 :
Name_Not_Found :02/12/26 02:27 ID:nIVdlmRJ
外部スタイルシートを読み込むようにすると リンクをクリックすると背景色が変化するJavaScriptが無効になってしまいます。 JavaScriptを有効(優先)する方法はありますでしょうか? 外部CSSにJavaScriptを埋め込まないとだめなのでしょうか?(そんな方法あったっけ?) <html> <head> <SCRIPT LANGUAGE="JavaScript"> <!-- function bgchange(colorCode){ document.bgColor=colorCode; } //--> </SCRIPT> <link rel="stylesheet" type="text/css" href="test.css"> <title>サンプル</title> </hrad> <body> <table border="1" cellspacing="1" cellpadding="1"> <tr> <th><font size="-2">背景の色を変えてみよう</font></th> </tr> <tr> <td bgcolor="#ffffff"><a href="#" onclick="javascript:bgchange('#ffffff');return false">□</a></td> <td bgcolor="#808080"><a href="#" onclick="javascript:bgchange('#808080');return false">□</a></td> </tr> </table> </body> </html>
850 :
849 :02/12/26 02:34 ID:???
ちなみにこのソースを外すとJavaScriptはIE・NNとも正常に動作します。 (Operaは駄目でした) <link rel="stylesheet" type="text/css" href="test.css">
>>849 document.body.style.backgroundColor=colorCode;
ではいかがか
</hrad>だしなぁ
ヘラッド
>>849 CSSで指定したbackground-colorをJavaScriptで制御したいと言う事か?
貴方が書いてるJavaScriptはbodyのbgcolor属性を制御しているだけだから当然そのままじゃ無理だよ
CSSスレと言うよりJavaScriptスレの範疇だとは思うが。
BODYにID振ってそこからかなぁー
856 :
849 :02/12/26 17:50 ID:???
質問に答えていただきありがとうございます。
>>853-854 ヘラッドはヘッドの間違いです(笑)。
>>852 の方法ではうまくいきませんでした。
>>855 ボディーにIDを振るとはどういうことなのでしょうか?
出来ればソースをどう変えれば良いのか指摘してもらうとありがたいです。
>>851 を読んでみてもう少し自分でも調べてみます。
857 :
849 :02/12/26 17:58 ID:???
ちなみに外部CSSの「test.css」のソースはこんな感じです。 body { color :#00007f; font-family :'MS ゴシック'; font-size :16pt; font-weight :normal; font-style :normal; } a:link { color :#696969; text-decoration : none; } a:visited { color :#0000ff; } a:hover { color :#008000; }
うちでは
>>852 ので動いた。
ブラウザのバージョンとtest.cssの内容はどうなん?
859 :
849 :02/12/26 18:16 ID:???
動作確認環境は Opera6.05 IE6.0 NS7.01 の3つです。 OperaはスタイルシートがあろうがなかろうがJavaScriptによる 背景色のチェンジは不可能でした。
こっちでは body { background-color: red; } をtest.css に指定した場合 IE6 Mozilla1.2.1 document.body.style.backgroundColor=colorCode; に変更すれば色変更可能。 Opera6.03 document.body.style.backgroundColor=colorCode; に変更すれば色変更可能。ただし背景全体じゃなくてbodyの領域のみ NN4.7 そのまま動作。 って感じだった。background-colorを指定しない場合Opera以外はそのまま動作。 Operaはdocument.body.style.backgroundColor=colorCode; に変更すれば色変更可能。 こんな感じだった。 あと onclick="bgchange('#ffffff')" で十分。
861 :
849 :02/12/26 23:35 ID:???
質問に答えてくださった方ありがとうございました。 もしかしたら単なるタグミスかもしれないので うまくいかないのかもしれません。 タグをもう一度チェックしてみます。 </hrad>というミス(笑)もあったくらいだし・・・(完全手書きなもので) とにかくありがとうございました。
862 :
Name_Not_Found :02/12/27 07:06 ID:UXk83hmX
質問です。 hoge { background-image : url(../pic/hoge.gif); height : 50px; widht : 100px; } <div class="hoge>menu</div> とやった場合、menuの部分の背景画像が IE6だとちゃんと表示されるのですが NN7だとかすれてしまったり、 スクロールさせると消えてしまったりします。 NN7でもきちんと表示されるようにするには どうすべきなのでしょうか?
>>862 background-repeatとかbackground-positionとかbackground-attachmentとか色々指定しる!
ついでにbackgroundで一括指定しる!
それとwidthですよコノヤロウ!
866 :
Name_Not_Found :02/12/27 16:20 ID:xAIbQjGo
<div style=" background-image:url(img.jpg); background-attachment:fixed; overflow:scroll; height:150px; ">ほげほげ・・・・</div> と指定してスクロールしても背景が動かないように したのですが、ネスケ7だとページ全体のスクロールでも fixedされてしまいます。IEのようにするにはどうすればいいですか?
869 :
866 :02/12/27 18:02 ID:???
>>868 ありがとうございます。
IEがおかしいんですか。個人的にはネスケ7みたいな固定の仕方は余計なお世話な
気がするんですが・・・何に使うんでしょうか・・・。
>>867 ページのスクロールではなくて、divのスクロールに対しての固定です。
870 :
862 :02/12/27 18:06 ID:UXk83hmX
>863-864 どうもありがとうございます。 でも"widht"はカキコ時のミスなので 原因はそれじゃないみたい。 いろいろいじってみたのですが、直りません……。 background-attachmentは scrollでは変わらず、fixedでは悪化。 background-position を指定しても変わりませんでした。 現状は以下の通り。 .label{ position: absolute; width: 154px; height: 88px; background-repeat: no-repeat; color : #ffffef; font-size : 16pt; visibility: visible; padding : 3px 0px 0px 88px;} #lblhome{ background-image : url(../pic/home.gif); top: 170px; left : 55px;} <div class="label" id="lblhome"><a href="index.html">Home</a></div> で、相変わらずかすれてしまうんです。>NN7 黒っぽい背景画像(それぞれ違う)の上に 白文字で HOME LINK MAIL とかやりたかったんだけど……。
>>870 CSSでなくて画像に問題があるって可能性は無いのかね。
あと、positionの指定の仕方が何だか怪しげ。
かすれるの意味が解らんし もうちょっと具体的に言ってくれ
874 :
862 :02/12/27 21:44 ID:???
>>872 ありがとうございました。
透過gifをやめたらNN7でもちゃんと表示されました。
>>873 すみません。
かすれる、というのは画像にフィルタがかかった様な
白い膜がかぶさる状態のことです。
スクロールをくりかえすと消えたり、表示されたり。
リンクの文が途中で改行されてしまうのを防ぐにはどうすればいいのでしょうか?
画面の折り返しだと思う。 <nobr><a href="http://2ch.net/">2ch</a></nobr>みたいなことがしたいんだろう。 white-spaceでできた木が。
white-spaceはIE5で使えないよ
ども申しわけないです あいう かきく さしす こんな感じで横にリンクを並べた際 あいう かきく さし す こんな感じに中途半端に改行されてしまうんですが これを防ぎたいんです
881 :
Name_Not_Found :02/12/28 19:56 ID:MPXxQ22i
a {white-space: nowrap} でもこれだと <a name="fubar">foo bar</a> も改行されません。
指定する相手を間違っている
883 :
Name_Not_Found :02/12/28 21:33 ID:k88/XKVX
スタイルシートで <table>や<HR>などでalign=leftを直接指定するような 構文ってどのようにすればいいのでしょうか?
884 :
883 :02/12/28 21:35 ID:k88/XKVX
あぁ、、、text-align:left;でしたね。 すいません、事故解決しますた。
887 :
Name_Not_Found :02/12/29 22:45 ID:eQRD2PBZ
a 要素に accesskey が設定してあることを ヴィジュアル系 UA を使っているユーザに知らせるために a:after { content:' (' attr(accesskey) ') ' } とすると、 accesskey が設定されていない a 要素は、 要素の後に空カッコが表示されてしまいます。 HTML ソース <a href="bar" accesskey="f">foo</a><br /> <a href="bar">foo</a> 上記 HTML を Mozilla などの UA でレンダリングさせたところ foo (f) foo () かといって以下のように CSS を記述すると、 Mozilla などでは要素の直後に accesskey の値が出現してしまい、 直前の単語とつながっているように見えてしまいます。 a:after { content:attr(accesskey) } accesskey が設定されていないときに カッコを表示させないようにするためには どのようにすればいいのでしょうか ?
888 :
Name_Not_Found :02/12/29 23:29 ID:/+maAnUR
ちょっと質問の意味を取り違えてるかもしれないが…、 accesskey属性を持ったアンカーのみに適用、なら下のでいけるんと違うか。試してないけど。 a[accesskey]:after{ 〜 } てゆうか、 >要素の直後に accesskey の値が出現 は仕様通りの動作だと思うが。
>>887 a:after{ content: " attr(accesskey) "; }
これで間にスペースでない?
こんなんじゃダメ?
(ヴィジュアル系 UA持ってないから確認できん)
>>889 a[accesskey]:after{ content: " " attr(accesskey) ; }
じゃないか?
891 :
887 :02/12/30 00:15 ID:r2xwmRc1
>>888 ありがとう。うまくいきました。
> >要素の直後に accesskey の値が出現
> は仕様通りの動作だと思うが
>>887 の文章表現が稚拙でした。
a 要素直後に accesskey の値が出現してしまうと都合が悪いということが伝えたかったのです。
>>889 >>890 ありがとう。でも追加した空白にも
UA がつける underline がついてしまいました。
a[accesskey]:after {
content:content: " " attr(accesskey);
text-decoration:none
}
としても追加された空白の underline は除去できませんでした。
Mozilla で確認していますが、 Mozilla の挙動が正しいとも限りませんけど。
>としても追加された空白の underline は除去できませんでした。 >Mozilla で確認していますが、 Mozilla の挙動が正しいとも限りませんけど。 空白類『文字』なんだから underline が付いて当たり前じゃボケェ。 そんなに underline を消したいんだったら、 margin-left を指定すればいいだろう。頭悪過ぎ。 a[accesskey]:after { content: attr(accesskey); margin-left: .5em; }
怒りすぎで0が抜けてますね
>>896 試してみやげりますから怒らないでください
>>897 エラー及び警告は見つかりませんでした。
ってでたよ。さすが896だね。
妙にマータリしてるな
年越しですから
902 :
887 :02/12/30 23:47 ID:r2xwmRc1
質問ばかりで恐縮です。
ブロック要素の前 (上) に表示させた画像を
真ん中によせる方法はありますか ?
div:before {
content:url(/img/foo.png);
text-align:center
}
だと Mozilla では真ん中には来ませんでした。
div:before {
content:url(/img/foo.png);
margin-left:auto;
margin-right:auto
}
でも結果は変わりませんでした。
P.S.
>>892 " " (0x20) は .5em とはかぎりませんよね ?
ここのところは pending とさせていただきました。
903 :
Name_Not_Found :02/12/31 00:03 ID:/0E244so
CSSってどうやって切るんですか?
>>902 セレクターをdiv:beforeではなく単なるdivにしてmargin:0 auto;ではダメ?
906 :
902 :02/12/31 00:10 ID:zy94SfLs
>>904 表示させる画像は装飾で、コンテンツではないので
できれば HTML の中には書きたくないのです。
ってそういうことではないのでしょうか ?
907 :
904 :02/12/31 00:12 ID:???
div {margin:0 auto;} div:before { content:url(/img/foo.png); }
908 :
902 :02/12/31 00:22 ID:???
>>907 たびたびありがとうございます。
CSS 的には正しいのかもしれませんけど、
手持ちの UA では期待通りにレンダリングしてくれる
ものはありませんでした。
margin: auto を正しくレンダリングしてくれる UA ってあるのでしょうか ?
909 :
904 :02/12/31 00:29 ID:???
ごめん、間違った。 ブロックレベル要素センタリングさせるには左右marginをautoにするだけでなく、 ブロックレベル要素に幅(width)も指定しないとだね。
910 :
902 :02/12/31 00:34 ID:???
>>909 あ、そうか。いわれたことを試すだけで思考停止していました。
試してみます。挿入する画像のほうの width は画像の幅のピクセル数ですかね。
911 :
902 :02/12/31 00:52 ID:???
だめでしたー :'(
質問者も回答者も馬鹿ばっかりだなぁ。 みんな良く頭使えよぉー。
>>912 されば是非とも蒙を啓かれたく、ご示教賜らんことを。
これでどうだ。
div:before {
content: url(/img/foo.png);
margin: 0 auto;
width: 50%; /* 適当な幅 */
display: block;
}
>>3 仕様書は読んでおきましょう。
> 非置換インライン要素の場合(Inline, non-replaced elements)
> 'width'プロパティは効果を持たない。'left'、'right'、'margin-left'、'margin-right'の指定値が'auto'ならば、その算出値は'0'になる。
> 置換インライン要素の場合(Inline, replaced elements)
> 'left'、'right'、'margin-left'、'margin-right'の指定値が'auto'ならば、その算出値は'0'になる。'width'の指定値が'auto'ならば、その算出値は内在寸法と同じになる。
> 通常フローの非置換ブロック要素の場合
> 'margin-left'と'margin-right'の指定値が両方とも'auto'ならば、両者の算出値は等しくなる。
> 通常フローの置換ブロック要素の場合
> 両側のマージンの指定値が'auto'ならば、両者の算出値は等しくなる。
【CSS2勧告邦訳 10. 視覚整形モデル詳細】より
915 :
902 :02/12/31 01:29 ID:???
>>914 カンペキです。長々とお付き合いありがとうございました。
>display: block;
これがキモみたいですね。
916 :
Name_Not_Found :02/12/31 08:25 ID:bQhPsdjJ
CSSで表示させてる特定の画像に 特定のURLにLINKする事ってできるんですか?
918 :
Name_Not_Found :02/12/31 08:36 ID:bQhPsdjJ
thx
919 :
Name_Not_Found :02/12/31 10:18 ID:WaMA1Xro
CCSとはカードキャプターさくらの略ですか?
>>919 そうだよ。そのスレにきてまでなにうつつヌカしてんだ?
次スレッドにFAQの追加は無いかね?
923 :
Name_Not_Found :02/12/31 15:53 ID:j1D5VkcV
色を変える目的でリンクの下線にborder-bottomを代用したんですけど、下線と文字の距離が1px程度空いてしまいます。 padding-bottomでもmargin-bottomでも解決できないんですが、どうしたらいいですか?
924 :
Name_Not_Found :02/12/31 16:02 ID:hhfMGFkO
>>923 background-imageでリンクの文字の下に線の画像を指定するとか。
できるかどうかは知らない。
ウィンドウの右側でテキストが改行されるのを防ぐにはどうすれば良いですか?
>>929 こんな面倒くさい事しなくてもいいかもしれないけど、
ブロック要素かテーブルとかを横100%にして内容を囲んで、
それの横幅を固定すればいいと思う(table-layoutとか)。
新年早々ネタニマジレス
>>929 white-space:nowrap;
ウィンドウ全体に横スクロールバーはウザイので
white-space:nowrap;した要素は
display:block;にして、適当なwidthを指定して、overflow:auto;でもしる。
933 :
目のつけ所が名無しさん :03/01/01 07:48 ID:GQQ2nx/2
私で933getか〜。 有効な発言って200くらいってとこか?
935 :
Name_Not_Found :03/01/02 01:39 ID:aA27Qsjf
text-decorationでunderlineを指定した時、 テキストとアンダーラインの色を異なる色にするってことは可能でしょうか? たとえば、テキスト文字が黒でアンダーラインが赤ってことです。 結構単純なことだから、出来そうだとは思うんですが、 そういう記述を探してみても見つかりません…。 これは不可能ってことなのでしょうか?
937 :
935 :03/01/02 02:01 ID:aA27Qsjf
>>936 そうですか…。
ありがとうございました。
>>935 border-bottomで代用したらダメ?
>>935 p {text-decoration:underline; color:#f00;}
span {color:#000;}
<p><span>hogehoge</span></p>
IE4だと同じ色だけどIE5以降やMozillaなら別の色になる。
無難にborder-bottomを使った方がいい。
>>935 わからないことがあったら、とりあえず仕様書読め。
>テキスト装飾に必要な色は'color'プロパティ値と同じにすべきである。
>このプロパティは継承を行わない。しかし当該ブロックの子孫部に当たるボックスは、すべて同じ装飾を施されるべきである(たとえばすべて下線を施されるべきである)。
>またその時、子孫部の要素が'color'プロパティに異なる値を持っていても装飾の色は同じにすべきである。
【CSS2勧告邦訳 16.3.1 線を引く、点滅させる】より
941 :
935 :03/01/02 02:13 ID:aA27Qsjf
942 :
Name_Not_Found :03/01/02 02:20 ID:eeQmZZEi
>>941 > つまりテーブルを使えってことですね。<そうじゃないだろうっ
も う だ め ぽ
段組でググれ 以上
イケてるサイトスレで見たんだけど <hr />って何でつか
>>949 それは CSS 関連のものではない。
xhtml での水平罫線描画タグ。
タグは描画するためのものではない、と突っ込んでみる
ここでブチっと区切るってことを意味するタグだと思ってた>hr それでブラウザでは横線が表示されるんだと思ってた。
>>952 Horizontal Rule(水平方向の罫線)の意味
いい加減スレ違いだけどな。
水平線をマークアップするのでつ。スレ違いなのでこの話題はここまで。
955 :
954 :03/01/03 19:20 ID:???
スマソかぶった
956 :
953 :03/01/03 19:24 ID:???
957 :
949 :03/01/03 20:38 ID:???
ありがとうございました
次スレを……
961 :
Name_Not_Found :03/01/04 01:53 ID:VZCtEMRN
body に style="margin: 0px:" を指定しても IEではマージンがなくなるんですが、NNだとマージンができてしまいます。 なんかいい方法無いでしょうか?
>>961 Pとかにもつけないとダメじゃなかったっけかな。
BODYにつけてるのん継承されなかった気がする。
>>961 NS4.x だと body には効きません。
>>961 marginだけでなく、paddingも0にしても駄目かい?
ところで誰か次スレッド立てて。(私のプロバイダはスレッド立て禁止されてるんで)
じゃあ漏れがやっとくよ 色々直すからちょと待て
テンプレの1結構長いから、もう少しスキーリさせようよ。
つーことで、15で使えるのよろ
>>970
埋め
━━Cascading Ctyle Sheets質問スレ道場訓━━ 一、礼節を重んじ常に努力精進すること 一、UAのバグに打ち勝つ精神力を持つこと 一、心身の優れたHTML+CSSを学ぶこと 一、雑草の如く生涯HTML+CSS貫くこと 一、感謝と反省を忘れないこと 以上 ━━━━━━━━━━━━━━━━━━━━━━ このスレに書き込むことが許されるものは以下のとおり ・CSS を記述するための最低限のHTMLを理解する者 ・レイアウトのための最低限のCSSを理解する者 ・CSSの意味を理解する者 ・ユーザーに迷惑となるCSSを書かない者 ・過去ログや関連資料を読むことができる者 ・「初心者です」を振りかざさず、質問を分かる日本語で説明できる者 ※ マターリ進行 推奨 奨励 ※
Cascading Style Sheetsの事で尋ねたいことがあったらこちらへどうぞ。
関連スレやリンクは
>>2-5 あたりに。
ルールを守れ。過去ログ読め。FAQ読め。仕様書読め。関連サイト読め。バグ辞典読め。・・・・・・・・
コレだけでもよくない(藁
>>971 ━━Cascading Ctyle Sheets質問スレ道場訓━━
どうでも良いけど、
CtyleのCって間違えてない?
埋め
埋め
生き埋め
埋め
埋め
埋め
埋め
埋め
埋め
埋め
埋め
埋め
埋め
埋め
埋め
埋め
埋め
埋め
埋め
梅
績め
埋め
夢...おやすみ
ひっそりと・・・素敵だ
千 昌男
1001 :
1001 :
Over 1000 Thread このスレッドは1000を超えました。 もう書けないので、新しいスレッドを立ててくださいです。。。