/* CSS、スタイルシート質問スレッド【14】 */
Cascading Style Sheetsの事で尋ねたいことがあったらこちらへどうぞ。
関連スレやリンクは
>>2-5あたりに。
■■■■■ 注意 ■■■■■
質問者 (特に「初心者」) は、
必ず
>>4にある解説サイト (かなりわかりやすい) で
勉 強 してください。
質問の前に、まず
>>5-6 の【FAQ】を参照してください。
【FAQ】でわからなかった場合は、過去ログを検索しましょう。
WinIEの場合は、[Ctrl+F]で検索できます。
また、IE などではまだ対応できていない要素などやバグが多数存在します。
ですので、
>>2(関連スレ)の「バグ辞典」に目を通しておきましょう。
また、「環境を書け」とか「ソースは?」と求められたときは
応じるようにしましょう。回答が早く返るようにするためです。
特にNetscapeについては、ヴァージョンについても必ず明記する
ようにしてください。ネスケは、4までと6以降でまったく別物です。
※ マターリ進行推奨 ※
>>2 【前スレ】【過去ログ】【関連スレ】
>>3 【仕様書】【CSS検証】
>>4 【解説など】
>>5-6 【FAQ】
スレ立て乙。これだけFAQが増えてくると、ジオかどこかに
スペース借りて載せた方がいいかもね。
11 :
Name_Not_Found:03/01/04 15:27 ID:1Osw1L4D
文字等を絶対値で指定するのは止めた方がよいと聞きましたがなぜですか?
13 :
11:03/01/04 15:53 ID:1Osw1L4D
じゃあ、相対的ではない値で〜に直しますわw
15 :
11:03/01/04 16:08 ID:1Osw1L4D
出力機器の画素の大きさに左右されるためでしたか・・・なるほど、ほかの環境で見ると違って見えるのは、そのためでしたか・・・
>>14 ありがとうございました。
環境によって、見る人によって最適なサイズはマチマチなの。
だから固定するのは良くないってことだろ。
>>14 便乗質問ですが、
ブラウザ側でのサイズ変更を無視するのと反映するのとはどうやってみわければいいですか?
19 :
17:03/01/04 17:08 ID:???
>>18 ごめんなさい。
ブラウザ側で、サイズ大、とかやってそれに応じてサイズが変わるサイズ指定、と
変わらないサイズ指定ってありますよね?
それを教えてほしかったんです。
smallとかだったら応じて変わりますよね。そういうやつです。
ようするに文字サイズの絶対指定と相対指定のやり方を教えろって言う事か
>>1読め
>>17 サイズ指定時の単位。
>>14のリンク先に書いてある。
ちなみにIE以外なら絶対指定でもブラウザ側でサイズ変更可能。
IEでも
「ツール→インターネットオプション→(全般タブ)→ユーザー補助→Webページで指定されたフォントサイズを使用しない」
とすれば固定文字のリサイズは可能。面倒だが。
てか、こんな良く使いそうな機能を分かり辛いところに置いているIEは糞。
>>23 乙。でもCSSスレ派生なんだし、もうちょいまともなHTMLで書いて欲すぃ。
>>21 >
>>14のリンク先に書いてある。
相対指定と相対単位は違うんじゃないの?
26 :
17:03/01/04 18:04 ID:???
>>20 1には見当たりませんでしたが、どれでしょうか?
>>17 お前は
>>1に書いてあるFAQ等への誘導が読めんのか?日本人じゃないのか?
>>25 相対単位って何だ
>>27 相対指定はブラウザ側のフォントサイズ指定に相対的に変わるやつだろ?
相対単位はディスプレイに対する相対なんじゃないの?
言葉遊びか
31 :
29:03/01/04 18:40 ID:???
>>30 じゃ、なくてだな。
pxは相対単位だけど、絶対指定なんじゃないの?って言ってるんじゃなくて尋ねてるんだよ。
どうなん?
cssにしてインポートにすれば、NNに適応しない、って出来ますが、
html自体にスタイルシート書いて、NNに適応しない、って方法ないですか?
また凄い事言うね
>30
>言葉遊びか
>33
>また凄い事言うね
独 り 言 は よ そ で や れ
落ち着けよ
float による段組の質問です。
divA〜I{
width:49%;
}
の際、
AB
AB
CB
CD
CD
CE
CE
CF
GF
GH
IH
わかりづらいかもしれませんが、アルファベット一つが height の一単位だとお考え下さい。
この場合、段落Cが一番縦に長いということになります。
このような組み方にするには、どのように float (+ clear ?) を指定すれば良いでしょうか。
>>37 左に配置したいボックスにfloat:left。
右に配置したいボックスにfloat:right。
>>39 試してみると分かりますけど、事はそう単純ではないようです。バグ(?)が出る出る
>>39さんの方法で駄目だとしたら、もうfloatでやるのは無理なんじゃないですか?
ページ最下方のリンク部に触れると――つまりhoverになった瞬間、
divAとBの上にぐばばばっとマージンが空いてしまうんです。
win2000 + IE6 と、win98+ IE5.0 で同じ症状を確認しました。
…別のスレッドに誘導されそうだな
>>37 ACGIをさらにDIVでくくる、というのは?
>>43 そうすると文章構造がおかしくなります。
ソースには上から順に ABCDEFGHI となっているわけで、
<div>ACGI</div><div>BDEFH</div> としなくてはならなくなってしまいますから。
>>44 差し支えない範囲でソースを晒してくれ。
>39の方法で当方のIE5とIE6では問題なく表示されている。
フロートだけではなく、他の部分との関係でおかしくなっていると思われ。
別段異常は見受けられないが。
やや重いくらいで。
なんと。
具体的に言いますと、「モチーフ(?)」の「スカルパゴタ」にカーソルを乗せた瞬間、
AとBにあたる「新着」と「Information」が、強制的に最上段の画像から3000pxばかり下に下がります。
その後、文字サイズを変えたりリロードする事によって一時的に直りますが、再び同じ事をすると…、といった感じです。
>>50 >NN 4.x は今すぐ窓から投げ捨てろ
気持ちはわかるけど、インポートにすればちゃんと見れるんじゃないの?
勿体無い気が。
>>50 セキュリティ面でも危ういことを知らない 4.xユーザーに、
「…このブラウザまずいのかなあ?」 と気づいてもらえればいいなと思って書いてる
と見せかけてただ単に NN4.x がうざいだけです。
IEを5.0 から 6 にアップデートしたら問題がなくなりました。IE5.0 の float のバグだったのでしょうか。
答えて頂いた方、ありがとうございました。
56 :
53:03/01/05 03:08 ID:???
>>55 俺宛だな。
まあ、俺もNN4.xにの人はバージョンアップしてほしいな、って思うけど、
俺の場合「NNに対応できない人」って思われたらイヤだなあ、と思う気持ちのほうが強いな。
>>56 NN4.x だけじゃなく IE5.0 とかも「バージョンアップして欲しいブラウザ」にカテゴライズされてはいるけれど、
それでもやっぱ NN4.x が最も嫌われているんだって事実を突きつけてやらないと、
低スペックでバージョンアップ出来ないユーザー以外は気づかないんじゃないかな。
とりあえず、スレ違いですね。
>>46 「 ruby はHTMLの要素ではありません」 なんてエラーを出すチェッカーに囚われるのもアレかもしれない。
>>57 rubyはIE独自拡張じゃなかったっけ?
スレ違いだが、XHTML.1.1でもルビ使わん方がいいぞ。
音声ブラウザで二重で読み上げられる。
rubyはacronymのように、MicrosoftがW3Cに対して仕様に加えるよう働きかけたもの。
将来、音声ブラウザが Ruby の読み上げに対応したら有益になる可能性もある。
つまり対応していない現状では使わない方が良い。
二重になる場合はスタイルシートで読ませないようにすればいいだけじゃん。
文意が破壊されるほどのもんじゃないからいいでしょ
>>66 ところがその対応も甘い。 音声ブラウザ使ってみれ。
>>67 もちろん駄目なんて言ってない。使いたければ使えばいいし、
使いたくなければ使わなければいい。
スレ違いなのでこの辺で勘弁。
floatで段組を作るのって、tableを使うのと同じで、基本的に反則だったりしますか?
>>70 見栄えをCSSに任せる、って事なんだから無問題。
というか、それが反則だったら「レイアウト自体反則」と言う事になりやしまいか?
rubyはspan titleでごまかせるけど、CSSの対応を考えると……だしな。
>>38 で紹介されてたけど、
「疑似フレーム」の部分ってなんでリストマーク表示されないの?
木になってソース見てみたけど、問題はなさそうだし。
>>75 それっぽいんだけど、その下は正常に表示されているし。
なんか不思議。
#Iこういうことが結構あるから困るんだよな
77 :
前スレ961:03/01/05 22:43 ID:F1oLaeOy
うっかり"margin:0px:"と指定していたのが原因でした。
首釣って逝ってきます。
>>78 それぞれの質問にIDがちゃんと振ってあっていいな。これなら参照し易い。
余計なお世話だけど、ddの下マージンかdtの上マージンをもう少し広めに
取った方が読みやすさが上がると思うよ。
_、_ グッジョブ!!
( ,_ノ` ) n
 ̄ \ ( E)
フ /ヽ ヽ_//
82 :
Name_Not_Found:03/01/06 22:36 ID:Qg9o+7IE
div二つをfloatを使って段組にして、さらにそれを大きなdivで囲って
┏大枠━━━━━━━━━━━━┓
┃┌段組1 ──┐┌段組2 ──┐┃
┃│ ││ │┃
┃│ ││ │┃
┃│ ││ │┃
┃│ ││ │┃
┃│ │└─────┘┃
┃│ │ ┃
┃│ │ ┃
┃└─────┘ ┃
┗━━━━━━━━━━━━━━┛
のように大枠を作りたいのですが、実際にやってみると、段組2のサイズに合わせて
┏大枠━━━━━━━━━━━━┓
┃┌段組1 ──┐┌段組2 ──┐┃
┃│ ││ │┃
┃│ ││ │┃
┃│ ││ │┃
┃│ ││ │┃
┃│ │└─────┘┃
┗┥ ┝━━━━━━━┛
│ │
└─────┘
の様になってしまうのですが、何か対策はありますか?
実にAAを使うのが上手い +10点
>>84-85 縦幅は色々変わるもんで……
自己解決しました。さらにこれを囲うdivを書いて
そいつにborderを指定したらなんとかなりました。
DIV厨…
段組2の次にhrでも追加して{ clear: left; visibility: hidden; }
スペースは大枠のpaddingで調整
div追加するよりはマシな程度だけど
IEなら大枠にwidth指定するだけで何故か解決
質問どっす。
borderをdottedの1pxにすると、たまに線が途切れたりするのですが、何ぞ対処法はあります?
あ、ブラウザはIE6です。
90 :
89:03/01/07 09:27 ID:???
うーん。
今色々まわってみたけれど、他所のサイトさまではいくらスクロールやサイズ変更しても
まったく途切れないんですよ。いいなあ丈夫だあ。
なんでうちだけ消されにゃあかんのー。
>>90 その他所さまのサイトのCSSを見て勉強すれば?
http://pc3.2ch.net/test/read.cgi/hp/991666454/683n 683 :Name_Not_Found :02/11/19 01:21 ID:???
【IE6】
http://cssbug.tripod.co.jp/detail/winie/b079.html フロートの後続フロー制御を設定したbr要素が親要素に包含されない
<div style="border:2px solid red;">
<div style="float:left; width:50px; height:50px; background:aqua;">Float</div>
<br style="clear:left;">
</div> ←ソース例にこのdivの閉ぢタグ、脱けてますよ
これへの対処法。
親divに値がauto以外のwidth(heightでなく)を指定してやるとなぜかうまく包含してくれる。
しかも<br style="clear:left;">は要らない。
ちなみにN6の場合、親divにposition:relative;を指定してやると
やはり<br style="clear:left;">無しにfloatさせた子要素まで包含する。
Opera6だけはどうしてもclearさせる要素が後続しないと包含してくれぬ。
94 :
Name_Not_Found:03/01/08 15:20 ID:j7KIjLbw
nowrapはcssでどう書けばいいんですか?
htmlだと
<td nowrap></td>
ですよね?
white-space: nowrap;
何度も同じ質問すんなよ。
そのくらいぐぐれ。
FAQですらないですよこの阿呆んだら
ということはFuckUですか?
堕ちていく、WEB制作板。ここに見たり
103 :
102:03/01/08 19:05 ID:???
CSSを記述する上でMac IEバグ対策とは具体的にどんな事をいうのですか。記述の方法も教えて下さい。
107 :
106:03/01/08 19:22 ID:???
被りますた。
109 :
104:03/01/08 22:55 ID:???
ありがとうございますた。
CSSでtableのcellspacingにあたるものってないですよね?
>>110 border-spacing
(border-collapse:separate;の場合のみ)
IEは実装されてなかったはず。
N6とOperaはOKだったかな。
112 :
Name_Not_Found:03/01/10 00:25 ID:PXWCmkOo
文脈セレクタで親要素に id を指定するのは不当ですか ?
elemA#id elemB や elemA#id > elemB としてもセレクタとして機能してくれるブラウザがないようです。
>112
p {color: black;}
p em {color: red;}
p#test em {color: blue;}
<p>normal <em>emphasize</em> normal</p>
<p id="test">normal <em>emphasize</em> normal</p>
ちゃんと効いてるように見えるけど?(IE6,Moz1.2.1)
114 :
112:03/01/10 00:42 ID:???
>>113 このソースだとちゃんと効きますね。
もうちょっと調べてみます。
ありがとうございました。
他のスレを見たのですがよくわからなかったので、
質問させて下さい。
OS X10.2.1 ブラウザIE5.2だとfont-family
だけ指定通りに表示できません。
Win IE5 だと表示できるのでバグなのかな?
ソース↓
<style type="text/css">
<!--
font.a{font-family:"MS Pゴシック,Osaka";font-size:15px; color:#333333;line-height:130%;}
font.b{font-family:"Times New Roman,Impact";font-size:15px; color:#cc0000;line-height:190%;}
font.c{font-family:"Arial,Verdana";font-size:15px; color:#0066cc;line-height:300%;}--->
</style>
何か原因とかあれば教えて下さい。
>font-family:"MS Pゴシック,Osaka";
font-family:"MS Pゴシック",Osaka;
117 :
115:03/01/10 16:21 ID:???
>>116 上のがミスです すみません
正しく記入してもダメなのです。
>MS Pゴシック
MS Pゴシック
119 :
マカー:03/01/10 20:03 ID:???
MacのIEで欧文フォントを使用したい場合はその要素にlang="en"とかを入れなきゃいけない。
もちろんlang="fr"とかlang="de"とかでもいいけど。
要は親とかで日本語が指定されてるだけだとたとえ選択されてる内容が半角文字だけでも、
日本語ってことで欧文フォントは適応されないんよ。
2バイト文字も適応されないんなら、ちょっとわかんない。
W3C信者はlang属性入れてるだろうがな。
<html lang="ja">
略
<p>This is a pen.</p>
<p>これはペンです。</p>
で font: "Times New Roman","MS Pゴシック" ;
だとMSPゴシックに全てなるという話ですか?Macで。
121 :
マカー:03/01/10 21:06 ID:???
>>120 そそ、そういうこと。
もっと言っちゃえば
<html lang="ja">
略
<p>This is a pen.</p>
<p lang="en">This is a pen.</p>
p { font-family:Impact }
で、Ipmactが適応されるのは下だけ。
まぁそれが
>>115の直接的な原因かは分からないけど。
>>122 CSSでもできるが、その前に、HTMLで<sup>ってのは知ってるか?
見た目の定義はCSSでやれ
125 :
112:03/01/11 02:08 ID:???
>>124 でもそのために無用なマークアップをしなくてはならないわけで。
文脈セレクタって全然文脈じゃないよなあ。
contextには前後関係という意味もある。
>>124 <p>2^4は16です。<p>
これをソースには手を加えずに、CSSだけで
<p>2<sup>4</sup>は16です。</p>
と同じ表示になるようにしてください。
「2^4」っていうのがそもそも「^」が階乗ですって記号(マークアップ)じゃんか。
わかる?
じゃあ
24
か。
MathMLのマネするとこうかな
<span class="superscript "><span class="number">2</span><span class="number">4</span></span>
結局SUPとかわらねえw
変わらないってか、そもそもマークアップの領分だしな。
><p>2^4は16です。<p>
の4だけを拾ってスタイルを適用するのは無理。
以下のやり方で<suq>っぽくはなるが、結局24を何かで囲う必要が有る。
hoge{
font-size:0.5em;
line-height:90%;
}
hoge:first-letter{
font-size:2em;
display:block;
float:left;
}
<p><hobe>24</hoge>は16です。</p>
えらくミスタイプが多いね
134 :
訂正:03/01/11 02:52 ID:???
× <suq>っぽく → ○ <sup>っぽく
数式や化学式は<sup><sub>で良いんじゃない?
でないと,スタイルシートを理解しないブラウザーでわけわかめになるし.
レイアウトのための上付き,下付きだったら,<span>とか(.exeを小さくするのが強調であるなら)<em>とかでかこって,スタイルを適用するしかない.
とりあえずspanを使うと
span.exe {
vertical-align: super;
font-size: small;
}
名無しさん<span class="exe">.EXE</span>
136 :
Name_Not_Found:03/01/11 11:33 ID:eKHdua2r
overflowでの擬似フレームを使っているのですが、
HTMLでいうフレームで分割した二つのページの間に、どうしても線が入ってしまいます。
この線を消すにはどうしたら良いのででしょうか?ご教授お願いします。
>>136 ソースとか使用ブラウザとかの情報を出してくれぬと返答できませんって。
borderでも弄っておきなさい。
height(又はwidth)とoverflowしか使わない擬似フレームでどうしたら線が出るんだ?
そこが知りたい。
まぁ、
>>137と同意見ってことで。
>>4 の中でも、その他でも構わないのですが、
何処のリファレンスが一番お勧めだと思われますかぁ?
140 :
122:03/01/11 23:19 ID:???
皆様ありがとうございました!
すごく勉強になりました!
感謝です!
見た事無いのがいっぱいだけど、
justifyとかきれいですね。さっそく使いまくります。
>>143 オススメ、って事はまあ、かなうかなわない関係なくいいと思うやつのことなんじゃない?
>>136です。
>>136での問題は解決しました。
>>137-138どうもすんませんでした。
ふと疑問に思ったことがあるのでまた質問・・・。
擬似フレームで、ocerflowで左右に分割されたページがあるとします。
左のリンクをクリックすると、分割された右の部分のみページを切り替えられるように
することはできるんですよね?
「左」のリンクをクリック
┏━┳━┓ ┏━┳━┓
┃左┃右┃ ⇒ ┃左┃右┃
┃ ┃ ┃ ┃ ┃ ┃
┗━┻━┛ ┗━┻━┛
右の領域のみ指定されたページに変化
もしできるのでしたら、普通のフレームならば「target="aaa"」なんてやるターゲットの指定は
どうやってやればいいのでしょうか?
IE6、OSはME。
ソース(ところどころ略しました)
<style type="text/css">
<!--.header2,.footer{;width:20%;}
.content{width:80%;}-->
</style>
<div class="hidari">左</div><div class="migi">右</div>
あくまで擬似です
>>145 できません。
>>146の言う通りです。
つーか一番下のソースさ、肝心なところを略してどうすんの。
へぇ、あくまで擬似ですか。
わかりました。ありがとう。
スクロールバーを左に表示したりできるんですか?
>>149 できない。
bodyにdir="rtl"とかするしか。
質問です。
戻る 進む
↑こんな感じで
一つの行の右端と左端に文字を書いて真ん中は空けたいのですが
スタイルシートでこの様にテキストを配置する方法はありますか?
152 :
150:03/01/12 21:08 ID:???
できるじゃん。
body{direction:rtl;}
鬱打詩嚢…
スクロールバーを変えたいだけの理由で使うのはやめといた方が良いと思うけど。
>>151 <ul>
<li class="back">戻る</li>
<li class="go">進む</li>
</ul>
li{width:10em;float:left;}
li.go:before {content:"御飯が御飯が";}
li.go:after {content:"君。";}
全てコピペはおすすめできません。
154 :
151:03/01/12 22:23 ID:???
>>153 レスありがとうございます。要するに
<li> もfloatにしたら横に並べることが出来るんですね。
色々学習してきます。
155 :
Name_Not_Found:03/01/13 05:36 ID:mMtsEDHM
テーブルを表示windowの真ん中に表示させる正しいやり方を教えてください。
table{
text-align:center
}
でやるとNN7で真ん中によってくれません。
>>156 すいません、FAQでしたね。逝ってきます
<div>で囲ってaling=center
リストをセンタリングしたいのですが
<ul>のclass指定で
list-style-type: none;
で「・」を見えなくして
<li>のclass指定で
text-align: center;
にしたら「・」の分字下げされてしまい、
センタリングしたいのにちょっとずれて不格好です。
文字の部分を完全にセンタリングする方法はありますでしょうか?
>>159 list-style-position:inside;
と、確認もせずに書いてみる。
161 :
Name_Not_Found:03/01/13 10:35 ID:tFLaNEbY
>>159 ないっちゃ!
HTMLによるリストの意味を考えるっちゃ!
163 :
159:03/01/13 11:29 ID:???
レスありがとうございます。
>>160 試してみたけど、字下げはされてしまうようで、ダメでした。
>>161 そうですか(´・ω・`)
デザインを考え直します。
>>162 floatかpositionじゃないの?
CSSファイルは見てないが。
てか、少しは自分で見ろよ。
>>164 positionだったYO!
外部スタイルシートを見れる事にはじめて気づいた
>>162 positionかfloatを判断する場合、
画面サイズ(ウィンドウ)をだんだん小さくさせて、
右か左のブロックが下に移動すれば(回り込みが解除されれば)float。
ウィンドウを小さくしても横スクロールバーが出るだけで
左右の状態が変わらなければposition
って漏れはやってる。(いちいちCSS見るのが面倒なもんで
岡田克彦ファンクラブからのご案内です。ご高承のとおり、岡田克彦氏の卒業した早稲田大学政治経済学部
と、ひろゆきの卒業した中央大学文学部は比較にならないほど差があります。中央大学文学部のような
ヘボい大学に共通しているのは、文化水準が低いという事です。18歳から22歳をヘボい大学で過ごすという
ことは、感受性において致命傷と言えます。2ちゃんねらーの大半は岡田克彦氏に比べて、著しい低学歴で
頭が悪いだけでなく、感受性も愚鈍で腐っているという、取り返しのつかない状態なのです。
せめて、
http://www.geocities.co.jp/MusicHall-Horn/1091/で、岡田氏の作品に触れましょう。
ブロックAとブロックBがあるとして。
この2つのブロックを横に並べたい場合、
{ float : 〜 }と{ display : inline }、どっちが適切だと思いますか。
質問というか…みなさんのご意見を聞いてみたいです。
float
174 :
172:03/01/15 21:01 ID:???
補足。ブロック内容は共に1行です。
>173
やっぱりfloatでしょうか…
好きにしろ
用途に合った方を選ぶ
すみませんが教えて下さい。
AとBの二つのテーブルがあり、
Aテーブルの中の指定した場所へ、
Bテーブルを置きたい場合はどのようにしたら良いのでしょうか?
宜しくご教授下さいませ。
CSS切り替えスクリプト使ってるんですけど、
改行を消したいデザインと消したくないデザインがあるんですけれど、
この場合前者の時<br>を{display:none}で消してもいいのでしょうか。
文法的になにか引っかかるような引っかからないような。
>>178 CSSとは無関係だよ。
Bテーブルを入れたいAテーブルのセルに入れればいい。
ただ何重にもテーブル内にテーブルを入れると(入れ子といいます)
処理が重くなる(PCスペックによってはフリーズする)ので入れ子は
2〜3程度で留めてください。
例えばAテーブルが3行3列で真中にBテーブルをおきたい場合の
ソースはこんな感じ↓
<table>
<tr><td><td><td>
<tr><td><td><!--ここにBテーブルのソース--><td>
<tr><td><td><td>
</table>
>>181 >>178 >AとBの二つのテーブルがあり、
>Aテーブルの中の指定した場所へ、
>Bテーブルを置きたい場合はどのようにしたら良いのでしょうか?
こういう書かれ方したら、
>>180のような答えが返ってきても仕方ないんじゃない?
親要素や子要素って自分で設定する事は無理ですか?
>>183 HTMLの親子関係における制限(addressの中にブロック要素を記述できない、とか)を
CSSで変更(displayプロパティ等で)できるかどうか、という意味かな。
だとしたら、できない。
どういうことをしたいか日本語で説明できないのなら
ポンチ絵でも描いてどっかのうぷろだ借りてのっけて
誰か親切な人がそれを見に行ってくれるのを待つのはどうか?
ニポン語もロクに使えない香具師がHTMLなんか使うな!
…オレモナ!
188 :
Name_Not_Found:03/01/18 14:28 ID:3+LrgISQ
ゼロから勉強してる。どうせならちゃんとレイアウトはCSSで、と思った。
沢山のページのソースを見まくっているが、
例えば文字の指定ひとつとっても、HTMLからの指定・CSSからの指定、と
ぐちゃぐちゃに混在しているページが多いと思ったんですが・・・
こういうものなのでしょうか?
いきなりCSSまで突っ走って勉強してるので、難しいと感じる今日この頃だが・・・。
190 :
Name_Not_Found:03/01/18 16:55 ID:BdwT2uW6
ボケボケな質問で申し訳ないのですが、
フォーム部品のうちラジオボタンへはCSSが適用できますが
チェックボックスには適用できないのでしょうか。
ネスケ7.0やIE5.2(Mac版)などでチェックしたのですが
チェックボックスへのCSS適用がきちんとできているものはありませんでした。
かといって
input { border:2px; }
のように一括指定をすると、チェックボックスの回りを囲むように
ボーダーが出て醜くなるブラウザもあるので、
チェックボックス以外のフォーム部品に一括指定できるような
やり方がないかと思っているのですが、何かありませんでしょうか。
よろしくお願いします。
>>190 チェックボックスにspan使ってclassでも指定したら
>190
input[type~="radio submit reset"] {border: 2px;}
とかそんな感じ?NN7やMacIEなら対応してるかもしれない.
キーワードは「属性セレクタ」
WinIE6が未対応だと思うから,現実的には >191さんの方法かな.
193 :
Name_Not_Found:03/01/18 21:57 ID:/PXgom5U
HTMLとCSSをポツポツ始めたのですが、わからない事があると
ソースを表示させて、例えばHTMLなら表示させて見ることが出来ますが、外部CSSファイルってどうやったら見ることが出来ますか?
CSS、むずかししくて頭痛くなります。
font-sizeで%指定できますよね?
その%指定で100%は何を基準としてるんですか?
>>193 外部CSSファイルのURLをブラウザに打ち込めばエディタで表示されるよ。
197 :
193:03/01/18 23:37 ID:/PXgom5U
>>196さん!!
ありがとうございます。
なんのお礼も出来ませんけど、ありがとうございます。
外部とはいえ同じ所にあるんですもんね、もっと頭を働かせねば...。
質問です。
:first-letter擬似要素のmarginに負の値を指定したところ、
IE6.0では効いているんですがN7、Opera7.0では無視されました。
これはIEのCSSの解釈が間違っているんですか?
>>200 本当だ、どうもありがとう。実装の問題ってことなんですね。
spanで代用しようかな・・・
ガイシュツだったらスマソ。first-letter絡みで質問です。
<h1><a href="2ch.net">hoge</a></h1>
h1:first-letter{font-size:3em;}
アンカーにカーソル乗せるとMozでfirst-letterが無視されるのですが
これはバグ?
ちなみにWinのopera6.05、IE5.5では大丈夫です。
CSSでお勧めの書籍あったら教えて下さい。
>>202 バグだと思う。
以前、その場合でアンカーにポイントしなくてもh1:first-letterが効かなくなる問題があったし。
修正漏れかな。
>203
206の青いやつ使ってる。
>204-205
れすサンクス。バグスレに報告しておきます。
>207
青いのは赤いのに比べてCSSパートが弱い気がする。
読んだのは前バージョンの方の2冊だが。
あと、ちょっとだけ割高だし。
210 :
Name_Not_Found:03/01/19 21:34 ID:Bc3U0fbA
cssでtableの枠の色を設定できますか?
>210
できます。
table { border : #ff0000 1px solid ; }とか。
cssで<select>のハンドルやリストや選択カーソルなどのコントロールの色を設定することはできますか?
すみません、ちょっと質問させて下さい。
当方IE5.01sp2を使用しております。
cursorをCSSで指定したいのですが、
n-resizeとs-resizeはネスケ6で差異がありませんよね?
IE5.01ではそれぞれ、上下の矢印になるのですが、
IE5.5以降ではどう表示されるのでしょうか?
>>217 サポートされていますよ。
(ちょっと考えれば分かることだと思うんだが…)
>>217 カーソルは、ユーザーが指定しているそれになる。
例えばくまちゃんカーソルを使ってる人のブラウザでは、くまちゃんクロスカーソルになったりしてるわけ。
クールなサイトのつもりでも、よそでは滑稽になってるかもしれない、という話。
#カーソル変更は、視覚的に馴染まないという理由から嫌がる人は多いですよ。
220 :
Name_Not_Found:03/01/20 16:45 ID:1M1ZX7Rl
本当に初歩的な質問で申し訳ないんだけど…
CSSのセレクタ名に記号って使っちゃいけないの?
使えるのはUAが勝手に通してるだけなの?
微妙にスレ違いな質問で申し訳ないんだけど…
text-decoration : blink; に対応しているブラウザってあるの?
……NN4とかな。
Netscape6以降
224 :
221:03/01/20 17:25 ID:???
>>222 ほんとだ。ちゃんと点滅したよ! ありがとう!
使わないけどな。
225 :
221:03/01/20 17:39 ID:???
>>223 ほんとだ。どっかに「N6は非対応」って書いてあったの鵜呑みにしてたよ! ありがとう!
使わないけどな。
>>220 セレクタには当然記号は使われるぞ。
#.:[]|=~、全部セレクタのシンタックスの一部だ。
、も使えるんだ
>>229 、そんなこともわからないんですか?
、小学校から(略
<del>
>>227-230 </del>
del { font-size: 500%; }
透明あぼ〜んをして。
↓つぎどうぞ↓
いわゆるテーブルレイアウトをテーブルを使わずにやるには
どのCSSを使用したらよいのですか?
「どのCSS」っていうのも凄い質問だな。
HTMLにおける「タグを教えてください」に通じるものがある。
236 :
217:03/01/20 23:50 ID:???
>218
サポートされてるのは当然でしょうけど、
ie5.01とネスケ6じゃあ後者のほうがcss対応が優れていることを考えると、
IEの新しいバージョンがネスケと同じ表示方法になっているかも
とか思ったのです。
nが北でsが南でしょうから、それぞれの方向に矢印が出るほうが正しいとは思うのですが。
でも、219で言及されてるクライアント依存の件ですが、
上だけとか下だけの矢印を、windows上で見る機会がないので、
やっぱ上下どっちにも矢印ってのが正解なのかな、う〜んわからんです。
>219
くまちゃんカーソルによる説明は、自分を納得させるのに充分過ぎました。
使わないことにします。
カーソル画像作って、urlでその画像を指定する。
ということに触れないのは何かの陰謀ですか?
>>237 カーソル変更させたくないからじゃない?
視覚的に、も理由なんだけど。
<div class="abc"></div>で囲んだら下側のマージンだけが無視されます。
cssには
.abc{margin:5% 5% 10% 180px;}
としか書いてません。
最初はこれでちゃんと表示されてたんです、なのにソースいじってたら…。
ブラウザはIE5.5です。NN7で見たらちゃんと下に余白ができてました。
なんとかしようと頑張ってたらいつの間にかこんな時間だしもうダメポ(;´Д`)
>>236 カーソルなんて
windowsIE5
windowsIE6
macIE4
macIE5
windowsのNN7
macのNN7
LinuxのNN7
全部ちがうでつよ。
243 :
Name_Not_Found:03/01/21 13:27 ID:DE75Gzb5
質問です。
<dl><dt>hoge</dt>
<dd>hage1</dd>
<dd>hage2</dd></dl>
というのがあったときに
hoge hage1
hage2
という風に、<dd>要素を縦にそろえる方法ってありませんか?
hogeとhage1は同じ行に、
hage2以下をhoge1の下に来るようにしたいのですが……。
>>243 dt { float: left; width: *em; }
dd { margin-left: *em; }
定番のこれでできるけど
IEは二つ目以降のddがちょっとズレる。
dtのheightを調節するしかないかな
245 :
243:03/01/21 13:59 ID:???
>244
ありがとうございました。
dtのheightに少し大きめの値を持たせてやることで
上手く整形できました。
やっぱり
<dl compact>
を使うのは邪道なの?
247 :
Name_Not_Found:03/01/21 21:11 ID:afmQFC0i
iモードサイトをやっているのですがPCからの見た目も考えて、
外部スタイルシートを使っています。
そこで質問です。。。
「iモードからアクセスした場合、外部スタイルシートは読み込まないから
外部スタイルシートが数KBあったとしても、パケット通信料に掛かる負担は
head内に埋め込んだタグの分だけである・・・」
という自分の常識は世間の常識でしょうか?
>世間の常識でしょうか?
アンケートでもする気ですか?
無駄なファイルを読み込まないのは仕様です。
>>247 余談ですが、WAP2.0は、cssを読み込みますよ。
背景画像すらも読み込みます。
#はじめて見たときびっくりしましたもん。
250 :
247:03/01/21 21:46 ID:???
>>248 どうもです。失礼しました。
>>249 ほんとですか?
あながち余談でもないので、勉強してきます。。。
未だによく理解できないEZ Web、、、恐るべし、、、
要素を float させる際に指定する幅って
max/min-width でもいいのでしょうか。
width で決め打ちしないといけないのでしょうか?
>>251 min-widthしか指定してないと、100%にされちゃうかもしんないので、
どうせやるならmax-widthの方がよろしいかと。
classとidの違いって何?
全部class属性でごり押しできたけど。。
idで指定するのってなんか意味あるのかな?
くだらない事だけど教えてもらえたら嬉しいです。
正直、「またか」と思います
>>253 すごい既出だし過去ログにあるから探して見るといいよ。
自分的には全部class指定でいいと思う。
ここはid属性じゃないとダメ!ってケースあまりない気がするし。
IE5で、
td { width:10em; }
のようにしても、テーブル全体の幅がブラウザ幅を越えないように
詰められてしまいます。
横スクロールバーを出してでも指定どおりの幅を取る方法ありませんか?
>>257 できました。完璧!
ありがとうございました。
>>253 すごい既出。
前に出ていたCSS-FAQのサイトに書いてあった気もするが。
idは hoge.html#ID でアクセスできる。
>255
・リンクの飛び先
・javascriptのgetElementById
・perlなどで処理する時の目印
etc
CSSが先にあってclassやidがあるわけじゃないよ
font-size : small;を
IE6でみると<font size=3>の大きさなのに
NN7でみると<font size=2>の大きさになってしまうのは仕様ですか?
はい
便乗。
font-size : small;って、Win、Mac共にIEでは意味無しでしょうか。
mediumと全然変わらないように見えるんですが。
って言うか、素直に%なりemなり使え
意味が無いとは言わんが
>>260 スタイル適用させるためだけの目的でclass振るかid振るか迷ったら
とりあえずclassを振ればいいんじゃないってことっす。
言葉足らずでごめん。
font-size:mediumはIE6も標準モードならNN7と同じ大きさ。
267 :
Name_Not_Found:03/01/23 22:00 ID:Hivd8+j3
CSSマンセーなページ色々見てて少々ウンザリした。・・・
「絶対指定」で二種類のフォントサイズを使ってるが、小さいほうで16px。
これでも、アクセシビリティの低いページなのか?
もひとつ、「画像オフでエロ"画像"ページ巡回するユーザー」とか想定すべき
(出来る)ものなの? ていうかそういう一面に触れようともしない(CSS以前でね)
のが不自然に感じるのですが。皆さんの考えはどう?
分かりやすく書き直してくれ
>>267 > 「絶対指定」で二種類のフォントサイズを使ってるが、小さいほうで16px。
絶対指定そのものがウザい。
> もひとつ、「画像オフでエロ"画像"ページ巡回するユーザー」とか想定すべき
> (出来る)ものなの? ていうかそういう一面に触れようともしない(CSS以前でね)
そんな特異な例なぞサンプルにならんでしょ。
「絶対指定」は一部のブラウザでは実際に固定されてしまうわけで
電子媒介の利点といえるスケーラビリティを損なうような行為を
わざわざする必要はない
>267
16pxの絶対指定でのアクセシビリティは、
弱視のひとにとっては低いと言えるでしょう。
まあ、絶対指定のアクセシビリティは、どこで線引きするかの問題ですね。
相対指定なら、線引きする必要はないということかな。
あとはなに言ってるかよくわかりません。
って言うかそれはCSSの話なのか
サイズの絶対指定は避けるべきでしょうね。
もちろん、デザインを重視したい場合もあるでしょうから
絶対に使っちゃいけないわけじゃないけど、その場合でも
代替スタイルシートを用意して、弱視の人も快適に
読めるようにしておくべきでしょう。
>>272 CSSとは無関係だな。というか少なくとも直接的に関係ある話ではない。
多分、CSS解説に付随してたアクセシビリティに不満を述べてるんだろう。
というか、ユーザビリティを「どうでもいい」と思う人間に無理に分かってもらう事は難しいだろうな。
バリアフリーで段差をなくそう、っつったって、俺は楽に登れるし、普通みんな楽に登れるだろ、とか言ってるようなやつと同じ。
pxは相対単位だよ。
>>276 質問なんだけど、
解像度に対する相対
と
ブラウザで指定したフォントサイズに相対
とは別だよね?確か。(うろ覚えなので)
278 :
267:03/01/23 22:34 ID:Hivd8+j3
>>268 すまん。そうだろうな。html知識ゼロから一気に勉強していて原則的な
疑問が多い。(CSSも勉強すべきなのだな、と知ったのも数日前)
>>269 >絶対指定そのものがウザい。
文字サイズはアクセシビリティの観点では「小さすぎる文字」
以外に考えるべき事がある?(色を変えるのは問題あるケースもある事
は解った)何故ウザイのか教えて下さい。大きく絶対設定するのも
いけない理由が解らない。あと、
>そんな特異な例
そうです。自分もそう思っています。「あなたがページを作る時」
という文脈のページが多くてウンザリした次第で。
>>270 >電子媒介の利点といえるスケーラビリティを損なうような行為
もう少し具体的に教えて下さい。印刷時の問題とかですか?
279 :
277:03/01/23 22:39 ID:???
>>278 > >絶対指定そのものがウザい。
> 文字サイズはアクセシビリティの観点では「小さすぎる文字」
> 以外に考えるべき事がある?(色を変えるのは問題あるケースもある事
> は解った)何故ウザイのか教えて下さい。大きく絶対設定するのも
これは
>>271で。
> そうです。自分もそう思っています。「あなたがページを作る時」
> という文脈のページが多くてウンザリした次第で。
多分、特異な例、を省いて一般的な場合を指し示してる文書なんじゃないですかね。
例えば、「アメリカビジネスマンの間では、太ってる人は自己管理が出来ていないとみなされる」
という文書を関取が読んで憤慨してるようなもの。
あと、文節で区切ってくれないと、引用するときちょっと困るでス。
だからよぉ、それはCSSの話なのかって
> 「絶対指定」で二種類のフォントサイズを使ってるが、小さいほうで16px。
これどこのWEBサイトを例に挙げてるの?
サンプルきぼんぬ
>>281 それは自サイトのことじゃないの?
こうやってる俺のサイトもアクセシビリティ低いのかよ、って。
アクセシビリティを口に出すような奴がする真似じゃないわな
好みの大きさにユーザーが自由に調整できるという事が肝要な訳で
ptは相対指定値になるのかな?
>>284 相対単位と相対指定は違う。
ptは相対単位(画面に相対)で絶対指定(ブラウザに絶対)だと思うんだけど。
#勘違いしてたら補足きぼん
286 :
285:03/01/23 22:58 ID:???
>>287 いろいろ試してみたが、emとexだけブラウザで可変できるっぽいな。
290 :
288:03/01/23 23:08 ID:???
>>289 THX
そういや前にこのスレで尋ねたら、
>>287のURLに誘導されてそれで終わったような。
成長しないんですね。
ピップクプゥですね。
294 :
267:03/01/23 23:24 ID:???
直接CSSに関係の無い質問に皆さん的確なレス、感謝。
16pxの具体論、一般論としての例え話、スゲェ勉強になった。
厳しい、鋭い突っ込みも全て図星・・・だ。(作りかけだが。)
勉強進めて今度は高級な質問します。よろしく。
↓何事もなかったかのように岡田克彦↓
296 :
288:03/01/23 23:24 ID:???
>>291 だから自分で試したんだよ。
そいで、同じ話題が出てるから、結果を示したんだよ。
(´-`).。oO(
>>294は、登場の仕方の割りに大人だった。
大人。。。(*´Д`*)
大人になったのね。
>>300 CSSで赤ちゃんを作るにはどうしたらいいんですか?
>>301 baby{display:none;}
(;;´д`)堕胎ですか…
>304
baby{visibility:hidden;}じゃないの?
要素自体は存在するわけだから。
↓何事もなかったかのように山崎渉(^^)↓
>307
ワロタ
me{display:ょぅι゛ょ;}
擬似フレーム作りたいんだけど、右から●ピクセルで分ける、って指定できる?
フレームで書くと、
<FRAMESET cols="*,100">みたいな感じにしたいんだけど…。
どうやってやるか教えてください…(つД`)
御願いします。
>>315 ピクセル単位での分け方載ってない…。
lしかムリ?
甘え過ぎ。氏ねや
まあええや。使うのやめた。
はい次の方↓
よくないんじゃヴぉけえ
はよおしえろ
ミミミミミミミミ
ミミミ ミ .________
ミミミ ∧ ∧ ミ /
ミミミ ・ ・ | < バカヤロ!コノヤロ!
(61 └┘ | \
\ ー ノ  ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄
\____/
プッ、誰もわからないんだろ
>>322 最近それはやってるの?
まー別に君がそんなこといっても誰にもデメリットないし、誰も答えないだけだけど。
さようなら。
>>324 じゃーとっととこたえなよー
無理だろうけどね!!プッ
326 :
314:03/01/24 17:12 ID:???
↑のほう、俺が書いてるみたいに思われそうだな…。
無駄だと思うけど、一応俺が書いてるんじゃないと断っておく。
騙りがいるのでトリップします。
騙りに先にトリップつけられてやんの
やんのやんの
npxなんてねーよ
333 :
314:03/01/24 17:35 ID:???
〜pxを使うと左または上からの指定しかできないですよね…?
右か下から指定しようとすると、ウインドウサイズによって変わってくるから困ってる。
騙んなハゲ
JavaScript使ってやれれ
>>314 left:0;
right:100px;
まともに対応してるのはmozilla系のブラウザだけだな。
Operaも7ならいけるかもな。
337 :
314:03/01/24 17:56 ID:???
「できる?」って聞いて、「できる」としか答えてもらえないないのって、
見ててかわいそう。
>>338 質問の一つもまともにできないやつって確かにかわいそうだよな。
>>338 できますかと聞かれたら「はい(いいえ)」と答えたくなりますが何か
気の利かない人ね!(*゚д゚) 、ペッ
>>338 質問にちゃんと答えてるんだからいいじゃねえの。
表示の確認をするのに、WinIEの5.5と6を同時にインストールしたいんだけど、
それって出来ます?
みんなどうやって確認してるんだろう?
PC二台買う
5.5と6互換モードなら大差ない
微妙にスレ違いかもしれませんが、classやid名にはアンダーバーやピリオドは
使用できるのでしょうか?
いくつかのリファレンスサイトを見て回りましたが、使わない方が無難という
答えがおおく、明確に判断できませんでした。
>>347 レス、どうもありがとうございます。
なるほど、色々な変更が有ってそうなったのですね。
使わない方が無難と言う意味が分かりました。
各ブラウザの実装状況を調べて検討してみます。
ありがとう。
馬鹿げたこと聞く奴が多いだけ
ヒマなだけ
だけ
け
。
ヒ
>>338 質問に答えられないヤシが横からどうこう言うのはおかしいわけで
おまえが満足な解答を与えてやればいい
border-width等の数値を設定するプロパティで
border-width: 0 0 0 1em;と設定したら
友人に「0に単位つけろボケ」と言われました
すごいショックでした
あんなに優しかったのにWeb関連のことでは豹変してしまいました。
絶交を考えた方がいいですか?
又 0に単位をつけるのはなぜですか?そしてメリットを教えてください。
li属性を横にする方法はdisplay: inline;以外ないですか?
ボックスとかのようなんで
画面を2つ縦に分割して
片方の幅を200pxみたいにして
もう片方をウインドウサイズにあわせることはできますか?
できるならやり方を教えてもらいたいと思われます。
>>360 実現するにあたり、貴殿はどういった手法を試してみたのかと小一時間…
363 :
Name_Not_Found:03/01/26 21:18 ID:p43xYbd2
flot?
>>363 flot知らないのか?
今CSS界で最高のプロパティだぜ?
ツマンネーー。
367 :
362:03/01/26 22:43 ID:???
ああ、そうだよ。floatだよ。間違えたんだよ。悪いか。(逆切れ)
>>358 0の単位は省略できる。
それはその友人がDQNなだけ。
369 :
Name_Not_Found:03/01/26 23:37 ID:uE0Y6M+t
<li>をフロートさせると、少なくとも私のIE5.5(WinME)で見た時
マーカーが消えてしまうのですが、マーカーが消えないように
する方法はないでしょうか。
Netscape7で見るとマーカーは表示されているのですが、IEでも
表示されるようにしたいです。
370 :
Name_Not_Found:03/01/26 23:36 ID:uE0Y6M+t
<li>をフロートさせると、少なくとも私のIE5.5(WinME)で見た時
マーカーが消えてしまうのですが、マーカーが消えないように
する方法はないでしょうか。
Netscape7で見るとマーカーは表示されているのですが、IEでも
表示されるようにしたいです。
<li>をフロートさせると、少なくとも私のIE5.5(WinME)で見た時
マーカーが消えてしまうのですが、マーカーが消えないように
する方法はないでしょうか。
Netscape7で見るとマーカーは表示されているのですが、IEでも
表示されるようにしたいです。
>>369-371 モチツケ
floatさせた要素は強制的にdisplay:blockになる。
マーカーが表示されるのはdisplay:list-itemな要素だけ。
つまりIEが正しい。
373 :
369:03/01/27 00:07 ID:???
>>372 IEが正しいんですね。勉強になりました!
とりあえず、マーカーに依存しない方向でやっていこうと思います。
本当にありがとうございました。
1回しか投稿ボタン押してないのに複数投稿されてしまいました。すいません。
なんか日付の順番もおかしいし、エラーかな?
>>372 げ。そうだったんですか。
li { float : right; display : list-item; }
とかってやると、floatしててもマーカーが表示される
(IE6とNetscape7で確認)
んですが、これって、仕様的には正しいんでしょうか。
flortのwidthを50%にして、項目枠を横に二つ並べたいんですが、
ブラウザサイズを縮めて20emを下回ると20em以下にはならない、という方法はありますか?
最初から20emに指定すると、解像度が高くブラウザ最大にしたとき左に空きが出来るし、
50%にすると、縮めたときに項目枠の中でリストが改行されてしまうんですが。
二つの幅指定ができるなら教えて欲しいです。お願いします。
376 :
375:03/01/27 01:27 ID:???
訂正
右に空きが出来るし、でした。
┌──────────┐┌──────────┐┃
│ ││ │┃
└──────────┘└──────────┘┃
↓
┌────────┐┌────────┐┃
│ ││ │┃
└────────┘└────────┘┃
↓
さらに縮めると
↓
┌────────┐ ┃
│ │ ┃
└────────┘ ┃
┌────────┐ ┃
│ │ ┃
└────────┘ ┃
>>375 min-width: 20em
ということではなくって?
378 :
375:03/01/27 01:31 ID:???
>>377 そんなものがあったんですか。
有難う御座いました。これで安心して仕事に打ち込めます。
直列と並列の図ですか?
380 :
375:03/01/27 01:42 ID:???
>>379 ある一定の幅以下になると、そこでストップして、段組で下にずれ込むようにしたいわけです。
>>377 #ID名{
width : 30%;
min-width : 15em;
float : left;
}
これでいいんですよね?
通常は30%で、15em以下にはならない、であってますか?
382 :
375:03/01/27 01:52 ID:???
>>381 あ、IEじゃ無効なんですね…。
有難う御座いました。
ところでみなすあんは何でcss書いてますか?
みんな手打ちなのかなあ。
>>384 俺は、HTMLをタグ挿入型ソフトで書いて、あとからcssを手書き。
divとspanしか使ってないんですが、
ddとかemを使う意味って何ですか?
>>387 ddとかemを使いたければ使うだけのこと。
そゆ些細なことは気にしなくてもOKです(^-^*)
絶対ネタ絶対ネタ絶対ネタ
激しく既出かもしれませんが、おしえてください。
CSS で縦方向の中央揃えはどうやってやるんですか?
>>391 「vertical-align」で検索
393 :
391:03/01/27 16:33 ID:???
すんません。ちゃんとやりたいことを書くべきでした。
画像を縦方向中央揃えにしたいんです。
例えば、ページに gif が一点だけ、真ん中に来るような奴。
今までだと例えば、table 組んで td で valign で済ませたような奴。
>>392 試したのだが、それってテキストだけだよね?
もしかしてまちがってんのかな?確認して見よっと。
imgもインライン要素だろうが
395 :
393:03/01/27 17:04 ID:???
>>394 すまん。配置したいのは table だった。
やっぱりよくわからん。
<body style="vertical-align: middle;">
center!
</body>
↑でも
<div style="vertical-align: middle;">
center!
</div>
↑でも
うまくいかないんだけど・・・
ページは基本的に縦に伸びるものだから
bodyをtdに見たてて valign="middle" みたいなことはできない
vertical-alignは行に対する垂直位置
画像貼るだけなら background で
397 :
395:03/01/27 17:09 ID:???
>>396 そうなのか。
わかりました。
さんくすこ。
floatに関して、いくつか質問があります。
>>251でも同じことが訊かれていますが、
img以外をfloatする際に必須となるwidthの指定ですが、max-widthや
min-widthでもOKでしょうか? また、width : autoでもOKでしょうか?
>>372によると、「floatさせた要素は強制的にdisplay:block扱いになる」
そうですが、同時に、display : list-itemを指定することによって、
floatさせつつマーカーを表示させる、というのは仕様的に正しいでしょうか。
400 :
398:03/01/29 00:33 ID:ddoKXcoA
>>399 丁寧な回答ありがとうございました。
olで「パンくずリスト」を作ってたんですが、
(liをfloatして、list-style-imageで矢印を表示)
仕様的には間違ってたんですね。
li{display:inline}とli:before{content:"→"}にしようかな……
display: inline と padding-left と background-image
を併用すればいけるんじゃ?
画像がいるけど
オペーラの正式版が出た訳ですが
>>399 私も読んだけど、別に正しくないとは言ってないのでは?
すいません、質問です!!!ヾ(≧Д≦)ノ
非ASCII文字をぜんぜん使ってなくても@charsetは必要ですか???
だれか教えてください☆
IE6.0なのですが何故かどのサイトを
見てもスタイルシートが読み込めません。
そうですか。
以下のようなリストがあり、
<ul>
<li>リスト項目</li>
<li>リスト項目
<ul>
<li>下位のリスト項目</li>
<li>下位のリスト項目</li>
</ul>
</li>
<li>リスト項目</li>
<ul>
左にマージンを2emとりたいと思っています。
ですが、ul {margin-left: 2em;} とすると、
内側のリストにもmargin-left: 2emが適用されてしまいます。
内側と外側のリストの位置関係はデフォルトのままで、
うまくリスト全体を2em下げたいのです。
いろいろ試して、IEなら、
ul {padding-left: 0;} /*左パディングを0*/
ul ul li {margin-left: 0;} /*内側リストのマージンを0*/
li {margin-left: 2em;} /*すべてのliの左マージンを2em*/
/*一段目のデフォルトのマージンは生かし、
リストの字下げはliのマージンで調節する*/
でうまくいくようだと分かりました。
ですがMozillaでは、ULすべての左マージンが0になってしまい、
左端に整列して非常に困った状況です。
皆さんならどうされますでしょうか。良案ありましたら、よろしくお願いします。
classは?
>>409 内側のulにclassなりidなり振って
ul.hoge {margin-left: 0}
とかじゃダメ?
ごめんかぶった・・・
413 :
409:03/01/29 20:03 ID:???
classも考えたのですが、スタイル付与を目的にclassは付けたくなかったのです。
なので出来るだけ文脈セレクタで対処したいと思っています。
二段目以降のmarginをデフォルト値に戻せればよいのですが。
ul li ul { margin:0 } はどう?
>>405 質問にはきちんとこたえてくだサイo
でないと友達のスーパー☆ハッカーに住所を調べてもらっちゃいますよ?(笑)
書く順番を変えてみる
417 :
409:03/01/29 20:20 ID:???
いけました。
>>414 さんのアイディアが功を奏しました。
ul {margin-left: 0;}
ul li ul {margin-left: 0;}
li {margin-left: 2em;}
これでIE、Mozillaともに、期待どおりの結果を得られるようです。
ずっと悩んでたのですが、解決してほっとしました。
皆さん、ありがとうございました。
418 :
Name_Not_Found:03/01/30 11:03 ID:BGJIAQiS
<div style="text-align:center;">
<table><tr><td>aiueo</td></tr></table>
</div>
こするとNetscapeだとテーブルが真ん中にきません。なぜでしょうか。
tableはブロック要素だからです。
420 :
Name_Not_Found:03/01/30 11:09 ID:1zGMPutp
仕様です。
すごい、やっぱりオタクは知識が違いますね。
ありがとうございます。
はい次↓
マジ、CSS使えねー。
カスイケリンク集とかも見たけど、ぶっちゃけ全然イケてない。
しかもあんな単純なレイアウトするのにかなり不自然な処理しなきゃいけないのを見ると、
つくづくCSSってオタク向けアイテムだよなーって思う。
フレームだのテーブルレイアウトはいかんだの言うまえに
手前らの服のダサさを何とかしろと言いたい。
http://www.irrationalcontraption.net/launch.html ↑
CSS普及活動をされている方達が見たら、激怒しそうなサイト。
でも哀しいかな、Strictなカスサイトより断然支持されてる。
質問どぞ↓
426 :
ey:03/01/30 14:25 ID:esdma4ko
macのネスケ4.7で背景画像を固定したいのですが、できませんよね?
なにか、解決策はありますか?
そんなのは無視する
俺も NN4.x は無視してる。
可哀想だが相手にしてられないぐらい実装ショボいんで。
429 :
ey:03/01/30 15:05 ID:esdma4ko
・・・・そうですか・・・・。
仕様では、UAは代替スタイルを選べるようにしなければならない、とあるけど、
無効にできなければならないとは書いてないね(多分
Basic Page Style ってのは永続スタイル(titleなし)のことかと
>>431 must とは書いてないけども should とは書いてあるよ。
433 :
質問です。:03/01/30 20:08 ID:N7gYN1Sg
質問します。
インターネットで文字サイズを「最大」にしている人にも、自分のHPの文字がほとんどめちゃくちゃに表示(文字化け?)されないようにするには、どんなタグを入れたらいいんですか?
つまらんネタだな
437 :
質問です。:03/01/30 21:18 ID:N7gYN1Sg
>>436 どういうことですか?これを入れればいいんですか?
すいません。初心者なもんで・・・
>>437 <style>と</style>の間。
ヘッダに
<style type="text/css"><!--
*{display:none}
--></style>
と書く。
440 :
USS愛好者:03/01/30 21:42 ID:eV3JqvCf
スタイルシート側で img を非表示に設定して、
かつ、alt を展開させることはできますか?
img[alt]:after { content: attr(alt); }
までは思いついたのですが( IE では無効とはいえ。)
img を隠す方法がわからないのです。
img[alt] {visibility: hidden; } では生成文字列も見えなくなるし、
img[alt] {width: 0; height: 0;} では何かが残るし……。
後者で妥協してもよいのですけれど。
CSSでは無理だべ。JavaScriptで野郎
443 :
440:03/01/30 23:53 ID:???
>>441 どうもありがとうございました。
CSS 以外でがんばります。
2ちゃんの糞スレの皆様に、作曲家・岡田克彦ファンクラブからのご案内です。
ご高承のとおり、岡田克彦氏の卒業した早稲田大学政治経済学部と、ひろゆきの卒業した中央大学文学部夜間は
比較にならないほど差があります。中央大学文学部夜間のようなヘボい大学に共通しているのは、文化水準が
低いということ。18歳から22歳をヘボい大学で過ごすということは、感受性において致命傷と言えます。
2ちゃんねらーの大半は岡田克彦氏に比べて、著しい低学歴で頭が悪いだけでなく、感受性も愚鈍で腐っている
という、取り返しのつかない状態なのです。
せめて、
http://www.geocities.co.jp/MusicHall/5933/で、岡田氏の作品に触れましょう。
また、学歴至上主義は、学歴がないか、東大のような高学歴であっても学歴に相応しいだけの自分の特技
等を持っていない人が不愉快に思っているだけのことです。2ちゃんのひろゆきの卒業した中央大学
文学部夜間のようなものは、学歴と言えるようなものではなく、これは、拭うことの出来ない、生涯つきまとう
汚点で、絶対に取り返すことは出来ません。2ちゃんの皆さんの大半は、波風を立てずにその場限りの平穏無事を保守する
という、下らない事なかれ主義にうつつを抜かしていますが、私共は心優しい仲間なので、はっきり申し上げられます。
ひろゆきは、感受性において、まさに取り返しのつかない状態にある、ということです。
従って、阿呆のひろゆきのやっている2ちゃんは阿呆の危険集団だということです。
445 :
430:03/01/31 01:50 ID:???
>>445 Basic Page Styleはスタイルシート無効にする機能ではなくて永続スタイルシートを
選択するだけの機能だからOperaと比較するような物じゃない。
スタイルシート無効のUIは以前から議論されてるみたいだけど
Mozillaでは実装されてないだけだな。
447 :
430:03/01/31 10:47 ID:???
>>446 あー、なるほろ。
つーことは、スタイルシート無効のBookmarkletは必須なんでつねー。
サイトの注意書きに書いとこ。
ありがとうございました。
448 :
USS愛好者 ◆unVrIW7i6w :03/01/31 11:17 ID:pJC8HVDs
自己レスです。
>>440 >スタイルシート側で img を非表示に設定して、
>かつ、alt を展開させることはできますか?
できました!
img[alt]:after { content: attr(alt); }
img[alt] {width: 0; height: 0; border: none; }
で意図通りになるようです。
境界線をきちんと消しておくのがコツでした。
(ボックスサイズとボーダーの関係から。)
>>448 面白いこと考えるね。
marginとpaddingも消してみてはどうか。
はじめから置かないのはどうか。
>448のCSSの使い方がどういう時に役立つのかわからない。
>>451 推測だが、テキストブラウザでの見た目を再現させようとしたとか?
でも
>>488はdisplay:noneしているわけでもないから
画像は読み込まれるんだよね
テキストしか見えていないのになぜか重いサイトの完成か(藁
>>453 display:none は表示されないだけで読み込まれてるぞ。
455 :
453:03/02/01 16:39 ID:???
>>454 そうなの?
でも、「無かったことにする」わけだし、
前にどこかで「画像は読み込まれない」と書いてあったんだけど。
IE6で実験してみた。
確かに読まれているね。
>>454 便乗質問だが、 display:none は必ず読みこまれると考えていいのでしょうか。
iframe要素を隠すのに display:none を使っています。イントラ向けで、イントラでは IE しか使われないので今のところ問題は起きていませんが、 IE がupdateされたときや他のブラウザで問題が起こる可能性はないでしょうか。
試せることは試してから聞こうよ。
他のブラウザをインストールできない訳じゃないだろ?
別に自宅PCで実験したっていいんだし。
>>451 ユーザースタイルシートでは使い出があるかもしれない
olやulの40pxくらいの左の余白は、Mozillaはpadding、IEはmarginでとってる臭いんですが、
どちらの環境でも同じように表示させるにはどうすればいいんでしょうか?
ul,ol{
margin : 0 ;
padding : 0 0 0 40px ;
}
ul,ol{
margin : 0 0 0 40px ;
padding : 0 ;
}
どつちでも好きな方を使ふ。
>>451など
みなさんが答えてくれたように、
ユーザースタイルシートと代替スタイルシートでの使用を考えています。
でも、代替スタイルシートが使えるネスケ7だとうまくいきませんでした。
メインスタイルだと意図通りなんですが、alternate になるとダメ。
Opera7 では試していませんが、IEで×、ネスケでも×だと、
このアイデアはしばらく封印ですかね。
>462
いや生`。
ちょうど漏れも今全く同じアイデアを考えてた。
参考になりますた。ありがd。
464 :
451:03/02/02 04:34 ID:???
なるほど……ユーザーと代替のスタイルシートか。
何かの参考になりそうだ。462サンクス
<div class="hoge"><div class="hogehoge">
<h4> タイトル </h4>
<p> 文章 </p>
</dvi></div>
上のようにdivをネストしている構造が含まれるHTMLを
winIE6で見るとつぎのような現象がでます。
ページをロードした時はきちんと表示されるのに、
画面を下にスクロールして、いったんh4要素部分を画面から消し、
また上に戻すと、h4に適用しているスタイルが消えてしまう。
(具体的には背景色、ボーダーラインとか)
自分なりに調べてみたのですが、わかりません。
同じような現象になった方はいないでしょうか?
また回避策などはあるのでしょうか?
466 :
Name_Not_Found:03/02/02 15:17 ID:m6LrApAj
<td>の中の<a>にline-heightが効きません。tdに指定してもダメだったので
tdのline-heightを消してaに指定してみたのですがやっぱりダメでした。
どこに指定すればいいのでしょうか?よろしくお願いします。
>>465 再現できなかった
ネストしたdivのスタイルにもよると思う
>>466 ソースを良く確認してみて
こちらでは(IE6、Moz、Opera7)問題なし
N4ならあり得るけど
468 :
466:03/02/02 18:35 ID:m6LrApAj
>>467 ありがとうございます。MacIE5ではOKですが、WinIE6だとダメです。
どうしてもできないのであきらめて<br>を2つ入れて行間をあけました。
469 :
Name_Not_Found:03/02/02 18:45 ID:7QPmLTQ0
470 :
469:03/02/02 19:50 ID:7QPmLTQ0
上のサイトのように<fieldset><legend>をborderの変わりに使うのは駄目ですか?
471 :
465:03/02/02 20:38 ID:???
467さん、レスありがとうございました。
いろいろ試行錯誤した結果、h4要素にwidthを指定してやったらきちんと表示されるようになりました。
なぜこうなるのかはさっぱりわかりませんが・・・汗
とりあえず、思うとおりにいったので満足です。
1日中こればっかりやってたからほんと疲れた。
>>440=462
自分も参考にさせてもらいました。印刷用のに使います。
Opera7 は alternate でも効いたので一応ご報告。
Mozilla は 1.2.1 でもだめぽ。
>>472 Opera7 の報告、ありがとうございます。
そうか、使えましたか。自分も導入しようかな……。
実は私も印刷用スタイルシートで既に採用していたりします。
特にリンク集のバナーは印刷しても……という感じがあったので。
まあ、CG系サイトにはお奨めできませんかね(笑)。
ネスケ7(というより Mozilla?)は
「印刷プレビュー」を一度表示してから戻ってくると
なぜか有効になるようです。
全般的に、一度 display:none; にした部分や contents 成分がおかしいようですね。
あとスレ違い気味ですが、ブラウザで実現して欲しい機能として、
代替スタイルシートを有効にしていてページを移ったとき、
同じ title のスタイルシートがあったらそちらを優先して使って欲しい、
というのがありますね。
ページごとにいちいち切り替えるのはおもしろくないし……。
画面いっぱいのTABLEを作っていたのですが
<table style="width:100%;height:100%">
ではheightがIE6から機能しなくなってしまいました。
(borderを引かせるとtableの大きさが100%になっていない)
できればTransitionalにはしたくないんですが、回避方法はありますか?
>>475 strictで画面いっぱいのテーブル使う機会ってどんなときですか?
ちょっと知りたい。
>>476 初心者がFrontpageで作ったえっれぇ複雑なページをタグ打ち野郎が引き継いだときでつ。
>>477 引き継ぐならついでに簡素にしちまえばいいと思いますが。
>>479 きっつい蔵にあたった、って事か?
だったらトラジショナルにしといた方がよくねえか?
それとも、自分の意思でデザ変更不可なのか?
だったらトラジショナルにしといた方がよくねえか?
>>480 「文法上云々」では通らなさげ。あと14ページぐらい統一レイアウト使用してるもんで、
1ページレイアウト変えると全部変えるハメになるので俺が死にます
なんか方法なさげなのででTransitionalにしまつ。
今更Transitionalに書き換えるのも面白くないけど・・・(´・ω・`)ショボーン
>>481 文法上云々は通らないだろうな。
「もっと見栄えをよくする方法がある」
と、
「今後いつ仕様が変わるかわからない(現状のやり方が通らなくなるかもしれない)」
を併用すれば通る可能性はちょっとあがる。
>>482 とりあえず今これ以上手間増やしたくないのも事実なんで、
Transitionalにして「今後どうなるかわからんから、ブラウザの仕様次第では
レイアウト変更の可能性アリ」としますた。
しかし、なんでheight:100%はダメなんすかね、理由がよくわからない。
>>483 何に対して100%かという計算の基準が変わったのでは。
>>482 俺も今そこで苦労してるわ〜。
でも、HTMLのことを何も知らないクライアントの方が、下手に
不思議マークアップをする人より若干説き易い気がする。
>>483 DOCTYPE宣言はTransitionalでも、その他の部分はStrict DTDに適合させて
おけば、後で事情が変わった時に、DOCTYPE宣言だけ入れ替えればいいから、
比較的らくなのでは。
といっても、バリバリTableレイアウトしてるなら、内容も書き換えないと
strictにこだわる意味があんまないけどなー。
# スレ違いスマン。
なんでCSSには float:center が無いんだよ。
>>485 HTMLのことは何も知らなくても、自分でウェブを利用してる場合は、
「文字をもっと小さく、幅をもっと狭くして」
とか無茶な要求してくるので、ウェブのことなんかちっともわかって
ない相手の方がやりやすいけどなー。
>>488 そういう香具師には、画面をキャプチャした画像を張り付けておけばよい。
それでもだめなら、印刷して CRT に張っておく。
490 :
488:03/02/03 13:49 ID:???
>>489 いや、だから、自分でウェブを利用しないような、なんにもわかってない人
の方がやりやすいって言ってるんだってば。
よく読んでからレスしてね。
#スレ違いなのでこれにて終了
>>483 strictモードで、height:100%;はbody直下ならbodyの高さに対する100%
また、body要素の高さは内容物によって可変で、ウィンドウいっぱいいっぱいに確保されるわけではない。
だから指定しても意味がない。
ということだと思うけど。
strictモードで、
body { border:1px solid #FF0000; }
とやってみるとわかるかな。
>>483 tableの祖先要素全てにheight:100%
初めまして。根本的に間違っているかも知れませんが
以下のソースでテーブルの表示を変更すると
rowspan部分の表示がおかしくなってしまいます。
一番下になる項目が表示されている場合は見た感じ正常ですが
一番下が非表示(display:none)だと崩れてしまいます。
何とかうまく表示させる事は出来ないでしょうか?
<div style="cursor: hand" onclick="fnc_dsp(document.all.dsp0);">td-1</div>
<div style="cursor: hand" onclick="fnc_dsp(document.all.dsp1);">tr-2</div>
<div style="cursor: hand" onclick="fnc_dsp(document.all.dsp2);">tr-3</div>
<div style="cursor: hand" onclick="fnc_dsp(document.all.dsp3);">tr-4</div>
<div style="cursor: hand" onclick="fnc_dsp(document.all.dsp4);">tr-6</div>
<table border=1 style="border-collapse : collapse ;"><tbody>
<tr><td id = "row1">12345</td><td id = "dsp0">1</td></tr>
<tr id = "dsp1"><td>2</td></tr><tr id = "dsp2"><td>3</td></tr>
<tr id = "dsp3"><td>4</td></tr><tr id = "dsp4"><td>5</td></tr>
</tbody></table>
494 :
493:03/02/03 20:52 ID:???
追記です。
<script>
document.all.row1.rowSpan = 99;
function fnc_dsp(e) {
if(e.length){
for(i=0;i<e.length;i++){
if (e[i].style.display == "none"){
e[i].style.display = "block";
}else{
e[i].style.display = "none";
}
}
}else{
if (e.style.display == "none"){
e.style.display = "block";
}else{
e.style.display = "none";
}
}
}
</script>
>493
>494
びっくりするほどすれちがい
1時間ぐらい試行錯誤してみたんですがさっぱりでつ…助けてえらい人。
position:absoluteで画像を最上段に固定。
擬似的にレイヤーぽく他のコンテンツがその裏にまわるようになってます。
さらに、その下にCSSで疑似フレームを作成。
position:fixedが使えないIEでもほぼ理想通りの疑似フレームを再現しました。
(
>>5 がものすごく参考になりました。ありがd。)
ここまではうまくいったんですが…。
IE6で見ると<select>の部分だけが(疑似)レイヤーの上に浮き出てしまうんです。
NN7で表示するとちゃんと裏側に潜ってくれるのに…。
これってCSSではどうにもならなかったりします?(汗)
>>496 どうにもならない。
周知の通りWindowsではブラウザがWeb用(IE)もOS用も共通で、
セレクト・ボックスもOS絡みになってるので、
CSSでは制禦されないのだ。
だからWinIEでは<select>にborderを指定しても適用されないでしょ?
499 :
496:03/02/04 06:18 ID:???
>>497 そっか…。
Select使ってるの1カ所だけだし、
仕様ってコトで我慢します。ありがと〜。
はいはい、取ればいいんでしょ。
5 0 0 G E T
時代は501Getです。
502get が最新の流行
504get失敗してこそ漢
お前らCSSの話をしてください。
やだ。
bodyとhtmlのどっちに背景指定したらいいんですか
507 :
Name_Not_Found:03/02/04 13:08 ID:KTFEA2L6
508 :
506:03/02/04 13:21 ID:???
509 :
三平です:03/02/04 16:28 ID:IkXRw25J
文字の大きさをを固定させて、見る人が文字サイズを「最大」にしていてもレイアウトが崩れないようにしたいんですが、どうしたらいいですか?
ゲロゲロ〜
文字サイズが変わっても崩れないデザインを作るように努力してください
>>509 文字のサイズを変えられたぐらいでレイアウトが
崩れるような糞サイトを作らないようにしましょう。
512 :
511:03/02/04 16:31 ID:???
かぶったスマソ
はいこんいちあ
514 :
三平です:03/02/04 21:11 ID:6zvN1c+D
>>510 >>511 それが難しいので、したいと思います。
文字の大きさをを固定させて、見る人が文字サイズを「最大」にしていてもレイアウトが崩れないようにしたいんですが、どうしたらいいですか?教えてください。
>514
できるけど、フォントサイスの絶対指定は
アクセシビリティ的に推奨されないのでやめれ。
>>514 FLASH
PDF
画像全般
HTMLで固定しようなんて思う方が間違い
518 :
三平です:03/02/04 21:56 ID:wm1PA2LH
管理者に聞いたらいいでしょ
ネタでしょ?
521 :
三平です:03/02/04 22:10 ID:wm1PA2LH
それが、管理人に聞けないんです。国の機関ですから。
前にチャットで「そういうことは、ここで聞いたらいい」と教えていただいたので、聞いています。
ぜひ教えてください。お願いします。
524 :
Name_Not_Found:03/02/04 22:15 ID:JnZ2jjxn
自己紹介のページなんですけど、
例えば
<h2>自己紹介</h2>
<dl>
<dt>名前</dt>
<dd>花子</dd>
</dl>
とするのと
<h2>自己紹介</h2>
<h3>名前</h3>
<p>花子</p>
とするのは、どちらが文法的に正しいのでしょうか?
私は<h3>の見出し要素を使ったほうが良いような気がするのですが。
どなたか教えてください。
526 :
524:03/02/04 22:20 ID:???
>525
向こう逝って聞いてきます。
ありがと。
>>518 ネスケやオペラだと予想に反して崩れそうですが。
だから無理。
528 :
Name_Not_Found:03/02/05 02:28 ID:8uNf6rij
背景画像を一部分に固定して表示させるやつで
例えば真ん中とか右端とかあるけど
左上と右下とか同時に2箇所に表示させる事は可能ですか?
>>528 無理
他の要素を上手く使って対処(bodyとh1とか
>>527 無理ではないだろ
三平には無理だとしても
>>Q: Netscape6(or7)では、text-alignにcenterを指定してやっても、table(や、その他のブロック要素)をセンタリングできません。IEではセンタリングされるのに……
ではセンタリングはどうするので?
普通の人はNetcapeが間違ってるとしか思わないよね。
もっとIEにすり寄せた方がNetscape自身の為になると思うけどな
>>532 ネスケには今のスタンスを貫いてほしい。
<div align=center>
CSSじゃないけどね
>>534 cssでやらなきゃ無意味だと思うが。
#そもそもcss使ってて、それを知らん、って事はまあないと思うんだけど。
リスト
・あ
・い
・う
を
・あ ・い ・う
て横に並べるのはどうしましょう?
>>536 フロートさせて左側に回りこませればいいんじゃない?
それか見栄えをインラインにするとか。
538 :
537:03/02/05 11:15 ID:???
>>536 ちょっと不親切だったな。すまん。
LI{
display:inline;
}
>>536 後者では、display : list-itemじゃなくなるので、マーカーが消えて、
あ い う
になっちゃうけどね。
あと、floatされた要素は自動的にdisplay : block扱いになるそう(
>>372)
なので、ブラウザの実装が仕様通りなら、後者でもマーカーは消えるはず。
(IE5.5では消えるらしい。IE6とN7じゃ消えなかったけど)
マーカーをつけたままにしたいなら、
li:before { content : "・"; }
とかするしかないかな。(IEは対応してないが)
540 :
539:03/02/05 11:38 ID:???
>>539 ごめん、いま確かめたら、IE6でも消えてた。
IEの方が(仕様的に)正しい、ってのは珍しいな。
本来ならdisplay:compactがその役割なんだけどねぇ…
CSSでスタイリッシュなサイトに貼ってある
「W3CHTML〆」
のようなバナーはどういう意味があるので?
クリックして飛んでも英語ページだからわからんでさぃ
>>542 その文書が、W3Cの策定したHTMLの仕様に適合していることを表しています。
リンク先の英語のページは、W3CのHTMLの検索サービスです。
CSSには直接関係ありませんが、仕様に則った正しいHTMLを書こうと心がけている人は、CSSを使用する場合が多いようです。
スタイリッシュかどうかはまったく関係ありません。
また、勝手に貼り付けることができるので、きちんと仕様に則っていないページでも、貼っているところがあるかもしれません。
#menubox{ text-align:right; width:24ex; height:15em; }
#menu{ font-size:130%; font-weight:bold; line-height:123%; }
<div id="menubox">
<p id="menu"><pre id="menu">
<a href="">Top</a>
<a href="">Contents</a>
<a href="">BBS</a>
<a href="">Link</a>
<pre></p>
</div>
こんなふうに表示させたいんですが、改行させずにすることって出来ませんか?
CSSファイル切ったときに横に・・・できれば各リンクの間にスペースが入るような感じで。
>>546 ごめん、意味がよくわかんないんだけど、
CSSが有効な場合は、上記のソースで実現できるような見た目で、
CSSを無効にすると、各項目が横並びになるようにしたいってこと?
>>546 <div id="menubox">
<p id="menu">
<a href="">Top</a>
<a href="">Contents</a>
<a href="">BBS</a>
<a href="">Link</a>
</p>
</div>
でいいんじゃないの?
ちなみに同じid名を同一htmlファイル内に書いたらだめですよ。
>546
<p>の中に<pre>は入れられないが,それはともかく
a {display: block;}
ということをやりたいのではないかと思った
550 :
548:03/02/06 17:06 ID:???
追記
a {display: block;}
551 :
548:03/02/06 17:06 ID:???
ごめんかぶった
この場合、pをdivでくくる意味もあんまりないような……
#menu { text-align : right; width : 24ex; height : 15em; font-size : 130%; font-weight : bold; line-height : 123%; }
#menu a { display : block; }
<p id="menu">
<a href="">Top</a>
<a href="">Contents</a>
<a href="">BBS</a>
<a href="">Link</a>
</p>
でいいんじゃないかな。
ただ、これってコンテンツを列挙した「リスト」だよね?
pじゃなくてulを使った方がいいと思うよ。
CSS無効のときの見栄えになどこだわらず。
553 :
548:03/02/06 17:22 ID:???
>>552 すっきりしましたね。
>>546はこっち参考にして。ごめんね。
ところで便乗質問していいですか?
NC4でtableにborder指定する方法ありますか?
554 :
IE6.0:03/02/06 17:54 ID:e5oWdR+X
.fill {background:#ff9999}
<a href="xxx.html" class="fill">link</a>
何度かリンクをたどったりしていると、
いつのまにか背景色がなくなってしまいます。
これって…。たぶんすれ違いスマソ。
>>547-553 激しくサンクスコ
結構無駄なことばかりだったのね・・・反省します。
俗にいうdiv房なのでdiv使う癖を少しづつ直していきたいと思います。
557 :
IE6.0:03/02/06 18:37 ID:e5oWdR+X
わたしも原因を特定できていないのですが、
最初はもちろん正常に背景色がつきます。
しかし、<a>のリンク先に飛んだり、また戻ったり、更新ボタンを押したり、
まあとにかく、しばらくブラウザを操作しているといつのまにか、
背景色が適用されていない状態になってしまうのです。
ていうかたぶんスレ違いなのでスマソ。
>>557 a:linkやら使ったら?
関係ないが、日本語が不明瞭なので
もう少し推敲して工夫して欲しいと思った。
余計な御世話と思った。
リソースが足りなくなってるんだろと
リソースっておいしぃ?
ネタ質問かよ・・・
以後放置
>>559 / / / /( ∧ ) ヘ ヘ
く // ( /| | V )ノ( ( ( ヘ\ お て
┘/^| \ ( | |ヘ| レ _ヘ|ヘ ) _ヘ し め
/| .| | )) )/⌒""〜⌒"" iii\ え |
.| α _ ヘ レレ "⌒""ヘ〜⌒" ||||> て
_∠_ イ | | /⌒ソi |/⌒ヘ < や に
_ (_ ) ヘ | ‖ () || || () || _\ ん は
/ ( ) ヘ |i,ヘゝ=彳 入ゝ=彳,i|\ ね
/ー ( / """/ ー"""" > |
_) | ヘ(||ii ii|||iiii_/iii)ノヘ|||iiiii< |||||
| ( ヘ|||||iiii∠;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; フ ""'
///// ヘ_/ ) ヘ|||""ヘ===二二二===7フ / ム/∧ ∧ ∧
///// ( | ii | |LL|_|_LLL// | )( ∨| ∨)
・・・・・ ) )| || | |||||||||||||||||||||||| | | ( ヘ | ヘ ) (
___ | | /| .| |||/⌒/⌒ヘ | | | iiiiヘ ( | ( | /
/ / (|.| | | | | | iii ) | ヘ )( )
( ( /..| | |_____/ | | iii ( )( // /
\ ) )..| |ヘL|_|_L/ / / ,,,,--(/Vヘ)(/
皆さん、CSSを書くときにエディタは何を使ってますか?
notepad
TTTEditor
秀丸
秀丸じゃ構造化できないべさ。
xyzzy
秀丸使いはダサスギ(藁
名前を羅列するだけじゃ利点がわからん
CSSなんて、どんなエディタ使っても似たようなものだと思うけど。何百行もあるCSS書くなら別だけど。
何だかんだで500行以上あるな……うちのサイト
まあ、編集しやすいように並べてるからだけど
愚痴だからレス不要だけど、
Ie6氏が、背景が消えるといっていたが
俺もなったことがある。
文字が消えたり、borderの一部が欠けたり。
ドラッグしたり、一度画面外に出すと戻ったり戻らなかったり。
どーでもいいけどな(藁
CSSをHTMLに適用した様子をプレビューできるエディタとか無いのかな。
577 :
Name_Not_Found:03/02/06 21:13 ID:u//Ox/J6
<style TYPE="text/ccs">
<!--
BODY { background: url(bg1.gif); background-repeat: repeat }
BODY { font-size: 11pt; line-height: 200% }
-->
</style>
をヘッダ内に書いてるのに反映されないんですけど、なんででしょうか。
よくよくみたら、cssがccsになってました…。(*´д`*)ハァハァ オハズカスィ
さくらたんのエ(略
説明うまく書けずにすみません。なお、559,561はわたしではありません。
あと、>574のいう、ちょっとしたレンダリング失敗は何度も経験があります。
たとえばsolidボーダーがdottedになったり、line-height指定が無効になったり。
ただ、これまではこういう状況になっても、F5押すだけで直っていたものですから。
放置可。
漏れも、TopStyle使ってる。結構、いいよ。
>>580 フィルターガシガシにかけたり
文字をいくつも重ねたらそういう傾向あるかもしれません。
答えになってませんが。
>>580 原因は全くよくわからんが
背景にtransparentでも何でもいいから何か指定するとか
borderの無い辺があったら、何でもいいから指定してみると
直ることもあったぞ。
584 :
Name_Not_Found:03/02/07 18:02 ID:PdVhrUaa
<hr />をCSSを適用した時のみ表示させないようにしたいのですが、
教えていただけませんでしょうか。
>584
hr {display: none;}
586 :
584:03/02/07 18:09 ID:???
ふと、思ったのですが、IE4や3を使ってブラウジングしている人って
どれぐらい居るんですかね。やっぱ少数でしょうか。
>>587 少数です。アクセス解析でも付けて調べてみましょう。
次からはCSSの質問をどぞー。
589 :
Name_Not_Found:03/02/07 20:58 ID:d4+HpbPY
>>4にあるサイトで、NC4を省く方法を見ていたのですが、
media属性にscreen以外の値を指定すればいいというのはallでもprintでも
どちらでもいいと言う事ですか?
どちらを指定するかによっての違い等はあるのでしょうか?
また、あるとすればどちらを推奨されますか?
それと、screen以外の値を指定すれば読み飛ばされるというのは
弾くのではなくてcssの読み込み自体をさせないで、プレーンなHTMLを
表示させるという事なんでしょうか?
質問ばかりで申し訳ありませんが、よろしければ教えてください。
>>589 media属性にscreen以外を指定してるとこのスタイルシートだけ読まれない。
だから
<link rel="stylesheet" href="hoge.css" media="screen">
<link rel="stylesheet" href="hogehoge.css" media="screen,tv">
とかにするとNC4ではhoge.cssだけ読まれる。
media属性をどうするかはぐぐったほうがいいんじゃないかな?
>>589 ネスケ4除けという意味では、allでもprintでも効果は同じ。
allはあらゆるメディアに適応、printは印刷時に適応、という意味なので、
media="screen,print"として、通常のモニターと印刷の両方に対処した
cssを書くのが適切かと。
後者の質問については、その通りです。
592 :
591:03/02/07 21:13 ID:???
593 :
589:03/02/07 21:23 ID:d4+HpbPY
>>590-591 レスありがとうございます。
つまり、media属性というのはどのメディアで出力させるかを
こちらでコントロールできる要素という事なんですね?
で、NC4はscreenの値でしか、認識しないので、
それを利用して除けるという事でよろしいでしょうか?
なんだか理解できてきました。お二人共どうもありがとうございました。
>>593 それで合ってます。ちなみにたぶんこのスレの過去ログにあったんだけど、
media="screen,"ってscreenの後にカンマつけるだけでNC4は
スタイルシート読まないそうです。
595 :
589:03/02/07 21:48 ID:???
<link rel="stylesheet" href="doukou.css" type="text/css" media="print,screen," />
という事はこれでいいって事ですよね?
どうもありがとうございました。
>>594 それって、仕様的には正しい記述なんですかね?
mediaにprojectionも指定しておかないとOperaでフルスクリーンにしたときに
CSSが適応されない。
>>596 どうなんでしょう?
僕は無難にmedia属性はscreen,tvを指定してます。
つってもテレビで自分のサイト見た時にどうなってるのか
わかんないんですけどね。
>>598 media="tv"っていうのは、ドリームキャストとか、ちょっと前によくCMで
やってたインターネット・テレビみたいなのを想定してるのかなあ。
それらが実際、media="tv"と指定されたCSSに対応してるかどうかはともかく。
600 :
sage:03/02/08 00:40 ID:YO23bi6V
>>580 465で質問した者ですけど、
レンダリング失敗という状況は似てます。
漏れの場合はwidthを指定してやったら、
きちんとレンダリングされるようになりました。
状況によって違うような気がするから
参考にならないかもしれないけど。
601 :
Name_Not_Found:03/02/08 00:44 ID:N5VJgVoA
positionを使って2段組にして、左にコンテンツ、右にページ内容で
両段ともdivで囲ってるんですが、ウィンドウの幅を狭くすると
右の段に貼った画像がdivの領域からはみ出たりしてしまいます。
divのwidthを絶対指定しないで、ある程度幅を狭くすると
表示がおかしくならないよう横スクロールバーを
出すようにする方法はありますでしょうか?
上手く説明しにくくて、ちょっと状況が分かりづらいかもしれませんが、
何卒よろしくお願いします。
>>601 img に overflow を指定してみてはどうだろう
603 :
Name_Not_Found:03/02/08 01:35 ID:N5VJgVoA
>>602 overflowを指定してみましたが、だめでした…。
NC6だと画像がはみ出て、IE5.5だとdivの領域が画像のサイズよりも
小さくならず、文字だけ改行されて狭くなってしまいます……。
それと、NN4にも対応させた作りにさせてますんで、出来れば
overflowは使いたくないんですが…うーん……。
604 :
601:03/02/08 01:51 ID:N5VJgVoA
幅の値をxxx〜xxxまで…という風に指定する事は出来ますでしょうか?
>>604 min-width, max-widthとか
606 :
601:03/02/08 02:11 ID:N5VJgVoA
>>605 こんなのがあったんでつか…。
ぐぐってみたんですが、どうやらIEには対応してないみたいでつね…。
他の段組サイトはどうやってるんだろう…。
ソース見てみたけどさっぱり分からないぃ…。
他の段組サイトはどうやってるんだろう…。
ソース見てみたけどさっぱり分からないぃ…。
608 :
Name_Not_Found:03/02/08 02:14 ID:1WDRLKMT
<h1>でサイトのタイトルを入れている人は多いと思いますが、
代替スタイルシートなどを使った場合に、
テキストでタイトルが表示されるのではなく
<h1>への背景画像で表示したいことってありませんか?
この場合、背景画像は表示、テキストは非表示とするのでしょうが
{display:none;}だと背景も表示されなくなってしまいますし
{color:hoge;}でtransparentは設定できないしで悩んでいます。
<h1>タグだけでは解決できない問題なのでしょうか。
609 :
601:03/02/08 02:20 ID:N5VJgVoA
>>608 <h1>のfont-sizeを0にしてみるのはどうでしょうか?
>608
前にも同じような質問があったけど,「見出し」の中身が「背景だけ」って
のは
どうも変な気がするんだけどなあ…strictスレ向きかも.
前に僕が答えた時には「JavaScriptなり使えば?」だったんだけど.
611 :
Name_Not_Found:03/02/08 02:54 ID:nwsCKcwv
シツモソ。
背景色をCSSで固定しようと思って
h1{background-color:#FFDAB9;}
って書いたんだけど、反応しないんです。
タグ間違ってますか?
612 :
601:03/02/08 03:06 ID:N5VJgVoA
>>608 font-sizeを0にしても最小サイズになるだけでした…。スマソ
うーん、IE5で見たらテキスト消えてるようにみえたんですが…
物凄くちっちゃく残ってたんですね。
<h1>をvisibility:hiddenにすれば、h1は表示されなくてスペースだけ
確保されるので、そこに背景画像をposition:absoluteで配置する
というのはどうでしょうか?
613 :
608:03/02/08 03:22 ID:1WDRLKMT
>>610 言われてみればそうなんですが、CSSを切った時には
見出しとしてタイトルが表示されるわけですし、
タイトルのためだけに<img>タグを貼付けるのも
却って混乱するだけなのではとも思います。
strictスレはちょっと怖くて近付けない・・・。
>>612 visibility:hiddenはまだ試していませんでした。
やってみます。ありがとうございました。
615 :
601:03/02/08 03:47 ID:N5VJgVoA
>>614 >画像を読み込まない設定しているユーザーとかは無視ですか。
だから「代替スタイルシート」を使うんじゃないかと言ってみるテスト。
616 :
Name_Not_Found:03/02/08 03:51 ID:pSXRpjGB
pxってブラウザによって大きさ微妙に変わるんですか?
617 :
?:03/02/08 03:53 ID:???
>>616 ブラウザによっても解釈が違うし、解像度によっても解釈が違うらしいよ
618 :
Name_Not_Found:03/02/08 06:45 ID:pSXRpjGB
[CSSファイル]
.title1{
width:150px;
height:50px;
padding:0px;
float:left;
border:1px dashed #CCCCCC;
background:#FFFFFF
}
.title2{
width:500px;
height:50px;
padding:0px;
float:left;
border:1px dashed #CCCCCC;
background:#FFFFFF
}
[HTMLファイル(省略してます)]
<body>
<div class="title1">
<img src="title.jpg" width="150" height="50" alt="俺の部屋">
</div>
<div class="title2">
TITLE-02
</div>
</body>
今、こんな感じなんですけど、ウィンドウが小さいとtitle2クラスが下に下がってしまいます。
ウィンドウをどれだけ小さくしても、そのまま横に並ぶように固定するにはどうしたらいいんでしょうか?
そりゃfloat使ってんだから当たり前だよな
postion使え
って言うか、解りやすいDIV厨だネ、imgにclass振るとか見出しはh1かなとか言う発想は出て来ないか
>>618 backgroundに対するcolorは設定したか?
<div> <div> <div> <div> <i><div>you</div></i>
<i> <i> <i> <i> ウェブハムズ!
<div> <div> <div> <div> <i><div>you</div></i>
<i> <i> <i> <i> ウェブハムズ!
ウェブハムズ!
622 :
Name_Not_Found:03/02/08 18:36 ID:Vp1wwDk8
∩
∽
∽
>>623 <p>こんな感じにスタイルシートししたいんですけどどうすればいいですか?</p>
P{
border-style: solid;
border-width: 1px 0px 1px 1px;
border-color: お好みで;
}
>>624 できました。
即レスありがとうございます。
>>624 > こんな感じにスタイルシートししたいんですけどどうすればいいですか?
には突っ込まないんですか?
627 :
623:03/02/09 00:05 ID:???
<p class="title">こんな感じにスタイルシートししたいんですけどどうすればいいですか?</p>
P.title{
border-style: solid;
border-width: 0px 0px 1px 1px;
border-color: black;
display:block;
font-style:
font-size: 18px;
font-weight: normal;
margin: 3px;
padding: 1px;
}
こんなのにしました。
>>626 まちがってますね。すいません。じぶんで突っ込んどきます。
(=゚ω゚)ノなんでやねん
>>627 display:block;いらない.フォントサイズ固定は読ませる文章なら止めてくれ.
>>627 てか P.title って <hn> でマークアップすべき部分じゃないか?スレ違いだが。
>>619 img要素ってbody直下に置けたっけ?w
w
632 :
618:03/02/09 01:13 ID:QN6QY9bg
[CSS]
body {
background-color:#FFFFFF;
margin:0px 0px 0px 0px
}
.title{
width:150px;
height:50px;
position:absolute;
padding:0px;
border:3px dashed #666666;
background:#CCCCCC
}
.menu{
width:100%;
height:50px;
position:absolute;
padding:0px;
border:3px dashed #666666;
background:#CCCCCC
}
----------
[HTML]
<body>
<span class="title">[TITLE]</span>
<span class="menu">MENU01 / MENU02</span>
</body>
----------
>>618です。
DIV厨とか言われてDIV使わんでもいいことに気付きました(´・ω・`)
今、こんな感じでposition使ったんですけど、TITLEがMENUにかぶさって見えなくなってしまいました。
横に並べたいんですが、どうしたらイイんでしょう。。。
びっくり!divがspanになっちゃった!
634 :
span厨618:03/02/09 01:26 ID:IKo3Ezia
っていうか変わらんよなぁw
DIV厨ってなんだYOヽ(`Д´)ノ
別にいいじゃんかYO!
635 :
span厨618:03/02/09 01:36 ID:IKo3Ezia
っていうか日付変わってないのにID変わった?
なんでだろうケーブルなのに
>>632 タイトルにはhn要素使え.メニューにはリスト使え.
>>634 マジレスするが、別にいいと思うなら反応するな。
突っ込まれないソースを書く機会と思えば有意義だとは思うんだがな。
本人が良けりゃいいってもんでもないけどな
>>638 デブ厨、スパン厨とかは自分からよくしたいと思わん限り更正するのは無理っぽいよ。
>>639 >デブ厨、スパン厨とか
~~~~~
とかのとかって何?
>>640 最初、「とか」はつけなかったんだが、テーブルレイアウト厨とかフォントサイズ固定厨とかも同じようなもんだから、
特定する事もないかな、って思って。
>>632 とりあえずあなたはブロック要素とインライン要素について勉強したほうが
いいと思います。
もういいじゃねえか
div厨とかスパン厨とか
余計な干渉はうざいだけだろ
644 :
618:03/02/09 06:31 ID:IKo3Ezia
<body>
<div>
<h2 class="title">TITLE</h2>
<dl class="menu">MENU-01 / MENU-02</dl>
</div>
</body>
ブロック要素、インライン要素を勉強して、
>>636さんを参考にさせてもらい、HTMLは完成しました。
なんとなくわかって来ました!
.title{
width:150px;
height:50px;
padding:0px;
border:3px dashed #666666;
background:#CCCCCC
}
.menu{
width:100%;
height:50px;
padding:0px;
border:3px dashed #666666;
background:#CCCCCC
}
CSSは今こんなんですけど、横に配置するプロパティがよくわかりません。。。
645 :
Name_Not_Found:03/02/09 07:40 ID:jCylwVu7
646 :
Name_Not_Found:03/02/09 08:00 ID:rVl1kBAo
中央に配置したいdivの事で解からない事があります。
<div>文章</div>そのものを
<div style text-ailgn="center">でさらに囲んだら、このブロックは
中央にきましたが、この中の文字まで中央揃いになっちゃいました。
だからといって、文章部分をleftにするのって、何かおかしいですよね?
どうすれば良いですか?宜しくお願いします。
div ってデヴって読むの?
今までディヴだと思ってたんだけど
649 :
Name_Not_Found:03/02/09 09:19 ID:rVl1kBAo
divはディヴィ。
hrにhtmlとスタイルシートで
<hr style="color:#ff00ff" size="1" noshade>
とするのはへんですか?
>>648 DIV厨を愚弄してる、という事くらい気付けよデブ。
と言って欲しいのか?
>>644 完成してないよ。リストの書き方が変。
もうちょっとHTMLの基礎を勉強しれ。
ValidなHTMLじゃないとCSSはまともに機能せんぞ。
>>644 |<body>
|<div>
|<h2 class="title">TITLE</h2>
|<dl class="menu">MENU-01 / MENU-02</dl>
|</div>
|</body>
Hn, dlを何故わざわざdivで囲むのか。
見出しになぜh1を使わずにh2を使うのか。
dlではなく、普通は ul 若しくは ol を使うべきだ。
(で、display:inline; とかcontentを使う。)
HTMLも書けないと、CSSは上手く適用されない。
>>644 を読むに至り、これはネタだと確信した。
>>644 .title{
float: left;
width: 150px;
height:50px;
padding:0px;
border:3px dashed #666666;
background:#CCCCCC
}
.menu{
float: left;
margin-left: 1px;/* 右ブロックとの余白 */
width:60%;/* この値はお好みで */
height:50px;
padding:0px;
border:3px dashed #666666;
background:#CCCCCC
}
いまいちやりたいことがよくわかんないけどとりあえずこれでウインドウ小さくしても
横に並んだままになる。
ポイントはfloatさせるボックスのwidthを%などの可変の値にすること。
んで正しくCSSを使うためには正しいHTMLを覚えましょう。
>>646 えっととりあえずボックスのセンタリングについて勘違いしてると思うので説明すると
text-align: centerでボックスがセンタリングされるのはIEの間違った仕様です。
だからこの場合、<div style="text-align: center;margin-right: auto;margin-left: auto;">
が正しいセンタリングの方法です。
658 :
続き:03/02/09 12:09 ID:???
で中の文章もセンタリングされるということですが、それが正しい仕様なんで、
解決法として、文章をちゃんと<p>でくくって、
<div style="text-align: center;margin-right: auto;margin-left: auto;">
<p style="text-align: left;">
文章
</p>
</div>
とすれば、divでくくったボックスはセンタリングされて中の文章は左揃えになります。
657の補足で正しいセンタリングと書きましたが、正しいのではなくて
IEでも他のブラウザでもセンタリングさせるためには、という意味です。
660 :
646:03/02/09 13:01 ID:???
>>657-659 れすさんくす。成る程…大変解かりやすかった。思ったんですけど、
text align:center の部分も必要なのですか?div要素はmargin以降だけで
センタリングされそうですが。
>>660 IEだとmargin: auto;が効かなくてセンタリングされないようです。
IE6.0の標準準拠モードでは大丈夫ですが。
というわけで旧バージョンのIE対策としてtext-align: centerを入れておくのが
無難だと思います。
662 :
660:03/02/09 13:29 ID:???
>>661 そういうことかぁ。UAの事を考えてという事ですね。かっちりしたcode、
凄く参考になりました。本当に有難うございました。
663 :
618:03/02/10 00:45 ID:KRBwY/8f
664 :
618:03/02/10 01:20 ID:KRBwY/8f
.menuのwidthを100%にして、尚かつ下にいかないようにしたいんです・゚・(ノД`)・゚・
ずうずうし過ぎ
もう消えろ
>divはディヴィ
ハァ?
[Div]ision
668 :
神:03/02/10 02:24 ID:???
[Div]inely
669 :
656:03/02/10 02:45 ID:???
>>664 .title{
position: absolute;
top: 0;
left: 0;
width: 150px;
height:50px;
padding:0px;
border:3px dashed #666666;
background:#CCCCCC;
}
.menu{
position: absolute;
top: 0;
left: 151px;
width: 100%;
height: 50px;
padding: 0px;
border: 3px dashed #666666;
background: #CCCCCC;
}
width: 100%にするんだから横スクロールバーでるけどいいの?
とりあえずこれでウインドウ小さくしても下に回りこまないから。
あとは自分で調べてやってくれ。
って俺釣られてる気するんだけど…明日テストだっつーのに
670 :
656:03/02/10 02:52 ID:???
釣られついでにhtmlも直す。上のに追加して
ol {
margin: 0;
padding: 0;
}
li {
display: inline;
margin-right: 0.5em;
}
でhtmlは
<body>
<h2 class="title">TITLE</h2>
<ol class="menu">
<li>MENU-01</li>
<li>MENU-02</li>
</ol>
</body>
もう寝る。
<h1>を差し置いて<h2>から始めちゃいかーん
h1{
display: fuck!すっこんでろ!;
}
673 :
656:03/02/10 03:03 ID:???
>>671 まあそうなんだけど644の例がh2から始まってるからさ。
もうdivでいいんじゃねとか思ってきた。
/* そんなに怒らないでよ! */
675 :
674:03/02/10 03:04 ID:???
hr{
たまにはdisplay : none以外にも何か設定してよ;
}
>>676 マジレスだけど、UAによって解釈が違うので、borderやcolorで色々調節してるよ。
とは言っても、間もなく漏れのHTMLから<hr />は全て消えてしまうんだけど。
678 :
656:03/02/10 03:13 ID:???
>>676 h1 {
visibility: hidden
}
…ごめんなさい。ほんとにもう寝ます。
679 :
Name_Not_Found:03/02/10 15:43 ID:/gs5olTz
スタイルシートでこういうことは出来ますか?
各ページに「○○ランキング」というランキングが書かれた表
を掲載しようと思います。
そのランキング内容をCSSに書く。コードを各HTMLに記述する。
CSSの内容を変えると毎回ランキング内容を変えられる。
680 :
Name_Not_Found:03/02/10 16:04 ID:CXc9i16w
誤爆の予感
XSLTの予感。
どっちかというとXMLスレ向き?
……display:noneを駆使する?
未対応ブラウザでは意味が無いけど。
684 :
Name_Not_Found:03/02/10 16:51 ID:Ig9GOnvk
>>679 スタイルシートは見た目をコントロールするもので、
内容のコントロールをするものではありません。
なにがしたいか意味はわかりますが(似たような事をしようとした)
インラインフレームで別のページを読み込むか、
GCIに頼るしか方法はみつかりませんでした。
686 :
Name_Not_Found:03/02/10 18:25 ID:/gs5olTz
>>684 そうですか・・・そうですよね。
私もあれから調べたらCSSは見た目の変化で
内容は関係ないみたいですね。
そういうことができるCGIもないし、あってもシェアだし・・・難しい。
>>679 ssiでインクルード、の方向で検索をすすめる。
やり方はスレチガイなので言わんけど。
689 :
Name_Not_Found:03/02/11 01:12 ID:3IDKR41g
<div class="mainmenu">
<h2>メインメニュー</h2>
<ul>
<li><a href="page1.html">page1</a></li>
<li><a href="page2.html">page2</a></li>
<li><a href="page3.html">page3</a></li>
<li><a href="page4.html">page4</a></li>
</ul>
</div>
というhtmlに
div.mainmenu ul li{
display: inline;
margin: 0;
padding: 0;
border-right: solid 1px #000000;
}
div.mainmenu ul li a{
padding: 5px;
text-decoration: none;
}
というスタイルを摘要すると、IE5.5 IE6 ネスケ7 Mozilla 1.0.1 Opera6.05では
page1 | page2 | page3 | page4 |
というように線で区切って適度に間隔を空けli要素が横に並ぶのですが、
IE5.01だと
page1 page2 page3 page4
というように線は出ないし間隔はあかないし(文字としての半角スペースは空きますが)全然メニューとして使えないものになってしまいます。
私の記述がまずいんでしょうか?それともIE5.01が悪いのですか?バグ辞典には載ってないようなのですが・・・。
また、対処方法はなにかあるのでしょうか。
>>690 ここまでくると、確信犯とさえ思えてくるな……
>>690 ( ゚д゚)ポカーン...いや,690にじゃないけど.
>>689 div.mainmenu ul li{
display: inline;
margin: 0 5px 0 0;
padding: 5px;
border-right: solid 1px #000000;
}
div.mainmenu ul li a{
text-decoration: none;
}
手元にIE5.01ないんでわかんないんですけどこれでどうですか?
695 :
694:03/02/11 04:06 ID:???
┌─┬──┐
│ │ │
│ │ │
│ │ │
└─┴──┘
右側がコンテンツメニューで
左が日記の文章出力先。
こんなかんじのでカコイイCSS くれ
随分カコイイな
698 :
Name_Not_Found:03/02/11 06:47 ID:jb97s3rZ
<ul>あああ
<li>hoge1
<li>hoge2
</ul>
あああ
・hoge1
・hoge2
↑ここのマージンをなくすにはどうしたら良いでしょうか?
<ul>と<li>にmargin-left:0を設定すれば
IEではマージンがなくなるのですが
NN7ではなくならないのです。
padding-leftも0にしる。
>>699 素早いレスありがとございます。
解決致しました。
売るセーバか
704 :
Name_Not_Found:03/02/11 10:34 ID:GAQciZrb
擬似クラスa:link a:hover を外部CSSでページごとに指定する方法が
解りません。head内で今やってますが、.cssで全てやりたいので。
宜しくお願いします。
>690
私もある意味感動しますた。
>704
>4
うわさの
>>690のCSSリファレンス見た。
最初から飛ばしていて感動した。
<H1><P>スタイルシート</P></H1>
解説もいい加減でステキ。
>spanでやってみたらできなかったのでdiv使いました。
>こういう物だと暗記しましょう
でも、関心するよ。FrontPage使いこなせてるなぁ〜って。
CSSとテーブルレイアウトのフュージョンを見た。ハーモニーだね。これこそ、WEBのインプロ。
IT JAZZみたいな。
マジレッサーハッケソ
>>710 うん、マジで言ってるよ。徹夜してる状態のテンションだけどね。
>>712 ハーモニーですか。
通常のテンションで見てほしかったですね。
どっかの書籍のパターンに似てるとこも素敵だよね。
説明つかないとこは、いいかげんだし。俺も解説サイトつくってみよう。
muvc.netあたりで。
アダルトがらみかよ!
716 :
Name_Not_Found:03/02/11 12:48 ID:x0k/qa/S
>>690のサイトいきなり引用からはじまってるんですが
引用元はどこですか?
>>719 だな.
あれをみて「わかりますた!」とかいわれても困るけど.
ここは厨なリファレンスサイトを晒すスレでつか?
厨なリファレンスサイトを晒すスレきぼんぬ。
725 :
Name_Not_Found:03/02/11 17:57 ID:NU/thWsQ
外部シートでクラスを設定したクラスを<div class="***">と設定したときは
ちゃんと反映してたのに、見直したら反映されてません。なぜだか解りません。
他にもstyle〜なら反映されるのに外部シートにすると反映されない事があって、
外部CSSってバグが多いのかな?とか思ってます。教えて下さい。。。
>>725 サーバ上に上げた時の話か?
もうちょっと環境を書け。
727 :
725:03/02/11 18:15 ID:Di4bBrSU
いえ、まだ上げてません。が、ほぼ完成しています。
<div class=>に設定したクラスの中身(外部シートから)をコピーして、タグに直接
<div style=***>に貼り付けたら反映されます。???何故でしょうか?
>>727 CSSファイルへのパスは正確に指定した?
>>727 その外部シートにはどう記述してるの?
そしてその外部シートはどう読み込んでるの?
あとOSと使用ブラウザも書いて
731 :
716:03/02/11 18:22 ID:x0k/qa/S
>>717 すみません、、そこを見たけどさっぱりわかりません・・。
732 :
716:03/02/11 18:26 ID:???
すみません、DWをいじってたらできました
733 :
725:03/02/11 18:35 ID:???
パスはちゃんと通ってます。(他の全てのクラスは反映される)
Win98/tttでブラウザで同時に見ながらやってます。
.aaa{"border-color:#000000;..."}の中の、""部分(他にマージンとか沢山)を、
<div style=>に入れるとちゃんと出る。という感じ。
.aaa{"border-color:#000000;..."}
の""は激しく余計。
>>733 " " で囲わないでください。
.aaa { border-color : #000000; .... }
>>733 どこでプロパティと値を""で囲むなんて教えられてきたんだ?
そっちのほうが知りたい
埋め込むときのstyle="〜"の記述からの類推じゃない?
仕様を類推するなよ。
739 :
725:03/02/11 19:20 ID:???
激しく余計でした。ハズカスウィ。。。今までこんなまちがい無かったのに。
途中まで見えてたから(類推してくれてた?)余計気付かなかった。
でも素早いレスで解決してウレスィ。有難う。
まぁ、コピペにミスったんだろ。よかったね。
>>696 <html><body>
<div class="menu">
<h2>メインメニュー</h2>
<ul>
<li><a href="page1.html">メニュー1</a></li>
<li><a href="page2.html">メニュー2</a></li>
</ul>
</div>
<div class="main">
<p>本文</p>
</body></html>
↓でお礼言っとけ
くだらない質問を書くだけのスレ4
http://pc2.2ch.net/test/read.cgi/hp/1026576633/
類推して望みどおりになるということは、それだけそのブラウザが
優れているのだな。どんなに変なのを書いても類推してくれる
IEはやはり素晴らしい。ちょっとでも変なのは完全無視するネスケは
ユーザーに優しくない。普及しないのも当たり前。
早くcontentプロパティ対応して欲しいナァ。
ユーザースタイルシートにattr書いてもIEだと意味無いよ…(ノД`;)
>>742 でもそのせいで
新しく追加された(別のプロパティと類推してくれるような)プロパティで誤作動する罠。
>>742 それにより「変な書き方をしても良い」と解釈する厨が量産される罠
746 :
Name_Not_Found:03/02/11 20:55 ID:LC4WAtlj
HTMLが
<div class="main">
<div class="hoge">
hoge<br>hoge<br>hoge<br>hoge
</div>
<div class="geho">
geho<br>geho
</div>
</div>
<div class="footer">
footer
</div>
CSSが
.main{background-color:#333333;}
.hoge, .geho{float:left;}
.footer{clear:left;}
このときに背景色がつかないんですが、
どうすればいいですか?
.hoge .geho .footer に background-color 指定すればいいんじゃないの
ってゆう問題じゃないのかな
もしくは .main div{background-color:〜;}とか。
>>747 .mainにwidth: 100%; 等を指定するってのは?
750 :
746:03/02/11 21:29 ID:???
>>749 それで出来ました。ありがとうございます。
751 :
746:03/02/11 22:00 ID:LC4WAtlj
追加で質問なんですが、
>>746のCSSを
.main{background-color:#333333;width:100%}
.hoge, .geho{float:left;}
.geho{background-color:#999999;}
.footer{clear:left;}
にしたとき、hogeの右側全部にgehoの色をつけたいときは
どうすればいいんでしょうか?
このままだと"geho"と書いてある部分しか色がつきません。
>>751 .main{background-color:#999;width:100%}
.hoge, .geho{float:left;}
.hoge{background-color:#333;}
.footer{clear:left;}
無理矢理だけど。
753 :
746,751:03/02/11 22:10 ID:LC4WAtlj
すみません。聞き方悪かったです。
率直に言うと、hogeの右側全部をgehoの範囲にしたいんです。
>>742 そのCSS観は安い高校生の日本語観そっくりだな.
>>754 そんな抽象的な物を引き合いに出す前に、もうちょい日本語を勉強したほうがいいと思う。
そういう話題はよそでやって下さい。
もしくは質問形式にしてください。
>>757 たぶん、君は「必死」と書くことで優勢な立場にあるという錯覚、或は勘違いをしてるよ。
真性ではないことを祈る。
もうやめれ
しかし必死だな
position:relative
top: -100px;
↑みたいな感じでボックスを底上げした時、
そのボックスが本来あるはずだったと位置まで余白が
開いちゃうんですが、これを解消する方法はありませんか?
ちなみにWinにてIE6とネスケ6で確認。
>>762 relative属性について、よく調べてみると。何か書いてあるはず。
relativeは他要素、レイアウトに影響を与えると。
764 :
Name_Not_Found:03/02/12 01:37 ID:/48g0Wjy
今までテーブルレイアウトで乗り切ってきたんですが、現ページをツール使ってcssに変換すると
所謂div病ってやつになってしまいます。
css覚えるに超した事は無いと思うんですが、div病状態でもcssで公開するべきなんでしょうか?
>>764 その状態だと、公開してもしなくても(現状ままでも)変わらないと思います。
マークアップを修正してから公開するか、公開してからマークアップを修正するかはお好みで。
どっちにしても「テーブル厨」「div厨」と言う心ない人はいるわけですから・・・
>>764 文脈セレクタを使えばdivの数も減ると思うよ.
cssを使うためには正しいhtmlが必須だから,テーブルよりはよっぽどまし.
おマイら、ユーザースタイルシートにどんなプロパティ書いてますか?
漏れはスクロールバーの色が変わったり、カーソルが変わるのがウザイから
* {
scrollbar-base-color:#bbb !important;
scrollbar-3dlight-color:#bbb !important;
scrollbar-(中略)
cursor:auto !important;
}
って書いてます。
あの、
ページの幅を固定したい(600pxを最大の幅として、そこからコンテンツがはみ出ないようにしたい)
のですが、どういう設定が一番スマートな方法でしょうか?
Divタグで全体を囲む
使用する全てのタグ(H1とかPとか)に設定
ぐらいしか思いつきません・・・。
BODYにwidth:600;を設定できるとありがたいんですが、ききませんでした。
下位のPやHRに継承されると思ったんですが。
┃attention
 ̄ ̄ ̄ ̄ ̄
・このサイトは横幅600ピクセルで最適化されています
なのでウィンドウのサイズを600ピクセルに合わせて
閲覧してください。
┃attention
 ̄ ̄ ̄ ̄ ̄
ズレ補正テスト
そんな不便なサイト作るなよ
773 :
Name_Not_Found:03/02/12 03:57 ID:iv9hMX6x
floatの次に来る内容は、ブロック要素ではダメなんですか?
テキストだとうまくいくのに、それをdivで囲んだだけで
下にいっちゃうんですけど。
駄目じゃない
775 :
601:03/02/12 06:59 ID:OrogjXpv
自分でも色々試してみたんですが、どうも駄目でした…。
601でも書いたんですが、詳しく申し上げますと
HTMLが
<div class="contents">
<h2>contents</h2>
<ul>
<li>あああ
<li>いいい
<li>ううう
</ul>
</div>
<div class="page">
<h3>ページの内容</h3>
<p>文章とか</p>
<img src="
http://xxx/" width=200 height=40>
</div>
CSSが
div.contents{position:absolute; top:5em; left:1em;
background-color:#fbfbfb; width:15em; padding:0.5em;}
div.page{background-color:#fbfbfb; padding:0.5em;
margin-left:17em;}
大体こんな感じで段組してるんですが、
ウィンドウサイズを小さくしてdiv.pageの幅がある程度狭くなっても
それ以上小さくはならないようにしたいんですが
どうすればいいのでしょうか?
それともこの段組の仕方では無理なのでしょうか?
min-width はIE未対応だったっけか
html見ると、コンテンツ部分の幅が200px以下になったときに
画像がはみ出てるんだろうけど
そこまでウィンドウ小さくして見てる人はいないんじゃないかと。
>>776 あ、そうそう。透明の画像で最低幅を確保する、っててもあるな。
>>779 IEでmin-widthの代用ってあるか?
それ提案してから言えよ。
>>778はテーブルレイアウトと同レベルだろうが。
>769
単位が書いてないからだめなんじゃないの?
>>781 確かにstrictじゃないやり方を推奨するような書き方をしたのはまずかったな。すまん。
しかし、min-widthに代わるもの、ってある?
785 :
Name_Not_Found:03/02/12 15:41 ID:l98GTplI
スタイルシートって携帯アクセスには対応しないですか?
786 :
Name_Not_Found:03/02/12 16:01 ID:J1zGP8L9
教えて下さい。ぶちきれそうです。
外部CSSで .aaa{float:left;} として、
<div class="aaa">BBB</div>
<div>CCC</div>
とした時に、ie5.5ではちゃんとBBBCCCとでるのに、動作確認のため入れた
NN7.0だと、ほぼ重なってしまいます。divの幅、高さともpxでしていしています。
なんですかこれは?うがー!
>786
>6
>>786 / / / /( ∧ ) ヘ ヘ
く // ( /| | V )ノ( ( ( ヘ\ お て
┘/^| \ ( | |ヘ| レ _ヘ|ヘ ) _ヘ し め
/| .| | )) )/⌒""〜⌒"" iii\ え |
.| α _ ヘ レレ "⌒""ヘ〜⌒" ||||> て
_∠_ イ | | /⌒ソi |/⌒ヘ < や に
_ (_ ) ヘ | ‖ () || || () || _\ ん は
/ ( ) ヘ |i,ヘゝ=彳 入ゝ=彳,i|\ ね
/ー ( / """/ ー"""" > |
_) | ヘ(||ii ii|||iiii_/iii)ノヘ|||iiiii< |||||
| ( ヘ|||||iiii∠;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; フ ""'
///// ヘ_/ ) ヘ|||""ヘ===二二二===7フ / ム/∧ ∧ ∧
///// ( | ii | |LL|_|_LLL// | )( ∨| ∨)
・・・・・ ) )| || | |||||||||||||||||||||||| | | ( ヘ | ヘ ) (
___ | | /| .| |||/⌒/⌒ヘ | | | iiiiヘ ( | ( | /
/ / (|.| | | | | | iii ) | ヘ )( )
( ( /..| | |_____/ | | iii ( )( // /
\ ) )..| |ヘL|_|_L/ / / ,,,,--(/Vヘ)(/
790 :
786:03/02/12 17:28 ID:???
>>788 なんですかそれは。教えて下さい。うがー。もうヤになりそうです。
>>786 ネスケで段組やろうとしなければいいんじゃないの?
インポートでエスケープ。見栄えなど二の次。
>>791 >インポートでエスケープ。見栄えなど二の次。
?
>>792 @importでネスケには読ませなかったらいいんじゃないの?って意味。
CSS validatorでチェックして、エラーも警告も出ない。
でもvailed認定もされない。
間違ってるのか正しいのか何もわかりましぇん。
795 :
786:03/02/12 17:50 ID:???
NNみなきゃよかったよ。…でも、ひょっとして回り込みをさせるものって、
ブロック要素はだめ(NNの動作が正しい?)なんですか?
>6あたりかたっぱしから見てもイマイチ解らん。
>>793 ネスケ4は@importで回避できるけど、7は無理だろ、というツッコミなのでは。
>>795 とりあえず、もうちょっと詳細にソースさらしてみ。
あと、「ほぼ重なってしまいます」の意味がよくわかんないから、
そこらへんも第三者に理解できるよう詳しく。
798 :
786:03/02/12 18:15 ID:???
2つのボックス(縦600px横200px)を作り、それぞれのブロックに文章を
いれています。ソースはそのまんま。全くシンプル。他に複雑な事もしてません
(lintチェック100)
外部CSS .aaa{float:left;} として、
<div class="aaa">文章</div>
<div>文章</div>
┏━━━━┓
┃┏━━━━┓
┃┃ ┃┃
┗━━━━┛┃
┗━━━━┛
こんなんなっちゃいます。ieではちゃんと 文章→文章 と出るのに。
.aaa,.bbb {width:600px;height:200px;float:left;}
<div class="aaa">文章1</div>
<div class="bbb">文章2</div>
このあとに続く要素には clear
>>798 ボックスには2つともfloat: leftしてる?
801 :
800:03/02/12 18:35 ID:???
かぶった。
>>799のやり方にすれば絶対問題ないはず。
他のスタイルが影響してなければ。
>>798 以下
>>6より
>Q: なんかMacIEやOperaでフロートの表示が崩れるみたいなんですけど?
>A: floatさせる要素にはwidth指定が必須(img要素以外)。
> これ、CSSの仕様書の決まりなんです。WinIEが勝手に補ってるだけです。
読んだのか?
漏れもカブった。ゴメソ。
804 :
786:03/02/12 18:44 ID:???
>>799>>800 3番目にはclearしてますが、2番目にもfloarを?…してません。
さっそくやってみます。
>>804 二つ目のボックスもfloatしないと二つ目のボックスの内容が一つ目のボックスより
大きかったら、一つ目のボックスの下に回りこむよ。
回り込まないIEの仕様が間違っている。
よってブラウザ責める前に
>>6読みなさい。
806 :
786:03/02/12 19:03 ID:???
で・出来ました。感激。文章2の後、回りこみをしないので、floatはいらなく、
3番目でclearすればよいかと思ってました。仕様ではなくIEそのものに合わせて
しまっている事が結構あるみたいです…勉強不足でした。
皆さん本当に有難う。ごめんねNN7。
807 :
NN7:03/02/12 19:15 ID:???
808 :
769:03/02/12 19:21 ID:???
俺が言ってるのは文章が横にだだっ広いと
読みにくいから指定幅以上に拡げたくないのと、
それに会わせてHRとかも一括で
サイズを合わせられる方法を知りたいんです。
>>770 ウィンドウのサイズはどうでもいいんですよ。
俺が言ってるのは、ウィンドウのサイズを極端に
拡げたときにコンテンツまで横に伸びるのが嫌なだけです。
あと、あんまりにもウィンドウを縮めた時に、最低でも500px
ぐらいあった方が読みやすいと思ってるからです。
>>772 どの辺が不便でしょうか?
ずいぶん偉そうですね
>>809 / \
/ ∧ ∧ \
| ・ ・ |
| )●( |
| \__/ |
\ \ノ /
\____/
_| |_
/ \
< <~| |~> 〉
\`| |'_ノ
/ \
//O| |O\\
// // \\
| | //= ヽ | |
| | // 二 \||
| | (_ノ ― = )| |
(_) (_)
バナナが一本ありました〜バナナンバナナンバナナ♪
>>809 ζ
/ ̄ ̄ ̄ ̄\
/ \
/\ . \ /|
/´ ヽ .一 一|. ヽ
| / |-----◯⌒つ| |
. | | _||||||||| | | 一生、一緒にいてくれや〜
| | / \_/ / |
. | |\____/ 丿
ノヽ` ノヽ ` /
/ ,/ソ \ /
( ,/ `´ |
\ イ ´ |
\ ヽ \ 八 ノ
ヽ ` ー ´人` /
\ / ´,、ヽノ
ノ⌒ / |
/ ノ_
| ノ ヽ 丿 \
/⌒l |. / \
/ l,丿 , っ . \
| / ´ /⌒`l \
丿 / , ./ ヽ ヽ |.
/ |, | / )\ ヽ
ヽ ノ ヽ__,/ . ( _\_ |
(_)__)|___,/:::::::: ::::::(__)_)_)ヽ、__/:::::
_,,.. -─‐- .、.._.
,. ‐''"´ ``'‐.、
,.‐´ `‐.、
/ \.
,i´ `:、
/ ヽ.
,i ,,,,;;::''''' i、
.i ,,,,;;::::::::::::::: __ i.
.i " __ :::: '"ゞ'-' l
| - '"-ゞ'-' ::::::... |. / ̄ ̄ ̄ ̄ ̄ ̄
| ::::::: (⌒) .| < 劣悪遺伝子は根絶やしな
| ( ,-、 ,:‐、  ̄ | \______
. l . (⌒) l.
. i、  ̄ __,-'ニニニヽ . ,i
. i、 ヾニ二ン" ,!
. ヽ /
. `:、 ,‐'
\ /
`‐、 , ‐´
` '‐.、 _ _, ‐''"
`` ‐-----‐ '"´
>>809 田舎者はだまっていろ
埼玉でおとなしくしてろ
なんだ キチガイか
なんていうか、教えてやるんだからって偉そうな奴ばっかりだな。
文句があるなら来なきゃいいですか?(^-^)
ヽ::::::::::::::::::/ :::::::: \::::|_
):::::::::::::::| ::::*::::: ヽ:|::::ヽ
/::::::::::::::::| ::;;;;: l::::::::ヽ
/::::::::::::::::::| ノ::ii:ヽ:: l::::::::::|
|::::::::::::::::::::| /::::;リ:::l:::: |::::::::::::|
|:::::::::::::::::::::l ...l::::;リ:::/:: /:::::::::::::|
.|::::::::::::::::::::::l . /:ア/::: /:::::::::::::::i
l:::::::::::::::::::::::::l ./::`^::::: /:::::::::::::::::/
ヽ::::::::::::::::::::::::l /:::::::::: /:::::::::::::::::::/
/:::::::::::::::::::::::l /::::::::::::: /::::::::::::::::::::::/
/::::::::::::::::::::::::i __-ー--=;;;:::::::::::::: ....::::/:::::::::::::::::::::::/
./:::::::::::::::::::::::::::i"::::::::::::::: ヾ─ 、/"ヽ:/::::::::::::::::::::::::::::l
ヽ::::::::::::::::::::::丶:::::::::: / il .ヽ:::::::::::::::::::::::::::/
\::::::::::::::::::::ヽ::::::: / l ! ヽ:::::::::::::::::::/
ii::::::::::::::::::` -::-/ / .i ヽ::::::::/
----- ̄丶/ lヽ ヽ/
(・3・) アルェ〜 ここの住人てどっちもばかなのかNA?
>>769 widthはブロック要素と一部のインライン要素にしか適用できません。
だから全体を<div>で囲うとかしかないと思います。
あとてめーが読みやすいと思うサイズが全ての人にとって読みやすいわけではない
ことがわかればもっとCSSを上手に使いこなせると思います。
(・3・) エェー ぼるじょあよりばかがいるYO!
821 :
819:03/02/12 20:02 ID:???
荒れてるんで具体的に不便だと思う点を言うと、
ウインドウサイズ小さくしてる人は横スクロールバーが出る→これはかなりうざい
逆にウインドウサイズが大きい人も600pxで折り返されるのが読みづらいって
思う人もいるってことです。
つまり、レイアウトは禁止と。
(・3・) アルェ〜 ぼるじょあは荒らしてないYO!
人 人 人
( Y Y )
/\__/
/ / \
/ / ヽ
(⌒ / ・ つ ・ |
( (6 | / ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄
( | ー― | < ファックユー
\ / \_____________
\____/
>>821 min-widthとmax-widthをきちんと実装しているブラウザ以外は無視する
というのであれば、横幅固定もいいかもしれないが。
今のところ、MozillaとOperaぐらい?
# min-widthとmax-widthで柔軟に対応するなら、そもそも横幅固定する
# 必要ないんじゃ、というのは内緒な。
受験が終わったからかねぇ……
幅固定ウゼーよ。
827 :
819:03/02/12 21:23 ID:???
>>822 いやwidth固定はよくないってことを言いたいだけで。
ってのはユーザにとってwidth固定はあまりにも閲覧の自由度が制限されるから。
つかレイアウトだって第一には見やすさを考慮するでしょ?
ならユーザーCSS使えって言うならそれは製作者としてどうかと思う。
>>824 max-widthを相対指定にするってことだよね?
828 :
824:03/02/12 21:24 ID:???
div {
width : 600px; /* 通常、幅は600px */
min-width : 90%; /* ただし、ウィンドウ幅の90%以上には広がらない */
max-width : 60%; /* また、ウィンドウ幅の60%以下には縮まらない */
}
これで、ウィンドウ幅が狭い場合も横スクロールバーは出ないし、
ウィンドウ幅が広い場合も、左右が極端に空くこともない。
ただし、IEは対応してない。
829 :
Name_Not_Found:03/02/12 21:36 ID:cQWnnIAA
830 :
819:03/02/12 21:45 ID:???
>>828 なるほど。それなら横スクロールバーでなくていいね。
今使ってるPC800×600だから横幅600pxに固定されるとお気に入り表示した時に
横スクロールバー出るからさ。スレ違いか。
>>829 「色取鳥」で検索。
あとは自分で頑張れ。
832 :
824:03/02/12 22:49 ID:???
>>830 自分で例示しておいてなんだが、正直、ここまでやるぐらいなら、
body { width : 90%; }
とだけ指定して、ウィンドウ幅が広くて読みづらいって奴は、自分で
エクスプローラバー(IE)なり、スライドバー(Netscape)なり、
ホットリスト(Opera)なりを出してお好みの幅に調節してもらった方
がいいな、と思わないでもない。
スタイルシート使うヤツのレベルが下がってきてる。
頼むから、幅固定したいヤツは黙ってテーブルレイアウトしとけ。
>>833 レベルの高かった昔でも幅固定しているページはあったけどな。
CSSのレベルは今のところ2までしかない訳だが。
・・・あれ?違うの?(´Д`;)
836 :
769:03/02/12 23:50 ID:???
>>819 そうなんですか。
やっぱり、全体を囲むか・・・。
全ての方の満足のいくようにするにはなかなか難しいと思いますし、現実的にはどこかで
妥協も必要じゃないかと思うんです。僕の線引きは、大多数だと思うPCからIE・ネスケ・オペラでブラウジングしている
方で、少なくとも500px以上で閲覧する方々を対象にしたいと思っています。
レイアウトや技術的な面でも私の現状ではこれが精一杯ですし、それほど時間的な
余裕もありません。
>>821 横スクロールバー→少なくともそれ以上で見て欲しいと言うことなんです。たいていの方は500px以上の環境で
閲覧していると思うんです。
僕は横に画面イッパイに文字が拡がるのが読みにくいという感覚をもっていますし、
2ちゃんねるの書き込みでも改行をいれろという文句をたまに聞くので、たいていの方は
アル程度の幅が読みやすいんではないかと思うんですよ。
>>828 僕へのレスでしょうか。
親切にありがとうございます。
でも、IEユーザーを切り捨てるのはちょっと。
>>832 BODYへはwidth指定できないそうですよ。
それだと簡単でいいんですけどね。
837 :
769:03/02/13 00:07 ID:???
あ、言い忘れましたが、600pxじゃなくて、500〜600pxの間で
800×600の環境でお気に入りとかを拡げても多少余裕のあるサイズで幅を制限したいんですよ。
一応解像度を変えて確認もしてます。
これでもダメなんでしょうか。
確かに、大きい幅に固定されてスクロールバーが表示されると非常に見にくいですが、
それが幅固定が絶対だめとは僕は思いません。
当然、固定しない方が自由度が高いですし、中には画面いっぱいの横幅に拡げて読みたい方もいらっしゃるのかもしれませんが、僕的には通常文章に関して言えば限度によりますが、適度な幅というのがあると思うんです。
そして、その幅にあわせて画像や文のタイトルなども位置を合わせたいのです。
そうすると、表示する幅自体を固定するのが適当な方法だと思うんですよ。
そうすれば、画像などもalignでleftと指定できますし。(表示する幅を固定しなければ、本当に画面の左の端にいってしまって文章とずれてしまうんですよ・・・。数値で指定もできますが・・・。)
838 :
819:03/02/13 00:09 ID:???
>>836 おっけーわかりました。その辺は自己判断で。
ただ一個だけ質問させてください。煽りじゃないですよ。
確かに今多くの人は1024×768のディスプレイ使ってるとは思いますが、
その人達にとってみやすい幅が500pxとするならば、width: 50%、
つまりウインドウ最大で512pxくらいになるわけですがこれじゃだめなんですか?
逆に僕には幅を固定しなければならないコンテンツってのが想定できないんですよ。
どうしても見せたい画像が500pxあるとかならわからないでもないんですが。
俺はウィンドウ最大化してブラウズすることなんて滅多にない。
幅固定は迷惑。こっちの好きなように調節させて欲しいと思う。
840 :
819:03/02/13 00:14 ID:???
あ、書き込んでるうちにレスが・・・
画像の位置はcssでやるべきじゃないですか?
ある程度自由な位置にレイアウトできますよ。
>>838 ああ、それでもいいですね・・・。
あまりにも幅が狭い時にレイアウトが崩れちゃうのが嫌だったこともあって
固定がてっとりばやいかなと思ってたんです。
透明GIFでつっかえ棒して最低幅を指定するやり方(ダメらしいですが)を
前に使っていたのでスタイルシートに移行するにあたって、
横スクロールバーが出なければ幅固定でもイイかなと。
確かにどうしても固定しなければ行けないコンテンツなんかないですが・・・。
それ以前に本当にそれをネットで世界中に公開したいのかと問われると
困ってしまうようなコンテンツですが。
842 :
769:03/02/13 00:33 ID:???
>>839 いえ、だからそう言う方の場合も考慮してだいたい500pxぐらいなら
支障ないんじゃないかなと思ってるんですが・・・。
僕も最大化はしないです。
>>840 基本的にレイアウトは全てCSSでやってます。
ただ、数値でがちがちに固定するのはちょっと抵抗があるので、出来るだけ
親要素を基にして相対的に指定したいんですよ。(ここの所、幅固定と矛盾してますね・・・・)
ん?やっぱり、838さんの言うとおりでいいのかな・・・。
ちょっと実際に試してからまた来ます。
お騒がせしました。
>>842 >いえ、だからそう言う方の場合も考慮してだいたい500pxぐらいなら
>支障ないんじゃないかなと思ってるんですが・・・。
だったら見る側が500pxぐらいにウィンドウをリサイズするだろーが。
親切だと思ってるようだが、はっきり言って余計なお世話だぞ。
自分が見やすいと思ったからと言って、他人もそう思うとは限らない。
見る側が調節できるという自由を奪ってどうする。文字サイズ固定と変わらんぞ。
844 :
601:03/02/13 00:52 ID:uq1keAKk
>>776 実際にはコンテンツ部分で15em分の幅を取っているため、
そこまで小さくなくてもはみ出てしまうんです。
>>784 透明の画像で幅を確保しようとしても駄目でした…。
>>844 min-widthの使い方分かってる?
>>842 おれ、タブブラウザ使っているから、左にエクスプローラバーがあるのよ
だから、幅は500pxも保てない
>>846 いや、min-widthの代用の透明画像を使う、って事は、
「これ以上縮まないように」って事になるはずだけど、
601の言ってることは、「はみ出る」だから、上のやり方では解決しないと思って。
#透明画像の場合、大きいときは%指定、縮めてもこのサイズ以下にならない(改行されない)ように、みたいな使い方かな。
849 :
819:03/02/13 01:01 ID:???
>>843 最後に一つ。
色々試したらきっと相対指定のメリットに気付けると思います。
特にcssで凝った段組とかする時幅を相対指定したほうが
ウインドウサイズに依存せずにレイアウトできるし。
それと最初のほうのレスで煽りっぽいこと書いてごめんなさい。
がんばって。
851 :
843:03/02/13 01:19 ID:???
>>849 さっきまでは利用者のことを考慮してる風な発言だったのに、
なぜ急に「作り手側の利便性」を述べ始める?
「気付ける」とか「がんばって」とかいちいち人を見下すのはやめてくれ。
852 :
601:03/02/13 01:35 ID:uq1keAKk
>>846 動作はIEとNNとoperaとmozillaで確認してます。
NNでは画像がはみ出て、IEだとdiv.page部分が画像サイズに固定され
横スクロールバーが出てウィンドウサイズから出るんですが、
文字だけウィンドウサイズに収まるという状況になってしまうんです。
>>848 透明画像を使ってもそれ自体が「はみ出て」しまいますからね…。
853 :
819:03/02/13 01:43 ID:???
>>851 いや基本的にレイアウトはCSSでやってるって言ってたからそれならと思って
アドバイスしたんだけど。
ウインドウサイズに依存しないレイアウト=利用者側のメリットだと思うし。
気に障ったならすまんです。
なんかレス間違いでケンカになってないか
856 :
819:03/02/13 01:57 ID:???
857 :
819:03/02/13 01:59 ID:???
↑
>>848でなくて
>>852だった…
ごめんなさいごめんなさい。ついでにサーバに負荷かけてごめんなさい。
もうだめだ逝ってきます…
859 :
819:03/02/13 02:49 ID:???
>>601 N7でdiv.page {min-width: 200px}で画像はみ出す?
やってみたけどちゃんと右側が200pxで収まってるけど・・・?
あととりあえず仕様通りwidthも指定しなきゃならないよね。
んでIE対策としてdiv.page h3{width: 200px}にしてつっかえ棒的にしてみたんだけど
<p>の幅がやっぱりおかしくなって駄目だった。
もう少しがんばってみるけど僕のスキルじゃ無理っぽい。
860 :
819:03/02/13 02:54 ID:???
今思いついたんだけど
<p><img src="200pxのgif">文章とか</p>
で駄目か?全然スマートじゃないけど。
861 :
819:03/02/13 03:06 ID:???
>>860 だめでした無視してください。
つかやっぱり無理でした・・・。でしゃばってすいません。
俺はこいつの慌てぶりを楽しんでる
863 :
819:03/02/13 03:15 ID:???
864 :
Name_Not_Found:03/02/13 03:15 ID:TGBkfC81
あの、教えて下さい。
外部CSSファイルの中で、…} と、/**/ の間の空白(スペース)をいくつか
削る前と後で動作が全く変わるのは、なんですかこれは!!
もういやになりそうです。
幅固定されるのが嫌な香具師はユーザー定義スタイルシートつかえ。
867 :
769:03/02/13 03:18 ID:???
>>838 さんのやり方で行くことに決めました。
ありがとうございました。
>>843 えー・・基本的にデザインに凝ったりしたいので(その是非については個人的なことなのでご勘弁を)
画面サイズはある程度固定したいわけで・・・。
それを前提として、できるだけ多くの人にも見ていただけるにはどうしたらいいかと思ってお聞きしています。
ですので、親切ではないです。
閲覧できないなどの致命的なものや、大多数の方に不都合が生じる
場合を除いて、レイアウトと自由度とを比べるならばレイアウトを取らざるをえません。
僕が悩んでいるのはこの両者の釣り合いのことです。
自分の思い描いたレイアウトを実現すると同時に、できるだけ読み手側を配慮する。
・・・まあ、僕がウィンドウサイズに関係ないデザインを創れるようであれば最良なんですが。
それほどのデザインかよ!とかいうのはやめて下さい。
>>849 ありがとうございました。
解決しました。
>>864 「/* */」の意味を理解して無いんじゃない?
他人のcssをコピペするだけじゃなく、
きちんと解説サイトで知識を身に付けることをオススメする。
説明かクレジットを消そうとしたわけか
そのまま嫌になっちゃえばいいのに。
コメント挿入が必須だと勘違いしてる様子だな
なんですかこれは!!
↓
ウェブサイトを立ち上げると言うことは個人の表現方法の一つであり、アートである。つまり
それはその製作者自身であり、他人に迷惑をかけるモノでない限り他者はそれについて
好き嫌いは論じることができても、善悪の評価を下すことはできない。なぜなら、全ての人間において
善悪という価値を定めることは誰にも出来ないからである。自らを省みずに他人の人格を全否定するようなことができる
人間がこの世にいるであろうか。
よって、幅固定にかかわらず、文字サイズ固定、全ページFLASHなどについて
他人は好き嫌いといった評価はできても、個人的な善悪の判断による強制はするべきではないのである。
我々に出来るのは、そういった人々を正しい道へ誘導してあげるべく、アドバイスをすることだけである。
↑
論理破綻の典型的な1例
結局、実質的にもっとも多くのブラウザで安全にサポートされてるデザイン方法はテーブルであるのでテーブルを使ったレイアウトが現実的に最も安全な手段である。
●か×か?
>>875 こういうのは「紋切り型」って言うんだよ。
既知のことを「である」調でもっともらしく言う、ってのね。
>>874 一理あるよね。
確かに押しつけるべきではないかも。
>ウェブサイトを立ち上げると言うことは個人の表現方法の一つであり、アートである。
商用サイトの立場は無視か
>全ての人間において善悪という価値を定めることは誰にも出来ないからである
おまいは悪
>自らを省みずに他人の人格を全否定するようなことができる人間がこの世にいるであろうか。
俺のこと?
>我々に出来るのは、そういった人々を正しい道へ誘導してあげるべく、アドバイスをすることだけである。
「正しい道へ誘導」は善悪という価値を定めてる
>>878 ▲かな。
レイアウトしない、がもっとも安全だよ。
>>879 それが紋切り型っていうのか。勉強になった。でもここの住民は既知じゃないらしいね?基地外はいるみたいだけど。
>>883 わからずにやってるのと、わかったうえでやってるのとの違いが分からないと「である」調がますます滑稽だよね。
886 :
Name_Not_Found:03/02/13 03:43 ID:TGBkfC81
他人のコピペやってませんが…。どうしてそんな事がわかるんだ?不思議だ。
SGMLがもっとも安全だろ
888 :
882:03/02/13 03:44 ID:???
>>885 俺は振り分けてるんだけどね。
全ブラウザに同じ表示、って無理があると思うし、そこまで必要だとも思わんし。
必要なのは、見易さ、とかでしょ。
>>890 ネットスケイプなぞいれとうない
オペラなぞいれとうない
895 :
601:03/02/13 03:48 ID:uq1keAKk
>>859 min-widthでN6,7ではちゃんと表示できたのですが、
IE等多くのブラウザでは対応してないので結局問題の解決にはならないのです。
div.pageのwidthを指定したいところなんですが、
div.contentsで15emの幅を取っているため、%だと色々問題が出ますし、
固定するとウィンドウサイズがかなり限定されてしまいます。
なのでとりあえずwidth:auto;という形をとるしか…。
>>894 入れんでもフロートとマージン関係使わなかったら大概いけるような気もする。
俺が他の要素を盛り込んでないせいかも知れんが。
899 :
891:03/02/13 03:50 ID:???
>>895 div.pageのwidthを指定した方が後々楽でいいよ。
分かった、ふり〜そざい☆だろ?
スペースとインデントの影響がわかんねーんじゃ。
902 :
891:03/02/13 03:50 ID:???
>>898 ああ、お前が反吐がでるほど嫌になったよ。
>>902 ちょっと待て、891書いたの俺なんだが。
お前は俺か?
904 :
891:03/02/13 03:52 ID:???
905 :
891:03/02/13 03:53 ID:???
ちんぽこ
907 :
891:03/02/13 03:54 ID:???
これからずーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーと続くよ。
NN7ってNN4に上書きされる?
されないんだったら入れたいんだけど。
カスケーディングスタイルシートを使わずに配置を決めたいんですがテーブルの他に方法はないか?
>>909 わがまますぎ。
クリッカブルマップでも使っとけ。
>>911 されるやつとされないやつが存在するブラウザってのがあるから聞いてるんだけどな。
それ以前の知識の人は黙らっしゃい。
>>914 他に方法あるか?俺はとりあえず思いつかん。
916 :
601:03/02/13 04:01 ID:uq1keAKk
>>899 指定はかなり難しいですねぇ。
数式とか使えたら別なんですが…。
100%-16emとか
>>900 floatは使ってません。
>>909 >カスケーディングスタイルシートを使わずに配置を決めたい
この時点でスレ違いだと思うんだが。
>>913 それが人にものを聞くときの態度か?
されないからいってるんだよ。
黙ってインストールしろ。
>>916 ファンデーションは使ってません。
>>895 IEだとどうしても<p>の内容がウインドウの表示領域で折り返されるね。
widthは絶対指定しないと無理なのかも。役に立てずにごめん。
>>867 いや色々ごめんよ。
920 :
909:03/02/13 04:08 ID:???
どないにしろ、こんな夜分遅くまで起きとるやつにろくな奴はおらんわな。w
わしみたいに下の奴らだけ使う身分になるとこういう社会人らしからぬ生活も可能だが。(各爆)
とりあえず一発ヌいといた。
夜中の不思議なテンションでムラムラする。
男っていつもそんなことばっかりしてんの?
たまたまだよ。
ちょうど最近ストレス溜まってたし、
これで気が紛れるなら安いものだ。
ふーん、へんなの
926 :
601:03/02/13 04:28 ID:uq1keAKk
今のところGIFとかPNGとかで固定するのが最も安全だよ
929 :
601:03/02/13 04:47 ID:uq1keAKk
透明GIFですか…。
うーん、画像で固定しても文章が改行されないのはなぜでしょうか…。
(WзW;
>>926 あれれ?
いま見てみたけど、お気に入りの幅を広げてもぴたっと固定されるなんてことなかったよ?
文字が縦2列くらいになると止まるようだけど。
IEでみると。
背景画像を画面の左端と右端の2箇所に固定することは可能ですか?
画像ファイルは同一のものです。
┏━━━━━━┓
┃画像 画像 ┃
┃ ┃
┃ ┃
┗━━━━━━┛
可能でしょう
935 :
933:03/02/13 05:54 ID:???
回答感謝いたします。
重ね重ねお手を煩わせる事になりますが、
それを実現する方法を教えていただきたく思います。
わからないよ。
でしょうとかいたのはそのためです。
もう寝た方がいいよ
>>918 ようするに上書きされないのね。ありまと。
こんなんでどう?
--------------------------------------------------
/* CSS、スタイルシート質問スレッド【15】 */
Cascading Style Sheetsの事で尋ねたいことがあったらこちらへどうぞ。
※ マターリ進行推奨 ※
■■■■■ 注意 ■■■■■
質問者 (特に「初心者」) は、
必ず【関連リンク】にある解説サイト (かなりわかりやすい) で
勉 強 してください。
質問の前に、まず【FAQ】を参照してください。
【FAQ】でわからなかった場合は、過去ログを検索しましょう。
WinIEの場合は、[Ctrl+F]で検索できます。
また、IE などではまだ対応できていない要素などやバグが多数存在します。
ですので、【関連リンク】の「バグ辞典」に目を通しておきましょう。
また、「環境を書け」とか「ソースは?」と求められたときは
応じるようにしましょう。回答が早く返るようにするためです。
特にNetscapeについては、ヴァージョンについても必ず明記する
ようにしてください。ネスケは、4までと6以降でまったく別物です。
【FAQ】
http://fake_lint.tripod.co.jp/css.html#faq 【過去ログ】
http://fake_lint.tripod.co.jp/css.html#log 【関連リンク】
http://fake_lint.tripod.co.jp/css.html#related
>>935 <img src="画像のURL" width="希望する幅">
これでこれ以下の幅にならないでしょ。
>>933 ためしたことはないけど,bodyに右側のバックグラウンドを指定して,
body直下にdivをおいて左側のバックグラウンドを指定して,中身はdivの中に書くってのはどうだ?
まあ,HTMLは汚くなるが.
943 :
941:03/02/13 09:38 ID:???
>>935 うわ、つっかえと勘違いしてた。すまん。
ちょっと作って見る。
944 :
941:03/02/13 09:42 ID:???
>>935 .waku{
border-width : 1px 1px 1px 1px;
border-style : solid solid solid solid;
border-color : black black black black;
width : 30em;
}
.hidariwaku{
width : auto;
float : left;
}
.migiwaku{
width : auto;
float : left;
}
.hidari{
float : right;
}
<DIV class="waku">
<DIV class="hidariwaku"><IMG src="aaa.gif"></DIV>
<DIV class="migiwaku"><IMG src="aaa.gif" class="hidari"></DIV>
本文</DIV>
945 :
941:03/02/13 09:43 ID:???
細かいミスが多いし汚いな。
<P>とかは補足してください。
こんなんじゃだめですか?
( ゜д゜)ポカーン
ポカーンの予感(´・ω・`)
(・3・) アルェー
これにはぼるじょあもポカーンとしたYO
あのねえ、馬鹿は回答しなくていいと思うんだ。
禿同
ごめん 新スレ立てられなかった
>946-949
じゃあ、あなたがたが教えてくださるのですか?
お願いします。
(´-`).。oO(そして、誰も答えられなかったとさ…
>951-952
>942
>>942 実は、933は背景画像「固定」と言ってるので、
CSS2の仕様上、実現できないUAも存在するという罠。
>941
( ゚д゚)ポカーン
ある意味感動しますた。
>933
同じような感じで上下バージョンでやってみたことがあるんだけど、
私はBODYの背景に上画像を指定して、中のコンテンツに下画像を指定しました。
動かないものをBODYに置いて、ウィンドウサイズに合わせたいものを下にって事で。
参考になるかな。
941はあのリファレンスサイトの作者だろ
新スレまだ?
おれ立てる?
961 :
958:03/02/13 17:29 ID:???
埋め?
16の時はテンプレをもう少し圧縮してほしい。
厨の季節も近づいてきたけど、
今の
>>1はあまりにも長い。長すぎる。
そしてごちゃごちゃしている。
誰か改正案きぼんぬ。
15になってよくなった。15スレの壱、ありがとう。
964 :
955:03/02/13 23:46 ID:???
あれ。間違えてた!
>941さん、失礼しました。
>956さん教えてくれてありがとう。
965 :
601:03/02/14 00:02 ID:UbAWoFgQ
色々サイトを巡って調べたんですが、どうやらDIVの背景から画像がはみ出たり
するのは、CSSの仕様なのですね…。
そんな仕様あるか
967 :
601:03/02/14 00:15 ID:UbAWoFgQ
969 :
601:03/02/14 00:25 ID:UbAWoFgQ
>>968 C:幅を定めた背景から、文字がはみ出してしまう
というところ。
>>933 これ前から気になって、しようがなかったんだよね。
結局、綺麗に(ソース・Strictは別として見た目だけ)両サイドに背景画像を指定する方法は
frameにたよる。3分割して、両サイドに背景画像。非推奨属性使いまくる。
CSSスレでこんなレスで申し訳ないけど、これひかおもひつかなひ。
>>970 変換できないんですか?
ちんこですよ。そんなのチンコです。
<h1 class="title">あいうえ<span style="font-size:150%">お</span></h1>
としたときspanでのstyle指定って1つしかできないの?
「お」のfont-weightも指定したいんだけど。
>>972
<h1 class="title">あいうえ<span style="font-size:150%; Font-weight:**;">お</span></h1>
<P>下半身もだえ組</P>
>>973 速レスサンクス。
セミコロンか・・・。スタイルシートの基本中の基本か・・・
ウツダシノウ
>>976 複数無くても、普段からつけて置いた方がいいですよ。
>>977 聞いておいてそれはなかろう。
>>978 マジレスかYO!!意味わかんねぇ・・・
せっかくだから埋めついでにくだらない質問。
みんなNN4にはスタイルシート読ませてる?
俺のサイトはNN4にもし読ませたらレイアウトは激しく崩れまくるけど
文を読むだけならさほどの支障はない。
この場合読ませたほうがいい?
素のhtml表示っつーのも少しさびしい気がするし。
好きなようにやればいい。俺は読ませてない。
>>981 ネスケ4の中でも初期のバージョンは特に不安定
(CSS読んだせいで落ちたりする)らしいので、
読ませない方が無難ではある。
そんなバグだらけのブラウザしらねえよ!
と開き直るのもひとつの手。
ちなみに俺は、レイアウトが崩れるだけで
なくて読めなくなるようなスタイルを適用
してるので、@impoでネスケ4は避けてる。
N4でもそれ以外でも適用できるCSSを探し続けるのもオツ.
>>984 すべてのバージョンで試せる環境が整ってるならな。
>>985 いや本筋とちょっと違う質問だから埋めついでにさ。
ちなみにうちもmedia属性でNN4は切ってる。
もし生かしたとしても効いてるスタイルは文字色と背景色とfloatくらい。(NN4.8で確認)
border関係は全滅。widthもおかしくなる。スタイルの継承もだめだめ。
>>983 >>986 確かにNN4といっても一括りにできないもんね。
無難に無効にしときます。
ブラウザの端から端まで線引くにはどうすればいいでしょう?
------------------------------------------------------------------------------
端から端まで線を引く
------------------------------------------------------------------------------
<HR STYLE="width:100%;">
1000!
992 :
Name_Not_Found:03/02/15 19:34 ID:7OIm6Fru
∧ ∧
|1/ |1/
/ ̄ ̄ ̄`ヽ、
/ ,, ヽ
/ 丿 \ |
| (●) (●) |
/ | さすがのムーミンも
/ ^ |
{ /| | このスレには
ヽ、. /丿ノ |
``ー――‐''" | 呆れ果てているようです
./ . | |
(⌒―| | ゙―^⌒)
. ̄ ̄|  ̄ ̄| ̄
\______ ______________________/
○
モワモワ O 。
, ─ヽ
________ /,/\ヾ\ / ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄
|__|__|__|_ __((´∀`\ )< というお話だったのサ
|_|__|__|__ /ノへゝ/''' )ヽ \_________
||__| | | \゚д゚) / 丿/
|_|_| 从.从从 | \__ ̄ ̄⊂|丿/
|__|| 从人人从. | /\__/::::::|||
|_|_|///ヽヾ\ / ::::::::::::ゝ/||
────────(~〜ヽ::::::::::::|/ = 完 =