/* CSS・スタイルシート質問スレッド【25】 */
1 :
Name_Not_Found:
2 :
Name_Not_Found:03/11/19 13:35 ID:SK1Vr9dR
4 :
Name_Not_Found:03/11/19 13:35 ID:SK1Vr9dR
7 :
Name_Not_Found:03/11/19 13:37 ID:SK1Vr9dR
>1
激しく乙。
>>9 >>11 いえいえ。
生まれて初めてのスレ立てでドキドキしまくった。
気付いた間違いは
>>8で追記しておいたけど他に不手際あったらスマン
>>10 に関連する話なんですが、
a img {
border: 1px solid white;
}
a:hover img {
border: 1px solid red;
}
みたいに hover のときだけ枠出すようにしてるんですけど、
align="left" な画像だと、上の方しか枠が出ません。
文章の先頭行のベースラインで切れてるような感じです。
┏━━━━━━┓文章一行目
(以下枠出ない) 文章二行目
回避できるもんなんでしょうか?
align=left・・・
>>13 ・OSやブラウザの種類とヴァージョンについては必ず明記してください。
>>14 何か変でしょうか?
>>15 すいません。忘れてました。
OS:Windows2000
ブラウザ:IE6.0
です。
align属性とか使わずにcss使ってください。cssのスレなんで・・・
>>17 いえ、ですから画像の枠のところのCSSをお伺いしたいんです。
それともこちらのスレではCSSで対応できるものについては
必ずCSSで書かないと駄目だというルールなのでしょうか?
それでしたら残念ですがあきらめます。
別にそんなことはないだろうが、ただ回答者が萎えて答える気が起きないだけ。
>>19 わかりました。どうもスレ汚しすいませんでした。
もう、ほんま、リンクの色を変えるためだけにcssって存在してるんかなぁ、って思うことがしばしば
>>21 あと、テキストに背景色を付けるためとスクロールバーの色を変えるためにも。
>>23 pxの固定指定はあんまり感心しないが……。
できれば%かem指定がよくはないか? せめてddのwidthは無くすとか。
dt.left {clear:both; float:left;}
dd.left,dd.right {margin:5px 80px;}
dt.right {clear:both; float:right;}
dt {
width:75px;
height:75px;
margin:5px;
}
28 :
27:03/11/20 02:38 ID:???
あ、バグ辞典スレッドに書き込むつもりで間違った。すみません。
>>29 >結局IEで動かないので、
? できてるやん。
今まで
<HR noshade size="1">
で横棒を表示させてたんですけど、
これをスタイルシートでやるにはどうしたらいいんですか?
1pxの黒い画像を用意して、それで表現するのも考えたんですが、
画像を表示させない設定だと消えてしまうので、出来れば<HR>を使ってやりたいです。
さすがにウンザリ
そしてゲンナリ。
border:none;
border-top:1px solid #000;
height:1px
36 :
32:03/11/20 10:49 ID:???
できました、ありがとうございます。
それでも教える奴は教えてくれるので、いつまでも同じ質問が続く事に。
HRでなく近接要素のborderで表現するって発想は出ないもんかね。
40 :
Name_Not_Found:03/11/20 15:15 ID:+jAmOGf2
cssで定義する場合、div と span どっちの要素を使うのか、少し悩みます。
また、その属性の class とi d もそうです。
用途で使い方が決まってるのでしょうか?
インラインとブロックで使い分けてください。
classとidは
前者は同一文書内に複数出現する可能性のあるもの、
後者は同一文書内に一つしか出現しないものに対して使ってください。
>>40 あまりよろしくない事ではあるけど、
よく分からないうちは全部classでも構わないと個人的には思う。
idとclassの意味やその使い分けを学ぶ前に覚えておく事も多いと思うしね。
スクロールバーの幅を変更することはできますか?
(´-`).。oO(・・・)
>41-43
ありがとうございました、基本的な事がわかってないみたいなので
逝ってきます。
>後者は同一文書内に一つしか出現しないものに対して使ってください。
id は同一文書内の或る要素を一意に識別したい場合に使ってください。
同一文書内に一つしか出現しないクラスというのも存在し得ます。
>>47 >複数出現する可能性のあるもの
ということは単一も内包してるんだけど。
<ul>にbackground-color適用した時にIEでは表示されてNNで表示されない様なのですが、これはブラウザ側の問題ですか?
>>50 どうしても<ul>全体に適用したいのですが・・・
やっぱり<div>で囲むしかないのかな
>>51 ul全体、って…
ul要素って何かわかってる?
>>48 出現回数ではなくて用途によって使い分けろってこと。
>>49 NNてバージョンいくつ?
6以降は普通に適用できているが。
あ、<ul>のheightをautoにしてたのが悪かったみたいです。
IEは<li>高さを継承して<ul>にも反映させてるみたいです。
>>57 二行目が気になる。 IEってそこまで腐ってるの?
>53
いや、
>>42は「区別が出来ないならこれくらい覚えておくと無難」って話だろ。
正直、いろいろやらない(スタイルシートでの利用しか考えてない)ならクラスだけで充分だし、
「idは一回だけだヨ!」で問題ない。
>>57はソース出しなよ。
もしかして、liにfloat指定してない?
style sheetで画像の高さの中間に文字を配置するにはどう書けば良いのですか?
これを変えたいです。
<a href="url">
<img src="img" align="middle">======<img src="img" align="middle">
</a>
img{vertical-align:middle}で事故解決しました
>>63 事故で解決したとはとんだラッキーボーイだな。
ってか、聞く前に試せるもんは全部試せよ。
調べて見つからなかったのでカキコして
もう一度調べたら運良くみつ簡単だよ
66 :
Name_Not_Found:03/11/21 12:12 ID:ftXfKsn5
質問です。
ラジオボタンへのCSS適用なんだけど、
MacIEだとbackground-colorで指定した色が、
○の背景に適用されるのね。
でも、winでは□に適用されるんですわ。
これって仕様?Winでも○の背景色を変える方法があれば
どなたか教えてください。
>66
そこまでこだわらんでも・・・
68 :
Name_Not_Found:03/11/21 22:41 ID:8uCOBwgy
実現できなくてもいい事なんですが、
<A>タグなどの下線をテキストと別の色に・・・
無理?
borderなら可能だろうけど…
デコレーションの下線なら俺は無理だと思う。
>>68 テキストデコレーションを消して、ボーダーボトム。でそれにカラー。
聞き方気に入らんな。
下線のスタイルも指定できるんかー。
CSS3が普及するのはいつごろからなの?
5年後。いや、永久に来ないかもしれない。
5年以内にはgecko、operaは実装してるでしょ。
IEは…
部分実装 + 独自拡張 + CSS1にすらまともに完全に対応しない + バグバグ
>>76 独自拡張 + Jscript + トリッキーな適用でcss3と同様なことが出来るようになる
そして、IEが標準厨が跳梁跋扈する((;゚Д゚)ガクガクブルブル。
CSS DESIGN @ 2ch { displaynone }
って今はもうないんでしょうか?板違い?
探してきます
79 :
Name_Not_Found:03/11/22 13:54 ID:Zou8XQ47
htmlで昔の日本のように「左から読む縦書き」にしたいのですが、
うまくいきません。
縦書きにはできるんですが、そのままだと右から左に向かって
文章が書かれてしまいますよね?
それを左から右へ読ませたいのです。
文章を<div>とかでくくってFlipH()というのを当てたら、左右の反転は
できるんですが、これだと文字まで左右反転してしまってよめません。
文字だけを左右に反転させるやり方があれば、鏡の原理(反転→反転)
で右から左へ文字が読めるようになるのではないかと思うんですが、
そんな方法ありますか?
それとももっと簡単に 右から左へ縦書きに文章を書く方法が
あったらご教授ください。
*html自体はいじらず、CSSだけで というのが大前提です。
>昔の日本のように「左から読む縦書き」
これの意味がわからないんだけど
俺も意味が分からないが、BDOかな。
<div dir="ltr">
ltr=left to right
rtl=right to left
の意味
83 :
80:03/11/22 14:22 ID:???
>81
>82
>右から左へ縦書きに文章を書く方法が
つってるから焦ってたんだろ。
>79
雰囲気を優先させて、常連が去る予感
そんな読みにくいもん何度も見に行くと思うか?
BDO要素とは言ったが、
>*html自体はいじらず
とか制限つけちゃってるのね。
84 :
79:03/11/22 14:23 ID:???
>>80 ドモ
ちょっと調べてみたんですが、BDOって↓みたいにくくらないと
<bdo dir="rtl">テスト</bdo>つかえ無くないですか?
今は → <p>テスト</p>とかになってるので、
これを書き直すのはつらいんですが、CSSから指定できるんでしょうか?
>>81 「右利きの人が手で文字を汚さないように左から右へ書く縦書き」
と書くべきでしたか。
85 :
79:03/11/22 14:25 ID:???
書いてる間にレスが・・・
できるかどうかっていう好奇心の方が大きいので。
連続カキコ&スレ汚しすいません。
88 :
Name_Not_Found:03/11/22 14:33 ID:Xbdiiqpi
テーブルレイアウトをやめて、スタイルシートで頑張ってみようと思っています。
以下のように書いたら、三行三列のようなレイアウトは出来たのですが、
この三行三列の塊の横幅を固定したいと思い、<body style="width:500px;">を入れてみても500px以上に広がってしまいます。
どうすればよいのでしょうか?
<html>
<head>
</head>
<body style="width:500px;">
<div style="float:left;width:30%;background-color:red;">
<div>a</div>
</div>
<div style="float:left;width:40%;background-color:gray;">
<div>b</div>
</div>
<div style="float:right;width:28%;background-color:blue;">
<div>c</div>
</div>
</body>
</html>
>>88 なんだ?脳みそが腐ってるのか?
全然固定されてるじゃねえか。
まさかてめえ「ブラウザを広げることができなくなる」とか思っちゃいねえだろうな?
90 :
Name_Not_Found:03/11/22 14:46 ID:Xbdiiqpi
>>89 えと、テーブルでレイアウトを組んでいたときは、テーブルの幅を500pxに固定して真ん中表示にしたら、
ブラウザを全画面表示にしても、真ん中の500pxの幅の中にしか文字が表示されない状態だったのです。
>>88のように描いてみても、ブラウザの画面の大きさに合わせて500px以上に広がってしまうんです。
<html>
<head>
</head>
<body style="text-align:center;">
<div style="width:500px;" align="center">
<div style="float:left;width:10%;background-color:red;">
<div>a</div>
</div>
<div style="float:left;width:50%;background-color:gray;">
<div>b</div>
</div>
<div style="float:right;width:38%;background-color:blue;">
<div>c</div>
</div></div>
</body>
</html>
こうやってみたら、うまく再現できたのですが、これは適切な書き方なのでしょうか・・・???
まず環境を書こうぜ
>>90 強いて言うと、激しく汚い。
これでは脱テーブルの恩恵は薄いな。
全くさらのデザインしよう、とかはないかな?
>>90 IE6だと正常に表示されてるけど。
ブラウザは何を使ってらっしゃるので?
94 :
Name_Not_Found:03/11/22 14:50 ID:Xbdiiqpi
>>91 済みませんでした。
OSはWindowsXPで、ブラウザはIE6です。
あれ?俺と同じ。
至って正常に表示されとるが…。
96 :
88:03/11/22 14:54 ID:???
>>96 > きたない、というのは、書き方ですよね?
・div要素多用しすぎかな
・コンテントを入れてないのは気持ち悪いかな
・幅固定は好ましくないかな
あんま焦らず地道にやって行った方がいいよ。
いきなり凄いサイトみたいにできるわけないからさ。
100 :
88:03/11/22 15:14 ID:???
まず正しいHTMLを学ぶ
次にCSSを、実際に適用しながら勉強していく。
そして上手になる。と、こんな感じが近道。
>>100 コンテント=開始タグと終了タグの間にあるもの。内容。
俗に「空DIV」と呼ばれ気持ち悪がられる。
とりあえずブラウザを半分にまで縮めて横スクロールバーが出ない、くらいからはじめてみて。
103 :
88:03/11/22 15:24 ID:???
paddingやmarginで指定する幅はpxとemと%、どれが一番いいんでしょうか。
>>106-108 ありがとうございます。
fontの大きさは%とsmall(large)とどっちで書けばいいんでしょうか。
これも出来れば細かく指定しないほうがいいのでしょうか。
指定しなくていいなら指定しない方がいい。
見に来る人全員が、"いつものサイズ"で見れるからな。
>>103 とりあえず、<div>と<span>がなくても正しくマークアップ出来ているかどうかをチェックするようにするといいよ
padding には percentage の値はないから em だな。
>112
あるよ
115 :
114:03/11/22 20:13 ID:???
訂正。
>2行以上にわたる文章では右から左へが昔も今も日本語表記の基本則です。
2行以上にわたる文章では横書きでは左から右へ
縦書きでは右から左へが、昔も今も日本語表記の基本則です。
スレ違いです。
リンクされてある部分にマウスカーソルをあてると
下線が出てきて下線が点滅するという方法がありましたら教えて下さい。
下線だけ点滅となるとJavaScriptか?
:hover時だけ背景画像にアニメーションGIFを指定するというのもありそうだが。
119 :
117:03/11/22 22:30 ID:???
>>118 あ、なるほど。その手もありますね。
早速やってみます。ありがとうございました〜
<ul>
<li>a
<li>b
<li>c
<li>d
<li>e
</ul>
これをスタイルシートで
a b c d e
と横並びに表示させるにはどうすればいいですか?
li{float:left;}
もしくは
li{display:inline;}
FAQだな。
125 :
124:03/11/23 11:37 ID:???
>>123 リストの■なら、
list-style-type:square;
うわぁ…
全然違う事考えてた…
即レスありがとう これで思い通りのサイトが作れそうです
さんくす!
127 :
124:03/11/23 11:43 ID:???
>>126 で、どっちだったんだ?124は上の方の青い■だぞ。
あ、すいません、125の事です
■〜〜〜
■〜〜〜
の方です
おお
できた!
処理の意味とかよくわかんないけどとにかく できました
ありがd
きちんと意味も学んでおきます
初心者がギャーギャーとすいませんでした
本気で感謝してます
>>129 おまえだれだ?
だれかわかれば説明してやるが。
132 :
130:03/11/23 14:55 ID:???
<SPAN onmouseover="this.style.background='red';" onmouseout="this.style.background='blue';">
背景色変更</SPAN>
これを外部ファイルに書いて、それをクラス指定でhtmlファイルに反映したのですが、
外部ファイルへの書き方がよく分かりませんでした。
どなたか分かる方いましたらお願いします。
>>133 それは外部ファイルにできないだろ・・・
>>133 今手元にリファレンスや開発環境がないので多分動かないと思うが参考までにどうぞ。
window.onload = hoge;
function hoge(){
var objs = document.getElementsByTagName("span");
for(var i = 0; i < objs.length; i++){
objs[i].onmouseover = "this.style.background='red'";
objs[i].onmouseout = "this.style.background='blue'";
}
}
137 :
Name_Not_Found:03/11/23 16:26 ID:rghaQRPI
あげ
138 :
88:03/11/23 16:32 ID:???
>>111 ごちゃごちゃしたテーブルタグ一掃して、見出し、段落、リストぐらいのスッキリしたhtmlになりました。
自分で見ていて、ヒジョーにみやすいです。
スタイルシートの書き方一つでサイトのデザインが物凄く変わり、はしゃいでます!
idやclassの作り方が、今まではその場その場の思いつき(ここの色を変えよう、というだけとか)だったんですが、
最初にこれをきちんと考えてやれば、スタイルシートを書き換えるだけでコンテンツメニューを上にも右にも下にも、自由に動かせてデザインできることがよく分かりました!
これからそこら辺をきちんと考えて、classとか作っていってみます。
>>133 外部ファイルに
span {background: blue;}
span:hover {background: red;}
IEじゃうまく適用できないがな。
140 :
くろさん:03/11/23 18:55 ID:zULC30g6
テーブル幅を固定するには「table-layout=fixed & widht= NOT auto」こと、教えていただきありがとうございました。
さて、moz, operaでは、colへの属性指定は、tdに伝わらないのでしょうか?
IE6だと、2つ目のabcdefは赤色になるのですけどね。
またまた、moz,operaの方が「正しいCSS」なのでしょうか。
<html>
<head>
<style type="text/css">
body { font-size: 12px;}
col.change { color : red; }
</style>
</head>
<body>
<table border="1">
<col></col>
<col class="change"></col>
<tr><td>ABCDEFG<td>abcdefg
</table>
</body>
</html>
アカン、12Pxに吐き気が・・・
142 :
133:03/11/23 21:08 ID:???
>>139 レスありがとうございます。う〜む、背景色変更は我慢して
span {background: blue;}
で間に合いませます。ありがとうございました。
144 :
139:03/11/23 21:57 ID:???
>>143 IEを使うのは作成者ではなく訪問者なのだよ。
残念だけどな。
少しは脳味噌使おうな。
>>144 訪問者も糞IE使うのやめればいいことだ
脳みそ使う前の問題
>>146 含む含まないの問題ではなくて、CSS2のモデル的にはcolからセルにtext-alignは継承されないという話。
colは空要素なのでtext-alignを適用しても意味ない。
border,background,width,visibilityが適用されるのはセルではなくてcol。
仕様書のtable,colgroup,col,tbody,row,cellの順に重なってる図を見れば理解の助けになると思われ。
overflowによる疑似フレームをサイトに利用しています。
その疑似フレームを使ったサイトをブラウザで最大化で見る分には問題有りませんが、
ウィンドウ幅を少し縮めると横スクロールバーが表示されてしまうのですが、これを解決する方法ってないでしょうか?
どなたか解る方お願いします。
>>149 仮にmenuとmainに振り分けてるとするならば、main側の横幅をautoにする。
overflowはMacだとIEでもOperaでもバグがでるからなー
まぁmacなんて使ってるヤツほとんどいないから
無視していいんじゃないの?
まあMacOpera7が出たらOpera6は切ってもいいと思うが
ホントに今年中に出るんかな。
154 :
149:03/11/24 11:28 ID:???
>>150 レスありがとうございます。
ただ試行錯誤中です...できたら報告しにきます
155 :
149:03/11/24 11:47 ID:???
>>150 BODYにoverflow:autoを付加してみましたら出来ました!
ありがとうございました。
>>151 おかげで別館を造るはめに(つД`)
156 :
Name_Not_Found:03/11/24 13:34 ID:SS4OxOvP
age
>>155 CSS切り替え機能つければイインジャネーノ?
161 :
155:03/11/24 18:45 ID:???
>>157-160 自分がいない間に有益な情報をありがとうございます。
CSSの切り替えなんて知りませんでした。使いこなせば便利そうなので
これからリンク先を見て勉強してきます。
レスありがとうございます。
162 :
155:03/11/24 20:37 ID:???
164 :
155:03/11/24 20:49 ID:???
>>163 可能ですか。
出来ると分かった所で、自力で使えるように頑張って勉強してきます。
レスありがとうございました。
ただ、Operaの場合はブラウザをMozillaに認識させる等の機能があるからOperaは無理と思われ・・・。
js ならUA偽装してても if (window.opera) ... でイケるでしょ
それに navigator.userAgent の情報には
Opera っていう文字が末尾に記述されてある。良心的。
それに navigator.appName も Opera って返ってくる。
>>162 擬似フレームかどうかだけで内容を書き換えないといけないようなつくりなら
まず、マークアップを見直したほうが良い。
ちゃんとマークアップされていれば、CSSを替えただけじゃ破綻しないよ
js ありなら
>150 の例えでいうと、main を overflow させるよりも、
menu を js で固定させるほうが早いような気がする。
つか、俺はそうしてる。
意味も無く、自分の考えだけで overflow を使ってるサイトは
見づらい糞サイトだ(w
171 :
155:03/11/24 23:14 ID:???
164下の情報ありがとうございます。
少し調べていましたが先は長そうです・・
でもがんばります。それでは /ノシ
172 :
Name_Not_Found:03/11/25 02:23 ID:lBdLUhr9
単純な質問ですいません。
CSSで背景に画像を適用させて、その画像にフィルター
filter:Alpha(opacity=20)とかをかけたいんですが、
どうもうまくいきません。
body {background-image:url(back.png); filter:Alpha(opacity=20);}とすると
bodyの全部にフィルターがかかってしまうのです。
どうやったらうまくいくでしょうか?
背景だけにフィルタをかけるのは多分無理。
が、position や z-index をうまく使って背景のように見せることはできるかもしれない。
175 :
172:03/11/25 02:56 ID:???
なんか、155君はよくわかってない感じですな。
178 :
172:03/11/25 11:42 ID:???
>>176 フィルタで半透明にしたかったんですが、画像の処理で
半透明にするやり方がわからずあきらめました。
連続質問になってしまって申し訳ないですが、
あともう一つ教えてもらえませんでしょうか?
用途としては、h1などのタイトルの左横に画像(40*40px)をいれて、
その画像の横にタイトルがくるようにしたいのですが、
h1 {background-image:url(./h1-back.png); background-repeat:no-repeat:
padding-left:40px; font-size:1em;}
としたら、画像の横に文字は出るんですが、文字が画像の上のほうに
でてしまいます。
なんとか画像の中央横に文字を出したいんですが、どうしたらいいでしょうか?
vertical-align:sub;とやってもうまくいかなかったのです
基本。paddingを設定汁。
>>178 「画像の中央横に文字」じゃなくて、「文字の中央横に画像」なら
h1 {
padding-left:40px;
background-image:url(h1-back.png);
background-position:left center;
background-repeat:no-repeat;
font-size:1em;
}
で。
>>178 h1 {line-height:1.0; vertical-align:middle;}
<h1><img src="./h1-back.png" alt="" width="40px" height="40px">見出し</h1>
では駄目なのか?
Coolとは如何なるものなりや。
ところで、img要素でいいところまでbackground-imageを多用する人、
たまに見かけない? div中毒みたいなもん。
極論を言えばimg要素は必要なくて、すべて背景として処理すべきだ、と言えなくもない
185 :
172:03/11/25 13:02 ID:???
>>179-182 ども
>>180 おっしゃるとおりに書いたら確かに文字の横に画像が表示されました。
ただ、画像の上下端が切れてしまったので、height:40px;と指定したところ
文字が中央ではなく上に出てしまいます。
画像が文字より小さい場合は問題ないようなんですが、私の場合、
うまくいかなかったです。
>>181-182 CSSを切り替えて遊べるというのを見てちょっといじってるのでhtml本体
はいじれないんです。すいません
>>179 padding:20px 0 0 40px;で見た目は文字が中央になったんですが、
こういうことですか? 全然違います?
面倒だから line-height: 40px にしとけ
あのう、body { font-size: 12px;}で
12pxで吐き気……
>>140-
>>141 というのを読んでの質問なんですが、
読みやすさ等の為に文字サイズを16pxで指定して
小さすぎず、大きすぎず、年配の方にも……
と思っているのですが、これって適正でしょうか。
スレ違いでしたら、すんません。
12は論外だとしても、大きい小さいは実はあまり関係がない
ユーザーが、簡単に自身の好みに変更できる事が重要
>>188 12ってそんなに小さいかね?
モニタの解像度いくつなん?
>>190 脳みそ足りてるか?
px指定すんなヴォケ、と言ってるんだよ。脳みそ足りてない書き込みすんな。
192 :
190:03/11/25 16:11 ID:???
書き忘れ。
漏れは 19inchCRT で 1280*1024 と、
17inchCRT で 1024*768
>>192 お前の陳腐なマシンなんぞ興味ねえよ。
俺が55度のシャワーを熱くないと感じてても、俺が風呂屋の主ならそんな風呂は用意しないな。
>>187 読みやすいサイズというのは人によって違うので
IEでもブラウザで変更できるようにpxやptを避けるほうが吉
>>187です。
皆さん有り難うございました。
emかexで頑張ってみることにいたします。
お邪魔いたしました。
むしろ%推奨というか。
em指定はIEでの不具合があっただろ
ネストってなに?
>>204 ネストの意味ぐらい自分で調べろよ(´,_ゝ`)
それに片仮名なんだから英単語ではなくて外来語だろ。
というかそれぐらい常識。まったく恥ずかしい香具師だな。
自分のサイトの基本となるCSSの名前がbasic.cssなんだけど
何かお勧めのネーミング無い?
burakura_tonjae~~~ahya.ccs
212 :
198:03/11/26 02:53 ID:???
>204
> 無理やり英単語使うなよ馬鹿市ね
ごめんな。でも201は俺じゃない。201は教えてくれてるだけだよ。
>205
> Opera6と間違ってないかい?
それだね。記憶違いだった。スマソ
>>207 sutairu.si-to
拡張子はCSSでなくてもいいんだよな
>207
style.css
(サイトの名前).css
>>207 もれはdefault.cssとかnormal.cssとかにしてる。
>>207 【AV】[裏] 長瀬愛 - 宅配コギャル.css
>>207 私は standard.css にしてる。
もう俺CSSの紹介はどうでも良いです
>>219 2時間前に終わってるんだから蒸し返さなくてもいいよ。
em 単位は小数点は幾つまでOK ですか?
em じゃなくても、小数点はひとつだけです。
>>222 ワロタ
>>221 小数点以下は、いくらでもいけるだろ。ただ、該当する大きさがない場合、もっとも近いものを選ぶ、というわけで細かくしても無駄な気が。
了解しました・・・・
通常は小数点イカは、四捨五入でしょうか?
何を了解したんだ
>>224 >該当する大きさがない場合、もっとも近いものを選ぶ
もう二度と訊くなよ?
色指定を
color : #000;
てな感じで省略しているサイトがあったんですがこれは問題ないのでしょうか。
229 :
207:03/11/26 18:17 ID:???
>>214,216,218
いいネ!参考にさせていただきます
img src で表示させる画像を自動的に中央に持っていきたいのですが
img {
text-align : center ;
}
では無理ですよね。どうすればいいのでしょうか。
divで囲むしかないのかな...
img要素を子に持つ親ブロック要素にtext-align:center;を指定すればよい。
が、そんなセレクターは無い。
だいたいimgなどのインライン要素はbody直下に置いてはいかん。
必ずブロックレベル要素の中に入れねばならぬ(Strictの場合)
positionの絶対値指定って避けた方が無難ですか?
>>232 ハ、なんで?
場合によるよ。
まあ、ウィンドウ・サイズを拡大縮小したり文字サイズを大小させても
表示が崩れないか、試してごらん。
img {
display:block;
margin:auto;
}
後に来るブロック要素を、上に表示させることは出来ますか。
ポジションの絶対指定だと、
ボックスが縦に伸びたときに重なってしまうので悩んでいます。
>>235 具体的なソース出してくれないと、助言もできません。
237 :
Name_Not_Found:03/11/27 03:40 ID:6UkehJG5
<table border="1">
<tr>
<td>カテゴリA</td><td>カテゴリB</td><td>カテゴリC</td>
</tr>
<td>1a</td><td>2a</td><td>3a</td>
</tr>
</table>
として、カテゴリをクリックするとその下にそのカテゴリのメニューが出てくるようにテーブルでレイアウトしていました。
このテーブルレイアウトをやめようと思って作業しているのですが、
<ul>
<li>カテゴリA
<ul>
<li>1a
<li>2a
<li>3a
</ul>
<li>カテゴリB
<ul>
<li>1b
<li>2b
<li>3b
</ul>
<li>カテゴリC
<ul>
<li>1c
<li>2c
<li>3c
</ul>
</ul>
これを上のテーブルのようにスタイルシートで表現するにはどうすればいいのでしょうか?
strictじゃねぇな・・・
239 :
Name_Not_Found:03/11/27 07:19 ID:gEt3aA4z
position : absolute;
と
float : left;
左上の方にメニューボックスを作りたいんですが、どっちでやる方が良いんですかね?
まぁどちらでも自分の意図するように表示されてるんで、
自分的には好みで選んでいいのかなぁと思ってるんですが・・・
ムズムズするから</li>つけてくれ
>>240 ぶっちゃけHTML4.01では省略可となってるんだよな。
でもその奇妙なネストは許されんよな
<style type="text/css"><!--
ul {
list-style : none;
margin : 0;
padding : 0;
}
li.outer {
float : left;
width : auto;
border : solid 1px red;
}
ul.inner {
border : solid 1px blue;
}
--></style>
<ul>
<li class="outer">カテゴリA
<ul class="inner"><li>1a</li><li>2a</li><li>3a</li></ul></li>
<li class="outer">カテゴリB
<ul class="inner"><li>1b</li><li>2b</li><li>3b</li></ul></li>
<li class="outer">カテゴリC
<ul class="inner"><li>1c</li><li>2c</li><li>3c</li></ul></li>
</ul>
class名についてはこの際ご容赦願うとして
Opera6だと width:auto が ul.inner に「継承」されるかのように表示される。
で、ul.inner に width:100% とか指定するととんでもないことになる。
何に対して100%なのかが不明。ピクセル値は問題なさそう。
Opera7じゃ特に問題ないんで今更ではあるけど。
244 :
Name_Not_Found:03/11/27 11:09 ID:0ATNjL7H
質問です。
CSSのdisplayプロパティを使って文字の表示非表示を行なっています。
overflowでその全体を囲むと、非表示部分までスクロールバが伸びてしまいます。
表示されている部分だけでoverflowのスクロールバーを表示させたいのですが
どのようにすればよいでしょうか?なにかアドバイスをお願いします。
overflowはautoで指定してあります。
>>244 文章の意図を読み取れない。
具体的な例を提示せよ。
ul・liを使って表の様に表示させたがる香具師等の考えていることがわからんのだが。
tableでええやん、表なんやから。
>>242 どこがどう奇妙なんだ?
問題ないはずだが。
>>249 "pure css tab"で全言語のページから検索した結果から。
つか『ここみたいな』などと例が出せるのならそのサイトを参考にすればよかろう
真似じゃんか…。
じょじょの奇妙なCSS
>>252 HTMLソースの流用に問題があるとでも?
よく何々をしたいという欲望を持った質問者が現れるが、
それが本当にユーザにとって好ましいのか考えてみることだ。
どうせ見栄えなんか直ぐに飽きるんだし、スキルがないんだから、
Simple is best! を徹底した方が宜しいと思うのだが如何なものか。
如何なものだ。
258 :
Name_Not_Found:03/11/27 23:42 ID:inbLJmfb
divタグの中に長いアルファベットの文字列(URL)を書くと
自動的に改行されずにwidthで指定した大きさを無視して
横に長くなってしまってレイアウトが崩れるのですが、
なにがなんでも強制的に改行してくれる方法ってないでしょうか?
260 :
Name_Not_Found:03/11/28 00:06 ID:bEA3mANd
<p>
<img src="aaa.gif" align=left height=240 width=100>
aaaaaaaaaaaaaaaaaa
</p>
こうすると<p>から画像がはみ出るのですが、
どうすれば<p>の中におさまりますか?
>>260 はみ出るわけない。
ここ、なんのスレかわかってる?
余談だが「改行」ではなくて「行の折り返し」なんだよ。
「改行」ってのは、CR や LF などの制御コードのこと。
それと br要素は、強制的な行区切りの指定であって改行ではない。
「行の折り返し」や「行区切り」のことを日本語で「改行」って言うんじゃないの?
強制的な行区切り=改行
行を区切る=行を改める
なんかどこかの受け売りか知らんが、強制的に行を折り返す、ってのは行を改める、ってことで改行と同義だよ。
改行を辞書でひいてみ。
>>258 word-break:break-all;
だっけ。brじゃなくてこれ使いなよ
ああすっかり忘れていた word-break
確かIE専用だったよね
W3Cで審議中で、IEが独自実装だったかな
>>263 少なくともIT技術者はふつう「改行」と「折り返し」とをはっきり区別
した意味で使う。区別の仕方は>262が書いているとおり。
「キャリッジリターン」と「ラインフィード」は、けっこう適当な
使い方している人が多いけどね。
他の業種についてはしらね。
>>268 <p>に設定してるwidthに対して画像がでかすぎるだけだよ。
そこのところの<p>のwidthを画像の幅以上にするか、
画像を小さくしないと無理。
>>268 はみでるわけない。
Pの幅も同じだけ拡張されるからね。
下にはみ出るんだよ馬鹿
>>273 散々お前に馬鹿馬鹿となじられた272=261だけどね。
pに
height : 1px;とか入れて見ろ。
>>275 デキタ━━━(゚∀゚)━( ゚∀)━( ゚)━( )━( )━(゚ )━(∀゚ )━(゚∀゚)━━━!!
272=261=273=神
さんきゅう〜〜〜
>>277 ごめぽ
「はみでるわけない」って言われて
ムっとしちゃったあ
発言もはみ出てたね(-_-)ごめぽ
はみでるってなんだ?日本語が変。
これだけで解った>277は本当に神と思う。
280 :
277:03/11/28 02:47 ID:???
>>279 一応リファレンスサイトやってますんで。
てか、はみでる、はgoo辞書にも載ってるからまともな言葉じゃないの?
はみだす、と同義。
いや、具体的にどういう状態になってるのかが
サッパリわからなかった<はみでている状態
下にはみ出るってなんだろう…。
282 :
277:03/11/28 03:37 ID:???
>>281 ┏━━━━━━━┓
┃┌──┐あああ┃
┗| |━━━┛
| |
| |
| |
└──┘
太線がPのボックス
画像からリンクさせる場合のaの擬似クラスでborder-styleを指定したborderの消し方を教えてください。
>>10の方法では擬似クラスにborder-styleを指定したsolidのborderだけ残ってしまいました。
IEとNNの最新版でもどうしても solidを指定した方だけ消えなくて行き詰ったので、わかる方間違いを教えてください。
以下サンプルです。
<html>
<head>
<style type="text/css">
a {text-decoration: none;border-style-bottom:dotted;}
a:link {border-bottom: 3px blue;}
a:visited {border-bottom: 3px navy;}
a:active {border-bottom: 2px solid red;}
a:hover {border-bottom: 2px solid hotpink;}
a img, a:link img, a:visited img, a:active img, a:hover img {border-bottom: none ;} <!-- *備考:下記に記載 -->
img { border: none;}
</style>
</head>
<body>
<ul>
<li><a href="
http://www.hogehogehoge.net/" title="hoge"><img src="hogehoeg1.gif" alt="1バナー" /></a></li>
<li><a href="
http://www.hogehogehoge.com/" title="hoge"><img src="hogehoge2.gif" alt="2バナー" /></a></li>
<li><a href="
http://www.hogehogehoge.jp/" title="hoge"><img src="hogehoge3.gif" alt="3バナー" /></a></li>
</ul>
</body>
</html>
*備考: border-bottomをborder-style-bottomやborderに変えたり、noneを0px noneや 0pxに変えても結果は一緒でした。
>>283 AのボーダーをIMGで消そうとしてるわけ?よく考えい。
やりたいことは分かるが良い策は分からん。ごめん。
ところで a:link と a:visited の指定はそれで効いてるの?
a:active.img,a:hover.aimg {border:none ;}
とでもして、<img class="aimg" SRC="">とすれば消えてくれるが、なんで
a img {border:none ;}だと思いどおりにならんかな
a:active { hoge: huga; } -> specificity = 11
a img { hoge: huga; } -> specificity = 2
つまり優先度の問題。
288 :
285:03/11/28 11:13 ID:???
メンゴメンゴ。クラス振るのは<a>だな、書き違えたわ。あと、283じゃないよ。
で、優先度の問題を解決するんはどうすんのかな?important指定しても上手く行かんなー。
>>288 id を 100、
class を 10、
要素名を 1、
として足し算、だったっけ?
291 :
:03/11/28 12:08 ID:t6/2q5sc
↓のスタイルがあって
<style type="text/css"><!--
.al {filter:Alpha(opacity=50 );}
.no_al {filter:Alpha(opacity=100);}
--></style>
テーブルの背景は al で半透明にして、そのテーブルの中にある文字などは
no_al で透明にならないようにしたいのですが、
<table class="al"><tr><td class="no_al">あいうえお</td></tr></table>
としても、al が先にtableタグ内で宣言されているので td で no_al を使用しても
"あいうえお" の文字列が半透明になってしまいます。
しかし逆に
<table class="no_al"><tr><td class="al">あいうえお</td></tr></table>
とすると、table は 半透明にならずに 文字だけ半透明になります。
なんで〜〜???
テーブル(背景など)は半透明で、文字は透明じゃないようにしたいのに・・・。
どなたかご教授お願い致します。
半透明処理などのフィルタはCPU負荷率が高いので遠慮願いたい。
と言っても、ユーザースタイルで対処するから構わないのだけど。
初心者ってのは M$IE のフィルタがヴァカみたいに好きだね(´ー`)
294 :
:03/11/28 12:48 ID:t6/2q5sc
>>292 バカはお前だよっ。 ほとんどのユーザーがMSIEだべ。
サイトの対象となるユーザーの環境も考えないお前の
方が初心者。
んじゃな。
ps)
最近はmozillaとかOperaが多いとかいうなよな。
所詮10%以下なんだから。そいうユーザーにも
見てもらいたいのなら、そいうサイトのつくりに
すればいいわけだし。 さよなら、初心者の292さん。
295 :
Name_Not_Found:03/11/28 12:52 ID:YLg/JowU
link-style-image:url(listmark.gif);
でリストのマークを指定したら、指定してないときより
右にはみ出るのは何ででしょう?
IEのみでウィンドウサイズを変えたらはみ出ないんですが・・・。
漏れも5年前のパソコンではフィルタ乱用きつい。
Win98のレジストリいじって無効化してる。
>>294 あえて釣られるけど、お前のサイトのアクセス解析結果か?
お前のサイトのアクセス解析結果が10%以下を示しているのは、お前のサイトがMSIE向けに作られてるからだよ。
俺のサイトはどんなブラウザでも見れるように作っているからドリームキャストや携帯からでも閲覧可能だ。
論点がズレてるように見受けられる。
IEを使うヤツの話ではなくて、
IE用のフィルタを使いまくるヤツの話では?
>>295 何が、どう、右にはみ出るのですか。
その画面が見えない他人にもわかる書き方をして下さい。5W1Hね!
>>300 五人のワイフを見ながら一人エッチですか。
泣けてきますね」
>>301 違うよ、5人のワイフに毎日1Hするってことだよ。
絶倫。
303 :
Name_Not_Found:03/11/28 15:07 ID:bBCRabY8
頑張ってCSS&脱テーブルのサイト作っても、
Mac&IE5.2で見たらjsエラーでcss弾かれてちゃしゃーないわな。
そんなアホはcss使うのヤメレ。
304 :
295:03/11/28 15:08 ID:YLg/JowU
>>300 質問用にソースを書いていたら原因がわかりました・・・。
幅を%指定している並列の二つのボックスの右側ボックスに
margin-rightをpxで指定してしまっていました。
ソースがシンプルならば原因も見つけやすいのですが・・・、
皆さんソースが複雑になったときのレイアウトのずれなんかの
デバック?ってどうやってるんですかねぇ?
久々に大物の登場だったな
306 :
:03/11/28 16:54 ID:t6/2q5sc
>>297 >ドリームキャストや携帯からでも閲覧可能だ。
すっげ〜自慢だね! 全く興味をそそらないのは、何故?
>>306 どんなブラウザからでもアクセス可能ってのは凄いこと。
興味がないのはそういうことを考えてない人間だからだろ。
308 :
:03/11/28 16:57 ID:t6/2q5sc
>>297 携帯がアクセスしてきたら、User-Agent とかIP見て
携帯用のページにリダイレクトすりゃいいだろ。
なんで そこまでしてひとつのページを全ブラウザで
見れるようにするんだよ。 アホじゃね〜の。
素人めが。
309 :
:03/11/28 17:00 ID:t6/2q5sc
>>307 <HTML><HEAD></HEAD><BODY>あ</BODY></HTML>
全ブラウザで閲覧可能だぜ。どこがすごいんだよ。あ?
単に簡単なHTMLを使ったサイトだから、全ブラウザで
閲覧可能なんだろ? そこを間違えるなよっ。
凄い人の登場だ…。
お、俺は釣られねーぞっ!
良質なテキストサイトは XHTML Basic ひとつあれば十分に事足りる。
>>308 マジレスすると、
その手法は一世代前の考え方で、
結局情報が二(多)元化してしまう、更新コストがかさむ、
同期を取るのが結構大変、との理由で最近では嫌われています。
自分の不勉強を棚に上げて素人なんt(ry
314 :
Name_Not_Found:03/11/28 18:56 ID:ojOWcRV4
質問お願いします。
divで指定した部分が上と左右のウィンドウ枠に密着するように
したいと思っています。
bodyとdivにmargin:0pxの指定をすると、単独で見る場合は希望どおりに
表示されるのですが、フレームで表示させるとIE6では右側に余白ができてしまいます。
ネスケ7ではきちんと余白なしで表示されました。
この場合どのような記述をすればいいのでしょうか。よろしくお願いします。
フレームなんて使うな。
>291
あーとだな、何か流れが質問スレと違う中レスしてみるとだな。
OpacityはFont-sizeみたく子孫にも影響するんじゃないかな。
つまりno_alの方のOpacityを200にしてみるとどうかな。
ダメだったらごめんな。
317 :
Name_Not_Found:03/11/28 20:28 ID:TX1z+Wx8
いま、
http://kanzaki.com/docs/html/lesson1.html ここを参考にして自分のサイトのhtmlを書き直して整理しています。
htmlでは、見出し、段落、リスト、リンク、強調、線、署名だけにするようにしています。
レイアウトは後々スタイルシートで、と思っていますが、classやidはこの段階で割り振っていくようにした方がいいのでしょうか?
また、この段階で割り振っていくとき、スタイルシートの記述はどのように整理すると見やすくなるのでしょう。
皆さんの整理の仕方や、参考になるサイトがあったら教えてください。
宜しくお願いします。
>>317 せっかくそこ見てやってるなら、「線」(=<hr>のことだと思うが)のような物理要素もやめりゃいいのに。
strictの世界ではclass名やid名ですら文書構造を表す意味のあるネーミングでなきゃならんという話なので
理論上はマークアップをやってる段階でclassやidを割り付けることができるはず。
また、そのように構造化された文書ではスタイルシートの記述もおのずと構造化され整理されているはず。
319 :
Name_Not_Found:03/11/28 20:50 ID:TX1z+Wx8
>>318 ここの最後の纏めに
1. HTMLは文書の構成パーツを「要素」としてマークアップする
2.HTML文書はhead要素とbody要素で構成され、headとbodyを合わせたものがhtml要素になる。html要素にはマーク付け言語情報を書く
3.headの中に、分かりやすいtitleを書く。文字コードも必要ならここでmetaを使って示す
4.body(本文)は段落(p)と見出し(h1〜h6)で構成され、必要に応じてリスト(ul, ol, li)を使って情報を見やすく整理する
5.ハイパーリンクはa要素タイプを使う
6.強調するところはem, strong要素で示し、画像が欲しければimg要素タイプを使う
7.文書にはaddressで署名する。本文と署名のように役割が異なるセクションはhrで区切るとわかりやすい。
とあったもので・・・。
7で、hrで区切るとわかりやすい、と。
使わないほうがよいのでしょうか?
> strictの世界ではclass名やid名ですら文書構造を表す意味のあるネーミングでなきゃならん
むむむ…難しそうですね…。コツコツやってみます。
>>319 まあstrictな人の中には、br, hr, b, i, tt, big, small のような物理的な要素は
たとえstrict.dtdであっても排除すべきだという人もいれば、
spanにclass振るくらいならスタイルシート非対応ブラウザ向けにsmallにclass振れという人もいるし、
そこらへんは浄土宗か浄土真宗かって所なんで、宗派に合わせて適当にやって下さい。
法が人の為にあるのか、人が法の為にあるのかって議論は、この手の話には必ず
付いて回るものだし、これ以上やるのもスレ違いなんで。
321 :
Name_Not_Found:03/11/28 21:28 ID:TX1z+Wx8
>>320 はぁい
>>317 > 皆さんの整理の仕方や、参考になるサイトがあったら教えてください。
このあたりにもアドヴァイスいただきたいのですが・・・。
323 :
Name_Not_Found:03/11/28 21:50 ID:TX1z+Wx8
>>322 ありがとうございます、読んでみます。
> 要は最初からクラスとIDをもりもり付けていこうとしないようにって感じ。
まさにもりもり付けていこうとしていました…_| ̄|○
ありがとうございました。
>306
今更なんだが、メ欄も込みで見て欲しかった。
325 :
283:03/11/28 22:48 ID:???
>>284 <a><img /></a>
だから a imgとか a:link img としてますが間違ってましたでしょうか
img以外にはdottedで指定した:linkなどはちゃんと表示されます
>>285 確認しました。imgにclassを指定しないでやる方法はないものなんでしょうか
>>286 a {text-decoration: none;}
a:link {border-bottom: 3px dotted blue;}
a:visited {border-bottom: 3px dotted navy;} と変えて
a:link img, a:visited img, a:active img, a:hover img {border-bottom: none!important ;}
としたら今度は全部消えなくなりました。
a:link img{border-bottom: none;} ....
と個別に指定してもだめでした、もうどうしたらいいのやら
>>290 a:link * img や a:link > imgとしてもだめでした
擬似クラスにborder-styleを指定しなければ問題はなく消えるんです。
擬似クラスにborder-styleの指定があるとどうしてもだめです。
根本的に何が間違ってるのか本当にわかりません。
だれか助けて
>>325 あのさ、a要素(とその疑似クラス)に指定したスタイルを
img要素に対してnoneとしたって無意味では?
imgを子に持つa要素(とその疑似クラス)に対して取り消し指定をしなければ。
327 :
283:03/11/28 23:43 ID:???
>>326 なるほど、そう考えるべきなんですね。
すごくわかりやすかったです、ありがとうございます。
そうすると、*や>や+で結合させてもうまく行くわけないですね。
・imgを内包するaにだけという指定が出来る構文はない
↓
・classやidで対処するしかない
ってことであってますか???
>>327には折角の忠告↓が目に入らなかったのか。
284 :Name_Not_Found :03/11/28 09:06 ID:???
>>283 AのボーダーをIMGで消そうとしてるわけ?よく考えい。
ダメなやつは何をやってもダメ
330 :
283:03/11/29 00:22 ID:???
>>328-329 バカでほんとにすいません
>>10で紹介されていた「よくある質問」が自分のケースと同じだと勘違いしてたみたいで、
>>284の言っている本位を汲み取れませんでした。
お世話になりました。
>>318 hr要素は、CSS非適用の素のスタイルで閲覧する人用に、要る。
http://deztec.jp/site/tips/page/p0013.html#hr 「見えない水平線」を入れる
>CSS では見出しや段落にボーダーライン( border )を指定できるため、簡単な
>記述で(視覚的に)読みやすいページを作ることができます。ところが、非 CSS
>環境だと CSS の border が表示されないため、文章の区切りがわかりにくいと
>いうことがあります。
>
>こういう場合、文書の区切り位置に<hr>を挿入し、<hr>に対して CSS で
>display: none; と指定すると、 CSS 非対応環境でのみ表示される水平線にする
>ことができます。長文の場合などは章・節の句切りが意外と重要なので、章ごと
>くらいに挿入するといいでしょう。
画像の横(左側)に文章が置かれるようにしたいのですが、
<img src="" align="right">
こういう書き方はどうやら良くないそうですね。
何かいい方法はありませんでしょうか。
>>332 float使え
>>331 あんまりその議論は蒸し返さんほうがええよ。俺は <hr style="display:none"> 派だし
>>318もそんなことはわかってると思うが、<table> を見るとアレルギー起こす人と同じように
真の原理主義者は「物理的要素」を見ただけでヒステリーを起こすんだと思う。
334 :
昔の人:03/11/29 00:41 ID:???
他人がどう思おうがstrict.dtdの枠内で自分が正しいと信じるマークアップするのがいいんじゃないの?
ここCSSスレだし質問者がhr使いたいならむやみにやめさせることもないと思うよ。
確かにheight:1px;はヒドイ。IEのことしか考慮してないナ。
>>335 >>260君にはFAQのQ5(
>>7)、「浮動要素の高さもheightに含めさせる方法」を見て欲しかった。
WinIEの場合、親要素の幅を明示(widthプロパティを具体的な値で指定する)しておけばよし。
339 :
Name_Not_Found:03/11/29 02:34 ID:igAB4tAt
ネストされたULタグって、
IEだと見栄えはこんなかんじ↓になるかと思うのですが・・・
●ほげ
●ふが
○ヒゲ
○カツラ
●うき
こないだどこかのサイト(失念してしまった。。。)で、
●と○との、横方向(x座標)の距離がデフォルトより短いものを見つけました。
これは、CSSだとは思うのですが、どうやって実現させるのでしょうか?
どなたか教えていただければ幸いです。
LI UL , DT UL { margin-left : ??px }
pxという単位はあくまでも例です。
DTじゃなくてDDでした。申し訳ない。
フォントサイズについてなんですが、
em や % は一部のブラウザでバグがあるらしいと言う理由から
xx-small, x-small, small, medium, large, x-large, xx-large,
smaller, larger のみを使っているのですが、何か問題はあるでしょうか。
IEの旧態依然モードでは・・・
CSSのデフォルト
↓
CSS font-size | xx-small x-small small medium large x-large xx-large
HTML <font size=...>| 1 2 3 4 5 6 7
↑
HTMLのデフォルト
つーことでズレる。
>>335,339
IEで見えてれば誰も困りません。困る人数など統計的に見れば0に等しい。
有名無実の「w3c標準」に合わせると大多数のIEユーザが迷惑をこうむります。
99%のブラウザはIE4〜6です。OSもmacなんて1%です。
この数字を見れば何を基準にすべきかは小学生でもわかるでしょう。それはIE。
IEのシェアは世界的に見ても、日本だけを見ても圧倒的ではあっても
せいぜい90〜95%というところ。
5〜10%という数字は統計学的には0とは等しくありません。
あと、商的な意味でもそれらを排除するのは「望ましい」ことでは
ありません。
XHTMLでMIMEタイプをapplication/xhtml+xmlにするとかそういう
レベルの話でない限り、W3Cの標準に合わせることでIEユーザが
迷惑をこうむることはありません。
ブラウザに依存しないCSSを書けない奴の戯言に釣られるな。
348 :
314:03/11/29 15:38 ID:V8q7YsJt
えーとすみません、。
>314は表示することができないものだったんでしょうか…
>>345 >IEで見えてれば誰も困りません。困る人数など統計的に見れば0に等しい。
(´ι _` ) 馬鹿なオマエがな
350 :
13:03/11/29 15:55 ID:???
>>24 遅レスすいません。これだけのソースなんですが、
画像にマウスカーソルを乗せても枠の色が変わりません。
画像の上にカーソルを置いておいて ALT + TAB でウインドウを
切り替えて再描画させると変わっているので、認識はしてくれてる
みたいなんですが、IEの問題なのでしょうか?
<html>
<head>
<title>css test</title>
<style type="text/css">
<!--
a:link img, a:visit img {
border: 1px solid green;
}
a:hover img {
border: 1px solid red;
}
-->
</style>
</head>
<body>
<a href="test.html"><img src="test.jpg"></a>
</body>
</html>
ブラウザは
Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0; T312461; istb 702; .NET CLR 1.0.3705)
です。OS は Windows 2000 SP4 です。
352 :
13:03/11/29 16:16 ID:???
>>351 失礼しました。でも visited にしても変わらないです。
ちなみにちょっと古いのですが、
Mozilla/5.0 (Windows; U; Windows NT 5.0; ja-JP; rv:0.9.4) Gecko/20011128 Netscape6/6.2.1
でやると大丈夫でした。IEの問題っぽいですね。
IE以外にも対応すること 以 外 で 潜在的なカスタマを5%増加させるのは並大抵な事ではない。
とゆってみる。
355 :
342:03/11/29 18:01 ID:???
>>343 なるほど、そういえば古めの IE では大きくなりますね。
medium = ブラウザのデフォルト じゃないとなると
今使っているシートのみではちょっと問題もありそうなので、見直してみます。
ありがとうございました。
サイズ指定の単位についての質問です。
自分はフォントの大きさを指定するときにptを使うことがあるのですが、
ptってどういう基準で大きさが決まるんですか?
Windowsならどのパソコンのどのブラウザで見ても大体同じような大きさになってデザイン崩れないんですが、
Macだったり特殊な媒体だったりするとptのサイズが違って崩れるんでしょうか?
どうしてもサイズを絶対指定したいときはpxの方が無難ですか?
ptもpxも使うな。どうしても使いたいならその理由を言え。
画像の上に字を乗っけるのでフォントのサイズが一定じゃないとデザインが崩れるからなのですが。
>>357 Macは pt=pxだったと思うよ
OSXはどうだか知らないけど
>>361 フォントを固定するなって言ってる輩とそこの作者が固定にする
理由に挙げてるようなサイトの作者って層が違うと思う
>>360 なるほど、じゃあptは使わない方が無難ですね・・・
px指定なら、とりあえず字と周囲のデザインとの関係はどんな出力でも同じように表示されるんでしょうか。
(もちろん、そのブラウザが使用するフォントによって違ってはくるでしょうが)
364 :
Name_Not_Found:03/11/29 23:58 ID:Dfkj2CN/
済みません、スタイルシートでデザインすることを前提にhtmlを書く場合、
メニューなどのリンクは
<a>で並べるべきですか?
<ul>などでリストとして記述するべきですか?
>>364 aで並べる、の意味が不明です。
後者なら
<ul>
<li>日記<li>
<li>リンク<li>
</ul>
とするなら問題ないし、説明を加えたいのであれば
<dl>
<dt>日記</dt>
<dd>〜説明事項〜</dd>
<dt>リンク</dt>
<dd>〜〜〜〜</dd>
</dl>
としてもOKです。
他にも色々と方法はありますが…。
366 :
13:03/11/30 00:04 ID:???
367 :
Name_Not_Found:03/11/30 00:12 ID:o8x1wFc9
>>365 えと、スタイルシートでデザインしよう、と決意して、このスレのリンクとかのソースを覗いてみたりするようになったのですが、
殆どの人が<ul>でリストとして書いてました。
が、今日本屋で立ち読みした本では、
<a href="hoge.html">hoge</a>
<a href="hoge2.html">hoge2</a>
<a href="hoge3.html">hoge3</a>
という風に書いていたので。
ちなみに、今まではテーブルで
hoge1 ..hoge1の説明
あんなことやこんなこと
hoge2 ..hoge2の説明
あんなことやこんなこと
hoge2 ..hoge2の説明
あんなことやこんなこと
このようにレイアウトしていたのですが、
<ul>や<dl>でこういうレイアウトは出来ますか?floatやdisplay使ってやってみてるのですが、
右側の説明の二行目が左のタイトルの下に回りこんでしまったり、
右側の説明全体が左のタイトルの下に来てしまったりしてうまくいかないのです。。。
>>367 右側の説明が回りこんでしまうのは、
marginをしっかり指定していないせい。
リストを使っても回り込むものは回り込むよ。
369 :
Name_Not_Found:03/11/30 00:20 ID:o8x1wFc9
>>368 margin指定ですか!やってみます。ありがとうございました!
>>361 話の主旨のすり替えをやってるつもりのようだけど、「大きめに指定で可変」について触れてないところ、つまり言い訳でしかないと言えるな。
ptという単位に対しての質問をフォント固定否定論に摩り替える
>>358が一番の問題だが。
372 :
Name_Not_Found:03/11/30 01:14 ID:o8x1wFc9
<dl>でやってみたのですが、どうしても
>>357のようなレイアウトに出来ません。。。
どうすればいいのでしょう?
>>370 某所のセリフを借りると
「単なるW3C(とその信者)への恨み節」ってやつだな。
トップページでとんでもない事やってやがるし。
>>372 説明不足。5W1H!
ソースと環境を書いてね。
>>372 357じゃなくて367の間違いだよね?
>>367のようなデザインにしたいのなら、リストは無理に使わない方がいいと思うよ。
<div style="float:left;">hoge1</div>
<div style="margin:0 100px">hoge1の説明<br>あんなことやそんなこと</div>
・・・最低限のことしか指定してないけど、こんな感じかな?
377 :
Name_Not_Found:03/11/30 02:00 ID:o8x1wFc9
>>374 済みません、以下の情報でよいでしょうか?
<dl>
<dt><a href="info.html">information</a></dt>
<dd>このページ<br />何かご案内書いているかと</dd>
<dt><a href="rireki.html">what's new?</a></dt>
<dd>更新履歴<br />あまり更新はないものと思われ<br />むしろ、更新に興味を持つ人がいるのかと</dd>
<dt><a href="xxx.html">xxx</a></dt>
<dd>xxxxxxx<br />xxxxxxxxxxxxxxxxxxxxxxxx<br />xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</dd>
<dt><a href="うrl" target="_blank">logs</a></dt>
<dd><a href="うrl" target="_blank">2ちゃんねるxx板</a>xxxxxxx過去ログ置き場<br />このサイトの存在意義の全てを担うメインコンテンツ</dd>
<dt><a href="うrl" target="_top">bbs</a></dt>
<dd>訪れる人の少ない掲示板</dd>
</dl>
これがソースです。
WindowsXP IE6 です。
<dtの内容><ddの内容<br />
<ddの内容>
<dtの内容><ddの内容<br />
<ddの内容>
<dtの内容><ddの内容<br />
<ddの内容>
このように並べたいのですが、
displayやfloatを試してみても
<dtの内容>
<ddの内容<br />
<ddの内容>
このような並びにしか出来なくて…。
>>376 あぁ…済みません、書き込む前にリロードを怠り、無駄な書き込みをしてしまいました・・・。
なるほど、教えていただいた方法でやってみます!
>>377 せっかくdd使ってんだからbr使わないの。
>>376 div厨キタ━(゚∀゚)━!
ちゃんとしたソースにしたいなら
>>376はあんまりよくないよ
>376
div厨
>>364 <dl>
<dt class="contents">hoge1
<dd>hoge1の説明
<dd>あんなことやこんなこと
<dt class="contents">hoge2
<dd>hoge2の説明
<dd>あんなことやこんなこと
</dl>
.contents{
width : 10em;
float : left;
height : 2em;
}
>>376のソースなんてマークアップしてないのと同じ。
DIVなんて何の意味かわからんし。意味不明ソース。
>>378 dtとddのwidth指定したら出来ました!ありがとうございます!
>>380 はい…ddの中身を複数行で表示したい場合、どうすれば…?
>>381 自分も<div>を考えてました…気をつけます。
>>382 あ…凄い…できた…。
皆さんありがとうございました。
さらに勉強します!
>>384 > はい…ddの中身を複数行で表示したい場合、どうすれば…?
>>382のやりかたで複数にしたいなら行数文だけheight : 2em; の数値を多くすればいい。
>>385 ごめん。html4.01でしか書きなれてなかったもんで
>>385 はい、xhtmlで書いてみようと頑張っています!
自分でもソースが見やすくなってきました。
>>386 ありがとうございました。色々試して見ます!
>>387 あぁまたリロードを・・・
皆さんありがとうございました!
素直な子だと教えた甲斐があったな、って気がするね。
2chとは思えないすがすがしさ
入れ子になったtableがあります。
入れ子の階層によって、tdのclassは分類されています。
例えば、
第1階層のtdのclassは、jan、febなどの月名
第2階層のtdのclassは、sun、monなどの曜日名
とふうに、第1階層と第2階層のクラス名は完全に分かれています。
このとき、
第1がjan → 黄
第2がsun → 青
第1がjan、かつ第2がsun → 緑
などのように、要素名が同一で、複数のclassに一致するときは色を変える、
などのような指定は可能でしょうか?
最初、
td.jan {color:yellow;}
td.sun {color:blue;}
td.jan.sun {color:green;}
としたのですが、3つめが全く意味を成さないことに今さら気がつきました。
可能でしたら、その指定方法を教えて下さい。
月曜までよろしくといわれ、「おけ♪」と安請け合いしてしまった無知さ加減に
うなだれている週末です・・・_| ̄|○
入れ子になってんならこうだろ
td.jan td.sun {color:green;}
>>361 なんか都合の悪いことはみんなブラウザ、閲覧者のせいにしてるのな。
というか、一番驚いたのはこれだ。
ttp://ryus.s21.xrea.com/Sub/about/resp.shtml トップページに限らず、ページを開いたとたんに音が鳴るというのは好ましくありません。
聴くのが嫌なら止めておけば? 自分のテレビなら音量を下げるとかミュートするのに、自分のブラウザでしないのは何故ですか。
それをサイト制作者のせいにするのなら、貴方はテレビ局にも同じ苦情を言わなければなりません。
こいつは基地外か。
まずテレビとPCでは使用目的、使用方法そのものが違う。
どこぞの馬鹿ページで音が鳴るのをおそれて、スピーカーを常にOFFにしてなならんのか。
理由があってONにしてるときとかあるだろ。
「とたんに音が鳴る」と書いていて、「音を鳴らすかどうか閲覧者側に確認させる」と製作者側でできる対処を考えない。
単に面倒くさがり屋なのかなんなのか。
音楽を聴きながらブラウジングするなどという
PCならではの「ながら」作業に対する発想が欠落してるだけでしょ。
古いタイプの人間は本を読むは本だけ、テレビを見るときはテレビだけ
ご飯を食べる時はご飯だけ、と教育されてるだろうから
隊長!ここにもとんでもないヴァカがいました!
>>396
CSS・スタイルシートの質問者の方、どうぞ。
>>393-394 ありがとう・・・でもダメだったよ・・・_| ̄|○
ベースのhtmlファイルを見てtableの入れ子だと予想して、外部CSSで
いじってやろうと思ったんだけど、
>>393の通りにやってもだめなことから、
入れ子じゃなくて、「第1階層のclass」と俺が書いたものは、別の要素で指定してるっぽい。
しかも、ベースのhtmlファイルに対してじゃなくて、別のcssか何かで。
その要素がわからないとどうしようもないっぽい。
もう諦めた・・・_| ̄|○
402 :
Name_Not_Found:03/11/30 17:30 ID:tcevijOF
borderを特に使わないブロック要素の場合、
周囲のブロックや親ブロックとの空間の空け方は、
margin要素で指定するのとpadding要素で指定するのと、どっちが望ましいんでしょうか。
(実際の表示はどっち使ってもまったく変わらないと思うんですが、正しい表記をしたいので・・・)
ソースを見てるのに「入れ子だと予想」って?
バカ多すぎwww
>>392=
>>401です。
>>403 不可解なこと書いてると思ったでしょ?
自分でもどう書けばよいか良くわからないんだけど、
・ベースのhtmlファイルがある(コレはいじることができない)
・このhtmlファイルに記述してあるCSSファイルで、見た目だけ変更しろと指示されて安請け合いした。
・ベースのhtmlファイルは入れ子にはなっていない。
・表示させると、ベースのhtmlファイルの内容で表示された後、リフレッシュされて入れ子になる。
・なにか別の操作で、ベースのhtmlファイルへ変更を加えた上で表示している。
・再表示後のソースをみると入れ子になっている。
・それを、「入れ子にする操作」と予想した。
ってことなんです。
>>402 背景に色を付けてもう一度見てください。
質問です。
複数のスタイルシートを使っているサイトなどがありますが、どういうメリットがあるのでしょうか?
自分で考えてみたのは、classやidがごちゃごちゃにならずにスッキリ書ける、ということくらいです。
スタイルシートを切り替えて、閲覧者側で好きなデザインで見ることが出来る、ということ以外に、何かメリットはあるのでしょうか?
一つのスタイルシートの記述が少ない方が、読み込みが早い、とか…。
宜しくお願いします。
>>408 メインのSSと、ページ毎のSSをわけるとか。
>>409 つまり、classやidで細々と設定することを避ける、ということでしょうか?
それぞれの好みの問題ですか?
それとも、ページ読み込みが軽くなる、というメリットがあったりするのでしょうか?
たしか、IEは外部CSSだとプロパティが設定できる数に上限がでてたんだっけか。
いや、htmlに直接記述したプロパディの数が多すぎるとダメなんじゃなかったっけ?
>>411 >>412 外部スタイルシートに書かれている量と、サイトの読み込みとかは特に関係ないですか?
>>413 外部スタイルシートに設定したHtmlファイルの方が、
読み込みが若干ですが遅くなります。
>>414 ということは、外部スタイルシートの読み込みも、大きいスタイルシートが一つあるよりも、ページごとに異なる小さなスタイルシートを用意した方が若干早さが異なる、ということでしょうか???
>>415 そういうことになります。若干と言うよりはかなりです。
かなり早くなるので一度試してみてはどうでしょう(^^;
brにcssは当てられないのでしょうか。
スマン、シロート考えなのだが、ブラウザがレンダリングする動作と
キャッシュに依存してそうな気がします。
リラティブよりはアブソリュートの方が、位置をクライアントが考えなくて
よい分、速そうだし、4.01でも互換モードよりは標準モードの方が制約がある分、
余計なことを考えなくて良さそうだし。
テーブルって、クライアントが考えて描写しなきゃならんから、その演算に
かかる負荷が表示の遅さじゃないかと。
ただ、記述の上から解釈するのか、下から解釈してレンダリングするのか、
UAとバージョンによって違いそうだから、記述の順番はなんとも分からない。
コンパクトにするメリットって、共通するキャッシュが少なくて済むってこと?
偉い人、マジで教えて下さい。記述方法や順位や分割って、漏れも悩んでます。
>>819 brは極めて特殊な要素。
今のところこれへのプロパティはないんじゃないか?
>>419 >>422 CSS2仕様書の付録Aで
BR:before { content: "\A" } という
デフォルトスタイルを推奨している。
それと clear属性の代替で clearプロパティを割り当てるとか。
あとユーザースタイルで BR + BR { display: none; } ってのも、
おもしろい。BR の連続で空行が生成できると思っている人対策に便利。
425 :
Name_Not_Found:03/12/01 00:10 ID:Uvpwx5aC
質問させてください。
Mac9.2、IE5.1を使ってます。
a:link {color: #***;}
a:hover {color: #-----;}
a:visited {color: #+++++;}
a:active {color: #..........;}
一度訪れたリンクにもカラーを指定したいのですが(hoverの指定色に)、
実際やってみるとvisitedのカラーのままで変化しません。
なにか間違えているのでしょうか?
ヒントだけでも頂けませんか。いろいろ探してみたんですが
わかりませんでした。よろしくお願いします。
>>426 visted なリンクの上にポインタを当てた時(hover)のスタイルを指定したい
ってことじゃないの?
それなら
a:visted:hover { 〜 }
だよ。
>>427 >一度訪れたリンクにもカラーを指定したいのですが(hoverの指定色に)、
>実際やってみるとvisitedのカラーのままで変化しません。
この文章をどのように解釈すれば好いのか正直わからん。
どういう意図にしろ、それぞれの疑似クラスを活かすには
:link, :visited, :hover, :active の
順序で設定しなければならい事にはかわりない。
429 :
425:03/12/01 00:50 ID:Uvpwx5aC
>426-428
順序を >:link, :visited, :hover, :active
に変えたら思ってた通りにできました。
自分的にわかりやすいように勝手に順序を入れ替えてたのが原因だったのですね・・・。
安易な質問ですみませんでした。大変助かりました。
丁寧にありがとうございます。
430 :
427:03/12/01 00:52 ID:???
>>428 それは確かにそうだね、余計な突っ込みでスマソ。
合計サイズが同じなら、ファイルを幾つかに分割するより一つに纏めた方がリクエスト回数は減る。
ただ分割してある方がDLは早いかもしれない。
一つに纏めてあればキャッシュを読んで次からは早くなるということも考えられる。
しかし、たかだか数十〜数百行程度のテキストをDLするのに掛かる時間なんて
例えアナログ回線だろうと差異を体感出来る事はまずない。
レンダリングに掛かる時間の方がたぶん長い。
レンダリングに掛かる時間は正直判らん、ブラウザの実装とソース次第としか。
どっちにしても意図的に表示を早くするのは困難で、
なおかつ効果はほぼ体感できない。
効果があるのはテーブルを使わないようにする、imgはサイズを指定する、くらい。
細かい事は気にせず書き安いように書くのが一番良いと思われ。
ただimportで別のファイル指定してて、指定された先にもimportで別のファイル指定してたりしたら
さすがにこいつおかしいんじゃないのかとかは思うな
モジュール化してるなら別にいいと思うけど。
434 :
Name_Not_Found:03/12/01 16:37 ID:8QnaWJzI
質問です、
p{
margin: 0 0 1em 0;
padding: 1em 0 0 2em;
border-style: solid;
border-width: 1px;
border-color: #000000;
}
<body>
<p>橘ちひろ</p>
<p>珠瀬壬姫</p>
<p>桐嶋絵麻</p>
<p>芳乃さくら</p>
</body>
こんな感じで保存すると、
1行1行がボーダーで囲まれるんです・・・
全部を一つのボーダーで囲みたいんですけど・・・
ルールに準拠した形で組むには
どうすればできますかね
<div>で囲むのが一番手っ取り早い
しかし、まぁ例なんだろうけど、名前のリストなんだったら<ul>等を使うべき
436 :
421:03/12/01 17:39 ID:???
>>431 なるほどです。ありがとうございました。
正しさを追求しないのなら
<body>
<p>橘ちひろ<br><br>
珠瀬壬姫<br><br>
桐嶋絵麻<br><br>
芳乃さくら</p>
</body>
でもいい。
正しいのは<div>で囲ってそれにborderを指定して、
入れ子で<ul>を使う。
>>434 437の例は正しいとは言えないだろう。
ひとつの段落が複数行に渡るのなら
<div>
<p>〜</p>
<p>〜</p>
<p>〜</p>
</div>
としてdivに枠表示をさせる。例のようにただの単語の羅列なら
<ul>
<li>〜</li>
<li>〜</li>
<li>〜</li>
</ul> (liに閉じタグがあるのはXHTMLの場合)
というようにしないと正しいマークアップにならない。この場合はulに枠表示をさせる。
>>438 HTMLでもLIを閉じたって構いませんよ。
さも閉じタグがない様な言い方は良くないんじゃないかと。
より正確にいうと、html4.01ではliの終了タグは『省略する事ができる』ということ。
>>437 > 正しいのは<div>で囲ってそれにborderを指定して、
最初からこれを教えるべきかと。無駄に惑わせることを教えると混乱の原因になるんじゃないかな。
混乱上等
>>442 お前が勝手に混乱することには干渉するつもりはない。興味も無いし。
マジレス上等
>>444 意見のないお前にマジレスなどつくと思ってるあたりが哀れでめでたいな
オメデタ上等
CSSに関する質問はこちらへどうぞ。 ※ 議論はよそで ※
448 :
Name_Not_Found:03/12/02 12:58 ID:A+PT0zaT
キャンペーンサイトをCSSデザインで作ろうと思ってみたが、
度重なる追加・レイアウト修正に断念。
やっぱ理想でしかないな…。
449 :
V:03/12/02 12:59 ID:???
ここは釣堀じゃありませんよ。
>>449 >>448は、「自分にとっては」理想でしかないと言ってるんだよ。
CSSでデザインする人たちを高嶺の花だと思ってることをあきらかにしてるんだね。
451 :
448:03/12/02 23:10 ID:???
お、レスついてる。
>>449 そうそう、自分のサイトはstrict+cssだけど、やっぱ画像ばっかりでテキストのほとんどない
商業(特に広告チラシに近いキャンペーンサイト)なんかだとつらいものがあるね。
NN4.x避けにmedia="screen,tv"を指定してるんですが、
そうすると、
word-break : break-all
over-flowなどが使えません。
どうしたらいいでしょうか?
456 :
455:03/12/03 08:21 ID:???
仕様書を見る限りでは、
screen continuous visual bitmap both
tv both visual, aural bitmap both
となってますが、
over-flowはvisualなので使えるはずなんですが。
458 :
455:03/12/03 08:43 ID:???
>>457 あ、そっか。
そもそもimportしてるんですが、なぜか「NN避け」とか考えてました。mediaで分けるのはやめてみます。さんくすこ。
459 :
455:03/12/03 08:47 ID:???
で、試そうとしたらoldversion.comにNN旧verねえし……。
461 :
Name_Not_Found:03/12/03 09:12 ID:in8hHNnB
>>451 ぜんぜん辛くないぞ。むしろ
うだうだ表組みしない分だけ、手書きの身にはらくちんだ。
おれのサイトは画像サイトで、広告もばしばしはって
みじめたらしく小遣い稼ぎしているんだが、
おれの悩みはxhtmlの「構造」だな。
できれば<h1>を先頭に出したいが、そうもいかない。
<h1><h2><h3>と理路整然に並べるのも苦しい。
広告の見出しにhをつけたものか、<p>でもかまうまいかと
もんもんと悩む。
462 :
455:03/12/03 09:19 ID:???
>>460 すんません。欲しがってるくせにやらしく「ねえし」とか遠回しな要求の仕方をしてることに気付きました。
感謝します。
>>461 > できれば<h1>を先頭に出したいが、そうもいかない。
なぜ?
> <h1><h2><h3>と理路整然に並べるのも苦しい。
なぜ?
> 広告の見出しにhをつけたものか、<p>でもかまうまいかと
> もんもんと悩む。
見出しだからつければいいでしょ?
463 :
Name_Not_Found:03/12/03 09:38 ID:in8hHNnB
俺も構造で悩むってのは理解できん。
自然にh1は一番頭に来るし、h1h2h3普通に作ってきゃ並ぶし
ソースに寄るが、広告の「見出し」ならhnでいいだろ。いずれにせよスレ違い。
465 :
455:03/12/03 09:44 ID:???
>>457 原因がわかりました。
×over-flow
○overflow
typoですね。
466 :
Name_Not_Found:03/12/03 09:58 ID:in8hHNnB
>>464 いかにおまえが楽なデザインしかしていないかということだな。
新聞みたいに満載のページを作れば悩む。
たとえば、広告がある。それも一箇所でなくあちこちに。
(広告)<h1>記事<h2>記事(広告)<h3>記事(広告)
とある場合広告のヘッダはどうするんだ。
記事と広告は無関係なのだから、広告は独立したものと見做し<h1>とつけるか。
すると、<h1><h1><h2><h1><h3><h1>となるだろうが。
あんたは深い考えなしに適当なhnをつけるのだろう。
しかし広告はどこにあっても同じなんだから
広告挿入位置でhnの扱いが違うのはおかしい。
それじゃおかしいから<p>でやり過ごすか。
おれはそういうことを言っているのよ。
幼稚なことしか頭が回らないならふざけた口ぶりで絡んでくるな。
467 :
455:03/12/03 10:05 ID:???
>>466 スレ違いだよ。
ただ、一つだけ言うと、
例えば、「おじいちゃんのHTML講座」というサイトの「おじいちゃんのtips」というコンテンツの見出しは、「おじいちゃんのtips」なので、「<h2>おじいちゃんのtips</h2>」などとするけれど、
そこへの参照リンクを張るときは、「それを見出しとするかどうか」なんて考えればわかるだろ。見出しなわけない。
要は「それ自身がそれ自身にとっての見出しなのかどうか」と「この文書にとっての見出しかどうか」で判別できる、ってこと。
いやあなんつうか、煽り好きですね……
それはともかく
>いかにおまえが楽なデザインしかしていないかということだな。
楽なデザイン云々じゃなくて、ドキュソ広告貼りまくってるのから
ややこしくなってるだけなんじゃないの?単に。
大体、広告の見出しってのがわからんけど、広告ってバナー画像
はって、それクリックすると広告元に飛ぶ奴だろ?それにさらに見出し
つけんのか??糞広告貼るほど貧乏じゃないからわからんけど。
[広告]
いまなら*%値引き!(広告の説明)
って形は普通に見るが
**PC専門店(見出し)
[広告]
いまなら*%値引き!(説明)
これは見たこと無い。
470 :
Name_Not_Found:03/12/03 10:11 ID:in8hHNnB
>>467 なんの関係もない話だな。まあ、いいよ。スレ違いなんだろ。
その程度のレベルの人間と話しても無駄だ。
471 :
455:03/12/03 10:14 ID:???
word-break、overflow-yはIE独自拡張でした。自己解決。
>>470 読解力ないね。まあもまいがどんなヘタレソース書こうがどうでもいいけど。
慈悲かけてやって損した。
つーか複雑なレイアウトも糞も、
小遣い稼ぎ広告入れてるからややこしくなってるだけの話じゃないのか・・・?
470 名前:Name_Not_Found 投稿日:03/12/03 10:11 ID:in8hHNnB
>
>>467 > なんの関係もない話だな。まあ、いいよ。スレ違いなんだろ。
> その程度のレベルの人間と話しても無駄だ。
(´-`).。oO(本気で理解できていなかった様子。
475 :
Name_Not_Found:03/12/03 10:20 ID:in8hHNnB
>>468=455じゃないのか。だったらスマン。
>ドキュソ広告貼りまくってるのから
まあそのとおりなんだけどな。
貧乏人には月3万でも結構うれしいもんなのさ。
イケてるCSSサイトのリンクを見て回ったが、
おれのサイトはあのリンク集のどのサイトよりも圧倒的に複雑だよ。
自分のがイケてるサイトとは思わないけどね。
CSSサイトで新聞みたいに記事と画像と広告が満載のサイトは
見たことがない。参考にしたいんだけどねえ。
>>473 それ以前に、「広告における見出し」と「自サイトの見出し」の区別が出来てないだけだろ。
477 :
455:03/12/03 10:21 ID:???
>>475 お前は内容で判断せずに煽るんだね。とことん腐れだな。腐れ人間に腐れ広告に腐れソースか。おもしれえ。
>>475 > おれのサイトはあのリンク集のどのサイトよりも圧倒的に複雑だよ。
構文が複雑になるのは簡素に書く能力が欠損してるだけでは?
まあ、in8hHNnBは貧乏なわけだが。
>>475 > 自分のがイケてるサイトとは思わないけどね。
俺も思いません。
>>475 > CSSサイトで新聞みたいに記事と画像と広告が満載のサイトは
> 見たことがない。参考にしたいんだけどねえ。
見易さを考慮するとそういうデザインにならないからこういう結果になってるのでは?
そもそも、広告って自分のサイトの内容と関連性がないのに
ページ単位の見出しを与えようと考えるのが間違いじゃ?
hnなんてはなから候補にはいらんだろ
482 :
Name_Not_Found:03/12/03 10:28 ID:in8hHNnB
>481
>>476が理解できないんだから、何言っても無駄だ。
>482
はじめに見栄えありき、な人には紙媒体をオススメしまつ。
HTMLとCSSの考え方とは違う、ということに気付けばこんな愚問はでないはず。
484 :
483:03/12/03 10:33 ID:???
語弊があるね。
×HTMLとCSSの考え方とは違う、
○「HTMLとCSS」で構築するドキュメント作成の考え方は「見栄えありき」とは違う、
>>in8hHNnB
あなたのようなものの考え方をするお方にはテーブルレイアウトというふさわしい手法がご用意されておりますのでご安心を。
早くおいでよ。
これで自分の間違いに気付ければ彼も成長できるんだろうけど。
489 :
Name_Not_Found:03/12/03 10:40 ID:in8hHNnB
>>481 だから一応おれは<p>で囲ってんだが。
たとえば、<h1><h2><p>記事</p><p>広告</p><h2>...とあったとする。
構造的には広告が<h1><h2>に内包されておかしいだろ。
ぜんぜん別物なんだから。無関係なんだから。
で、別物だとはっきりさせるために、広告にhnつけて分けると
ますますおかしい。hnの候補にならないというのは同意。
だからどうしたものかと悩んでいると話したところ、
阿呆の455が絡んできたわけよ。
>>489 そもそも悩むことがおかしい、と全員言ってるんだけどな。
見出し(本文が存在する)なら広告でも見出しとすればいいし(現に
>>461で「広告の見出しに」と言っている)、
広告そのもの、(見出しではない)なら見出しとして扱わなければいい。
>>461の段階で、「広告の見出し」と言っているのだから、
>>462の「見出しだからつければいい」は妥当。
>広告は独立したものと見做し<h1>とつけるか
なんてのはそもそもHTMLの構文自体理解できていないことが原因じゃないか。
>だからどうしたものかと悩んでいると話したところ
どこで話したらいいかがわからない時点で「構造と見栄えの分離」以前の「構造」レベルの質問であることがわかるな。
もまいらいい加減相手にするのはやめろ。
494 :
Name_Not_Found:03/12/03 10:52 ID:in8hHNnB
>>490 じゃ、おまえならどうするんだ。
勘違いがあるといけないから強調しておくが、
<h1><h2><p>記事</p><p>広告</p><h2>..
は極端に簡略化して提示しているんだからな。
<h1><h2><p>記事</p><p>広告</p><h2>..
はこれでオッケーか。おれはこれだと
構文的に<h1><h2>で括られて非常に居心地が悪いんだが。
>>494 > <h1><h2><p>記事</p><p>広告</p><h2>
hnにブロックレベル要素は入れれませんて。
>>494 > <h1><h2><p>記事</p><p>広告</p><h2>..
> はこれでオッケーか。おれはこれだと
こんなレベルのやつと話してたとは……。
なんだ、真性だったんか・・・
498 :
Name_Not_Found:03/12/03 10:59 ID:in8hHNnB
>>495 おまえらアホか。てか、頭大丈夫か。
一瞬、なにを言っているのか理解できなかったぞ。
</ は省略してるに決まってるだろうが。
>>494 答えてあげよう。
本文に入れずにincludeして、さらにそれをポジションで適切な場所に配置。
文書自体にも本文にも関係ないんだから。
>>494 お前の居心地を解決するならこうかな。
<h1>〜</h1>
<div id="hoge">
<h2>〜>/h2>
<p>〜</p>
</div>
<p>広告</p>
<div id="hoge2">
<h2>〜>/h2>
<p>〜</p>
</div>
<p>広告</p>
502 :
501:03/12/03 11:15 ID:???
おい。貧乏人、これじゃ気に入らんのか?
h2直下になるのが嫌、というが、
<h4>更新履歴</h4>
<p>なし</p>
<address>〜</address>
その言い分だと著者情報も更新履歴の一部じゃねえか、となっちまわねえか?
504 :
Name_Not_Found:03/12/03 11:27 ID:in8hHNnB
>>500-501 まともなレスに感謝する。
> 本文に入れずにincludeして、さらにそれをポジションで
やってるよ。配置しやすい場所は。レイヤーで重ねるとか
いろいろためした。見栄えと構造が分離しているのはあたりまえだが、
その構造部分も内容とその他で分離しようと努力した。疲れたよ。
>502 なるほどdiv囲みね。<h1><h2>などの階層をdivで囲い込みして、
<p>広告</p>を叩き出すわけだな。すると広告はhnで階層化されていない
素地の場所の<p>となるわけだ。ああ、多少もやもやはあるが
それがいちばんしっくりきたよ。理屈が通る。いや、ありがとう。
しかし、基礎のきだよな
>>ID:in8hHNnB
あなたはテーブルでレイアウトしてるのが丁度いいレベルだと思いますよ。
というわけで次からは初心者スレで大暴れして下さいね。
507 :
544:03/12/03 11:39 ID:???
> なるほどdiv囲みね。
今頃そんなこと言ってる人はさっさと初心者スレに移動して下さい。
509 :
507:03/12/03 11:39 ID:???
544→455だったね。
466 名前:Name_Not_Found[] 投稿日:03/12/03 09:58 ID:in8hHNnB
>いかにおまえが楽なデザインしかしていないかということだな。
>幼稚なことしか頭が回らないならふざけた口ぶりで絡んでくるな。
470 名前:Name_Not_Found[] 投稿日:03/12/03 10:11 ID:in8hHNnB
>その程度のレベルの人間と話しても無駄だ。
475 名前:Name_Not_Found[] 投稿日:03/12/03 10:20 ID:in8hHNnB
>おれのサイトはあのリンク集のどのサイトよりも圧倒的に複雑だよ。
489 名前:Name_Not_Found[] 投稿日:03/12/03 10:40 ID:in8hHNnB
>だからどうしたものかと悩んでいると話したところ、
>阿呆の455が絡んできたわけよ。
504 名前:Name_Not_Found[] 投稿日:03/12/03 11:27 ID:in8hHNnB
>なるほどdiv囲みね。
========================================================
>なるほどdiv囲みね。
オナカイタイ…
テーブルレイアウトと言うよりどこでも配置モードで作るのがオススメ☆
>>510 >阿呆の455が絡んできたわけよ。
阿呆と罵った455に解決してもらったin8hHNnB萌え
ID:in8hHNnBは「俺はメモ帳使って手打ちで作ってるんだぞ!」と豪語してそうなタイプだな。
要は、可読性を捨てて複雑なレイアウトにする事で
「間違って」広告を押させようってタイプのサイトなのか?
そうだったらそもそもここで論ずるべきレベルではないような。
しかし、テキスト広告を出そうってクラいるんですか?
単にdisplay: inlineを使えなくて、中途半端なseo知識で<hn>を使いたい
だけなんじゃないかと…
>>ID:in8hHNnB
2003年新語・流行語大賞@Web制作板に「なるほどdiv囲みね。」をノミネートしました。
517 :
Name_Not_Found:03/12/03 12:01 ID:in8hHNnB
>>515 バナーよりテキストのほうが圧倒的に儲かる。
>要は、可読性を捨てて複雑なレイアウトにする事で
内容が盛りだくさんなんだよ。おまえらのスカスカの日記サイトと
一緒くたにすんな。
>「俺はメモ帳使って手打ちで作ってるんだぞ!」
当たり前だろ。手打ちがめずらしいのか。お粗末な奴だこと。
阿呆と罵った455に解決してもらった感想を一つ。
「俺はメモ帳使って手打ちで作ってるんだぞ!」と豪語してそうなタイプだな。
~~~~~~~~~~~~~~~~~~~~~~~~~~
>なるほどdiv囲みね。
ワラタ
CSSに関する質問はこちらへどうぞ。 ※ 議論はよそで ※
CSSに関する質問はこちらへどうぞ。 ※ 嘲笑もよそで ※
CSSに関する質問はこちらへどうぞ。 ※ なるほどdiv囲みね。もよそで ※
なるほどdiv囲みね。はこちらへどうぞ。 ※ ID:in8hHNnBはよそで ※
阿呆も大変なんだな
CSSに関する質問はこちらへどうぞ。 ※ 豪語はよそで ※
>>ID:in8hHNnB
☆ チン マチクタビレタ〜
マチクタビレタ〜
☆ チン 〃 ∧_∧ / ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄
ヽ ___\(\・∀・) < 阿呆と罵った455に解決してもらった感想まだ〜?
\_/⊂ ⊂_ ) \_____________
/ ̄ ̄ ̄ ̄ ̄ ̄./|
| ̄ ̄ ̄ ̄ ̄ ̄ ̄| |
| 愛媛みかん |/
ハイ次の方、質問どうぞ。
532 :
Name_Not_Found:03/12/03 12:56 ID:in8hHNnB
おまえらつぐつぐ馬鹿だな。ワロタよ。
おれは即、礼を言ったはずだぞ。
まったく次から次へと阿呆が沸いて出る。
平日の昼間ってのはいつもこんなのか。あさはかな。
CSSに関する質問はこちらへどうぞ。 ※ 豪語はよそで ※
534 :
455:03/12/03 13:01 ID:???
>>529 そうなんですか。
validatorでscreen,tvメディアにはそんな指定はねえよ、みたいに言われたのでてっきり思い込んでいました。
てことは、つまりブロックレベルに対して指定してあげれば怒られないんですね。有難う御座いました。
>つぐつぐ馬鹿だな。
狙って言ってるとしてもかなり痛い。
CSSに関する質問はこちらへどうぞ。 ※ つぐつぐはよそで ※
粘着は雑談スレへどうぞ>535
2003年新語・流行語大賞@Web制作板の者ですが「つぐつぐ」もエントリーしていいですか?
次ぐ次ぐ、のダジャレのつもりなのかw
つぐつぐ馬鹿?
東北の人なんだよ
んだ
なんだ東北人だらけだなこのスレw
----------------------------------------------------
>>534 そんな指定ないよってのは、独自拡張だから警告してるんでないの?
word-breakプロパティーはCSS3草案で、WinIEが先行実装してるだけ。
どうもちゃんとわかってらっしゃらないみたいなので、不安。
漏れも東北人だ
フォント指定で、英語フォントと日本語フォントを重複して使用しても良いのでしょうか?
半角全角が混ざった文で指定どおりに表示されてますが、別に問題ないのでしょうか?
>>547 Operaだとベースラインがずれますよ
MacIEだとtextareaが文字化けしますよ
だからもっと詳しくさ。MacIEとOSのヴァージョンとかあるでしょ。
なんでこの板はいつもこうなんだ……
自称プロを思い込む人がどうしても多くなりがちだから
こまった人たちだな。
557 :
Name_Not_Found:03/12/04 11:07 ID:L0Lkl71Q
向上心を、わすれるな。
「実るほど、頭を垂れる稲穂かな。」
テンプレにでもいれとけ。
これからしばらくは「俺の好きなことわざ」について語ってもらいます
じゃあ質問を。
1 table-align : center; が効かない<img>等をセンタリングするには?
2 スタイルシートが使える以上、<div>の存在価値がないのは気のせい?
ってか<p>と<div>に何か差異があるんでつか?
3 書籍に(常識なのかも知れんが)<br>をいくつも並べて、空行を確保することは
良く無い、とあったんだが。では、一般的なやり方は?
よろ。
>>560 あぁあぁぁ
1 は tableじゃなくて text でつ……失敬
>>560 1.text-alignはブロックレベル要素に指定し、その中のインライン要素に効きます。
2.気の所為です。意味に差違があります。
pはparagraph、段落です。divはdivision、区切りです。
3.改行して新たな段落に移るならpです。
2と3はCSSではなくHTMLの質問ですから、本来このスレッドに訊ねるべきことではありません。
どれも基礎の基礎なので、勉強して下さい。
なるほどdiv囲みね。
CSS Calidator使うと
Line : 0 can't find the warning message for otherprofile
と警告が出るのですが原因が分かりません。
何か分かる方がいらっしゃいましたら教えてくださいませ。
文字コード
Calidator っておいしいですか?
>>560 PocketIE2.0だと連続したbrは見た目1行にまとめられてたな。
あと、Lynxも設定によってはそうなる。
空行な見た目を作るときはCSSのmarginを使うのが普通だと思う。
空マージンですか?
#loe
>>568 下にマージンを多くとっているクラスを使うとか、
上にマージンを多くとっているクラスを使うとかだろ。
空マージンってなんだよ。
一応書いておくけど、中身のないpとかするのは止めといたほうがいいぞ。
なるほどdiv囲みね。
573 :
V:03/12/04 16:54 ID:???
●.......
●..... ●.......... ワーワー
div;..... ●...............
●............
●..... ●..........
●...... ワイワイ-
>>573 ワロタ
囲まれてるのがID:in8hHNnBか。
<div id="in8hHNnB">
<p>広告</p>
</div>
ここ数レスで笑えるか笑えないかがHTMLの基礎知識を知ってるか知らないかの分かれ目だな。
578 :
Name_Not_Found:03/12/04 19:35 ID:w62Pelvd
おまえら、まだやってるのか。
よほど悔しかったんだな。
( ´д)ヒソ(´д`)ヒソ(д` )
ここはCSS質問スレッドで、HTMLを初歩から教授する所ではありませぬ。
h2{font style="border-color:blue;
padding-left:1px; border-style: solid;
border-width:1px 1px 1px 30px;
width=100% size=5 color=blue: }
とか、外部CSSで
2つボーダー(っていうのか?)並べた時に、
その行間を詰める方法を教えてくれ!
line-heightじゃ詰められねんだ!
頼む!
つまり、重ねて並べたいんだよ!
初心者板でも書いたけど、駄目な様なので、
此処で頼みます。
>>581 全てにおいて最初から学習し直しましょう。
そうすれば「なるほどdiv囲みね。」と気付けるはずです。
>>582 無効でも言われたな。
答えだったのか。
ありがと。
584 :
581:03/12/04 22:17 ID:???
やってみたけど、駄目だった。
6PX開くんだよな。2PX位が理想なのに。
>>581 スタイルシートの書き方がめちゃくちゃ。
>>4行って最初から勉強しなおせ。
ごめん。違う方法で出来た。
margin-topが足りなかったらしい。スマソ。
>>585 CSSの素材サイト、そのままの写しだよ。
漏れ作じゃない。
>>590 晒したら突撃しそうな勢いあるから。
ガクガクブルブルな感じだ。
>>591 別に掲示板荒らしたりはしないと思うけどなぁ…。
ただ、他にどんなものを素材として配布してるのか気になる。
=でも認識するのか
HTML素材とかやってる時点で
スミからスミまで見てしまうなぁ。
荒らしはしないよ。ニヤニヤしたいだけだ。
>>581みたいな誤りだらけのソースを公開するサイトは、罪です。
ちゃんと批判すべきですよ。
>581までひどいソースは初めて見た。
>>581 CSS初心者の俺から見ると
ヽ(`Д´)ノなんじゃぁこりゃぁ
('A`)わけわーらん
ひどいっていうか、わけわかんないです。
縦に並ぶプルダウンの横の長さをCSSで揃えたんですが
WIN/MACのNN4.xは共に無視されて凸凹になりました。
どうにかきちっと揃えることってできませんか?
>>599 質問する時にはソースを書きましょう。
あと、こんな事いうのもなんだけどNN4.xはどうにもならん事があります。
601 :
Name_Not_Found:03/12/05 15:11 ID:PH7G6Js4
質問です。
<blockquote> </blockquote>
で囲んだ部分のフォントを等幅フォントにするには
どのように書けばいいですか?
603 :
Name_Not_Found:03/12/05 15:29 ID:PH7G6Js4
>>602 一通り全部見たのですが、分かりませんでした。
よろしくお願いします。
604 :
Name_Not_Found:03/12/05 15:41 ID:6mfPWF7f
>>603 フォントを指定してください。
style="font-family: MS ゴシック" など。
>>603 お前はリアル消防か。絶対に一通り読んでないだろ。
どうせ blockquote をレイアウト目的で使ってる低能だな。
>>604 お前もインラインスタイルなんかで教えるな。
それに例として monospace の指定を省くな。
606 :
Name_Not_Found:03/12/05 16:03 ID:+sDjZAiN
ネスケでもIEでも見た目が変わらないようにCSSでデザインをしているのですが
メニュー
<ul>
<li>bbs</li>
<li>mail</li>
</ul>
上のようなソースで<li></li>のインデント(?)位置が大幅に違っていて困っています。
(ネスケだと大幅に右にずれてしまう)
何か良い対処法はないでしょうか?よろしくお願いします。
>>606 ソース出せ.ブラウザのバージョンも書け.
たぶんpaddingだと思うが
609 :
Name_Not_Found:03/12/05 16:23 ID:+sDjZAiN
>>670 padding指定でOKでした感謝です。
>>608 ありがとうございます。参考にさせてもらいます
この板の人は親切ですね。
>>604 MSゴシックはインストールされてないんですけど。。。
monospaceとは何でしょうか?
親切なやつはごくひとにぎり。
残りはカスもカス。ひきこもり厨房ばかりだよ。
612 :
Name_Not_Found:03/12/05 16:44 ID:TBjuZd6p
614 :
V:03/12/05 16:45 ID:???
>>610 総称フォント名で等幅フォントを表したもの。調べれば一発。
疑問に思ったらとことん調べる、調べないと俺みたいになるよ。
abo-n {
background : url(****) bottom no-repeat;
}
---------------
abo-n {
background-image:url(****)
background-position:bottom;
background-repeat:no-repeat;
}
中身は同じだと思いますが、どちらの書き方の方が適切なのでしょうか?
>>615 abo-n {
color : ***
background : *** url(****) bottom no-repeat;
}
---------------
abo-n {
color : *** ;
background-color : ***;
background-image:url(****)
background-position:bottom;
background-repeat:no-repeat;
}
これが適切な書き方です。
どっちも適切。
外部CSSファイルでフォントカラーを指定しています。
JSで外部から情報を提供していただいて表示させているのですが、
背景色と同系統で隠れて読むことができません。
背景色は情報提供先で色指定しているようでCSSが効きません。
理想としてはのこの部分だけ外部CSSを無効にしたいのですが、可能でしょうか?
可能であれば、方法を教えてください。
強引に以下のようにしてみたのですがうまくいきませんでした。
<font style="color:#000000;">
<SCRIPT type="text/javascript" SRC="
http://情報提供先アドレス.js"></SCRIPT>
<SCRIPT type="text/javascript">
・・・以下、登録アドレスとマッチしているかを確認するJS・・・
</SCRIPT>
</font>
よろしくお願いします。
>>619 >JSで外部から情報を提供していただいて表示させているのですが
意味がわからないので、説明して下さい。
JavaScriptの結果、何が表示されるのか、そのソース例を出して下さい。
CSS使ってるのに、font要素を使用するなんて、いけません。邪道です。
621 :
619:03/12/05 23:47 ID:???
表示される情報は、リアルタイムで更新されるコラムや天気予報などです。
基本的にテキストで表示されています。
使用環境は、Win XP/IE6.0、ネットスケープ7.1です。
>基本的にテキストで表示されています。
だから、それはどんな要素としてマークアップされてるの?
ただのテキストなら文字色なんかつかないでしょ。
document.writeの中身を見せて。
あと、fontタグ使ってはいけないってのは理解できたのかな?
623 :
619:03/12/05 23:58 ID:???
何とかCSSを使おうと勉強はしているのですが、まだまだよくわかっていません。
document.write(get_weather(0));
document.write("No match!");
です。
埋め込んでいるJS全文は下記のもののみです。
<SCRIPT type="text/javascript" SRC="
http://情報的提供先アドレス.js"></SCRIPT>
<SCRIPT type="text/javascript">
<!--
var userID = '●●●';
if(check_id(userID) == 1) {
document.write(get_weather(0));
} else {
document.write("No match!");
}
// -->
</SCRIPT>
>>623 div#weather {
color:#000000;
background:transparent;
}
<div id="weather">
<script type="text/javascript">
・・・・・
</script>
</div>
とかにしてみたら?
>>623 もしくは、
div#weather * {
color:#000000;
background:●●●; ←任意で
}
<div id="weather">
<script type="text/javascript">
・・・・・
</script>
</div>
627 :
619:03/12/06 00:32 ID:???
呼び出されるHTMLが見ることができるんですね。
やっと見ることができました。
<table width="240" border="0" BGCOLOR=CCCCCC>
<tr bgcolor=#CCFFFF>
<td><div align=center>都市</div></td>
<td><div align=center>12/5(金)</div></td>
<td><div align=center>12/6(土)</div></td>
</tr>
・・・・以下続く
やはり背景色は指定されており、背景と同化している文字は指定されていませんでした。
>>624、625
なるほど、今から試してみます。
>>627 tableなんだから<font></font>の中には入れられないやな。
それはわかりますね?
セレクタは div#weather td で、よかろ。
629 :
619:03/12/06 00:53 ID:???
>>628、625、626
ありがとうございました。
望みどおりの結果になりました。
>tableなんだから<font></font>の中には入れられないやな。
確かにその通りですね。
色々勉強になりました。ありがとうございました。
ふぉんとに?
_, ,_ パーン
( ‘д‘)
⊂彡☆))ω・´) ←
>>630
>>7のQ6(画面中央に〜)を一通り読んだのですが、
結局Javascriptを使わずにCSSだけでIE、Netscape、Operaで縦中央を実現できないんですかね。
HP全体を
>>6にある擬似フレームで擬似フレーム化したいんですけど
どうもうまくいきません。
もっとCSSの書き方に関するページは無いでしょうか?
また、ここをこうすればおkなんて簡単には出来ないのでしょうか?
よろしくお願いします。
>>633 無理だろうね。単位に対する各ブラウザの解釈は違うし。すべて計算してってのならできるかもしれない。
縦中央がそれほど重要なのか問い詰めたい。
>>634 どのように記述しているのかもわからなにの答えようがありません。
>>633-634 それと質問はageましょう。
637 :
Name_Not_Found:03/12/07 03:29 ID:mUNpoKyW
すみません、
DW4でMac使いなのですが
トップの次の2ページ目をつくり、IEでプレビュー表示しても
レイアウト崩れはありませんでした。
しかしプレビューでトップから2ページ目にリンクすると
2ページ目に使われてるCSSが無効になっててレイアウト崩れが起きてしまうんですが
これはどういうことですか?
>>637 それだけじゃわからんよ
直接書いてるのか外部CSSを使ってるのか
どこか間違ってるんだろ
639 :
637:03/12/07 04:10 ID:???
外部…でいいと思います。
直接書いてるわけじゃないので。
自分のやった方法が外部がどうか分からなくて調べに行ってしまったので
初心者版で質問するべきですか?
>>639 コードビューで外部CSSを読み込んでいるか確認してみ
CSSで画面の一番下にボックスを配置ってできますか
>>643 position:absolute; bottom:0;
>>4見て基礎から学習しよう。
645 :
643:03/12/07 09:58 ID:???
BODY,{background-image:url("back.jpg");background-repeat:no-repeat;
background-attachment: fixed;background-position: 100% 100%;}
ネスケ7で背景画像が表示できないんですが、どこかおかしいところあります?
BODY,{ → BODY {
てゆうか、セレクタがコンマで終わる(最後が空要素)ってのが
CSSとして不正なのかどうかイマイチよくわからん。
不正。Appendix.D文法解析参照。
なるほど、DIV囲みですね。
勉強になりました。
651 :
647:03/12/07 12:24 ID:???
>648
おぉそんなところが・・・
さんくす!
>>649 おお、マジサンクス。Appendixなんて普段注意して見ないからね。
ruleset
: selector [ ',' S* selector ]*
'{' S* declaration [ ';' S* declaration ]* '}' S*
;
declaration
: property ':' S* expr prio?
| /* empty */
;
空の宣言は許されるから宣言ブロックの終わり } の直前が
セミコロンで終わってても問題ないが、
セレクタはコンマで終わったらいかんという解釈か。
おんや?しかし
selector
: simple_selector [ combinator simple_selector ]*
;
simple_selector
: element_name? [ HASH | class | attrib | pseudo ]* S*
;
ってことは、simple_selector で ? も * も 0 のときは
空のセレクタが許されるってことか?
そうすると結果的にコンマで終わってもいいってことになるし
また、わからんようになった・・・っと思ったら
CSS2.1で修正されるのね。失礼しました。
simple_selector
: element_name [ HASH | class | attrib | pseudo ]*
| [ HASH | class | attrib | pseudo ]+
;
cssを調べたらdivクラスが11個もあったんですけどもう立派なdiv厨ですか?
まだセーフですか?
>>654 個数は関係ないかと。
たとえ100個あろうが適切なマークアップのためであれば問題ないですし。
div.left なんてのが1つあっただけでdiv厨ほぼ確定
657 :
654:03/12/07 15:53 ID:???
div.rightとかある・・・_| ̄|○
そういうのと他のdivを組み合わせて使う以外に効率のいい方法がワカラン・・・
もっと頑張ろうね
XHTML側で
<div class="menu">
<a href="./info.html"><img src="./img/info.gif" width="32" height="32" alt="Info" />Info</a>
</div>
としていてCSSで
div.menu{
margin:0em;
letter-spacing:0.1em;
font-size:x-small;
font-weight:bold;
vertical-align:middle;
}
としているのに、文字が行の縦の真ん中に来ないのですが、何か指定がおかしいですか?
>>659 div.menu img {
~~~~
661 :
659:03/12/07 19:47 ID:???
>>660 あー、imgに指定するものだったのですね。自分が見ていた解説サイトはブロックに指定してあったもので。
ありがとうございましたー。
間違った知識を授ける解説サイトは、名を挙げて批判した方がいいと思ふ。
真面な所は
>>4 も含めて数箇所程度しかないぞ。
残りの 99.9% が「間違った知識を授ける解説サイト」。
一々名を挙げて批判してたら一生かけても終わらない。
それでも少しづつ正してゆくほかないのだ。
少なくともそこの誤りを鵜呑みにする犠牲者は減る。
666 :
Name_Not_Found:03/12/08 00:46 ID:foJIpPQb
画像はすべて左寄せにしたいと思い
img{
clear: left;
float: left;
}
としたのだが、IEだと2個目の画像からズレてしまいました。
>>666 IEのバグに引っかかってる
>>667 いくらなんでも<br>はないだろ
せめて<hr>
質問です
レイヤーをウインドウの下や右にぴったりくっつけて表示するにはどうすればいいですか?
ウインドウサイズを変えても端に張り付いてるようにしたいんです
左と上の端基準の方法しかないんですか?
>>665 杜甫々の間違った記述とはどれであるか? 指摘して頂戴。
672 :
Name_Not_Found:03/12/09 00:50 ID:Y8P52uzr
____ ____ ____
| | | | | |
| |_| | | |
| | | |
| | ̄| | | |
 ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄
本文本文本文
こんな図のように、h1の文字が半分程下のエリアに隠れる というものを目指しています。
z-indexを使ったり色々試行錯誤してみたのですが、
IEできちんと見えるようになると、NS、Mozillaの表示が崩れ…
逆にNS、Mozillaが見えると、今度はIEが崩れ……
と、ループに陥ってしまいました。
自分ではこれ以上無理なようです。
何方かどこをどうすれば3つのブラウザで意図どおりに表示されるようになるのか助言お願いします。
ソースとCSSは以下のようにしています。
-- HTML --
<div id="img"><h1> H1H1 </h1></div>
<div id="con"> 本文 </div>
-- CSS --
h1 {margin: 0;
padding: 10px 0 0 15px;
font-size: 85px;
overflow: hidden;
width: 200px;
height:60px;}
#img {width: 200px;
height:60px;
background-image:url(... 縦60x横200の画像 );}
#con {background-color:#aaa;
width: 200px;}
と、なります。よろしくお願いします。
>>673 1) #con の margin-top にマイナスの値を指定する。
2) #con に position:relative を指定して top にマイナスの値を指定する。
3) #img と #con をまとめて<div>で囲んで position:relative を指定し
#con に position:absolute を指定して top で位置決め。
どれか好きなのを選んで。つーか <div id="#img"> なんか要らんでしょ。
h1 { background: url( 画像 ) no-repeat }
>>671 間違った記述云々よりもまず理念・思想が腐っている。
杜甫々は何時まで経ってもレガシーなブラウザを妙に固執し過ぎる。
MSIE3,4 などシェアは限りなくゼロに近く、Netscape 4.x のシェアも低い。
UNIX系でも Gecko系ブラウザや KDE Konqueror が存在するというのに。
杜甫々はスタイルシートが嫌いだから、解説も偏っている。
h1 がなく h2 から始まり、次に h4 という構造からして、
HTML の理念を何時まで経っても理解しようとしていない。
彼のレガシーな『バカの壁』は堅牢で、一向に崩れる気配はない。
676 :
673:03/12/09 01:59 ID:???
>>674 2の方法でIE NS Mozilla全て同じように表示する事ができました。
有難うございました。助かりました。
よく見てみれば#imgも省略できましたね…そちらも有難うございますー。
>>676 見栄えのためのIDなのかい?
とか言ってみる
679 :
Name_Not_Found:03/12/09 02:57 ID:S/0GU+Nt
styleseet を使ってリンクのtarget を指定することってできますか?
>>679 styleseetじゃ、できません。無論、stylesheetでもできません。
>>680 あ、スンマソン。ありがとうございます。
>>679 IEのみでいいなら
a { behavior1: expression( this.target = '_self' ); }とかあるけど。
>>683 てか、んなもん使うくらいならa要素にtarget属性つけれ。
余談だけど、「HTMLドキュメントにtarget属性を記述しない」理由が「strict+valid」なら、今すぐ発想を転換しなさいよ。
そんな理由でCSSを使うのはstrictな思想とは言えないからね。
>>684 用途はユーザーにcookieを使ってターゲットを変えられるようにすることです。
>>675 何だ、理念だの思想だのの問題かい。
個々の記述に誤謬が無いんなら、許すよ。理念を声高に語ってるサイトではないんだし。
理念なんざは、もっと別の所で学べばよい。とほほはレファレンスと割り切って使用すればよし。
>687
さんきぅ!たすかったYo!
思想ばっかごねて、屁の役にも立たないようなCSS解説サイトも多いからな・・・
とほほはなんというか、入門向けと言うか、初心者向けと言うか。
一通り参考にはなるけど込み入った解説や解釈が足りない、という気はする。
<marquee> <blink> <multicol> <spacer> <nobr> <wbr> <comment> は参考になるよ。
なにせ仕様書でも解説されてないし。
>>694 それ、本気で感心してるなら一から勉強しなおせ。
皮肉以外の何でもないだろうが
font-styleプロパティについて、
不適切な解説している奴が多くない?
ちなみに杜甫々の解説も間違っている。
<div id="1"><H1>タイトル</H1></div>
<div id="2"><p>内容</p></div>
<div id="3"><address>署名</address></div>
3つのブロック要素を、右から順に複数並べたいのですが、単純に#1,#2{float:right; 〜}などとした場合、
floatを指定した要素に横幅を指定しなければならない関係上、
ウインドウの横幅を動かしたときに一番下のブロックの幅もしくは右マージンが影響を受けますよね。
このとき、下二つのブロックの幅を固定して一番上のブロックの幅、もしくはマージンが動くようにしたい場合、
どのような記述をすればよろしいのでしょうか。
ブロック要素の順番をひっくり返すと、HTMLとして内容があべこべになってしまう場合の話です。
699 :
698:03/12/09 16:46 ID:XWd5rYAz
あ、申し訳ないです。質問なのでageさせてください。
>>698 数字のみのID属性値は文法違反だよ。
HTML4 では [a-zA-Z][:.a-zA-Z0-9_-]*
CSS のセレクタでも #1,#2 は不正だよ。
702 :
698:03/12/09 17:03 ID:???
>>701 あ、すいません、例を分かりやすくするだけのために適当なidにしてしまいました。
1つめ、2つめ、3つめのブロックにCSSを設定するときの属性・・・ぐらいの解釈にしていただけると助かります
2つの幅を固定するなら残りは width:auto; margin:0 でいいんじゃないの?
浮動は幅を明示せにゃならんが、ここらへんがよくわからんのよね。
704 :
698:03/12/09 17:37 ID:XWd5rYAz
>>703 width及びmarginにautoの指定はしてみたのですが、反映されませんでした。。。
705 :
Name_Not_Found:03/12/09 18:08 ID:21N3nCER
解説サイトを見ても、どのキーワードで
調べれば良いのかすら解らない初心者です。
大変申し訳ありませんが教えていただけますでしょうか?
<form>
<input type="button" style="background:url(画像アドレス);
color:navy;border:2px solid navy;width:30px;" value="ボタン">
</form>
このフォームを頂いてきました。
それで、これを横にいくつか並べて、リンクのボタンとして使いたいのですが、
リンク先を<a href="****">(カッコは小文字で入れています)
色々なところに入れてみたのですが、飛んでくれません。
どこに入れれば有効なのでしょうか?
本当にバカみたいな質問なのでしょうが、どなたか教えてください。
お願いします。
>>705 JavaScript location.href onclick
>>705 スタイルは無関係。
HTMLの初心者向けの本・サイトを一から見直すことを勧める。
708 :
705:03/12/09 18:41 ID:???
JavaとJavaScriptは全くの別物。
710 :
698:03/12/09 20:12 ID:0WK7JFq/
自分の質問は一応CSS関係なんですが・・・誰か・・・
TABLEなんて邪道とかいわれそうで恐いですが、
TABLE内の画像を水平・垂直にセンタリングする場合は、
どういう方法が一般的なのでしょうか?
CSSは使用せず、HTMLでやった方がいいのでしょうか?
いや、JavaScriptで閲覧領域の位置とサイズを厳密に弾き出し
画像を絶対配置するのがいい。
俺はやらんけどな。
>>688 とほほのdiv要素に関する記述見て来い。
下手したらDVI厨を生産してるのはとほほだぜ?
DVIってなんだよ、吊ってくる
>>710 下とか上とか、どのブロックを指すのかわかりません。
id名で記述してもういっぺん
>>698を質問し直してくれない?
>>711 邪道と言うよりも、「そんなもん使うなら、CSS使うな」と思ってるだけで。
ジャージにトレーナー姿で「僕に似合うネクタイありますか?」って言ってるようなもん。
>>698 IEでmarginとってきれいに3等分するのはバグがあるからむりだよ
718 :
705:03/12/10 02:34 ID:???
>>706さん
遅くなりまして、申し訳ありません。
できました。ありがとうございます。
>>707さん
何年ぶりかでホームページを作成したら
すっかり色々忘れていました。はい、勉強しなおします。
708は私ではありません。
引用:
<div> 自身は特に何の意味も持たないタグです。
<div>〜</div> で囲まれた部分を右寄せしたり、スタイルシートを適用したりするのに用いられます。
これじゃDiv厨できるにきまってるじゃん。
>>719 説明は間違ってないが、補足くらいはしておいてほしいものだな。
>>721 杜甫々はHTMLの理念なんぞ気にしないから常に手抜きなんですよ。
杜甫々は物理マークアップが大好きで、CSS が大嫌いなんですよ。
杜甫々は過去の負の遺産に縛られて抜けられない哀れな人なんですよ。
負け組み解説サイトの管理人も必死だな
W3CのCSS検証サービス(
http://jigsaw.w3.org/css-validator/validator-text.html)
で、次のCSSを試してみました。
q{
quotes:"「" "」" "『" "』";
}
q:before{
content:open-quote;
}
q:after{
content:close-quote;
}
その結果、次のようなエラーが表示されました。
Line: 0 Context : q
Invalid number : quotesParse Error - :"「" "」" "『" "』"
これは CSS Validator が日本語に対応していないということなのでしょうか。
(引用符をシングルクォート「'」やダブルクォート「"」にしたら、エラーは出なかったので)
@charset "shift_jis";を書いてもダメですな。
でもファイルをどこかにあぷしてそれを解析させれば大丈夫なはず。
726 :
Name_Not_Found:03/12/10 14:29 ID:aXBUgErJ
STYLEを定義するのに . (ドット)ではなく # を使っているところがあったんですが
. (ドット)と # に違いはあるのですか?
728 :
Name_Not_Found:03/12/10 14:49 ID:aXBUgErJ
>727
ありがとうございます。
便乗で。
引用符を表示しない場合は
これでいいのかな?
クヲーテイション出ないんだけど。
q:before {content: no-open-quote; }
q:after {content: no-close-quote; }
>>729 q:before {content: ""; }
q:after {content: ""; }
もしくは
q { quotes: none; }
>>725 れす ありがとうございます。
(
>>724で、)「ソースファイルをアップロードして検証」のほうも大丈夫だったので、
日本語の扱いに問題があるのは「テキストエリアに入力しての検証」だけのようですね。
というか、微妙にスレ違いの質問だったかも。失礼。
733 :
Name_Not_Found:03/12/10 19:29 ID:lEoltu88
<input type="text" のサイズをスタイルシートから設定することは
できないのでしょうか?
input { size : 50px; }
などとやってもダメでした。
>>733 ネタならもうちょっとマシなやつにしてくれ
735 :
Name_Not_Found:03/12/10 20:04 ID:lEoltu88
>>734 マジです。出来ないのなら、HTMLタグの属性をどこまで
CSSで設定可能なのか分りやすく解説してるドキュメントを
教えてください。
>>735 FAQのQ8(
>>7)を見よ。
まあ、それすら見ないで質問する奴に、理解できるか危ぶまれるが。
737 :
Name_Not_Found:03/12/10 20:20 ID:lEoltu88
>>736 ありがとうございます。分り易そうなサイトがいくつかありました。
input { width : 300px; }
とすることでOKでした。ところで疑問なのですが、HTMLタグの属性名と
CSSのプロパティ―とはどうして名前が違っているのでしょうか?
後から作られたCSSはどうしてHTMLの規格に合わせなかったのでしょうか?
>>737 初心者は
>>4の解説サイトで学んで下さい。
CSSとは何のため作られたのか、理解してから使って頂戴。
で、とほほを見ると・・・
仕様書の翻訳、分りやすくていいっすね。
これとあわせてとほほさんところの読めば最強?!
複数の<img>を横に並べたいとき、img { display:inline; }でできますが、
下揃えで並びます。これを上揃えで並ばせたいのですが、可能でしょうか?
>複数の<img>を横に並べたいとき、img { display:inline; }でできますが、
インライン要素に何でdisplay:inline;を指定するか。要らぬことしなさんな。
>>4でvertical-alignについて學び給へ。
了解しました。確かにdisplay:inlineは勘違いでした。
745 :
Name_Not_Found:03/12/10 23:53 ID:JDfamHa4
画像を右寄せにしたいのですが、
text-align : right;
では、だめなのですか?
floatを使うべきですか?
ちなみに
<p>〜〜〜〜〜〜〜〜〜</p>
<ul>
<li><img src="バナー1.gif"></a>
<li><img src="バナー2.gif"></a>
</ul>
でバナー1、2を右寄せにしてみたいのです。
ふと思ったんだけどIEがCSSを結構なレベルまで実装した場合広告バナーをfixed指定とか大量に出ませんか?
そうしたら邪魔でしょうがない予感。
「text」だからじゃない?テキストの蟻群を右にするのかと。
蟻群でゲラゲラワラタ (;´Д`) モレもうすぐ発狂するかもわからんね
アラジン
アリグンとかエーハレフとかいわない?
アリグンとアーフレッフって読んでる
蟻群にわしもワラタ
>>745 text-alignはボックスの中身の寄せ方の指定だから、インライン要素には効かない。
display:inline;
も追加して味噌
でいいんだよね?
幅100%、高さ1pxの水平線を入れたいとき、どうするのがもっとも的確でしょうか?
hr { height:1px; } で<hr>するとどうしても高さ1pxにならないので、
<div style="border-top:1px solid #000000;"></div>
としましたが、これでよろしいんでしょうか?
からのDIVなんて使うなよ
そんなことせずにおとなしくhrで上手に指定する方法使う(cssバグ辞典参照)か、または
<p>ほげほげ</p>
<p>ほげほげ</p>
<!--ここにボーダーを入れたい-->
<p>ほげほげ</p>
<p>ほげほげ</p>
↓
<div class="capt">
<p>ほげほげ</p>
<p>ほげほげ</p>
</div>
<p>ほげほげ</p>
<p>ほげほげ</p>
とでもして、cssで
.capt{border-bottom:1px solid #000000;}
としなさいよ
そうします。
>>753 >display:inline;
>も追加して
ネタ? そんなの不要だろ。
普通にブロックにセンタリングかければいいんでないの?
ただの勘違いかと思われ
>>754 <hr style="border:1px solid #000; width:100%; height:1px;" />
そうしてしまったなら残念ですが
>>686-687 ,
>>689 で挙がってた
高齢者・障害者等配慮設計指針− 情報通信における機器・ソフトウェア・サービス −第三部:ウェブコンテンツ
のググルキャッシュのコードを消してマークアップしなおしたんだけど、
需要ありますかね?
>>745 text-alignはulかliに指定しる。
764 :
Name_Not_Found:03/12/11 19:10 ID:hBfzDFv5
<ul>
<li>12/30(火)</li>
<li>12/31(水)</li>
</ul>
マーカーに画像を使用したいんですが、
list-style-image
で指定しないで、
background-image
等を使ってを表示するのは好ましくないんですか?
加護ちゃんの写真集を買ってきて早速部屋でオナーニ・・・
・・・最中を妹に見られますた。
激烈に鬱。。このまま、引き篭もろうかなぁ…
>>764 表示の仕方が明らかに違うんだから、どのように画像を表示させたいのかで自分で考えろよそのくらい。
>>765 漏れの記憶だと、妹ブラウザでは兄のオナーニはバグって見えなかったと思う…。
ちょっと曖昧な記憶なので、誰か知ってる人補完して。
ちなみに、姉ブラウザではバグはなかったよ…_| ̄|○
768 :
756:03/12/11 23:02 ID:???
>>760 いや、それだと確かに1pxのラインにはなるんですが、上下に余計なマージンが
出てしまいます。IEのバグみたいなんですが。
上下にまったくマージンを取らない1pxの水平線が欲しいです。
770 :
756:03/12/11 23:40 ID:???
* { margin:0px; padding:0px; }
にしてます。それでもだめです。
772 :
756:03/12/11 23:52 ID:???
そうでした。すみません。
結局解決策はないのでしょうか。。。
>>772 マージンの値をマイナスにするのはいかんの?
<a href="長いURI(たとえばgoogle検索結果)">そのURI</a>
とした場合、<a></a>にはさまれた文字が
IE5.5では自動的に改行されるのですが、
Mozilla Firebird 0.7では、右にはみ出してしまいます。
ttp://win.nce.buttobi.net/up/img/029.png こんな感じ。
<a></a>の上には<dl>や<div>があるけれど、
<dl>や<div>にmax-widthを指定しても、
<a></a>にはさまれた文字だけは改行されない。
ほかの文字は改行されているのだけれど・・・。
IEのように、自動で改行させることはできないのでしょうか。
>>775 a要素云々関係なく英字は改行されないのが普通だよ。
改行しちゃったら間違ったURLになるからね。
>>776 いや、そりゃないだろ。単語ごと改行の間違いじゃなく?
URIはスペースが入らないので改行されなくて当たり前です。
780 :
Name_Not_Found:03/12/12 11:37 ID:P1XwVllR
バグ辞典スレでこちらに案内されました。
多少内容重複しますが以下の件についての対処法をしりたいです。
CSSだけの問題ではなくhtmlにも関係することなんですが。
マックのIE5で
<td align="right"><a href="hoge.html">hoge</a></td>
とか、
<div align="right"><a href="hoge.html">hoge</a></div>または
<div style="text-align: right;"><a href="hoge.html">hoge</a></div>
などとしたときにtdやdivのエリアのなかでhogeのリンクテキストの位置はたしかに右寄せになるんだけど
align="right"等がついてないときに表示されたであろう場所あたり(何もないとこ)で
カーソルが指になって何もないところがリンクされてしまう、
というバグがあります。バグ辞典サイトにも出てないみたいです。
web creators誌2002/8/p42にも出てるんだけどtdの場合は手前に
もう一つtdを99%で作って回避できます。こんな感じで。
<td width="99%"></td>
<td width="1%" nowrap="nowrap"><a href="hoge.html">hoge</a></td>
だけどDIVの場合どうやって回避したら
いいんでしょうか?大げさにテーブル組むのもなんだかなぁという感じで。
結局テキストのリンクをいくつか横並びで右つめにしたいわけなんですが
どんな風に書いたらいいんだろう?
もちろんそのリンクが並ぶ段にはいろいろとcssで装飾をしたいです。
strictにこだわるつもりはないですが何もないとこをクリックしても
勝手にジャンプしちゃうのは具合が悪すぎる。
liをインラインで・・とか危なそうだ。結局テーブルが一番安全?
>775
Mozillaのバグ。bugzilla-jp(Bug 1476)でも10月辺りから放置気味、つかorgから反応が無い。
>>780 ブロック
┌───────┐
│リンクリンクリ│
│ リンクリンク│
←─マージン─→│ リンクリン│
│リンクリンクリ│
│ リンクリンク│
└───────┘
ではだめかな?
多分ずれると思うが。等幅で見てくれ。
ゴールデンレター
このスレを見た人はコピペでもいいので
30分以内に7つのスレへ貼り付けてください。
そうすれば14日後好きな人から告白され、17日後に
あなたに幸せが訪れるでしょう
784 :
Name_Not_Found:03/12/12 16:29 ID:P1XwVllR
>>780です。
>>782 メニューのブロック↓
┌──────────────────────────┐
│ 寄せる→│リンク│リンク│リンク│
└──────────────────────────┘
こんな風にしたいのですよ。
テキストリンクなのである程度の伸び縮みはあるだろうけど
いくつかのリンクを改行無しで横に並べて右寄せしたい。
786 :
775:03/12/12 18:13 ID:???
情報ありがとうございます。
IEの互換モードとやらが気になって、Firebirdをきのう使ってみたら・・・。
早くIEも標準レンダリングしてくれるようになってほしいものです。
>781 バグでしたか。
自分のやり方がまずいのかと思っていましたが、
少しだけ安心しました。
>>780 適当だけどこんなんじゃ駄目か。divイラネli嫌って感じ?
<style type="text/css">
<!--
div.links { width:80%; padding:0.2em; border:solid black 1px; text-align:right;}
.links ul { margin:auto;}
.links li { display:inline; margin:0.5em;}
-->
</style>
<div class="links">
<ul>
<li><a href="link1">link1</a></li>
<li><a href="link2">link2</a></li>
<li><a href="link3">link3</a></li>
</ul>
</div>
788 :
Name_Not_Found:03/12/13 01:38 ID:Fr4xnvMX
質問です。
したらばBBSのカスタマイズをしているのですが、<head></head>の中身をカスタマイズできないので、<style>が書けません。
illigalなのは百も承知ですが、HEADタグ内でなくても正常に動きますでしょうか?
教えてください<m(_ _)m>
くだらない素人質問で申し訳ないんですが
IEでアドレスバーにアイコンを表示させようと思って
<LINK REL="SHORTCUT ICON" href="icon.ico">
をフレームに使ってみたんですが、どう頑張っても表示されません。
ググってみてもソースが引っかかるばかりで…
>>788 HTML4.01ではHEADにしか包含できないな。
IE、MozillaはBODY内でも有効になるみたい。
>>790 探しましたが、HEADの中に入れるとしか書いてなくて、別の場所でも動くとかは書いてありません。
794 :
789:03/12/13 02:33 ID:???
"favicon"で検索したら、favicon.icoで置いておけば勝手にやってくれると書いてありました。
でも、アドレスバーにはデフォのeのアイコンが…
キャッシュを全部消して、セーフモードで再起動もかけたりしましたが
やっぱり表示されません…
アイコンはビットマップの拡張子を変えたのではなく
アイコン用のフリーソフトを使いました。
>>794 IEに読ませるならルートにおかなきゃだめだよ
お気に入りに入れなきゃ出ないのは知ってるかしら。
で、キャッシュ消した状態でお気に入りに登録して(既に登録してあったら上書きする)
IEを再起動すれば多分でる。
797 :
789:03/12/13 11:00 ID:???
>>795 ルートにも置きました、LINK REL="SHORTCUT ICON" href=で指定もしてみましたが
ネットに繋いでいなかったPCで繋いで、お気に入りに登録しても駄目でした…
>>796 すみません。
ネットで参考にしたCSS講座サイトに
<LINK REL="SHORTCUT ICON" href="">があったので、CSSの一つかと思いこんでました。
799 :
798:03/12/13 11:10 ID:???
うわ、
>>795と同じこと言ってる。
それが言いたかったんじゃなくて、お気に入り、を削除してから入れなおすといいんじゃないか、って言いたかったんだけど。
あと、faviconファイルが破損してる、ってことはないよね?
スレ違いだと解ってなおこのスレで話を進めるのはなぜ?
昔、文書のアイコンを設定する @icon url()なんてのがW3Cに提案されて
誰も相手にせず却下されたから。
>>797 ま、マルチポストでないことを断った上で、 HTMLスレに行ってください。
申し訳ないですが、邪魔です。
803 :
803:03/12/13 12:06 ID:tpe2+MK5
<a href="../index.html" style="display: block;text-align: right;">top</a>
トップへのリンクを右寄せにしたんですが、これは邪道ですか?
>>803 どういう文脈でa要素が出てきているのか知らないが、body要素直下に
置くのであればp要素などで囲むのが常套手段だろう。
805 :
803:03/12/13 12:35 ID:tpe2+MK5
どうもありがとうございます。
文脈に関係なくトップへのリンクをつけただけです。
p要素で囲って、align属性で右寄せにしておきます。
ありがとうございました
>align属性で右寄せにしておきます
CSSでtext-align:right;にして下さい。
>>803 インライン・スタイルシートは止しませう。
#top {text-align:right;}
<p id="top"><a href="../index.html">top</a></p>
>>805 .navi {text-align:right;}
<ul>
<li class="navi"><a href="../index.html">top</a></p></li>
</ul>
>>808 pの閉ぢタグが餘計でせう。書き損なひかな。
811 :
803:03/12/13 14:14 ID:tpe2+MK5
<div>
<h1>見出し</h1>
<p>文</p>
</div>
このdivで囲んだ中を常に画面の中心に来るようにしたいのですが、
どうすればいいでしょうか。
>>812 *{
text-align : center;
}
>>812 div の左右のマージンを同じにすれば真ん中に来るので、自分はそうしてます。
こんな感じで。
div {
margin-left: 10%;
margin-right: 10%;
}
>>814 それはどっちかっつーと、インデントってやつだね。
センタリングよりもよいな。
ボックスの中心揃えよりも、ボックスの中身の中心揃えをきいてると思うのだが…。
分かってたらすまん。
旧仮名遣いキモイ
>>817 おまえの家に街宣車で突っ込まれるぞ。やめとけ
body:before{
content: "hoge";
}
のhoge内にタグを含める事って可能なんでしょうか。
実体参照なども試してみましたが、文字列として出力されてしまいます。
>>821 無理だと思う。
DOMならできるかも?
>>821 >hoge内にタグを含める事って可能なんでしょうか
そういう仕事は CSS ではなく DOM の担当です。
>実体参照なども試してみましたが、文字列として出力されてしまいます。
HTML の数値文字参照の同等の仕組みとして
\(U+005C)によるエスケープを利用できます。
CSSの役割を考えれば、「タグ」って発想はしないと思う。
825 :
821:03/12/14 01:27 ID:???
レスありがとうございます。CSS単独では無理したか。
DOMって使ったことがないので調べてみますです。
>>825 それ以前に、
CSSは「見栄えを与えるもの」
タグは「意味をマーク付けするもの」だから、外部からくっつけるのはおかしいと思わないか?
827 :
Name_Not_Found:03/12/14 03:45 ID:/PrX0//n
質問です。以下のようなhtml+cssで上部にナビゲーションバーを作っていたのですが
何故かリンクにカーソルを合わせると最初の一回のみリンクと見出しが端のほうに寄るんです。
しかもIE6でこのような現象がおこるのですが、もじら1.4では起こりません。どうしてこのようなことになるのでしょうか?
-----
<div id="header">
<h1>タイトル</h1>
<ul>
<li>アイテム1</li>
<li><a href="./a2.html">アイテム2</a></li>
<li><a href="./a3.html">アイテム3</a></li>
</ul>
</div>
-----
body{padding:0 5%;}
h1{float:left;}
div#header{
border-bottom:1px solid #808088;
padding:0 0 0.5em 0.2em;
}
div#header ul{text-align:right;}
div#header li{display: inline;}
div#header a:hover{background:#cfc;}
idは同じ物を2回以上使うといけないんでしょうか?
829 :
828:03/12/14 06:44 ID:???
追加なんですが、皆さんクラスとIDの使い分けはどのようにしてますか?
>823 自分も実体参照が使えなくてがっくりしていたけれど、
エスケープというのかな?
とりあえず、それが使えないか試してみます。
>828 スレ違いではないか?
同じ文書内で1回しか使わないならば、id属性を使う。
ナビゲーションは1回しか使わないから、
どこにidを割り当てるか決まっていなければ使わなくてよし。
それ以外は全部クラスにつけている。
たまにidとクラスの両方をつけることもあるけれど。
>828
ダメ。 ID属性は要素に固有の識別子を与えるもの。
だからIDセレクタとクラスセレクタも使い方は違う。
ぱっと見似てるけど混同しないようにね。
なんだか変な説明になってしまった。
とにかく、idは1回しか使えない。
一回しか出現しないものはIDを使わなければならない、ってわけでもなし
特に使い分ける意義がない人は全部classでもいいと思うんだけどね。
リストマークなどをCSSで独自の画像に置き換えると、どうしてもずれるんです。
大きすぎたり小さすぎたりと。目安はどの程度なんでしょうか。
>>830 >自分も実体参照が使えなくてがっくりしていたけれど、
HTML や CSS は国際符号化文字集合に含まれる文字の連なりである。
「厨」という文字は Unicode の符号位置では16進数で "53A8" だ。
SGML数値文字参照なら 厨、CSSエスケープなら \53A8 で表現できる。
例えば西欧の制作者がスタイルシートを ISO-8859-1 で符号化していても
p.boke:after { content: "(\53A8)"; } とすれば「厨」を生成できる。
なんだ 2ch は文字参照をサニタイズしないのか。
「厨」はSGML数値文字参照なら 厨 で表現できる。
838 :
827:03/12/14 14:07 ID:???
>>834 まさにそれでした。
paddingを%からpxにすることで解決しました。
どうもありがとうございました!
>>835 リストマークの微調整はいずれできるようになるみたい。
よく俺もそれで悩むけど、結局みんながつかってるIE6でちゃんと見えたらもう俺はいい。
841 :
Name_Not_Found:03/12/14 21:06 ID:d3tGoned
#menu ul li a{
width:100px;
border:1px solid #555555;
}
<div id="menu">
<ul>
<li><a href="aaa.html">aaa</a></li>
</ul>
</div>
Netscape7.1だと↑のwidthが無視されてしまうのですが、
うまく表示する方法はありますか?
liのwidthを100pxにする。
またはaをdisplay:blockにする。
>>842 即レスありがとうございます。
うまく表示されました。
ありがとうございました。
>>843 うまくいってよかったね。でもね……。
あのね、インライン要素にwidthを指定するのは反則なのよ。
だからdisplay:block;なのよ。
その辺、わかってるのかな。
845 :
842:03/12/14 21:41 ID:???
そうそう。NetscapeがおかしいんじゃなくてIEがおかしいことを忘れずに。
あとこれやって気づいたんだが、
LI { background-color:#999; }
<ul>
<li><a href="#">AAAAAA</a></li>
<li><a href="#">AAAAAA</a></li>
<li><a href="#">AAAAAA</a></li>
・
・
・
<li><a href="#">AAAAAA</a></li>
</ul>
をNS7で表示させるとLI5個おきに変な隙間ができるのね。
>>844 補足等ありがとうございます。
インライン要素にwidthは反則というのは知りませんでした。
これから気をつけたいと思います。
>>845 Netscapeがおかしいのかと思っていました。
IEがおかしいんですね・・・。
849 :
Name_Not_Found:03/12/14 23:06 ID:G8RHN3E8
netscape7とoperaだとウィンドウを小さくしたときに画像がボックスから
はみ出してしまうんですが、はみ出さないようにできませんか?
>>849 質問が説明不十分です。
どんなHTMLでどんなCSSを適用するとなるのか、
具体的な状況を書いてくれないと、回答できませぬ。
#f..GG%hO
>>849 div#imageBox {
height : 120px;
width : 80px;
overflow : hidden;
}
<div id="imageBox">
<img src="hoge" height="120" width="80" alt="hoge">
</div>
こういうことでいいのかな
853 :
849:03/12/14 23:19 ID:G8RHN3E8
<style type="text/css">
<!--
body{background-color:#888888;}
div#main {
margin:10% 20%;
padding:5%;
background-color:#eeeeee;
}
-->
</style>
<div id="main">
<img src="image/cat.jpg" width="300" height="240">
</div>
説明不足ですいません。↑こんなのを書いたのですがnetscape7だと
http://www.geocities.jp/teaari/cat.jpg ↑こんな風になってしまいます。
IEだとウィンドウを小さくしても横スクロールバーが出てはみ出ないんですけど。
>>853 こんな風がどんな風かは知らないが、%指定した意味は理解できてるのかな。
min-width:240px;とでも指定しておくとか。
今後netscapeの新バージョンは、もう出ないから放っておくのが一番。
時間かけるなんて無駄無駄。
857 :
849:03/12/14 23:27 ID:???
あ、min-widthを使えばよかったんですね。
ありがとうございました。
その前に、%指定を止めてemにでもする方が……。
>>857
860 :
830:03/12/15 00:11 ID:???
外部スタイルシートを使って、日記サイトを作ろうと思っています。
トップページと過去ログのページ、どちらも同じように作ったはずなのですが、
なぜかトップページだけ表示が変なのです。
具体的に言うと日記のタイトルのところを「background:#cccccc;」と「padding:3px;」とで
背景が灰色になるようにしようとしました。
過去ログページはきちんとすべて背景が灰色に表示されるのですが、
トップページは灰色になる日とならない日があり(1ページに5日分載るように作ってます)
ならない日のタイトル部分をマウスで選択すると表示されるようになったり、
画面を1度スクロールして再び見てみると表示が消えたていたり、です。
表示されることもあるので、間違えてはいないのかなあと思うのですが
なんのはずみでそうなるのかがさっぱり分かりません。
どなたか、ご存じの方いらっしゃいませんでしょうか・・・?(XP、IE6です。)
ソース出さないと全然分からん
お世話になっております。
以下のdiv内のtableのフォントの大きさを変えたいのですが
どうスタイルシートのデータを変えてもフォントの大きさが変わりません。
方法をご存知な方はご助力をお願いします。
--「抜粋 本当はccsファイルは別ファイル 改行も減らした」 --
<html><head><style TYPE="text/css">
div.msgHead {
background-color: #ccccff;
font-size: 46pt;
}
div.msgHead > table {
font-size: 46pt;
}</style></head><body>
<div class="msgHead">
<table><tr valign="baseline">
<th align="right"><strong>To</strong>: </th>
<td align="left"> <a href="mailto:auau">auau</a> </td>
</tr> </table>
</div></body></html>
「font-size: 46pt;」という所を弄ったけど変わらなかったです。
div.msgHead table td {font- size:46pt}
866 :
864:03/12/16 17:06 ID:???
ありがとうございます。
本当に素早いRES助かりました。
ちょっとお尋ねしたいのですが、
左に画像、右に回り込んだようにテキストで
そのふたつがセンタリングされるような形にしたいのですが、
<p style="text-align:center;">
<img src="img/nlogo.gif" width="100" height="40" alt="ロゴ" style="float:left">
<span style="font-weight:bold; text-align:left;">ほげほげ<br>ほげほげ<br>sほげほげ</span>
</p>
としてみたらうまくいきませんでした。
何がダメなのでしょうか。正義のところのHTML CSSハンドブック読んでるのですが
なんともわかりません。
__,,-――-、
/ 三ミ)、 / ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄
/ /```ヽミ、 / <p style="width:50%; margin:0 25%">
| (''彡ノ ,,`l | / <img src="img/nlogo.gif" width="100" height="40"
| i,===__,ニ=、`l^l / alt="ロゴ" style="float:left"><span style="font-weight:bold">
\ | ´’,ハ、__ノイノ < ほげほげ<br>ほげほげ<br>sほげほげ</span></p>
ヽ` ̄、し へ ノ| \ CSSではこれが限界だ。
〉` ー'=' /|、_ \ <center><table align="center"> の代替は難しい。
/`ーヘ、 ー--´ l| \ ̄ニ-、 \____________________
ノ、ノ^⌒へ\ー--‐'/,_ \ \
/⌒ ,◎、 \ / | : ̄ \
/:::: /|_.|イ-、 、V  ̄ : |
>-― __/、ニEl(,,ノ : |o i : o
( / 〈 ニニノ : | ``'''―'⌒
\| _ーノ : |
\`ー´/ ̄ :|
ありがとうございます。
CSSにも限界があるんでつね。
何せhtmlを昨日から始めたもんで氏ねとか言われないか冷や冷やしてました。
<div style="text-align:center;">
<p style="text-align:left;">
<img style="float:left;width:100px">ほげほげ
</p>
</div>
div使えば、まぁ簡単
>>870サソ
ありがとうございます。
試してみましたがやはり左寄せになってしまいました。
まぁおまいはそこまでして真ん中に寄せたいんかと言われると。
素直に
<table align="center">
<tr><td><img></td><td>ほげほげ</td><tr>とやるべきなのでしょうかね。
訂正
<div style="text-align:center;">
<p style="text-align:left;width:200px;">
<img style="float:left;width:100px">ほげほげ
</p>
</div>
幅を固定したくない!とか言われるとちょっとつらいな
<div style="text-align:center;">で中身のブロックレベル要素がセンタリングされるのは
一部のブラウザが後方互換性のためにそうしてるだけで
標準に準拠したブラウザが増えてくると使えないよ。
>>872サソ
それがいちばんしっくりきますね。
それにしてみようと思います。
皆さんありがとうございます。
875 :
Name_Not_Found:03/12/16 23:25 ID:bDqhghbi
http://31.com/test/bs/gk/css_hatena.html に例をあげたのですが、
上記例で、
「問題文」と「解答用紙」の間に、
<br style="page-break-after:always">
を入れてます。
で、自分のIE6ではきちんと改ページされてるのですが、
お客様のIE(「おそらくIE5以上」とのこと)では、改ページされていないようで、
困っています。
『<table>の中でstyle="page-break-after:always"を入れても改ページが効かない(IE6でも)』
ことは実証済みなのですが、
上記のタグは、<table>のそとにあります。
IE5以上(本来改ページがきくはず)で、なぜ本来効くはずの改ページが効かないのでしょう。
そして、IE5以上でも効くはずの改ページをちゃんと効かせるための改善作(多少トリッキーでもいいので)
はあるのでしょうか?
教えていただければ幸いです。
>>875 page-break-* が効くのは以下のブロックレベル要素(とIE専用の謎オブジェクト)だけです。
BLOCKQUOTE, BODY, BUTTON, CAPTION, CENTER, currentStyle,
DD, DIR, DIV, DL, DT, FIELDSET, FORM, hn, ISINDEX, LI, LISTING,
MARQUEE, MENU, OL, P, PLAINTEXT, PRE, runtimeStyle, style,
TABLE, TBODY, TFOOT, TH, THEAD, TR, UL, XMP
877 :
Name_Not_Found:03/12/17 08:06 ID:piVl3zpm
■〜〜〜
〜〜〜
〜〜〜
〜〜〜
〜〜〜
■=画像
〜=文章
上のように文章を右に寄せるにはどうしたらよいのですか?
floatでやってみたのですが、上手くいきません。
■〜〜〜
〜〜〜
〜〜〜
〜〜〜
みたいになってしまいます。
>877
それは発想を変えて
二段の段組をしないと無理なんじゃないかな。
879 :
Name_Not_Found:03/12/17 08:26 ID:piVl3zpm
やはりそうですか(´・ω・`)ショボーン
レスどうもです。
>>877 <div><img src="foo.png" alt="画像" width="100" height="100" style="float: left"></div>
<div style="margin-left:120px">
<p>文章… 文章… 文章…</p>
<p>文章… 文章… 文章…</p>
<p>文章… 文章… 文章…</p>
<p>文章… 文章… 文章…</p>
<p>文章… 文章… 文章…</p>
</div>
>>877 2段組にしたくないのでは、無理がありますが、
背景として設置するしかないんじゃないでしょうか?
縦横100pxとして
<div style="background:url("foo.png");padding-left:120px;">
<p>文章… 文章… 文章…</p>
<p>文章… 文章… 文章…</p>
<p>文章… 文章… 文章…</p>
<p>文章… 文章… 文章…</p>
<p>文章… 文章… 文章…</p>
</div>
882 :
Name_Not_Found:03/12/17 17:02 ID:w5UEMnOb
以下のようにボックスに幅とパディングを指定したら、
Macのネスケではボックスの幅が250+100=350になってしまいました。
なにか間違ってるんでしょうか?
.test {width:250px; height:20px; padding-left:100px; text-align:left}
めちゃめちゃ正しいやん。感動した。
<div>
<div>
<div>
...
</div>
</div>
</div>
このように入れ子になっているとき、
入れ子の深さが偶数番目の要素と奇数番目の要素に
それぞれ別のスタイルを適用させるにはどうすればいいんでしょう?
887 :
Name_Not_Found:03/12/17 19:27 ID:xfMhRDaj
JavaScript無効にしてるから
>>887が何を言ってるのかわからんかった
>>888 単純に
div {...}
div > div {...}
div > div > div {...}
とやると入れ子が深くなるたびにセレクタも書かなければなりません。
別の方法はないでしょうか?
>>890 偶数用と奇数用のクラスをdivそれぞれに付けてみたら?
>>890 そういう複雑な文書構造が“なぜ”必要なのか疑問。
HTML は本来、フラットでリニアな構造言語のはず。
div で擬似的に構造化したところで自己満足に過ぎない。
文書構造を再考し、表現方法を改め直すことを奨める。
>887
javascript ドロップダウンメニュー とかそのあたりのキーワード
>890
javascriptでdivの入れ子の数を数えて(親要素をたどっていって)
動的にクラス名を設定 とか
同列の要素が偶数奇数なら構造の想像もつくけど
入れ子の偶数奇数ってどうなってるの?
894 :
886:03/12/17 22:36 ID:???
id振るとか
<div id="1st">
<div id="2nd">
<div id="3rd">
.....
</div>
</div>
</div>
んで、
偶数のpだったら
div#1st,3rd p{...}
奇数のpだったら
div#2nd p{...}
id振る前にネタ振りですか?
よく振ってからお飲みください
>>895で「ちゃんと」スタイルが適用されるブラウザがあったら
俺は速攻で窓から捨てるけどな。
>>895 素直にfirst、secondとやりゃよかったのに。
901 :
893:03/12/18 02:06 ID:???
一応突っ込んでおくけどidの最初の文字に数字は使えないよ。
>>900はその事を言ってるのかな?
903 :
900:03/12/18 07:45 ID:???
dl要素に、ul要素のような左側の点を表示させる事は可能でしょうか?
教えてください…
無理だよ、listじゃないもん
beforeでつけるか画像で対応するとか
できますよ。
dt,dd{
margin-left:1em;
display:list-item;
list-style-type:disc;
}
左マージン入れる必要がありますが
見出しのhタグの文字が標準だとでかすぎるので
CSSで文字サイズ調整しようとしたのですが
IEではうまくいきますがネットスケープではまったく反映されません。
これはこういうものなんでしょうか?
910 :
908:03/12/18 18:04 ID:???
>>909 こんなんです。
.h1 { font-size: 50% }
______________
<h1 class="h1">見出し</h1>
h1 { font-size: 50% }
912 :
908:03/12/18 18:17 ID:???
>>911 あ、ソースが途中でおかしくなってただけでした・・・。
特定のh1にだけ適用させたかったのでclassを用いていました。
ありがとうです。お騒がせしました。
<h1 class="h1">
ってのもどうなんだろうな。
別におかしかないかね。
ってか、面白い。例えば<div class="div">とか<p class="p">とか。
でも、オレも悪いことと知りつつ
<ul class="list">とか
<dl class="list">ってやってるんだよな。。_| ̄|○|||
<h1 class="h2"> とかの方がいいんじゃないの? 意味わかんないし。
>>913 確かに面白いところをつくが。
それよりこっちも大変だ。
/*-------------------------------------------
見出しのhタグの文字が標準だとでかすぎるので
CSSで文字サイズ調整しようとしたのですが
h1 { font-size: 50% }
-------------------------------------------*/
ち ょ っ と ま て 。
他の文字が25%とかなんじゃねーの?
919 :
Name_Not_Found:03/12/19 10:04 ID:kl2aUJRi
<table>の中に<table>が以下の様に入れ子になってるんですが、
<table class="output">
<td><tr>
<table="input">
<td><tr>
</tr></td></table>
</tr></td></table>
この場合、外側のtableに適用したCSSは
内側のtableにも適用されてしまいます。
外側tableだけを適用する方法はありますか?
920 :
919:03/12/19 10:05 ID:???
あ、4行目<table class="input">です。。
別々に適用できると思いますが?
どのようなCSSソースを書いたのか書いて下さい。
恐らく、クラス設定がおかしいのではないのかと。
922 :
Name_Not_Found:03/12/19 11:11 ID:kl2aUJRi
>>921 input {filter: Alpha(Opacity=35);}
.output {filter: Alpha(Opacity=85);}
の様な感じで書いたのですが、
背景だけ半透明でいいのに、
文字や画像まで半透明になってしまうんです。
>>923 PNGはMacで表示出来ない場合が多い。
>>923 重いとか言い出したらフィルタの存在意義無いだろ。
>>924 IE5以降はMacでも表示可能のはず。ネスケは知らんが。
IEの仕様で無理でしょう。
filter:Alpha;をどうしても使いたいなら、背景を<div class="bg">などで置いて、
tableをposition:absolute;でそのdivの上に重ねるとかすれば、解決するのでは?
927 :
922:03/12/19 11:33 ID:kl2aUJRi
>>926 そうですか、、やっぱりレイヤーしか無いですか。
分かりました。有り難うございます
これで不思議マークアップがひとつ増える可能性が大と。
どうしてスキルがない人ほど半透明とかのフィルタを好むのかね。
半透明を実現する以前に、もっとやるべきことがあるだろうに。
知らずに閲覧者に余計な負担を強いて喜んでいるうちが幸せかね。
929 :
926:03/12/19 11:53 ID:???
教えていた自分もそう思う。デザインに中身が追いついていないサイトを運営中。
何で誰も
<td><tr></tr></td>
に突っ込みませんか?
931 :
926:03/12/19 12:48 ID:???
突っ込む必要も無い厨房だから
932 :
922:03/12/19 14:16 ID:kl2aUJRi
>>928 いや、半透明にしてくれってクライアントから指示が・・。
ここのサイト壁紙をしょっちゅう変えよるから、そのたびに
半透明の画像作るのもしんどいし。
それを話したら「CSS使えばええたい、CSS」って言われたの。
933 :
926:03/12/19 14:21 ID:???
流れから考えると、テーブルデザインですか……。
好きじゃないな。
俺は値段の貼る画像編集ソフト持ってない貧乏人なんで
IEのfilterをかけるHTMLテンプレを1つ用意しておいて
必要なときだけPrintScreenでキャプチャした画像を使ってるけどな。
パターンがだいたい決まってるし、そんな大した作業でもないし。
>>932 それじゃクライアントに半透明にする必然性を訊いてみろ。
多分「体裁が良いから」っていう理由だろう。馬鹿げてる。
だまくらかしてユニバーサルデザインをごり押しするのだ。
936 :
Name_Not_Found:03/12/19 14:47 ID:kl2aUJRi
>>933 クライアント(これもWebデザイン系の会社)が
テーブルの方が更新しやすいらしいw
>>935 多分そう・・。
というか、<td><tr></tr></td>
というカオスマークアップはtypoなんですか。
>>930が言いたいのは、テーブルレイアウトっていう問題では無い気がするんだが。
麻薬みたいなもんだな<td><tr></tr></td>
クライアントの要望を自力で解決できず、
こんなところに質問ですか。
なんだかなぁ。
>936 テーブルタグのことしか知らないからでしょ。
だから、テーブルの中を操作することしかできない。
つまり、テーブルの方が作業しやすい。
そんなWebデザイン会社なんてイラネ。
<td<tr></tr><>/td>
ID:kl2aUJRiレベルに仕事頼むほうもアレだが、
ID:kl2aUJRiレベルにテーブルの方が更新しやすいらしいw
とか馬鹿にされるのもかわいそうだな。
943 :
Name_Not_Found:03/12/20 00:34 ID:bDA2cBMI
CSSで作成したサイトをアップしようとすると
1行目にparse errorが発生してしまいます。
1行目は
<?xml version="1.0" encoding="Shift_JIS"?>
ですが、どこが間違ってるんでしょうか・・?
944 :
Name_Not_Found:03/12/20 04:57 ID:bsSaFj3K
CSSでブロックレベル要素を3つfloatで並べ、block2をセンタリング、
1と3は両端に置きたいと思っています。
[block1] [block2](←センタリング) [block3]
このとき、block2をmargin:autoにした後、block3をfloat:rightで置くと
block3がしたにずり下がってしまうのです。おそらく、block3が無い状態で
block2がmarginを計算してしまうからじゃないかなと思うのですが、それを解決するために
htmlでblock1→block3→block2で置くと期待通りの表示になりますが、当然CSS無効
だと順番がおかしくなり、好ましい方法でないと思います。この場合どうするのがベスト
ですか?それとも、根本的に間違ってるでしょうか?
-----
<div style="border:1px solid black;">
<div style="width:10em;float:left;width:10em;border:1px solid yellow;">
<p>blocklevel1</p>
</div>
<div style="width:10em;margin-left:auto;margin-right:auto;border:1px solid blue;">
<p>blocklevel2</p>
</div>
<div style="width:10em;float:right;border:1px solid red;">
<p>blocklevel3</p>
</div>
</div>
>htmlでblock1→block3→block2で置くと期待通りの表示になりますが
floato:right;って、さういふもんです。
元は「回り込み」なんだから當然でせう。
>>945 > floato:right;って、さういふもんです。
floatoってだふいふもんですか?
>>946 だふいふ→どういふ (かなづかひは正しくネ)
かなづかひUzeeeeeeeee
コメントにもかなづかひしてるんですか?
>943
プロバイダを明記しろよ それにShift_JISは止めた方が良いUTF-8だ
floato:right; で block1→block3→block2で置くと期待通りの表示になるかといえば、
これもケースbyケースだ。
block1のheightがとんでもなく長く
block3が短い場合は、block3の下にblock2が来るよ
>>952 > これもケースbyケースだ。
ケースによっては、floatoは有効なんですか?
>>952 block2を左右マージン指定した上で幅自動、
block2の中にセンタリングするプロックblock4を置くというのは可能だろうか?
<div>で囲った部分を、表示画面の丁度ど真ん中に
表示させるようにしたいのですが…
text-align:center;だと左右だけ中心揃えになってしまいますよね。
どうにか上下左右すべての中心に持っていく方法はありませんか。
>>951 >それにShift_JISは止めた方が良いUTF-8だ
,一-、
/ ̄ l | / ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄
■■-っ < んなこたぁない
´∀`/ \__________
__/|Y/\
Ё|__ | / |
| У
>>957はFAQも見ないで質問する慌てん坊です。
961 :
943:03/12/20 13:25 ID:???
レス遅れて申し訳無い。
>>943ですが、xmlの書き出しの<? で
何故かPHPスクリプトが働いてしまってるみたいなんですよ。。
PHPの書き出しも<?なんで・・
対処策無いんですかね。。
>>957 画面の水平位置のセンタリングは少し工夫が必要。
まぁ検索しれ。
あと、text-align:centerで左右が中心揃えになるのはIEのバグね。
本来ブロック要素をCSSでセンタリングするには
margin-right : auto;
margin-left : auto;
とする。
>961
cssと全然関係ないから本当はProg板のPHPスレあたりなんだろうけど
誘導するほどのことじゃない(Prog板に持っていったら怒られそうな)ので
・自分で設定が変えられるなら short_open_tag = を off にする
・ファイルの拡張子を変えて php として parse させないようにする
・php の echo 文で <?... を書き出す
phpのことがわからなかったら検索してください
おそらく「php xml 宣言」あたりでたくさん見つかるかと
MacではChicago、WinではVerdanaのboldを指定することは可能でしょうか?
>966
body {font-family: "Chicago","Verdana",sans-serif;}
こんなものでどうでしょう。
body {font-family: "Chicago","Verdana Bold",sans-serif;}
ボールドだった・・・。
MacIE5 では lang="en" とか指定しないと欧文フォントは採用されないよ。
<div style="margin-left:100px;"><textarea style="width:100%;"></textarea></div>
これをIEで表示させると、はじめはテキストボックスがきちんとウィンドウ右端までになっているのですが、
テキストボックスに何か書き込むとたんに横に伸びてしまいます。
解決策はありますでしょうか??
そうは い神崎
>>971 バグスレのまとめサイトに載ってるIEのバグ
text-decoration:line-through;
で表示される横の打ち消し線の、縦幅を指定することは出来ますか。
IEの英数字はserif;がデフォなんですか
>>974 残念ながら、できません。
したいのであれば、画像を重ねる等するしかないと思います。
>>975 確かそうです。
hnにはwhite-space:normal;は使えないんでしょうか。
ブラウザを横に縮めていくと横スクロールバーが出てしまいます…
>>977 ポイント
・white-spaceプロパティは空白類文字(「半角スペース」・タブ・改行)の
処理を定めるもの。また、すべての要素に適用できる。
・英語(など)は単語を空白(スペース)で区切る。
・英語(など)で改行は単語ごとに行われる。CSSでいうと、
この状態がすなわち、初期値である「white-space:normal;」。
・スペースで区切っていない英語(など)の文字列は1単語とみなされる。
つまり、
<h1>heading1heading1heading1heading1heading1heading1heading1</h1>
のようになっていると、1単語とみなされて、ボックスからはみ出ても改行されない。
>英語(など)で改行は単語ごとに行われる。
ここは、
行末まで(ボックスの端まで)いったら、単語の切れ目で
折り返される。ということで(単語の途中では改行されない)。
981 :
980:03/12/22 00:09 ID:???
985 :
Name_Not_Found:03/12/22 20:27 ID:YPBD2mxY
a:link{
text-decoration:none;
border:dotted 1px blue;
color:navy;
}
.tabnavi a:link{
text-decoration:none;
color:navy;
}
として、文中のリンクには青い下線を、タブ型ナビゲーションのリンクには下線なし、にしようとしているのですが、下線が出てきてしまいます。
タブナビの方の文字色を赤にしてみても反映されません。
aに複数のクラスを指定して、複数のリンクスタイルを使用したい場合、どう書くべきなのでしょうか?
IE6での確認です。
>>985 とりあえず、border 指定で作った下線は、border 指定でなしにしようね。
border:none; とか。
複数クラスは、class="classA classB" みたいな感じで。
988 :
Name_Not_Found:
>>986 タブナビのほうに border:none; を入れても出てきてしまいます…。
文字色の変更すら反映されないんですよ…。