08/01/31 20:26:14
URLﾘﾝｸ(art5.photozou.jp)
「au、…」はHTMLの文字例です。背景はCSSで指定しています。
文字例をCSSでピクセル単位で動かすにはどうすればいいでしょうか?
157:Name_Not_Found
08/01/31 20:58:59
later-spacing プロパティ
158:Name_Not_Found
08/02/01 12:08:30
paddingすりゃいいだけだろ
159:Name_Not_Found
08/02/11 02:20:11 xgyjrVKt
HTML 文書には、 link 要素で import.css を読み込ませるようにしてあり、
その import.css には、
@import'style1.css';
@import'style2.css';
と、二つのスタイルシートファイルが更にインポートされるようにしてあります。
この style1.css と style2.css 両方に、
style1.css ： 文字の太さは通常の太さで、文字色は青にする。
style2.css ： 太文字にし、文字色は赤にする。
というような、異なる a 要素のスタイルが書いてある場合、
どちらの表示が優先されるのでしょうか？
また、 style2.css での記述を必ず優先させるためには、
!important を書くだけで平気でしょうか？
よろしくお願いします。
160:Name_Not_Found
08/02/11 05:26:06
何で試したり、cssの仕様を読もうとしないの？
161:158
08/02/11 17:04:19
試してみたのですが、
どちらが優先されているかがイマイチ分かりません…。
後からインポートした方(style2)の方が優先されるのでしょうか…？
162:Name_Not_Found
08/02/11 17:14:39
色盲なんだな。
163:Name_Not_Found
08/02/11 17:27:34
上から下へ読んでいくんだろうが、ボケ
PCは昔のことなんか振替んねぇんだよ
164:Name_Not_Found
08/02/12 09:21:37
お前らなんでcssの話してんだよカスが
大柴の話をちゃんとしろよ
165:Name_Not_Found
08/02/12 12:45:50
ルー語でおｋ
166:Name_Not_Found
08/02/12 15:25:47
ユーはホワイcssのトークオンリーな訳？
しっかり大柴のトークをトゥギャザーしようぜ
167:Name_Not_Found
08/02/12 16:40:19
ミーの脳がメルトダウン
168:Name_Not_Found
08/02/12 22:21:27
>>166
もはやそなたはルー語をマスターしてるな
169:Name_Not_Found
08/02/18 10:21:33
幅指定ありのテーブルにボーダーを付けた時、ボーダーを含めて
幅が設定されるみたいなんだけど、これって仕様通り？
例えば
<table style="width:500px;border:3px solid #000;">
とかってした場合に、ボーダーを含めた幅が500pxになるみたいなんだけど。
（標準モードでも互換モードでも同じ）
仮に仕様通りの解釈だとして、どういう理屈になるのかな？
170:Name_Not_Found
08/02/18 16:25:06
strictスレへどーぞ
171:Name_Not_Found
08/02/18 20:01:26
ｼｭｯ
ｼｭｯ
ｼｭｯ ﾊ,,ﾊ ｼｭｯ
ﾊ,,ﾊ彡（ ﾟωﾟ ),ﾊ
（ ﾟωﾟ )彡ミ（ ﾟωﾟ ) お断りします
＿(__つ/￣￣￣/＿
＼/ /
172:Name_Not_Found
08/03/04 10:29:28 jxKPUKng
<div style="width:300px;height:300px;background-color:red;overflow:hidden;">
<img src="hoge.png" width="100" height="100" style="position:absolute;top:250px;left:250px;">
</div>
画像の赤いエリアからはみ出しているところが隠れるようにしたいと思っています。
IE7だと上の書き方でできましたが、
Opera9だとはみ出している部分が表示されてしまいます。
Operaでも可能な方法を教えてください。
173:172
08/03/04 10:39:52
すみません解決しました。
divのほうにも絶対座標を指定すればいいんですね。
174:Name_Not_Found
08/03/04 15:28:12 58HvQhEk
<ol>
<li>あああ</li>
<li>いいい</li>
</ol>
としたとき、数字と文字（あああ）の隙間が空くのですが、
これを詰める方法はないでしょうか？
175:Name_Not_Found
08/03/04 15:51:59
マーカー表示をやめて、content プロパティで表示するようにすれば？
IE対応？そんなゴミブラウザｼﾗﾈｰﾖ
176:Name_Not_Found
08/03/04 17:18:11
スレ違い
ここはルー大柴スレだ
177:Name_Not_Found
08/03/04 21:31:22
オールマイティーオッケーさ ブラザー
178:Name_Not_Found
08/03/05 20:20:26 3TVPhP6o
「#***がclassで、.***がidだ」って書いてある本があるんだが、これは一体なんなのでしょうか？
返品して貰えますかね？
179:Name_Not_Found
08/03/06 00:22:31
なんていう本ですか？
180:Name_Not_Found
08/03/06 11:21:45
div.newpage{ page-break-before: always;}
で印刷時の改行位置をやってるんだが、
印刷プレビューしてみると、divで指定しているブロックの区切りの間がものすごい開いて、
改行ポイントまで一つのdivブロックを押し下げるって状態になってる。
ようするに、ある区間、真白な部分ができている状態。
これってどうすればいい？
181:Name_Not_Found
08/03/06 14:50:39
どの UA で発生する現象なのかも書かないで質問とは片腹痛い
182:178
08/03/08 01:52:28
>>179
『3日で作るPHPアプリケーション』秦崇・遠藤諭 アスキー
という薄っぺらい本です。
PHPについての本ですが、なぜかCSSについても数頁ふれていて、そこでこの間違いが。
単なる誤植ではなく、著者が根本的に勘違いしてるんだと思われまする。
183:Name_Not_Found
08/03/08 21:01:41
ならCSS自体はおまけなわけで
そこのまちがいくらいじゃ返品はできないでしょ
184:Name_Not_Found
08/03/10 21:13:57
>>182
指摘すれば図書券500円くれるかもよ
185:Name_Not_Found
08/03/26 07:22:49
>>181
間違っています。
以上。
↓次どうぞ
186:Name_Not_Found
08/04/09 16:25:49
<html>
<head>
<style type="text/css">
h2{
background-image:url(nav_bk.gif);
float:left;}
</style>
</head>
<body>
<h2>MMENU</h2>
<h2>MMENU</h2>
<h2>MMENU</h2>
<h2>MMENU</h2>
<h2>MMENU</h2>
</body>
って試しに書いたら
URLﾘﾝｸ(www2.uploda.org)
みたいに左のだけ上にズレルのは何故
187:Name_Not_Found
08/04/09 17:34:29
margin,paddingを殺す
188:Name_Not_Found
08/04/10 02:57:56
おk、試してみるｻﾝｸｽ
189:Name_Not_Found
08/04/10 03:12:17
padd殺さんでもmargin殺したらできた。
聞いてばっかりですまないがコレってどういう理屈？
190:Name_Not_Found
08/04/10 06:14:58
仕様書にinline要素はそうしろ的なことが書いてあるから
一応、UAによってmargin,paddingの解釈は違うので最初に全部殺しておくが吉
191:Name_Not_Found
08/04/10 06:22:58
回答ｻﾝｸｽだぜ
192:Name_Not_Found
08/04/12 01:51:31 ezBgs235
背景画像の範囲を左や真ん中に寄せるにはどうすればいいですか？
bodyでwidthを指定すればできると思いましたが背景画像だけは全体に広がってしまいます。
193:Name_Not_Found
08/04/12 02:28:52
>>192
a) box作ってそれに背景指定
b) 画像を表示したい幅または高さに加工し、repeat方向をyまたはx指定
194:Name_Not_Found
08/04/12 13:21:43 gYw71jVr
URLﾘﾝｸ(www.xn--cckza4ab6e9czhb.net)
これはJavaScriptかな？
195:Name_Not_Found
08/04/12 16:24:01 CNG7bHPk
DTDでURL書いとけばieでも火狐でもそんなに機にしなくていいよ
196:Name_Not_Found
08/04/13 05:10:04 AdLzqwk3
ほら絶対配置なんかするとフッタから、金玉みたいにはみ出る事もあるじゃないか。
そういうのはCSSを諦めてtableを使ってみたりしてるのかい。
197:Name_Not_Found
08/04/13 05:46:01
金玉はしまってあるし
198:Name_Not_Found
08/04/13 07:28:41 AdLzqwk3
君は金玉に対する認識が間違っている。
折角、ぶらさげた金玉を皆に紹介しないでどうする。
それすらしたくない程に金玉が恥ずかしい存在なら
引きちぎってしまえ！！
199:Name_Not_Found
08/04/27 15:03:58 B3KoEFqh
バックの色を指定しつつ
それとは別に特定の場所から特定の場所までの色を別の色に指定する方法はありますか？
200:Name_Not_Found
08/04/27 17:26:22
ありますよ。
201:Name_Not_Found
08/04/27 21:39:41
余裕ですよ。
202:Name_Not_Found
08/04/28 11:07:33
CSSファイルを分けて作ると、管理はしやすいけど読み込みの処理が時間かからない？
前にサーバーが極端に重いときに読み切れなかったりしたんだけど。
ずらずらと長い1つのCSSファイルか、
部分部分に分けた5つぐらいのCSSファイルか
どっちがいいんだろうね
203:Name_Not_Found
08/04/28 11:33:58
そんなに細かい指定をずらずらCSSで行うのもどうかと
204:Name_Not_Found
08/04/28 17:09:38
冗長なソースしか書けないんだろ
205:Name_Not_Found
08/04/28 17:53:54
ﾊ,,ﾊ 僕、アルバイトォォ！！
('(ﾟ∀ﾟ∩_ 僕をどこかのスレに送って！
／ヽ 〈／＼ お別れの時にはお土産を持たせてね！
／|￣￣￣|.＼／
| ﾓﾂ煮 |／
￣￣￣
現在の所持品：新聞、∈(･ω･)∋ﾀﾞﾑｰ、ゆうパック、ダム穴、NCSA Mosaic
206:Name_Not_Found
08/04/28 18:09:52
普通にCSSだけで8kbいかないか？
207:Name_Not_Found
08/04/28 18:38:05
んじゃ、まさるさんのとこに送り返すか
208:Name_Not_Found
08/04/28 18:50:38
>>206
8kbで重いんか？
209:Name_Not_Found
08/04/28 18:53:32
>>205
土産：糞IE
行き先：ｽﾚﾘﾝｸ(kokusai板)
210:Name_Not_Found
08/04/28 19:35:41
htmlが大体12k～24kに収まるようにしてるから、
cssだけで10kbいったりすると、長くなったかもと思う。
一回読み込めばいいから気にならんけど。
cssにした一番のメリットは転送量だったが、少しでも軽くしたい。
211:Name_Not_Found
08/04/28 22:03:54
今見直したらHTMLが50Kから100KでCSSがざっと20Kほどか
50はさすがに個別ファイル化したほうが見やすいが、
idとnameによって一つのファイルに詰め込めるから詰め込んでいるが、
こりゃちょっとやりすぎだな。テーブルだとさらに増えそうだ。
212:Name_Not_Found
08/04/28 22:59:48
CSSもページ数が多くなってひとつに詰めるとそれぐらいになるよな
213:Name_Not_Found
08/04/28 23:27:49
ブログも煩雑だから20KB超えるぜ
どの程度のclassとidを使用するかによって、
最終的な量が決定するわけだ。
シンプルでidもclassも指定しなければ問題はないけど、
段組とかやりまくっていると、結構な量になるね。
214:Name_Not_Found
08/04/28 23:38:35
テーブルレイアウト→CSS段組→シンプルなCSS
こう移ると見た。
CSS段組も飽きると質素な、ほとんど文法のみのhtmlになるのかな。
215:Name_Not_Found
08/04/28 23:46:29
ならないだろ。
歴史的な系譜としては、
シンプル→テーブル→CSS
だよ。
発端は紙媒体のデザインをwebで表現したいことなんだから。
216:Name_Not_Found
08/04/29 03:43:00
定番な3カラムCSSだけど
デザイン的には悪くないんだけど
カッチリやればやるほど融通が利かなくなるな
文字サイズを最大にしたら崩れたり、cssでキッチリサイズ指定するから
217:Name_Not_Found
08/04/29 07:43:23
さすがルー大柴公認のｽﾚ
218:Name_Not_Found
08/04/29 09:58:38
というか、文字サイズ変更で崩れないデザインのほうが難しいだろ。
IE7は描画が特殊だからborder指定した瞬間、文字サイズ変更で崩れるのが確定。
219:Name_Not_Found
08/04/29 10:07:12
1カラムが少なくてさびしいな。
2カラムも好きだが、基本1カラム。
3カラムとかなんですか……なんであんなごちゃごちゃしたものが好きなんだろう。
220:Name_Not_Found
08/04/29 12:34:15
ヘタレ発見・・・>>218
221:Name_Not_Found
08/04/29 12:45:58
縦のスタイルのほうが楽だから
3カラム→2カラム→ほとんど1カラムになったよ
222:Name_Not_Found
08/04/29 13:53:38
読む分にも3カラムって全くメリットないしな。
あれって作成者がアフィ貼り付けるのに便利ってだけじゃね？
223:Name_Not_Found
08/04/29 17:28:23
URLﾘﾝｸ(www.templatemonster.jp)
これってCSSで可能ですか？
可能だとしたら、どうやってレイアウトすればいいのでしょうか？
特に下の両サイドあたりが、よくわからなくて。
どうかお願いします。
224:Name_Not_Found
08/04/29 17:29:48
ちなみに↑これって下の両サイドはブラウザに合わせて伸縮するんですよね・・・？
どうかお願いします。
225:Name_Not_Found
08/04/29 17:45:10
余裕だな。中身まで伸縮されたら厄介だったが。
後方互換は無視する。考えると面倒だ。
body {
margin:auto;
width:800px;
}
<body>
ここの中のものが中央ブロック揃えになりますよ
</body>
当たり前だが、後方互換を考えたらbodyではなくdivに指定する必要がある。
互換モードが発動するとbody要素ではセンタリングできないんだ。
226:Name_Not_Found
08/04/29 17:49:37
さらに段組にする場合は、floatを使って外幅の90%を超えないように指定する。
この場合、メニュー部分は250pxで本文部分は500pxでいいだろう。
後方互換の場合は全体にtext-align:leftを指定して、
bodyにtext-align:centerを指定する。さらに中身は全部外側にdivで外側divにwidth指定とmargin:autoだ
え？ text-alignはボックス位置の指定ではなくテキストの位置指定だって？ MSの製造ミスですよ。
227:Name_Not_Found
08/04/29 17:53:08
#CONTENT {
width: 500px;
float: right;
}
#MENU {
width: 250px;
float: left;
}
<div id="CONTENT">
<p>内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容</p>
<p>内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容</p>
<p>内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容</p>
</div>
<div id="MENU">
<p>関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報</p>
<p>関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報</p>
<p>関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報関連情報</p>
</div>
段組はこういう感じ。お粗末様
228:Name_Not_Found
08/04/29 17:55:30
>>223
は、「このページの作り方」を聞いてるんじゃなくて
「このページで紹介されているテンプレート」の作り方を
聞いてるんじゃないかと思うんだ。
229:Name_Not_Found
08/04/29 18:00:37
>>228
そのとおりでございます・・・
>>225さん
ありがとうございます。
いただいた内容も全部理解しきれていないのですが・・・
背景の写真とか、下のメニューの伸縮を考えると少し違うような？
中身のテンプレの作りを教えていただけるとありがたいです。
もし、私の勘違いだったらすみません・・・
どうかお願いいたします。
230:Name_Not_Found
08/04/29 18:06:42
orz
もしかしてflashの中身か……
上半分と下半分はまず最初にdivでグーピングして分割する。
別にフレーム使ってもいいけどさ。
上はタブメニュー部分をulリストにして丁寧にfloat
そこから内容は2カラム段組。さっき表示したパターンのdivを採用だ。
縦に表示が崩れると困る場合はここでoverflowを使う。
で外枠のdivに角丸背景画像を表示して上は完成
下は三カラム段組。一個ずつ丁寧にfloatしていく。
floatブロックの角丸は背景画像使うと楽だからそれ使え。
さらに外枠divにwidth指定。marginの指定も忘れるなよ。
で、あまった背景部分はおそらく別の背景画像を表示する。
下3カラムはおそらく固定だろう。上は伸縮しそうだけど。
231:Name_Not_Found
08/04/29 18:09:47
グルーピングすら不要だと思うがとにかく余裕
がんがれ
232:Name_Not_Found
08/04/29 18:13:31
body背景画像は左右に角丸と写真を描いたものno-repeatでtop・center位置に指定。
背景色は#fffかな？
もしくは下三カラムは角丸+縦横の線を描いたものを背景画像で指定かな？
すると中身は固定だが、背景部分のお陰で大きく見ると伸縮しているように見える。
この容量だと1024よりも大きい解像度で見ることはまずないだろうから、気にしないでいいだろう。
気になるのなら真ん中だけ可変幅にするとか出来なくないんだけど、そうすると角丸のために余分なdivが二つ必要になる。
233:Name_Not_Found
08/04/29 18:17:05
floatしたものにmarginは出来ないかorz
とりあえず四つのブロックに幅指定する。
上と下は別物として扱う。下はfloatする。
これだけね。すまんね。長々と。
234:Name_Not_Found
08/04/29 21:18:30
>>223
俺と好みが近いな。
他のテンプレートも紹介してくれ！
235:Name_Not_Found
08/05/01 22:14:14 ECONvAZd
float指定で困っています。
side1、main、side2を間隔なく配置し、それをブラウザの中央に表示したいと考えています。
この３つの要素をfloat:leftで左寄せにし、contentsというdiv要素の中に記述しました。
marginは0px、paddingも0pxと指定し、各要素のwidthはside1が9px、mainが740px、side2が9pxに
設定しました。合計で758pxなのでcontentsのwidthを758pxにしましたが、side2がside1の真下に配置されてしまい困っています。
IE6で確認しただけなのですがなぜかわかる方いましたらご教授お願いします。
236:Name_Not_Found
08/05/01 22:34:56
合計値は外幅の90%にするんだよ
じゃないと崩れる
237:Name_Not_Found
08/05/01 22:40:35
>>235
IEは横幅合計値とコンテナボックス横幅が同じだと下に落ちる有名なバグがある。
238:Name_Not_Found
08/05/01 22:40:43
ちなみに、その場合、mainのみでいいんじゃないか？
外側のdiv（この場合、contents）にpaddingかmarginを指定するのが定石だよ
で、さらに外側のbodyをセンタリングするといい感じ。
もしくはmainのみでpaddingかmarginを表示して幅指定しない
239:Name_Not_Found
08/05/01 22:50:15 ECONvAZd
>>236
>>237
すばやい指摘ありがとうございます。
width761pxにしたらしっかりなりました。
>>238
<body>
<div class="contents">
<div class="side"><img src="aaa.jpg" width="9"></div><!-- end side-->
<div class="main">
<div class="t_logo"><img src="logo.jpg" width="220"></div><!-- end t_logo-->
<div class="t_photo"><img src="photo.jpg" width="520"></div><!-- end t_photo-->
</div><!-- end main-->
<div class="side"><img src="bbb.jpg" width="9"></div><!-- end side-->
</div><!-- end contents-->
</body>
こんな感じになっています。logoとphotoにもfloat:leftつけてきっちり配置しているので
（デザイン上1pxも空けたくないので・・・）こんな面倒なことになってしまって。
240:Name_Not_Found
08/05/01 22:54:30
>>239
背景画像として組み込んだほうが、管理しやすいってことだよ
特にimgのみのdivってのはさほど意味がない
ごちゃごちゃとソースをいじるよりは一発なんだ
241:Name_Not_Found
08/05/01 22:56:54
書き忘れたが、divではなく、h*……つまり見出しの場合はimgの方が楽
242:Name_Not_Found
08/05/01 23:03:06 ECONvAZd
>>240
ご指摘ありがとうございます。
書き忘れましたが、背景に組み込みめばよかったのですが、デザイン上背景にすでに別の画像を組み込んでいたので
仕方なくこのような形をとりました。ブラウザによっては何個か背景画像を組み込めるらしいのですが通常は1つだけらしいので・・・
何か別の簡単なやり方などがあればご教授お願いします。
243:Name_Not_Found
08/05/01 23:35:45
つーかこのスレで質問すんなよ・・・
244:Name_Not_Found
08/05/02 00:10:20
sageも知らん超初心者だからな
245:Name_Not_Found
08/05/02 00:25:45
>>242
一つの要素に表示できる背景画像は一つ
旧IEを考えればhtmlはムリなので、
body以下の要素になる
つまり、bodyやdivなどがこの場合最有力候補
固定は旧IEのバグで一個しか固定できないが、普通に考えたら一個固定できれば十分
後は自分で考えろ。そうじゃないと成長しないぞ
246:Name_Not_Found
08/05/02 00:29:16
って、書いて、分からないだろうから答えを書く。
contentsが内包するdiv三つの画像を合体させて、contentsに背景表示する
もし、side main logo photoに背景表示されている場合はもう諦めるしかないけどね
それに、ソースを見る限り内包しているのはimg要素であってテキストではない
この場合テキストを追い出すテクニックもあるが、確かにこりゃfloatしかないわ
おせっかいすまんね
247:Name_Not_Found
08/05/02 10:29:52
>>IEは横幅合計値とコンテナボックス横幅が同じだと下に落ちる有名なバグがある。
これってpx指定でも崩れる？
どっか解説してるページとかあったら教えて。
248:Name_Not_Found
08/05/02 12:09:22
つーかdivの直下にimg
249:Name_Not_Found
08/05/02 12:25:08
おまえらネタスレで何やってんだ
250:Name_Not_Found
08/05/02 17:39:26
本音で語れないこの世の中じゃあ・・・
251:Name_Not_Found
08/05/02 18:56:33
>>246
どうもです。
参考になりました。自分なりにいろいろ試してみます。
252:Name_Not_Found
08/05/16 14:57:31 yRdVj5ds
hr要素にborder-styleを適用する手法は有りですか?
dottedを指定しても、FirefoxとSafariでだけベタの直線になってしまいます。
スタイルシート適用時は点線の罫線で、非対応のときは通常の罫線を表示したいのですが、
うまくいきません。
253:Name_Not_Found
08/05/16 15:20:57
UA依存だから仕方ない
254:Name_Not_Found
08/05/16 21:53:02 8V5hksUz
質問
画像付きボタンを img src= で書いたのですが、FireFoxだけちょっと横長で
小さくなりません、小さくするにはどうしたらいいのでしょうか？
255:Name_Not_Found
08/05/16 22:39:47
はあ？web初心者スレ池
256:Name_Not_Found
08/05/17 01:20:30
>>253
やはりしかたないのですね。罫線の意味としては変わらないので、そのままでいくことにします。
257:Name_Not_Found
08/05/17 01:20:58
あ、罫線ではなく水平線か。
258:Name_Not_Found
08/05/17 02:31:45
だからここは質問スレじゃねえっての！
259:Name_Not_Found
08/05/17 03:22:33
>>258
じゃあ何なの? 検索してヒットする質問スレは上級者用だけだし、「スタイル」で探して辿り着いたのだが。
260:Name_Not_Found
08/05/17 04:21:34
スタイルで検索ってダイエット板か
261:Name_Not_Found
08/05/17 04:56:09
>>259
マジレスすると
ネ タ ス レ 。
「CSS初心者」で検索汁
262:Name_Not_Found
08/05/17 16:18:55
CSSの質問かもわからないのにいい加減な誘導すんな
263:Name_Not_Found
08/05/17 22:11:20
>>262
間違ってここにきたとしてもCSSの質問じゃないことはあり得ない件
お前のほうが質問者よりスレタイ間違えてね？
264:Name_Not_Found
08/05/17 22:38:36
ハァ？
265:Name_Not_Found
08/05/18 00:34:46
>>263
カスケーディングスタイルシートではなく単にスタイルシートについて質問する人が
多いのではないかと。
266:Name_Not_Found
08/05/18 04:58:08
ハァ？
267:Name_Not_Found
08/05/18 12:26:51
>>265
JSSやXSLの質問なんてあったか？ｗｗｗ
そんなことよりも、どっちのスレもCSS用スレだから無関係。
268:Name_Not_Found
08/05/18 13:43:41
>>260
「スタイルシート」で検索したあと、「シート」を削って再検索。
269:Name_Not_Found
08/05/18 22:16:17
そりゃダイエットし過ぎってもんで
270:Name_Not_Found
08/05/19 15:38:04 2teYNWNa
『仕切り奉行』が五月蠅すぎ。
271:Name_Not_Found
08/05/19 21:50:55
五月蠅いって漢字がうるせーよｗｗｗ
272:Name_Not_Found
08/05/19 21:56:57
ご･･･ごがつばえ
273:Name_Not_Found
08/05/19 22:19:32
たしかに五月蠅いｗｗｗｗｗ
274:Name_Not_Found
08/05/26 10:19:34
特定のクラスのタグ内にあるテキストの先頭に
番号を順番に振っていきたいのですが，
こういうことってスタイルシートだけでできるのでしょうか？
<div class="title">たいとる</div>
<div class="naiyou">内容</div>
<div class="title">たいとる</div>
<div class="naiyou">内容</div>
<div class="title">たいとる</div>
<div class="naiyou">内容</div>
のような繰り返しがあるときに，title タグの中の
文字列の先頭に番号を振っていきたいのですが・・・・
今は連番を返してくる関数を書いて，
<div class="title">
<script type="javascript">
renban();
</script>
たいとる
</div>
のようにしているのですが，面倒で・・
275:Name_Not_Found
08/05/26 11:04:52
>>274
ol
276:Name_Not_Found
08/05/28 08:49:09
>>274
質問スレに行きなさい。ここはネタスレ
277:Name_Not_Found
08/07/04 18:15:59 zSjWM7/K
cgiで吐き出すテーブル（サーチエンジンの結果）を改行ではなく、
順に横に並べていって、横まで行きついたら改行するっていうのを
cssでやろうと思うのですがどのようにすればいいでしょうか？
278:Name_Not_Found
08/07/04 19:29:22
float
279:Name_Not_Found
08/07/04 20:02:47 zSjWM7/K
>>278
ありがとうございます。
フロートでできたのですが、一つ一つのテーブルの縦の長さが違うため、ブラウザの端まで来て回り込む際にガタガタになってしまいます。
ブラウザの横サイズを決めちゃう以外で何かいい方法はあるでしょうか？
280:Name_Not_Found
08/07/04 21:21:14
tableの高さを決めちゃう
281:Name_Not_Found
08/07/05 20:54:59 PZ6XbNJj
質問です。
下記のような同じ構成のボックス（四角は画像など）を
回り込ませてレイアウトした際にIE6でまれにボックスの
文章の最後から5文字くらいが外にはみ出してしまうことが
あるのですが対処方法はないでしょうか？
■こうなるはずが・・・
┏━┓ ┏━┓
┃ ┃あいうえお ┃ ┃さしすせそ
┃ ┃かきくけこ ┃ ┃たちつてと
┗━┛ ┗━┛
┏━┓ ┏━┓
┃ ┃なにぬねの ┃ ┃まみむめも
┃ ┃はひふへほ ┃ ┃やゆよ
┗━┛ ┗━┛
■IE6でたまにこうなる
┏━┓ ┏━┓
┃ ┃あいうえお ┃ ┃さしすせそ
┃ ┃かきくけこ ┃ ┃たちつてと
┗━┛ ┗━┛
┏━┓ ひふへほ←──左のボックス内の後ろ5文字くらいが
┃ ┃なにぬねの ┏━┓ この辺に分身として現れる
┃ ┃はひふへほ ┃ ┃まみむめも
┗━┛ ↑ ┃ ┃やゆよ
│ ┗━┛
│
ここにきちん文章があるのに
282:Name_Not_Found
08/07/05 22:11:49
>>281
IE6のfloat関連バグは山程あり、情報も山程あるんだからググレカス
283:Name_Not_Found
08/07/06 04:53:23
IE6以外で正しく表示できるならIE6対策を取らず放っておいても構わないとさえ思う。
284:Name_Not_Found
08/07/06 10:36:17
>>281
最後に<br>入れてみ
285:Name_Not_Found
08/07/10 21:55:01 5d81RjCM
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "URLﾘﾝｸ(www.w3.org)">
<html xmlns="URLﾘﾝｸ(www.w3.org)" lang="ja" xml:lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=SHIFT-JIS" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<title></title>
<style>
div#foo { width: 100px; height: 100px; border: 5px solid #000; }
div#foo p { display: none; }
</style>
</head>
<body>
<div id="foo"><p>FOO<p><div><img src="./foo.gif" width="100" height="100" />
</body>
</html>
例が変で申し訳ないですが、
上記HTMLを出力すると、foo.gif のボトムに数ピクセルの隙間が必ずできてしまいます。
対応方法はあるのでしょうか？
286:285
08/07/10 22:01:14 5d81RjCM
すいません。追記です。
この現象はIE6のみで発生します。
287:Name_Not_Found
08/07/10 22:27:09
>>286
こんな風にしてみたらどうかな？
div#foo p {
display: none;
margin: 0px;
}
288:Name_Not_Found
08/07/10 22:35:20
>>287
変わりませんでした。
289:Name_Not_Found
08/07/11 01:02:22
そうか・・・では知らん!!(｀･ω･´)ｷﾘｯ!!
290:Name_Not_Found
08/07/11 09:59:02
>>285
img {vertical-align:bottom;}
291:Name_Not_Found
08/07/19 00:31:11 nQ5rYAPt
PHPとCSSを使っていますがCSSでも変数って使えないの?
色とか文字サイズを1つ1つ指定していくのは大変・・・
もっと効率よく使いたいので変数が使えればいいな～
292:Name_Not_Found
08/07/19 01:49:04
セレクタの意味わかってる？
293:Name_Not_Found
08/07/19 02:08:06
プログラマは頭がカタい
294:Name_Not_Found
08/08/06 01:00:15
あああああああああああああああ
あああああああああああああああ
いいいいいいいいいいいいい（改行）<!-- 先頭2文字分あき -->
いいいいいいいいいいいいい（改行）
ううううううううううう（改行）<!-- 先頭4文字分あき -->
ううううううううううう（改行）
こういうのが作りたいんですが、p ではなくspanでできないでしょうか。
p.3 {
margin-left: 3em
}
295:Name_Not_Found
08/08/06 02:04:37
>>294
padding
296:Name_Not_Found
08/08/07 19:44:51 fv5MkkX5
画像をセンタリングするのに２時間かかってもできないのです・・・
初心者な質問すぎて申し訳ないです！
（テンプレも読んだのですが上手く行かず）
<div style="text-align: center;"><img ほにゃ/></div>
ならうまくいくのですが、CSSを別ファイルにして
test.css:
.centering{text-align: center;}
test.html:
<div class="centering"><img ほにゃ/></div>
とすると左寄せになってしまいます。centering クラスの中に
margin: 0px auto;
display: block;
やら何やらいろいろ足してみてもだめです・・・何が間違っているのでしょうか？
297:Name_Not_Found
08/08/07 20:06:02
>>296
・text:alignはインライン要素に有効
・imgはインライン要素
・divはブロックレベル要素
・IEは糞
298:Name_Not_Found
08/08/07 21:08:13 fv5MkkX5
>>297
お返事ありあとうございます！
上３つはわかったのですが、
一番したの「IEは糞」というのは・・・？
バグが多いと聞いたことがありますが、そういうことでしょうか。
もう３時間以上この問題で右往左往して疲れてしまったので、
作業は明日にします・・・ああ、どうして画像を中央に持ってくるだけで
こんなに面倒くさいのか・・・<center>タグとか<div align>とか
使いたいなあ、正直・・・
299:Name_Not_Found
08/08/07 22:18:42
わかるタグを使えばいいのです。
背伸びしても仕方ないのです。
300:Name_Not_Found
08/08/07 22:53:10 fv5MkkX5
>>299
非推奨のタグって使っても大丈夫なんですかね？
ある日からポンと使えなくなりそうで怖いです・・・
（現実問題大丈夫なんでしょうけどねー）
301:Name_Not_Found
08/08/07 23:11:10
>>300
まず標準モードにしてみたらどうかな
302:Name_Not_Found
08/08/07 23:34:21
バグも多いし仕様もおかしい。
303:Name_Not_Found
08/08/10 02:10:30
外部cssから全てのdivにフィルタ
filter:Alpha(opacity=70)
をかけているんだけど、
divの中の画像にはかからないようにするにはどうすれば良いですか？
304:Name_Not_Found
08/08/10 02:25:24
>>303
img { position: relative; }
305:Name_Not_Found
08/08/10 02:32:20
>>303
そんなのはIE独自プロパティでCSSじゃねえよスレチ。
306:Name_Not_Found
08/08/10 02:52:42
>>304-305
解決しました。
即答ありがとう、すれ違いごめん
307:Name_Not_Found
08/08/11 20:27:54 CNc3/M+W
a:link { color: --- }やa:visited { color: --- }など、リンク色を変えるのは、
外部スタイルシートから呼び出すことはできないんですか？
目的のhtml文書のbodyに組み込むしかないんでしょうか。
308:Name_Not_Found
08/08/11 20:57:47
>>307
外部スタイルシートから呼び出せるよ。
うまくいかないとしたら、どっか記述間違ってるんじゃないかな。
309:Name_Not_Found
08/08/11 21:22:19
>>308
回答ありがとうございます。安心しました。
どっか間違ってないか見直してきます（｀・ω・´）
310:Name_Not_Found
08/08/14 13:00:42 r25rewuU
質問です。
box1(div)のheightに固定値を指定すると「余白」の色が
box1で指定した背景色（仮に青とする）になるのですが、
autoにすると、青になったり白(box2とbox32の背景色）に
なったりします。
高さ以外に違いがないと思われるページで、違う色になります。
高さが関係するのかと思って調べたのですが、
高さの関係が、ｘ>ｙ>ｚになるｘとｚが青で、ｙが白になるので
関係ないような気がしています。
table1とbox31の高さは常に同じで、table1の高さの方がbox31の
高さより大きく、box32の高さが可変です。
どういう原因が考えられるのでしょうか。
ｂｏｘ１
ｔａｂｌｅ１ ｂｏｘ２
ｂｏｘ３１
余白 ｂｏｘ３２
よろしくお願いします。
311:Name_Not_Found
08/08/14 13:05:21 r25rewuU
↑補足します。
ｔａｂｌｅ１とｂｏｘ２はｂｏｘ１の要素です。
ｂｏｘ３１とｂｏｘ３２はｂｏｘ２の要素です。
312:Name_Not_Found
08/08/14 13:19:51
・floatやpositionした要素に高さは無効
・boxの挙動がおかしいと思ったら、borderを付けて確認するのが基本
・ソース出せ馬鹿
313:Name_Not_Found
08/08/14 13:20:16
ソースをよこせ
314:Name_Not_Found
08/08/14 16:15:03
そーだよそーだよソースだよ
315:Name_Not_Found
08/08/15 15:18:57
テーブル全体をリンクに使用したいしたいのですが
現在は
onclick="window.open('view/research_capital_view.html')"
を使用しています。
これをスタイルシートで実現する方法はないのでしょうか
JAVAScriptで行うとHover設定がまったく反映されないのと
構造が綺麗にならない点が不満です。
316:Name_Not_Found
08/08/15 16:47:37
>>315
JSだとかCSSだとか以前の問題だ
tableをaの中に入れるのは間違い
317:Name_Not_Found
08/08/15 18:06:57
>>316
それは、分かっているから、JAVAScriptでやっているわけでして
とはいえIE、Opera、FireFoxで挙動は全然違いますが、
aの中にTableを無理やりぶち込んだほうが、
まだ求めている物に近い動作はするですよね。
特にFireFoxはそのものズバリの動作をしてくれてしまいます。
318:Name_Not_Found
08/08/15 19:18:44
スレ違いということも分からないのに分かってるとかｗ
319:Name_Not_Found
08/08/15 21:58:42
そもそもこのスレが質問スレではない件
320:Name_Not_Found
08/08/17 21:12:57 +JE4P2wV
>>318
CSSで細工して、そのように動かすことが出来ないか？
という質問なのですが
ここはCSSの質問スレではないのですか？
321:Name_Not_Found
08/08/17 23:16:51
>>320
htmlにはa要素にtarget属性がありますが、HTML4.01で非推奨、
xhtml1.1では廃止されました。
cssで動的な指定はできません。
322:Name_Not_Found
08/08/18 11:29:53 AufoEyIv
>>321
Hover以外に動的な細工をする方法はないんですね
trやtdには出来てもTable自体にHoverが有効でない以上
手法はなしという事なんですね
ありがとうございました
323:Name_Not_Found
08/08/18 21:29:37
馬の耳に念仏
324:Name_Not_Found
08/08/19 13:14:57 WaoB7Y1R
<div class="box1">
<table class="box2">
<tr class="box3">
・・・・
って構造だとbox1にfont-size指定してもbox3内には利かない？
325:Name_Not_Found
08/08/19 15:27:46
フツーdivにtableなんて入れないけど、利かないブラウザあんの？
326:Name_Not_Found
08/08/20 15:05:37
>>325
えっ
327:Name_Not_Found
08/08/20 19:40:50
おっ
328:Name_Not_Found
08/08/20 23:43:10
ぱ
329:Name_Not_Found
08/08/20 23:47:06
っ
330:Name_Not_Found
08/08/20 23:49:04
ぴー
331:Name_Not_Found
08/08/22 04:26:23
>>316
tableをaの中に入れてはいけないのか…。
table全体をa nameで囲んだりよくするのだけど。
332:Name_Not_Found
08/08/22 04:57:40
この場合a hrefと言いたいんじゃないかと
a nameならcaptionやhxに付けた方がスマートではないかと
333:Name_Not_Found
08/09/02 11:19:17 lN/qnR2r
印刷するときに、css を使って印刷するページごとに
ヘッダやフッタを付けたいのですが可能ですか？
334:Name_Not_Found
08/09/02 22:47:31
余計な事すんな
335:Name_Not_Found
08/09/03 01:39:29
>>333
<link rel="stylesheet" type="text/css" href="print.css" media="print">
printcssは印刷のときだけ適用される。
336:Name_Not_Found
08/09/24 06:16:35
>>332
a hrefだろうがa nameだろうが
インライン要素でブロック要素を囲むな
337:Name_Not_Found
08/09/24 07:34:11
他にもつっこみどころ満載
HTMLから勉強してこい
338:Name_Not_Found
08/09/24 16:49:23
ﾌﾟ
339:Name_Not_Found
08/09/24 20:11:22
質問失礼します。
web初心者スレでも質問させていただいたのですが
あちらなんだか荒れてるみたいでスルーされてしまったので
こちらでも質問させていただく失礼をお許しください。
<STYLE TYPE="text/css">
<!--
TABLE {font-weight:bold;}
-->
</STYLE>
でページ全体の文字を太くしたのですが、一部分だけ細字に戻すことはできますか？
よろしくおねがいします。
340:Name_Not_Found
08/09/24 21:36:47
>>339
細くしたい部分に
font-weight:normal;を指定
341:Name_Not_Found
08/09/24 22:12:29
>>340
できました！ありがとうございます！
スタイルシートの効果を部分キャンセルする方法ばかり考えていました…。
342:Name_Not_Found
08/10/08 17:39:05
floatしたボックスをネガティブマージンで重ねた場合の重なり順序は、
後続が絶対上にしかならないのでしょうか？
<!-- 例HTML -->
<div id="satou">
<div id="sio"></div>
<div id="solt"></div>
</div>
/* 例CSS
++++++++++++++++ */
#satou{
width:45px;
}
#sio{
float: left;
width: 100%;
height:30px;
margin-bottom: -15px;
background-color: #FFF;
}
#solt{
float: left;
width: 100%;
height:30px;
background-color: #000;
}
というコードの時の、重なり方についてです。
#FFFが15px+#000が30px、#FFFが30px+#000が15pxとコントロールできないのでしょうか？
343:Name_Not_Found
08/10/08 19:13:40
>>342
position+z-indexで可能
344:Name_Not_Found
08/12/26 15:32:30
W3CのCSSチェックかけると
「padding-leftとかpadding-rightの値にautoとかねーよw」とか言われる…。
これって廃止になったの？使わない方がいいんだろうか？
345:Name_Not_Found
08/12/26 23:14:43 h+SjkvEv
説明しにくいのですが、画面いっぱいに表示するメニューに
div style="overflow:auto"を使って、サイドバーのようなものを作りたいのですが、
下のようにしたとき、
IEなら画面を小さくして、div.sidebarの中身がはみ出るときちんとスクロールバーが出るのですが、
firefoxで表示させると、divの中身が全部表示できるだけ大きくなってしまいます(スクロールしない)
うまくfirefoxで表示できる方法はありませんか?
<html><body>
<table style="width:100%;height:100%;">
<tr>
<td colspan="2" style="height:1;background-color:#f00"> </td>
</tr><tr>
<td style="width:20%;background-color:#ff0">
<div id="sidebar" style="overflow:auto;height:100%;">
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
</div>
</td>
<td rowspan="2" style="background-color:#f0f"> </td>
</tr><tr>
<td style="height:1;background-color:#0ff">a</td>
</tr></table>
</body></html>
346:Name_Not_Found
09/01/03 02:14:06
css初心者です
作った（といっても改変可サンプル変更）のおかしな部分を実際見てもらって
間違いの質問をしても大丈夫でしょうか？
もし、もっとふさわしいスレがあったら誘導して頂けるとありがたいです…
質問は、IEでは出るのにサファリ、火狐ではでないスクロールバーについてです
347:Name_Not_Found
09/01/19 02:19:38
リスト化したメニューにそれぞれ画像を張り付けているんですが、
hoverで別の画像を表示したいのですがうまくいきません。
ご教示ください。
html
<div id="header">
<ul>
<li><a href="#"><img src="image/home.gif" alt="ホーム" name="home" width="160" height="50" id="home" /></a></li>
<li><a href="#"><img src="image/profile.gif" alt="会社概要" width="160" height="50" id="profile" /></a></li>
<li><a href="#"><img src="image/service.gif" alt="提供サービス" width="160" height="50" id="service" /></a></li>
<li><a href="#"><img src="image/faq.gif" alt="FAQ" name="faq" width="160" height="50" id="faq" /></a></li>
<li><a href="#"><img src="image/contact.gif" alt="お問い合わせ" width="160" height="50" id="contact" /></a></li>
</ul>
#header ul li a#home:hover という感じでそれぞれ指定するだけではダメなのでしょうか？
348:Name_Not_Found
09/01/19 14:59:19
>>347
a#homeなんかどこにも存在してないだろ
349:347
09/01/19 15:57:08
これ以外にいくつか試したんですがうまくいきません。
id="home"を#homeで指定してもダメでした。
#header ul li #home:hover、#header ul li #home a:hoverも同じく・・・orz
350:Name_Not_Found
09/01/22 09:56:37
みんな、固定レイアウトの時ってフォントサイズどうしてる？
可変？それとも固定？
351:Name_Not_Found
09/01/24 16:01:46
絶対値指定はしない。ここでいう絶対値指定っていうのはピクセルとかじゃなくてミリメートルとかインチとかのこと。
352:Name_Not_Found
09/01/25 05:29:25
ピクセルもやめとけ
353:Name_Not_Found
09/01/25 16:09:11
URLﾘﾝｸ(www.free-css-templates.com)
が見れなくなってるよー
354:Name_Not_Found
09/01/28 21:08:15
>>347
根本がおかしいだろ。なんで画像にID振ってるんだ。
javascriptの画像切り替えと混同してないか？
普通は
<ul id="Menu">
<li id="Test"><a href="#"><span>TEST</span></a></li>
</ul>
てな感じでタグ書いてcssは
#Menu ul li a { display:block; width:200px; height:30px; }
#Menu ul li span { display:none; }
li#Test a:link,li#Test a:visited { background:url("test1.gif") no-repeat 0 0; }
li#Test a:hover,li#Test a:active { background:url("test2.gif") no-repeat 0 0; }
CSSの画像切り替えは普通背景でやる。
347みたいにデフォ画像を画像タグでやるんなら
マウスオン時にデフォ画像をvisibilityで隠すなりして背景にマウスオン画像を敷く、でいけるかも。
どっちにしろ画像じゃなくliかaにid振るべき。
355:Name_Not_Found
09/02/10 05:57:39
ちょっと質問
<meta http-equiv="Content-Style-Type" content="text/css">
これが記入されていれば
<link rel="stylesheet" href="hogehoge.css">
<style>～</style>
これでかまわない。
<link rel="stylesheet" type="text/css" href="hogehoge.css" />
<style type="text/css">～</style>
やはりこう書かないとだめだ。
さて、どっちが正しい？
356:Name_Not_Found
09/02/10 08:57:40
コンテントタイプの意味を考えればわかるだろ
357:Name_Not_Found
09/02/10 16:46:54
imgをくくってるdivの背景画像を、imgの上に重ねることは不可能ですかね？
<div class="box">
<a href="test.html"><img src="test.gif" ></a>
</div>
div.box {
background-image:url(test2.gif);
z-index:2;
}
img {
z-index:1;
}
358:Name_Not_Found
09/02/16 18:48:10
>>348
divの中にある以上無理だろ。
z-indexは同階層のものに対して使う。親子関係に口は挟めない。
なんでそもそもそんな馬鹿げた事やろうとしてんだ。
divの中の画像を消してdivの背景出したいならvisibility:hiddenで消しゃいいだろ。
359:Name_Not_Found
09/02/18 21:29:08
高さが可変のブロックAの中に、ブロックB、ブロックCが入っています。
こんな感じです。
<div id="A">
<div id="B">hoge</div>
<div id="C">moge</div>
</div>
ブロックBの高さを100px、
ブロックCを残りの長さ(ブロックAの高さから100pxを引いた値)にしたい場合、
CSSではどのように指定したら良いでしょうか？
360:359
09/02/18 22:35:37
（モダンブラウザのみですが）自己解決しました。スレ汚し失礼しました。
div#A{
height:80%;
}
div#B{
height:100px;
}
div#C{
position: absolute;
top: 100px;
bottom: 20%;
}
361:Name_Not_Found
09/03/03 16:15:15
<li>や<dd>のリストをfloat:leftで横並びにするとき、
最後の属性だけfloat:noneを指定すれば、親ブロックにその分の領域が発生する
（全部floatだとheightがゼロになって背景などが描画されないので）
……と期待するのだけど、Firefoxなどで表示すると、まるでclear:leftが指定されたかのように、
そのブロックが右に流し込まれずに下に落ちてしまいます。
<ul><li>hoge</li><li>hoge</li><li>hoge</li><li class="end">hoge</li></ul>
li{width:100px; float:left;}
li.end{float:none;}
これは、ただしい描画なのでしょうか？ また、どういう解釈になるのでしょうか。
362:Name_Not_Found
09/03/03 18:07:24
>>361
ブロック要素はfloatしない限り基本的に横に並ぶことはない。
なのでfloat:noneを指定されれば下に落ちるのは当然のこと。
363:Name_Not_Found
09/03/03 19:26:15
「リストが終わったら周り込み解除」ではなく「最後のリストだけ周り込み解除」になる。
だからそれで問題ない。
<div class="hogehoge">
<ul>
<li>hoge</li><li>hoge</li><li>hoge</li><li class="end">hoge</li>
</ul><span class="end"> </span>
</div>
.hogehoge { background:#fcc; }
li {width:100px; float:left; background:#ffc; }
span.end { display:block; height:1px; width:1px; overflow:hidden; clear:left; margin-top:-2px; }
364:Name_Not_Found
09/03/05 10:47:38
この記述は正しいの？
body{border:5px solid; border-color:#000000 #0000ff;}
div{border:solid #000000; border-width:5px 3px;}
365:Name_Not_Found
09/03/05 13:47:43
>>364
特に間違いは見当たらないが
何が問題なんだろうか
366:Name_Not_Found
09/03/05 16:00:44
borderの一括設定とborder-widthを同時にやってるって点だろ。
正しいかどうかはワカラン。別に問題は無さそうだけどな。
個人的には一括設定のトコでborderのtyoeの前にwidthが来てるトコとかが気になるがw
367:Name_Not_Found
09/03/05 17:27:04
>>366
>borderの一括設定とborder-widthを同時にやってる
線の太さや色をtop、bottomなどで変えたいときはむしろ今回のように別に指定しなければならない
>一括設定のトコでborderのtyoeの前にwidthが来てるトコとかが気になる
値さえ合っていれば、順番はどちらでも大丈夫
368:367
09/03/06 08:54:42
>>366
あーごめんなさい、しなければならないはちょっと言い過ぎ
ベースをborderで指定して個別に上書きというやり方も可
369:Name_Not_Found
09/06/02 06:25:13 7YwK8DI7
<table border="1" style="border-collapse:collapse;">
<tr>
<td style="width:10px;">aaa</td>
<td style="width:10px;">bbb</td>
<td style="width:10px;">ccc</td>
・・・・
ってやると5個目のセルくらいからセルの左端の座標が1pxくらいズレ出すんだけど
borderのせい？
セルの左端の座標を全部正確に10の倍数にするにはどうしたらいい？
370:Name_Not_Found
09/06/03 07:25:30
多分改行のせい
371:Name_Not_Found
09/06/03 07:50:05
ここは質問スレじゃないのに質問してるせい
372:Name_Not_Found
09/06/07 01:49:07
pタグで改行しない方法ってありますか？\
373:Name_Not_Found
09/06/07 03:42:34
display:inlineか
display:inline-block
あまりオススメはしないが、
状況によっては使い道もあるかもな
374:Name_Not_Found
09/06/07 09:41:21
だからここ質問スレじゃないっつーの
375:Name_Not_Found
09/06/07 22:31:58
>>374!!!!!!!!!!!!!!!!!!３７４！！！！！三七四！！！！！！！！！！！！！！
なんでお前がしきってるんだよおおおお！！！
ちゃんとスレタイに質問スレって書いてあるじゃんかよおおおおお！！！
376:Name_Not_Found
09/06/07 23:06:25
ﾂﾏﾝﾈ
377:Name_Not_Found
09/06/20 11:44:10 PTFkUzz8
id・classの使いまわしをするとMarkup Validation Serviceでしかられます。
仕方なく、id・classの名称を変えて二度書、三度書きをしています。
Markup Validation Serviceでエラーを出すことなく、効率よく書く方法が
あるのでしょうか。
378:377
09/06/20 12:51:19
idとclassが混ざってました。レス汚しですみません。
379:Name_Not_Found
09/06/20 22:40:36
それ以前にここはネタスレであって質問スレじゃない
380:Name_Not_Found
09/07/05 06:50:53
>>379!!!!!!!!!!!!!!!!!!３７９！！！！！三七九！！！！！！！！！！！！！！
なんでお前がしきってるんだよおおおお！！！
ちゃんとスレタイに質問スレって書いてあるじゃんかよおおおおお！！！
381:Name_Not_Found
09/07/05 12:49:27
>>380
ﾂﾏﾝﾈ
382:Name_Not_Found
09/07/08 03:52:06
110のランキング表作っているのですけど
10のいちが各ブラウザ安定しません
各<li>タグににパディングをいてれ調節しているのですが・・
テーブルのしかできませんか？
383:Name_Not_Found
09/07/09 02:14:38
スレ違い以前に日本語でおｋ
ここネタスレだから
384:Name_Not_Found
09/07/11 02:18:16
>>383!!!!!!!!!!!!!!!!!!３８３！！！！！三八三！！！！！！！！！！！！！！
なんでお前がしきってるんだよおおおお！！！
ちゃんとスレタイに質問スレって書いてあるじゃんかよおおおおお！！！
385:Name_Not_Found
09/07/11 03:02:24
ﾂﾏﾝﾈ
386:Name_Not_Found
09/07/11 05:07:29 QTq+57Lo
他人のｃｓｓ見て勉強中なんだけど、全体幅に780pxが多いのは何か理由があるのかね？
ちょっと気になったもんで
387:Name_Not_Found
09/07/11 07:08:52
多いのはリキッド
388:Name_Not_Found
09/07/11 07:42:46
>>386
> 他人のｃｓｓ見て勉強中なんだけど、全体幅に780pxが多いのは何か理由があるのかね？
> ちょっと気になったもんで
IE6の標準設定でギリギリA4縦に収まる幅が770～780px
389:Name_Not_Found
09/07/11 13:39:48
>>388
そういうことだったのか！？
ありがと
390:Name_Not_Found
09/07/11 21:01:44
>>389
無視すんなよ
391:Name_Not_Found
09/07/13 13:32:54
1024幅のモニタでお気に入り出したままで
サイドバーの幅はデフォなら
横スクロール出ず全部入るのが790pxくらいまで
392:NAME IS NULL
09/07/14 15:08:06
希望している動作はCSS無しで書くと、↓こんな感じの動作を希望しています。
<table border="1" cellspacing="0" cellpadding="20"><tr><td>あ</td>
<td><table border="1" cellspacing="0" cellpadding="0"><tr><td>あ</td></tr></table></td>
</tr></table>
<table border="1" cellspacing="0" cellpadding="0"><tr><td>あ</td>
<td><table border="1" cellspacing="0" cellpadding="20"><tr><td>い</td></tr></table></td>
</tr></table>
それで↓のようにしたのですが
■CSS
.hoge { border: 1px solid black; border-spacing:0; border-collapse:collapse; }
.hoge td { border: 1px solid black; padding:20px; }
.hage { border: 1px solid black; border-spacing:0; border-collapse:collapse; }
.hage td { border: 1px solid black; padding:0px; }
■HTML
<table class="hoge"><tr><td>あ</td>
<td><table class="hage"><tr><td>あ</td></tr></table></td>
</tr></table>
<table class="hage"><tr><td>あ</td>
<td><table class="hoge"><tr><td>あ</td></tr></table></td>
</tr></table>
テーブルの中のテーブルのpaddingが上位のpaddingが優先されてしまうみたいなんですけど
どうすれば良いのでしょうか？
393:Name_Not_Found
09/07/14 20:39:21
>>392
だからここ質問スレじゃねーっての
394:Name_Not_Found
09/07/15 20:24:35
>>393!!!!!!!!!!!!!!!!!!３９３！！！！！三九三！！！！！！！！！！！！！！
なんでお前がしきってるんだよおおおお！！！
ちゃんとスレタイに質問スレって書いてあるじゃんかよおおおおお！！！
395:Name_Not_Found
09/07/15 20:36:38
しつこい奴だな>>394
396:392
09/07/16 08:39:49
質問スレじゃなかったんですね。
他のスレに移動します。
スレ汚して、申し訳ありませんでした。
397:Name_Not_Found
09/09/15 15:55:20 GZqjI6jH
a { ～ }
a:hover { ～ }
のように書いて、マウスが乗ったときに色かえたりできますけど、これを
<a style="～">のように<head></head>に書かないでやることはできますか？
398:Name_Not_Found
09/09/15 16:35:29
だから質問スレじゃ（ｒｙ
399:Name_Not_Found
09/09/15 19:45:59
>>397
.css 外部ファイル
400:Name_Not_Found
09/09/15 22:34:23
マルチ乙
401:Name_Not_Found
09/09/15 22:57:38 Eb4QiI20
URLﾘﾝｸ(www.dotup.org)
↑のファイルの中の「index.html」の右側のサイドメニューの横幅をかえたいんですが、
「style.css」の
/*サイド（一番右側）コンテンツ
------------------------------------------------------------------*/
#side {
float: right;
width: 176px;
margin-left: 8px;
padding: 10px;
この部分のwidth: 176px;の176pxの値を大きくすると大きくはならず、
形が崩れてしまいます。
どうすればサイズ変更できるでしょうか？
402:Name_Not_Found
09/09/15 22:59:18
URLﾘﾝｸ(www.nttdocomo.co.jp)
の上にあるボタンみたいに、開いたページに対応した所だけを変化させるにはどうすればいいのでしょうか？
403:Name_Not_Found
09/09/16 00:24:12 oqGyqT1l
こんにちは。FireBugをカンでいじってCSS組んでいます。
URLﾘﾝｸ(fukia.6.ql.bz)
上記のサイトを作っているんですが、IEで見てみると、下のbottomの部分がなくなってしまいます。
どうしたらよいのでしょうか？
404:Name_Not_Found
09/09/16 08:17:07
ここは質問スレじゃねーっての
スレも読めない奴は仕様書でも読んでろ
405:Name_Not_Found
09/09/16 14:58:43 3rcpibgk
>>404
どこが質問スレなんですか？
406:Name_Not_Found
09/09/16 15:50:29
「CSS」でスレ一覧を検索
407:Name_Not_Found
09/09/16 17:24:07
了解しました>>403は無視してください
失礼しました
408:Name_Not_Found
09/09/26 16:44:58
CSSを使用してリスト内の文字の上下間隔を狭めるにはどうすれば良いでしょうか？
(上下の文字と文字の間隔を5pxや10pxと指定したいと思っています。)
<ul>
<li>あ</li>
<li>い</li>
<li>う</li>
</ul>
409:Name_Not_Found
09/09/26 16:48:19
>>408
ですが自己解決しました。
410:Name_Not_Found
09/09/27 02:11:53
自己解決したときはちゃんと書くように
・li内部の行間を調整するのは
li {line-height:xx } →単位無し整数指定が推奨
・li同士の間隔を調整するのは
li {margin-bottom:xx}
li {padding-bottom:xx} →px指定が安定だがemでもよい
411:Name_Not_Found
09/09/27 13:46:12
>>410
推奨も何もない
用途によって変えなきゃならないに決まってるだろ
412:Name_Not_Found
09/09/27 22:02:23
>>411
> 推奨も何もない
> 用途によって変えなきゃならないに決まってるだろ
line-heightに関しては「推奨」です
line-height の値には単位なしが良いとされる理由 - lucky bag
URLﾘﾝｸ(www.lucky-bag.com)
413:Name_Not_Found
09/09/27 22:16:23
割と一般的に知られてる話だと思ってたが。＞line-heightには単位なし
行間(行の高さ)を調節するなら単位はナシで - ［ホームページ作成］All About
URLﾘﾝｸ(allabout.co.jp)
line-heightに関しては、用途によって変えなきゃならないケースが
ほとんどないからな。pxでガチガチにデザイン決めたい場所でも
font-sizeの方でpx指定してそれに無単位でline-heightしておけばいいわけで。
414:Name_Not_Found
09/09/27 22:17:48
>>410
>単位無し整数指定が推奨
整数？
415:Name_Not_Found
09/09/27 22:21:12
整数じゃないな すまん
416:Name_Not_Found
09/09/28 02:02:47
>>412
そこの管理人が推奨してるとWeb全体に推奨なんてことはないｗ
理屈は知ってるが、知ってればこそ用途によって変えるべき
417:Name_Not_Found
09/09/28 05:29:55
というかその人も「行ボックスの高さが意図していないものになってしまう可能性がある」
から推奨と言ってるだけで、常に推奨とは言ってないじゃん。
逆に言えば意図があれば別のものを使うという話をしてるだけだろ、
なのにその推奨を布教されてもその管理人に迷惑なだけと思うが。
418:Name_Not_Found
09/09/28 12:22:20
本人だったら問題ないんじゃね？ｗ
419:Name_Not_Found
09/09/28 13:51:24
お前が本人か
420:Name_Not_Found
09/09/28 16:10:13
俺がガンダムだ
421:Name_Not_Found
09/09/28 17:45:15
そこの管理人はそこまで馬鹿じゃないだろｗ
422:Name_Not_Found
09/09/28 20:52:52
知り合いかよ
423:Name_Not_Found
09/10/19 13:40:12
tableでカレンダーを作りたいのですが、縦(日曜・土曜)の文字に色を適用する方法で悩んでます。
URLﾘﾝｸ(www.d-spica.com)
上のページだと縦列の背景色に<col class="xxx">、<th scope="col">などとして一括設定していますが
背景色の変わりにcolor:red;などとしても文字色が変わりません。
（td全体なら文字色変更できましたが。）
上の方法だと文字色指定は無理なのでしょうか？
また別の方法があるのでしょうか？
最悪、該当セル全てにclass指定するつもりですができればやりたくない・・・
424:Name_Not_Found
09/10/31 14:19:34
良スレage
425:Name_Not_Found
09/11/05 09:30:25
>>423
自動で振り分けさせる。
URLﾘﾝｸ(gihyo.jp)
それが嫌なら全部にclass書いてやるしかない。
ちなみにcolはfontまわりのスタイルはいじれない。
426:光
09/11/05 21:21:25
<select>の<option>に個別に設定したスタイルシート(色変え等は)はブラウザ依存なのでしょうか？
SH903iのiﾓｰﾄﾞﾌﾙﾌﾞﾗｳｻﾞでは正常に動作したものの
SH-06Aのiﾓｰﾄﾞﾌﾙﾌﾞﾗｳｻﾞでは効きません
ブラウザ依存なら対象方法としてはJavaScript/onChangeで<select>ごとスタイルシートを変えるくらいしかないでしょうか？
427:Name_Not_Found
09/11/17 13:57:40 ifxZIQ60
IE8, Windows7です。
下線がボックス幅を超えて描かれます。どうしてなのでしょうか？
幅240pxのサイドメニューボックスの中に下記のmenu_leftボックスを設け、
menu_leftボックスの中に、menu_titleを入れています。
下記の定義でmenu_titleの下線(border-bottom)が、menu_title幅(200px)をはみ出して（右側に20px）描かれます。
menu-tileの幅もmenu_leftのマージン幅も200pxなのに、なぜはみ出すのでしょうか？
.menu_left {
margin: 0px 20px 0px 20px;
padding: 0px 0px 20px;
}
.menu_title {
text-align:left;
color:#fff;
font-size:12px;
font-weight:bold;
background-image:url(URLﾘﾝｸ(hogehoge.com));
background-position:top left;
background-repeat:no-repeat;
border-bottom: 1px solid #961585; /*この下線が右にはみ出す*/
margin:25px 0 0 0;
padding: 6px 12px 2px 30px;
height: 25px;
width:200px;
}
428:Name_Not_Found
09/11/18 16:58:31
-webkit-border-radius: 4px;
-webkit-ってなんだろー
429:Name_Not_Found
09/11/19 13:05:22
独自拡張のプロパティに付けるベンダ接頭辞
430:Name_Not_Found
09/11/20 16:39:48 mUHXNI5N
質問です。
リンク文字にマウスを重ねた時に、背景色（ボックス形）を表示するようにしたいのですが、
背景ボックスの高さが変更できません。指定方法を教えて頂けませんでしょうか。
今のソースとスタイルシートは以下の通りです。よろしくお願いします。
（「HOGEmail」と「HOGEｕｒｌ」のところの背景色の高さです）
≪ソース≫
<ol class="ct_container">
<li><p class="ct_header"><a href="mailto:hoge1">HOGEmail</a> | <a href="URLﾘﾝｸ(hoge2.com)">HOGEurl</a> |
<p class="ct_title"><a id="comment3" name="comment3"></a>タイトル</p>
<div class="ct_body">内容</div>
<div class="cnt_date">YYMMDD</div></li>
<li>/*次のタイトル、内容等*/</li>
</ol>
≪スタイルシート≫
.ct_header a , .ct_header a:visited {
color:#666;
text-decoration:none;
line-height:28px; /*(1)ここを変えても変わらない*/
padding:0.2em 0.5em;
border:1px dotted #fff; }
.ct_header a:hover {
color:#444;
/* (2)ここにline-heightを追加して変えても変わらない*/
border: 1px solid #ccc;
background:#f5f5f5; }
/* (3)下記を追加して変えても変わらない
li { line-height:28px; }*/
431:Name_Not_Found
09/11/21 18:21:50
質問です。
横一列のメニューリンクテキストを右詰めで、<ul><li>タグを使って再現したい。
ブラウザではきちんと表示されるが、DreamWeaverのデザイン表示が妙なことになる。
（5つのメニューが、途中3つで改行され2段表示。
うち1つはテキスト自体も4文字が全て改行され縦4文字に並んでしまう。）
テキストボタンでなく画像ボタンならば<li>にwidthを指定することで
回避できるのですが、テキストなのでwidth指定はしたくない。
また、納品後はクライアントが更新作業を行っていく体制を取るので
DreamWeaverのデザイン表示を混乱の少ない状態に整える必要がある。
432:Name_Not_Found
09/11/21 18:23:24
>>431の続き
これは仕方のないことなのでしょうか？
現在は<li>タグにfloat: leftを指定して横一列に表示しています。
これをやめて<li>タグにdisplay: inline;を指定すると
DreamWeaver上では改行無しで表示されるのですが、
ブラウザ上でトップマージン指定や背景画像の位置指定が効かなくなります。
何か解決策が分かりましたら教えてください。
433:Name_Not_Found
09/11/21 18:51:49
DWの表示が完全だという前提になってますね
こういう人多いのかなあ今
434:Name_Not_Found
09/11/22 21:08:43
まったくだ。ローカルの1制作ソフト上での見た目なんてどうでもいい。
どうせ各ブラウザで確認するんだし、WYSIWYGの見た目なんて違って当然。
435:Name_Not_Found
09/11/22 21:42:26
というかDWもWebKit採用してくれればいいのになー
俺はhtmlもCSSもエディタでハンドコーダー派なんだけど
DWしかわからない子たちが「○○さんのデザイン崩れます」て言ってくる
IE・FF・Safari・Opera，全部検証してるっつの！
436:Name_Not_Found
09/11/22 21:44:22
CS4からはプレビューはWebKit対応になってるらしいよ。
437:Name_Not_Found
09/11/23 08:03:01
トゥギャザーしようぜ！
438:Name_Not_Found
09/11/23 12:21:28
>>436
だね
あんまり意味ないんだけどね
IE9はまた独自仕様になりそうでこわいなあｗ
IEは6789でチェックとか、もうやめて＞＜
439:Name_Not_Found
09/11/26 21:02:04 FzH8K/lF
質問スレなんだから、まじめに回答しろ！
440:Name_Not_Found
09/12/01 12:27:45 Mkuhgcka
HTMLの中で以下のようなレイアウトを作ろうとしています。
This is a [pen].
↑black
[pen]を基準にして「↑black」の位置を決めるにはどうすればいいですか？
positionというのを使うのかな、、と試しましたがよくわかりませんでした。
よろしくお願いします。
441:Name_Not_Found
09/12/06 02:18:57
>>440
.pen { position: relative; display: inline-block; }
.black { position: absolute; top: 1em; left: 0; }
<p>This is a <span class="pen">[pen].
<span class="black">↑black</span></span></p>
442:441
09/12/06 02:37:42
って5日も前のレスだったか…もう解決してるかな
443:Name_Not_Found
09/12/08 11:25:26 spDDXc55
>>441
ありがとうございます。
とても助かりました。^^
444:Name_Not_Found
09/12/10 19:10:32
もうすぐ三周年 トゥギャザー
445:Name_Not_Found
09/12/26 01:26:25
jsだとオライリーのサイ本がバイブルっぽいですが、CSSでそういった書籍ってありますか？
もちろん一冊で完結する訳はないんですが、皆さんどんな本で勉強されたのかなと。
446:Name_Not_Found
10/01/11 02:32:45 QmXP9yD9
CSSで、この画像のような構造のサイトを作りたいと考えています。
URLﾘﾝｸ(imagepot.net)
今このようなCSSを組んでいるのですが、実際には以下の画像のような表示になってしまいます。
URLﾘﾝｸ(imagepot.net)
div#content {
position: relative;
width: 900px;
margin-left : auto;
margin-right : auto;
top: 40px;
text-align: left;
bottom: 40px
min-height: 90%;
height: auto !important;
height: 90%;
}
div.nakami {
background:#fff1c3;
border:solid 10px #c96c29;
overflow:scroll; padding:30px;
position: absolute;
bottom: 71px;
left: 0px;
top: 72px;
right: 0px;
z-index: 11;
}
<続きます>
447:446
10/01/11 02:34:08 QmXP9yD9
<続きです>
div.copyright {
display: block;
position: absolute;
bottom: 0px;
left: 0px;
right: 0px;
background-image: url(images/copyright_2010.png);
background-repeat: no-repeat;
background-position: right bottom;
}
検索しているのですが、どうしてもわかりません。
どなたか、何が悪いか、御指南ください。お願いします。
それから、position="relative"にしておくと、margin-bottomは適用されないのでしょうか？
448:Name_Not_Found
10/01/11 02:46:17
>>447
cssに
html,body { height: 100%; }
を書いてなさそう？
449:446
10/01/11 05:20:52
>>448
レスありがとうございます！
今急いで追加してみたんですが、変化なしでした。
どこか他におかしい所はないでしょうか？
450:446
10/01/11 05:32:46
HTMLの方はこうなっています。
<div id="content">
<div id="menucontainer">
メニュー
</div>
<div class="nakami">
テストテスト
</div>
<div class="copyright">
</div>
</div>
451:Name_Not_Found
10/01/11 11:41:54
>>450
>>446-448と>>450コピペしてやってみたけど、div.copyrightを下に固定？することは出来たよ
452:446
10/01/12 00:30:03
できました！
ありがとうございました。
453:Name_Not_Found
10/01/12 12:50:53
ここはネタスレであって質問スレは別にあるだろボケ
454:Name_Not_Found
10/01/16 12:03:39
定期的に書いておかないと駄目か
ここは質問スレじゃないぞ
455:Name_Not_Found
10/03/19 15:28:56 uF0/sJns
Adobe Spryのアコーディオンで、
クリックするとSarariで青い枠線が出ます。
Abobeのサイトのサンプルでも出るもの、出ないものがあります。
この違いは何なのでしょうか？
また消すためには、どう指定すれば良いのでしょうか。
お教えください。
URLﾘﾝｸ(labs.adobe.com)
456:Name_Not_Found
10/03/30 12:19:19
a:link { color: white; }
a:visited { color: white; }
a:hover { color: red; }
いくら指定してもブルーのまま。
試しに<head>内をいろい消しても変わらず・・・
ドキュメント宣言とか文字コードとかも関係アルのかな？？
457:Name_Not_Found
10/03/30 12:20:21
検証もしてないし根拠もないがoutlineとかは？
458:Name_Not_Found
10/03/30 13:12:11
>>457
outlineはどこも設定してません・・
全てを消して
a:link { color: red; }
未訪問リンク
a:visited { color: red; }
訪問済みリンク
a:hover { color: blue; }
マウスカーソルを乗せたリンク
書いてみたけどマウス載せても色が変わらない・・
459:Name_Not_Found
10/03/30 14:15:46
a:hover { color: red; }
<body link="white" vlink="white" alink="white" >
<a href=" ">リンク</a>
結局これで解決・・・なんでできないんだろう。。
460:Name_Not_Found
10/03/30 14:54:55
>>457は>>455へのレスなんだけど、
クリックしたとき出る枠線ってのはoutline:noneで消せたはず、と思って。
>>456は>>455ではないよな？
CSSだけだされても誰もわからんと思うよ。
461:Name_Not_Found
10/04/02 09:06:49
だからここはネタスレだと何度