CSS初心者スレッド＝9th＝

1 ：Name_Not_Found：2010/10/19(火) 15:44:23 ID:???

CSS初心者の方のための質問スレッドです。
具体的な記述方法がわからない方、基礎知識がない方はこちらでどうぞ。

※気のいい人だけが答えてくれますので、解答はまったり待ちましょう。

《関連スレ》
Webサイト制作初心者用質問スレ Part 212
http://pc11.2ch.net/test/read.cgi/hp/1249471196/

《前スレ》
CSS初心者スレッド＝8th＝
http://hibari.2ch.net/test/read.cgi/hp/1273383771/

《過去スレ》
CSS初心者スレッド＝7th＝
http://pc11.2ch.net/test/read.cgi/hp/1251527427/
CSS初心者スレッド＝6th＝
http://pc11.2ch.net/test/read.cgi/hp/1234355194/
CSS初心者スレッド＝5th＝
http://pc11.2ch.net/test/read.cgi/hp/1228900036/
CSS初心者スレッド＝４ｔｈ＝
http://pc11.2ch.net/test/read.cgi/hp/1218200382/
CSS初心者スレッド＝3rd＝
http://pc11.2ch.net/test/read.cgi/hp/1212198165/
CSS初心者スレッド＝2nd＝
http://pc11.2ch.net/test/read.cgi/hp/1207202319/
CSS初心者スレッド＝1st＝
http://pc11.2ch.net/test/read.cgi/hp/1193327030/

2 ：Name_Not_Found：2010/10/19(火) 15:45:06 ID:???

【FAQ】
Q1: IEでは大丈夫なのに、Netscape6 以降で見ると横スクロールバーが出たりするが？
A1: Windows版 Internet Explorerのボックス・モデルが間違った実装だからです。
「width と height の計算方法の実装の違いについて」参照。
　http://hp.vector.co.jp/authors/VA022006/css/visualren.html#ref-width-height
width（height）は、要素の内容領域の幅（高さ）を指定するプロパティですが、
WinIE等では、ボーダー領域 + パディング領域 + 内容領域の寸法で計算されます。
Netscape 6以降やMacintosh版 Internet Explorer 5 の計算が正しい。
WinIEもver.6 からは標準準拠モードにすると仕様通りに計算してくれます。
　http://www.microsoft.com/japan/msdn/ie/ie60/cssenhancements.asp#cssenhancements_topic3
参考「IEとNNのBOXの計測方法の違いについて」
　http://www.fromdfj.net/html/border2.html

Q2: tableなどブロック要素をセンタリングするには？　text-align:center;を指定しても Netscape6(or7)ではなりません。IEでは中央寄せになるのに……
A2: IEの実装の誤りです。詳しくは下記（特に5.）をご覧ください。
1.'text-align'に関する考察
　http://anslasax.net/css-make/t-a/index.html
2.IE5.5とNetscape6のCSS - 中央寄せ
　http://tancro.stp-1.com/stylesheet/n6_center.html
3.Internet Explorer 6におけるCSSの拡張
　http://www.microsoft.com/japan/msdn/ie/ie60/cssenhancements.asp#cssenhancements_topic6
4.Tableのセンタリング
　http://members.jcom.home.ne.jp/jintrick/Personal/css_miss_table.html
5.ブロックレベル要素をセンタリングする方法
　http://www.mozilla.gr.jp/standards/webtips0004.html

3 ：Name_Not_Found：2010/10/19(火) 15:46:11 ID:???

【FAQ】
Q3: CSSで段組するには？
A3: 下記などを参照して下さい。
CSSを用いた段組の作成のコツ
　http://www.fromdfj.net/html/column.html
CSS段組レイアウトデザ委員会
　http://web.archive.org/web/20031005195659/http://www.skipup.com/~l-_-l/web/
スタイルシートでマルチカラムデザインの実現
　http://web.archive.org/web/20040603063133/http://shiten.s9.xrea.com/etc/stylesheet/multi_column.htm
スタイルシートでマルチカラム・デザインを実現する方法
　http://www.motchie.com/article/multicolumn.html
tableを使はない段組:CSSによるマルチカラムデザインについての考察
　http://members.jcom.home.ne.jp/pctips/www/faq/Dangumi.html
試驗場 - 段組(position版)
　http://members.jcom.home.ne.jp/pctips/www/test/positiondangumi.html
段組れいあうとてすと (floatによる段組の例)
　http://www.remus.dti.ne.jp/~a-satomi/nikki/tmp/dangumi.html
なかよしぱれっと（Netscape4でも崩れない段組みの実例）
　http://web.archive.org/web/20041001014138/http://homepage3.nifty.com/fores/
リストを用いたレイアウト
　http://css.maxdesign.com.au/index.htm

4 ：Name_Not_Found：2010/10/19(火) 15:47:07 ID:???

【FAQ】
Q4: なんかフロートの表示が崩れるみたいなんですけど？
A4: まずclear忘れがないかを確認してください。
floatさせる要素にはwidth指定が必須（img要素以外）。抜かすとMacIEやOperaでの表示は保証できません。WinIEは勝手に補ってくれるだけです。
　http://www.remus.dti.ne.jp/~a-satomi/nikki/tmp/floattest/float_not-specified-width.html
またfloat:left;で回り込むのはテキスト（imgを含む）だけです。ブロック自体を横並びにするには、後続要素にも“float:left;”なり“margin-left:（浮動要素のwidth）;”なりを指定する必要があります。WinIEの間違った実装で誤解が多いので注意。
　http://cssbug.at.infoseek.co.jp/detail/winie/b054.html
これに当て嵌まらなかったら「浮動要素の高さもheightに含めさせる方法」などを参考に。
　http://www.mozilla.gr.jp/standards/webtips0021.html#c1_2
　http://cssbug.at.infoseek.co.jp/detail/winie/b079.html
　http://cssbug.at.infoseek.co.jp/detail/winie/b053.html

Q5: CSSで擬似フレームってどうやるの？
A5: 次のページを参考にして下さい。
overflow プロパティは擬似フレームも作成できる
　http://web.archive.org/web/20040221221340/http://kobit.info/tips/overflow.html
　http://web.archive.org/web/20040215182735/http://kobit.info/files/frame.html
overflowを用いた擬似フレーム
　http://www.fromdfj.net/html/overflow.html
レイアウトサンプル擬似フレーム
　http://www.rju666.com/web/layout/imitate_frames.html

Q6:画面中央に配置するにはどうすれば？
A6:左右（水平方向）のセンタリングはA2に既出。垂直には色々な方法があります。
　「スタイルシート縦中央(垂直中央)」参照のこと。
　http://chaichan.hp.infoseek.co.jp/qa3500/qa3558.htm
vertical-alignはテキストのみが対象だからブロックレベル要素を配置できません。

Q7:背景画像を二つ指定するにはどうすれば？
A7:CSS2.1ではbackground-imageは一要素に一つだけ。要素を重ねるなど工夫しましょう。
　もしくはCSS3を待ちましょう。

5 ：Name_Not_Found：2010/10/19(火) 15:48:10 ID:???

【FAQ】
Q8.dt・ddを横並びにしたいのですが。（会話文など）
A8.floatとmargin-leftの応用で。下記サイトを参照のこと。
「<dl> の整形」
　http://www.remus.dti.ne.jp/~a-satomi/nikki/2001/12b.html#d18n03

Q9.リンクした画像の線が消えません。
A9.img要素ではなくa要素をセレクタにしてborder指定してませんか？
a:link img, a:visited img, a:hover img {border:none;}
NN4は http://cssbug.at.infoseek.co.jp/detail/nn4x/b022.html 参照。
text-decorationの場合、親要素に設定された下線を子要素で解除できないのが正しい仕様です。
cf. http://cssbug.at.infoseek.co.jp/detail/winie/b040.html

Q10: リンクを新しいウィンドウで開かせるにはどうしたら？
A10: CSSではできません。target属性かJavaScriptでやって下さい。別窓が開くと迷惑に感じる人もありますからなるべくしない、がW3Cの方針です。

Q11. height:100%;としても高さが100%になりません。
A11. heightを%単位で指定するためには親要素の高さを明示的に指定する必要があります。下記サイトを参照のこと。
「height: n%;の正しい仕様」
　http://www.mozilla.gr.jp/standards/webtips/webtips0032.html

Q12: いままでHTMLでやってた××をCSSでやるにはどうすればいい？
A12: 下記をご覧あれ。テーブル・レイアウトは段組のFAQ（A3）を見なさい。
「いままでの HTML との対照」
　http://www.tg.rim.or.jp/~hexane/ach/fscs/fscsa1.htm
　http://www.tg.rim.or.jp/~hexane/ach/sfcs/sfcsa1.htm
　http://www.tg.rim.or.jp/~hexane/ach/tocs/tocsa1.htm
HTML でのレイアウト指定の、 CSS での指定との対応表
　http://deztec.sakura.ne.jp/x/01/tips/page/p0037.html

6 ：Name_Not_Found：2010/10/19(火) 15:49:24 ID:???

【参考】
　IEの position:absolute; のバグを利用した擬似フレーム

----------------------------------------------------------------

＊IEの position:absolute; のバグを利用した擬似フレーム

１．標準モードにする
２．body {height:100%; overflow:auto;}
３．fixしたいブロックを position: absolute; で指定

以下に示すようなハックを用いることにより、全ブラウザへの対応も可。

/* 全ブラウザに適用 */
#menu {position:fixed; display:block; top:100px; left:10px; width:130px; height:200px;}

/* IE6 のみ読み込む */
* html #menu {position:absolute; display:block; top:100px; left:10px; width:130px; height:200px;}

《実現例》
CSS frame emulation
http://www.stunicholls.myby.co.uk/menu/background2.html

7 ：Name_Not_Found：2010/10/19(火) 16:13:06 ID:???

【初心者向けの解説】
正しい知識を得たい人の爲のCSS2リファレンス
　http://hp.vector.co.jp/authors/VA022006/css/

【構文チェック】
W3C Markup Validation Service
　http://validator.w3.org/
W3C CSS Validation Service
　http://jigsaw.w3.org/css-validator/

【ブラウザのバグリスト】
CSSバグリスト＠CSSバグ辞典スレッド
　http://cssbug.at.infoseek.co.jp/

【仕様書】
CSS 2.1 Specification
　http://www.w3.org/TR/CSS21

8 ：Name_Not_Found：2010/10/19(火) 16:38:34 ID:???

次スレいらないって言ったじゃん

9 ：Name_Not_Found：2010/10/19(火) 17:46:57 ID:???

CSSは初心者スレじゃない質問スレだったときから
スレをなくそうとする工作員が多いけど何なの

10 ：Name_Not_Found：2010/10/19(火) 18:05:40 ID:???

IEが言う事聞かなくてイラついてるんじゃね？

11 ：Name_Not_Found：2010/10/19(火) 18:48:21 ID:???

イヤな人は入ってこなければいいだけのにね

12 ：Name_Not_Found：2010/10/19(火) 19:13:28 ID:???

>>1乙
>>8および前スレラストで無駄話してた奴らは今後立ち入り禁止

13 ：Name_Not_Found：2010/10/19(火) 19:57:22 ID:???

なんでこの板は分散したがる人が多いんだろう

14 ：Name_Not_Found：2010/10/19(火) 19:58:43 ID:???

DW の話題は禁止なの？

15 ：Name_Not_Found：2010/10/19(火) 20:07:45 ID:???

>>14
それは普通にソフトスレじゃね
DWで作ってようがエディタで作ってようが、CSSの話題ならいいけど

16 ：Name_Not_Found：2010/10/20(水) 17:45:01 ID:???

ie8にて、

<div style="overflow:scroll; width:200px; height:200px;">
　　<table>
　　　　略 ※tableの幅と高さが200pxより十分大きいとする
　　</table>
</div>

とすると、divのスクロールバーをいっぱいまで動かしても、
下は最後の行のセル内まで、
右は最後の列のセル内までのところでしかスクロールできず、
下と右のボーダーのあるところまで動けません。

これ、なんとか解決できないでしょうか...

17 ：Name_Not_Found：2010/10/20(水) 18:27:58 ID:???

>>16
標準モード

18 ：Name_Not_Found：2010/10/20(水) 18:41:25 ID:???

試した限り、ちゃんとボーダーまでスクロールするな
というわけで>>16のミス

19 ：Name_Not_Found：2010/10/20(水) 22:38:21 ID:???

通常、直接入力以外のひらがな入力とかの時って、未確定の文字列には下線が表示されますよね？
でも、google mapのルート検索のテキストボックスの「input#d_daddr」、「input#d_d」ではその下線が表示されません
これをCSSで表示可能にすることは出来ますか？

20 ：Name_Not_Found：2010/10/20(水) 22:39:56 ID:???

出来ます

21 ：Name_Not_Found：2010/10/21(木) 01:08:25 ID:???

>>20
どうやるんですか？教えてください＜（＿　＿）＞

22 ：Name_Not_Found：2010/10/21(木) 10:57:27 ID:???

>>18
すみません、tableのスタイルに、
position:absolute;
を指定すると表示されなくなるようです。
ただ、ちょっと特殊なことをやっていて上記は外せない。。。

23 ：Name_Not_Found：2010/10/21(木) 11:10:41 ID:???

なら諦めろよ
できないことはやるなというのがCSSの鉄則

24 ：Name_Not_Found：2010/10/21(木) 16:10:06 ID:???

>>22
position:absolute; いらなかったけどな

25 ：Name_Not_Found：2010/10/21(木) 18:45:18 ID:???

その前になぜtabeleが必要なのかdivじゃいかんの？

26 ：Name_Not_Found：2010/10/21(木) 18:47:55 ID:???

>>25
表をDivにする奴ってかなり無能だなと思うよ

27 ：Name_Not_Found：2010/10/21(木) 19:02:41 ID:???

表にしてるならまだしも
tabeleには普通じゃなくてもしない

28 ：Name_Not_Found：2010/10/21(木) 19:17:41 ID:???

あ、そうなの？正真正銘初心者なもので失礼しました。

29 ：無能：2010/10/21(木) 19:21:02 ID:???

だとするとオレのブログ全ての表をdivで作ってるから直さなきゃｗ

30 ：Name_Not_Found：2010/10/21(木) 20:45:34 ID:???

誤字の指摘をされたということに気付いてない人がいる？

31 ：19：2010/10/22(金) 00:07:12 ID:???

>>19の質問に答えてください
まさか「text-decoration: underline」で出来るんだよってオチじゃないですよね？

32 ：Name_Not_Found：2010/10/22(金) 01:13:58 ID:???

>>31
やってから家

33 ：Name_Not_Found：2010/10/22(金) 01:34:01 ID:???

>>19
で、何を使って下線消してるん？

34 ：Name_Not_Found：2010/10/22(金) 02:11:35 ID:???

行間異常フォントをブラウザの設定で指定してるに一票

35 ：Name_Not_Found：2010/10/22(金) 10:41:59 ID:???

>答えてください
何様

36 ：Name_Not_Found：2010/10/22(金) 15:40:56 ID:???

マスゴミっぽい口調だからマスゴミ様

37 ：19：2010/10/22(金) 15:54:51 ID:???

>>32
やりましたけど下線は出ませんでしたよ？

>>33
下線を消すなんてことしてませんが・・・orz

>>34
ブラウザの設定を初期の状態でgoogle mapを開きましたけど同じですﾌﾞﾜｯ
赤く囲った所（「ああああ」ってとこ）のテキストボックス（AとB）が問題点です
Aが未確定の文字列、B下が確定の文字列です
ttp://www.katsakuri.sakura.ne.jp/src/up47954.jpg

>>35
ごめんなさいﾌﾞﾜｯ

38 ：Name_Not_Found：2010/10/22(金) 15:57:20 ID:???

どうせメイリオでも使ってるって落ちだろ
行間が異常に広いから下線が隠れて見えてないだけ。inputの縦幅広げろ

39 ：Name_Not_Found：2010/10/22(金) 16:42:04 ID:???

>>37
俺の環境でのルート検索
上が確定、下が未確定
ttp://www.katsakuri.sakura.ne.jp/src/up47955.jpg

まず最低限の環境出せよ

40 ：19：2010/10/22(金) 17:20:51 ID:???

>>38
>>39
縦幅広げたらおｋですた！！
みんなありがとだお！！ヽ(ﾟДﾟ)ﾉ

41 ：16：2010/10/22(金) 23:50:35 ID:???

>>25
遅レスすみません。
純粋に、表形式でデータを表示するというtableを使うべくして使うシチュエーションなもので。

自己解決...とは言い切れ無いですけど、とりあえず見た目は解決しました。
tableのborderをnoneにしたら、セル下のボーダーまでスクロールするようになりました。。
なんだそりゃー。。。

たまたま共通仕様として、
tableは、border-collapse: collapse;
tableとtdはともに、border: 1px solid;
の見た目になっていますので、
tdのボーダーが表示されていれば全体の枠も表示されているようにみえる、
というなんか気持ち悪いものですが。

とりあえずクロスブラウザで確認して大丈夫だったのでヨシとします。
ありがとうございました。

42 ：Name_Not_Found：2010/10/23(土) 16:43:57 ID:???

５００ｘ５００の写真をwebに載せ、その写真をクリックするとthickboxで説明用のページを表示する
そんなサイトを予定しているんですが、実際にthickboxで動かすとうまくいかず新しいウインドウが強制的に開きます
また、元のページを見てもthickboxは真っ白でうまく作動していません

別ページでなく、普通に画像であればthickboxは正常にlightbox風に表示してくれています。

例：<a href="http://dailynews.yahoo.co.jp/fc/local/amami_heavyrainlashes/?1287765707" class="thickbox"><img src="1.jpg"/></a>
方法・参考サイトあればよろしくお願いします。

43 ：Name_Not_Found：2010/10/23(土) 16:50:16 ID:???

42です
?TB_iframe=true&width=800&height=500"を入れ忘れてました
すみません、自己解決しました

44 ：Name_Not_Found：2010/10/23(土) 16:55:38 ID:???

スレ違い

45 ：Name_Not_Found：2010/10/23(土) 16:56:04 ID:???

スレ違いスマソ

46 ：Name_Not_Found：2010/10/24(日) 17:25:18 ID:???

指定した要素以外の全てに適用、という書き方ってないですか？

なにがやりたいのか具体的に言うと
Stylishで、特定のIDが付いたdivブロック以外すべて非表示にしたいのですが

47 ：Name_Not_Found：2010/10/24(日) 17:26:41 ID:???

48 ：Name_Not_Found：2010/10/24(日) 17:55:48 ID:???

* { visibility: hidden; }
#特定のID { visibility: visible; }
でいんじゃない

49 ：Name_Not_Found：2010/10/24(日) 19:31:19 ID:???

>>47-48
どうもありがとうございました。

50 ：Name_Not_Found：2010/10/25(月) 20:52:27 ID:???

>>29の無能ですが
tableにすると、ブラウザのズームや縮小でレイアウトが壊れちゃうんですが
何かコツとかあるんですか？

divで表を作るように、thやtdにスタイルを細かく指定するんでしょうか？

51 ：Name_Not_Found：2010/10/25(月) 21:12:47 ID:???

幅の指定をブラウザ任せにしてるなら崩れることもあるだろう

52 ：Name_Not_Found：2010/10/25(月) 21:31:03 ID:???

tableの幅なら指定してるんですが・・・
もう少し弄ってみます。

53 ：Name_Not_Found：2010/10/25(月) 21:33:52 ID:???

情報を出せない、人には言えないような変なことしてるんだろ？
知らんがな

54 ：Name_Not_Found：2010/10/25(月) 21:41:15 ID:???

table-layout を指定してない落ち

55 ：Name_Not_Found：2010/10/25(月) 22:07:52 ID:???

>>54
知らなかった、何しろ無能なもんで、今から試してみます。

56 ：Name_Not_Found：2010/10/25(月) 22:24:06 ID:???

＞thやtdにスタイルを細かく指定するんでしょうか？
＞今から試してみます。

試してみればいいじゃない。
むしろ試してから書き込め。

57 ：Name_Not_Found：2010/10/27(水) 17:35:07 ID:???

CSSというか、Stylishの質問なんですけど、

<a href="～～">
　<img src="○○" alt="××" title="△△" />
</a>

とかってなってるときに、これを

<a href="～～">
　△△
</a>

みたいに置換することって、CSSでできます？

58 ：Name_Not_Found：2010/10/27(水) 19:16:36 ID:???

>>57
content プロパティ

59 ：Name_Not_Found：2010/10/27(水) 19:23:32 ID:???

>>57
javascript ならできるけど

60 ：Name_Not_Found：2010/10/27(水) 19:56:47 ID:???

>>56
遅レスゴメン

いや細かく指定するなら、divとあんまり変わらんなと思ったしだいで
勿論文字数はちょっとだけ少なくなって、縦横まとめて指定できるけど。

細かく指定すればズレなくなりましたが
毎回書き直す部分で見た目煩雑になるのは嫌なのでやめました。
お騒がせしました。

61 ：Name_Not_Found：2010/10/27(水) 21:33:42 ID:???

見た目で使い分けるなよ……

62 ：Name_Not_Found：2010/10/27(水) 22:05:30 ID:???

申し訳ない。
後々複数人で編集してもらおうと思っていて、
そこはオレ以上にCSSやHTMLに明るくない方が多いので
重要な部分はエクセル等で表に変換する予定ですが、その他はなるべくシンプルにしようかと

63 ：Name_Not_Found：2010/10/29(金) 10:45:00 ID:DLlmb3uw

ちょっと携帯向けに表を作りたくて、久しぶりにtableを使ってます。

細めのセルを作りたいのですが…
widthの値をどんなに小さくしても、携帯から見るとセルの幅が「全角1文字分」までしか縮まってません。

理想の幅
| |

現実
|　|

って感じです。(パソコンから見ると、理想どおりになってます)
これは仕様でしょうか。（auのCA002で見てます）
何か対策法はありますか？
特にcolspanなどは使っていません。

64 ：Name_Not_Found：2010/10/29(金) 10:55:45 ID:???

細いセル、ってだけでもうそれはテーブルの構造から外れてるんでない？
なら別の要素でもってやれば良い

65 ：Name_Not_Found：2010/10/29(金) 11:56:33 ID:DLlmb3uw

>>64
ありがとうございます。
早速試してみました。
しかし、divとかdt・ddとかulで試してみましたが、どうもfloatで横に並べることができないようで…

|あ|い|う|

としたくても、
|　　　　　　　　あ　　　　　　　　|
|　　　　　　　　い　　　　　　　　|
|　　　　　　　　う　　　　　　　　|

になります…。

66 ：65：2010/10/29(金) 13:36:07 ID:DLlmb3uw

さらに色々試してます。
どうやら、ブロック要素は丸々１列使ってしまうようですね。
画像を使って線を引く、というのも試みてみましたが、うまくいかず。（詰まりすぎなのか、携帯が表示してくれない）
あとはabsoluteが使えるかどうか…？

67 ：Name_Not_Found：2010/10/29(金) 14:09:37 ID:???

>floatで横に並べることができないようで
CSSの効かないキャリアだとしたらスレ違い
CSSの効くキャリアだとしたら何かの間違い

68 ：Name_Not_Found：2010/10/29(金) 14:28:30 ID:wSLaMvek

こんにちは。質問させて頂きます。
http://uproda.2ch-library.com/308331j9y/lib308331.jpg
この画像にあるグレーのボックス（上）は文字数に合わせて幅が自動で調整してくれるのですが
（下）の複行の場合はどうすれば自動調整になるのかがさっぱりわかりません。
http://uproda.2ch-library.com/308332bVX/lib308332.jpg
現状はこの画像の様なソースになっております。

<div>
<span>
<span>
</div>
ではうまく表示されません。どうかご指導宜しくお願い致します。

69 ：Name_Not_Found：2010/10/29(金) 14:32:20 ID:???

なんでそういう見掛けだけのことやりたがるかな・・・
ボックス2つ重ねで内側ボックスをfloatで灰色に、外側ボックスはそのままボックス

70 ：Name_Not_Found：2010/10/29(金) 14:37:18 ID:???

>>68
インラインとブロックの違いだわな

71 ：Name_Not_Found：2010/10/29(金) 14:45:54 ID:wSLaMvek

<div>
<div style="float:right;background-color:#d0d0d0;">
文章<br>
文章
</div>
</div>
<br clear="all">

>>69
これで出来ました！綺麗に表示されています有難う御座いました。
>>70
勉強します！

72 ：63=65=66：2010/10/30(土) 03:51:24 ID:???

数時間調べ回って、ようやく原因に辿り着きました。

http://ke-tai.org/blog/2008/06/11/mawarikomi/
> auでfloatが利かない

http://34567.jpn.org/study1/css/width.html
> auではtable要素の幅は指定できますが、通常のブロックボックスの幅を指定することはできないようで、常に100%で表示されます。

au…

73 ：Name_Not_Found：2010/10/30(土) 09:10:10 ID:???

auに限らず携帯の仕様なんて糞だろ

74 ：Name_Not_Found：2010/10/30(土) 11:00:16 ID:???

>>72
自分もこないだauのfloatでやられた。
いまはドコモでえらいめにあっている。
先に携帯CSSの本を読んでおけばよかった。

75 ：Name_Not_Found：2010/10/30(土) 11:40:44 ID:RVM1KvXt

ｹｰﾀｲは未だにお馬鹿っていうかやっかいだからね
自分は書籍なしで
ほとんどネットですんでる
偉大なる宝庫　ネットに感謝

76 ：Name_Not_Found：2010/10/30(土) 12:11:48 ID:???

divとspanくらいしか使えないんだね

77 ：Name_Not_Found：2010/10/30(土) 12:13:24 ID:???

CSSで一番酷いのはiモードブラウザだろ・・・

78 ：Name_Not_Found：2010/10/30(土) 18:46:13 ID:???

初心者な質問なのですが、
CSS手打ちの場合、ツールは何を使用するのが一般的ですか？
メモ帳？ezhtml？Crescent Eve？･･･？

79 ：Name_Not_Found：2010/10/30(土) 19:40:16 ID:???

>77
今一番マシなのはｉモードブラウザ2.0
CSS2.0まではほとんど問題なく使える

その次がSoftBankの最新のブラウザ
position使用時の文字サイズ等、なんかバグらしきものが結構あるが概ね〇

>78
CSS程度メモ帳で十分

80 ：Name_Not_Found：2010/10/30(土) 19:46:48 ID:???

>>78
Crescent Eveよかったよ。
プレビューもタグチェックもしてくれるし。
ctrlやshiftとエンター押せば、閉じタグや改行入れてくれるし。

81 ：Name_Not_Found：2010/10/30(土) 20:00:16 ID:???

>>79,80
レス、ありが㌧。

82 ：Name_Not_Found：2010/10/31(日) 04:38:44 ID:6Q49bmZi

livedoorブログの本文の横幅を変更したいと思ってwidthをいじったら
レイアウトがぐちゃぐちゃになってしまいました。誰か教えてくれませんか？
シンプル（ブルー, 2カラム）の#contentのwidth:500px;を700pxに変更したい場合
他にどこを変更すればレイアウト崩れず変更出来ますか？

83 ：Name_Not_Found：2010/10/31(日) 10:23:42 ID:???

それで答えられる奴がいたらエスパー

84 ：Name_Not_Found：2010/10/31(日) 10:43:47 ID:???

#contentの幅を弄るなら
それを囲むタグは全部広げないといけないね

85 ：Name_Not_Found：2010/10/31(日) 21:38:28 ID:???

h1, h2{
color:#505050;
}

↑のように

.aaa{
color:#505050;
}
.bbb{
color:#505050;
}
<div class="aaa">あいうえお</div>
<div class="bbb">かきくけこ</div>

.aaaと.bbbに対して一度に指定することはできますか？

86 ：Name_Not_Found：2010/10/31(日) 21:39:48 ID:???

.aaa,.bbb {
color:#505050;
}
じゃないの？

87 ：85：2010/10/31(日) 22:03:04 ID:???

あー、すごい単純な事でしたｗ
ありがとうございます

88 ：Name_Not_Found：2010/11/01(月) 01:50:12 ID:???

divの領域にマウスを乗っけたとき、divの背景色を変えたいのですが

.aaa div:hover {
background-color:#ee0033;
}

.bbb {
width:280px;
height:10px;
}

<div class="aaa">
<div class="bbb">内容</div>
</div>

↑のようにやったらFirefoxなどではＯＫだったのですがIE6ではダメでした。
IE6でもスタイルシートで実現する方法はありませんか？

89 ：Name_Not_Found：2010/11/01(月) 02:49:02 ID:???

IE6はaでしかhover出来ない

90 ：Name_Not_Found：2010/11/01(月) 09:07:02 ID:???

>>85
すごく最近見た覚えがあるんだけどこの質問

91 ：Name_Not_Found：2010/11/01(月) 14:40:08 ID:???

.container {
height: auto;
width: 600px;
border: thin solid #000;
}
.c-left {
height: auto;
width: 200px;
margin: 3px;
border: thin solid #000;
position: absolute;
float: left;
clear: both;
}
.c-right {
height: auto;
width: 370px;
border: thin solid #000;
margin: 3px 3px 3px auto;
float: none;
clear: none;
}
<div class="container">
<div class="c-left">AAA</div>
<div class="c-right">111</div>
<div class="c-left">BBB</div>
<div class="c-right">222</div>
<div class="c-left">CCC</div>
<div class="c-right">333</div>
</div>
幅600pxの表みたいなものを作りたいのですが、これだとIEだと崩れ、
FirefoxだとAAAとBBBの間に変なスペースが出来ます。どうして；；

92 ：Name_Not_Found：2010/11/01(月) 15:21:29 ID:???

370+200=600になるんだ

93 ：Name_Not_Found：2010/11/01(月) 15:27:27 ID:???

c-leftのマージン左右3pxとc-rightのマージン右3px
あとボーダーの厚みthin(2px?)が4本…
それで適当に余裕持たせて370にしたんですけどぴったりのほうがいいんですか？

94 ：Name_Not_Found：2010/11/01(月) 17:57:26 ID:???

>>91
position: absolute; って必要なのかな？

95 ：Name_Not_Found：2010/11/01(月) 21:19:17 ID:???

table　で作ったら？

96 ：Name_Not_Found：2010/11/01(月) 22:00:52 ID:???

>>91
ttp://airrat.blog103.fc2.com/blog-entry-392.html
このあたりは？

97 ：Name_Not_Found：2010/11/01(月) 22:49:16 ID:???

>>96
縄文時代から掘り出してきた情報出されても・・・・

98 ：Name_Not_Found：2010/11/01(月) 22:52:23 ID:???

>>81
IEのバージョン書いて。
.c-leftのposition: absolute;が謎だったので削除。

.container {
padding-bottom: 3px;
width: 600px;
border: thin solid #000;
}
.c-left {
float: left;
clear: both;
margin: 3px 3px 0;
width: 200px;
border: thin solid #000;
}
.c-right {
margin: 3px 3px 0 auto;
width: 370px;
border: thin solid #000;
}

99 ：98：2010/11/01(月) 22:53:08 ID:???

アンカ間違えた(´･ω･`)
× >>81
○ >>91

100 ：Name_Not_Found：2010/11/01(月) 22:53:19 ID:???

いや>>91がそこの「やってはいけないこと」だらけだったので

101 ：Name_Not_Found：2010/11/01(月) 22:54:20 ID:???

ってか、ここはマジレス禁止なのか
普通に>>91のやろうとしてることdlで簡単にできるよな
div厨だから遊んでる？

102 ：Name_Not_Found：2010/11/01(月) 22:59:04 ID:???

>>101
そう思うならソースを書いてあげなよ

103 ：Name_Not_Found：2010/11/01(月) 23:04:04 ID:???

>>101
書いてることが全てじゃないでしょ

104 ：Name_Not_Found：2010/11/01(月) 23:40:41 ID:???

divがむちゃくちゃ多いサイトってoperaじゃエラー吐くことが多いわ
おいらも、その理由を追求してからdivは使わなくなったわ
operaがマイナーだけど狐やIEがそれらを補正してるとしたら
それぞれの解釈の違いで表示が狂うのが当たり前
ブラウザ依存のcssになっちゃうよね

105 ：Name_Not_Found：2010/11/01(月) 23:42:59 ID:???

> divがむちゃくちゃ多いサイトってoperaじゃエラー吐くことが多いわ
Opera使ってるけど全然エラー出ませんが・・・
でもdiv厨はしね

106 ：Name_Not_Found：2010/11/01(月) 23:48:04 ID:???

IEで大崩壊して終了

107 ：Name_Not_Found：2010/11/02(火) 00:10:52 ID:???

>>104
できれば追求した理由をｋｗｓｋ

108 ：Name_Not_Found：2010/11/02(火) 01:57:09 ID:???

>>105
div厨に親でも殺されたん？div厨なんて放っておけばいいのに

109 ：Name_Not_Found：2010/11/03(水) 22:08:03 ID:???

文字がくっきり表現されている画像をそのままのサイズで使用したいので
すが、ブラウザで閲覧すると画像が 10% ほど拡大され、画像内の文字が
不鮮明になってしまいます。Firefox でのみ問題が発生し Chromium と
IE では問題ありません。css の設定で解決できますでしょうか?

==> test.html <==
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link href="hoge.css" rel="stylesheet" type="text/css" media="screen" />
<title>hoge</title>
</head>
<body>
<div id="hoge"></div>
</body>
</html>

==> hoge.css <==
#hoge {
width: 750px;
height: 400px;
background: url('a.png') no-repeat;
}

[user@host html]$ file a.png
a.png: PNG image data, 750 x 400, 8-bit/color RGBA, non-interlaced

110 ：Name_Not_Found：2010/11/03(水) 22:15:30 ID:???

>>109
firefoxの[表示]→[ズーム]→[リセット]

111 ：Name_Not_Found：2010/11/03(水) 22:46:46 ID:???

>>110
ありがとうございます。解決しました。
やっぱりクライアントの問題だったのか。
半日もハマってしまった。。。

112 ：Name_Not_Found：2010/11/10(水) 22:06:49 ID:???

CSSでメインのコンテンツとメニューを並べ、ページの一番下にフッターを配置しています。
JavaScriptでページのリロードを発生させずに中身の書き換えを行った際、
最初に表示されているものよりも書き換えたコンテンツの高さが高かった場合、
フッターの上にコンテンツが表示されてしまいます。

IE8では再計算してコンテンツの後にフッターを持ってきてくれるんですが、
Firefoxでは上記の通りフッターの位置は変わらず、その上にコンテンツが描画される状態です。
こういう場合、フッターの位置を動的に変えられるような書き方はCSSのみでは無理でしょうか。

bodyなんかをheight:100%にして任意に割り振るやり方もあるようなのですが、
ページの更新が無いと動いてくれないようです。

113 ：Name_Not_Found：2010/11/11(木) 11:33:51 ID:???

ひとつ聞きたい。
それが「CSS」の「初心者」の質問だと思うか？
js使ってるんだったらjsスレで聞けばいいとおもう。

114 ：Name_Not_Found：2010/11/13(土) 14:33:52 ID:???

http://www.adobe.com/jp/special/creativesuite/portal/guides/designtoweb_main.html
ここを参考にweb作成を試みています。（Dreamweaver CS4）
上記サイトの05-1に従ってDIV内DIVを追加し、08-3の要領で整列位置を決めようとしたのですが、
親DIVまで一緒に移動してしまいます。（DIV内DIVで指定したmargin Topのピクセル分下方に）
親DIVはそのままに、内包DIVだけ位置移動する方法をご教示願います。

115 ：Name_Not_Found：2010/11/13(土) 14:52:19 ID:???

どう書いたのさ?

116 ：114：2010/11/13(土) 15:43:44 ID:???

</head>
<body
<div align="center">
<div class="top">
<div class="text"> 「リード文章」○○○○○○○○○○○○○○○○。</div>
</div>
</div>
</body>
</html>

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
.top {
height: 500px;
width: 950px;
background-image: url(images/top.jpg);
background-repeat: no-repeat;
clear: both;
}
.text {
width: 200px;
font-family: "フォント名;
font-size: 8pt;
line-height: 150%;
color: #333;
text-align: justify;
}

こんな感じです。
あと前述参考URLの指示どおり、サイト全体をhtml側で「<div align="center">」でセンタリング
したせいなのか左右の位置設定もままなりません。（ブラウザごとに位置が大きく異なる）

117 ：Name_Not_Found：2010/11/13(土) 16:25:40 ID:???

う～む　これが噂の・・・

118 ：Name_Not_Found：2010/11/13(土) 16:40:48 ID:???

何をどうしたいのかさっぱり

119 ：Name_Not_Found：2010/11/13(土) 17:48:56 ID:???

エスパーが来い

120 ：Name_Not_Found：2010/11/13(土) 18:38:37 ID:???

>>116
text-align: justify; は実装依存。全てのブラウザで同じ位置にすることはCSS2レベルでは出来ない。
CSS3 の text-justify あたりで可能かもしれないので、調べてみると良いかも。

121 ：Name_Not_Found：2010/11/15(月) 09:43:08 ID:???

>>116
・text-justifyを指定してない。（してても対応できるのはIEだけだが）
ttp://www.htmq.com/style/text-align.shtml
・なんでもかんでもdivではなくテキストにはｐとか使え。
・「<div align="center">」はなんで
　.top { margin:0 auto; }
　にしないの？

122 ：Name_Not_Found：2010/11/15(月) 13:14:22 ID:???

GoogleChromeに対して文章の両端揃えがしたく、

.a{
text-align:justify;
text-justify:inter-ideograph;
word-break:break-all;
word-wrap:break-word;
margin:0px;
padding:0px;
width:500px;}
------------------------
<p class="a">
文章
</p>

こうやっているのですが、綺麗に両端に揃ってくれません。
(IEやFirefoxでは揃ってくれるのですが)

他に何か、いい方法やプロパティってないのでしょうか・・・？

123 ：Name_Not_Found：2010/11/15(月) 23:01:22 ID:3SRtrVQc

Cygwin使っている人いますか？その20
http://hibari.2ch.net/test/read.cgi/unix/1268282846/

272 名無しさん＠お腹いっぱい。 [sage] 2010/11/15(月) 11:42:30 ID: Be:
マウントオプションとは別に、CRLFをLFに変換するツールはないでしょうか？

美乳セーラー女子高生とSEX顔射フィニッシュ

というコマンドやnkfでも一応可能なのですが
専用のツールはなかったかと思いまして

273 名無しさん＠お腹いっぱい。 [sage] 2010/11/15(月) 11:43:21 ID: Be:
>>272
コピペミスった、、、、、
見なかったことにしてください

コマンドは、

cat crlf.txt | tr -d '\r' > lf.txt

です。

124 ：Name_Not_Found：2010/11/16(火) 01:35:07 ID:???

>>123
いくら匿名2chとは言え悶死レベルのミスだなｗ

125 ：Name_Not_Found：2010/11/16(火) 17:45:01 ID:???

CSSによって、a[target="_blank"]を無効にするにはどのようにすればよいのでしょうか。

126 ：Name_Not_Found：2010/11/16(火) 17:47:59 ID:???

CSSじゃ無理だわな

127 ：Name_Not_Found：2010/11/16(火) 20:02:19 ID:???

CSS＝デザイン　まずこれ覚えような

128 ：Name_Not_Found：2010/11/16(火) 20:13:35 ID:???

新窓無効にするのはブラウザの仕事だ

129 ：Name_Not_Found：2010/11/16(火) 22:27:02 ID:???

>>126
無理なんですか。残念です

>>127
>>128
target="_blank"
はCSSで指定するんじゃなかったんでしたっけ？だから出来ると思ったんです

130 ：Name_Not_Found：2010/11/16(火) 22:44:42 ID:???

HTMLで指定するんです

131 ：Name_Not_Found：2010/11/16(火) 22:59:06 ID:???

まずお礼を言いましょう

132 ：Name_Not_Found：2010/11/16(火) 23:55:42 ID:???

>>130
なるほど。HTMLでしたか

>>131
すみません、失礼でしたね、申し訳ございません

みなさんご返信ありがとうございました。

133 ：Name_Not_Found：2010/11/17(水) 00:20:25 ID:???

うむ

134 ：Name_Not_Found：2010/11/17(水) 05:33:52 ID:???

よしじゃあパンツを脱げ

135 ：Name_Not_Found：2010/11/17(水) 08:01:16 ID:???

　　　　 (⌒⌒)
　∧_∧ ( ブッ )
（･ω･`) ﾉノ～′
　 (⊃⌒*⌒⊂)
　　/_ノωヽ_)

136 ：Name_Not_Found：2010/11/19(金) 11:46:35 ID:o+ff3YwJ

「薬師丸ひろ子」って言おうとして、
ついうっかり「よく締まるアソコ」って
言ってしまうことは誰にもよくあるが、
俺の場合「尾道」って書こうとして
「尿道」って書いてしまったことがある。

137 ：Name_Not_Found：2010/11/19(金) 13:40:23 ID:Xpqo/Jan

もしここじゃない場合はすみません。

罫線(┗┃┓)を使って組織図みたいなのを書いているのですが、
その罫線の横に<input>などがあると罫線どうしの間がひらいてしまって
格好悪くなるのですがなにか組織図を表現する良い方法はないでしょうか？
┏a
┣b
┗c

138 ：Name_Not_Found：2010/11/19(金) 13:49:51 ID:???

┗┃∵┃┓

139 ：Name_Not_Found：2010/11/19(金) 14:54:04 ID:???

>>137
罫線ぽい背景画像使うのはどう？右方向と下方向の線は余裕を持って長めにしておく。
はみ出た部分は、重ねるか隠すかすればいい。

140 ：Name_Not_Found：2010/11/19(金) 19:21:34 ID:Xpqo/Jan

>>139
ん・・・。そうですか。
ありがとうございます。

141 ：Name_Not_Found：2010/11/19(金) 21:08:04 ID:???

ワードで書いて画像化。それをHTML画面にはめ込むのが簡単。

142 ：Name_Not_Found：2010/11/22(月) 16:21:46 ID:???

IE8でDOCTYPEがあるとマーカの大きさがバラバラになります。環境によるものでしょうか？
DOCTYPE付けたまま治す方法教えてください。

<ul>
<li>1</li>
<li style="list-style-type: circle;">1</li>
<li style="list-style-type: square;">1</li>
</ul>

143 ：Name_Not_Found：2010/11/23(火) 10:32:15 ID:???

そりゃ違うマーク割り当てれば大きさ違うのは当たり前でしょうに。

144 ：Name_Not_Found：2010/11/23(火) 12:34:09 ID:???

大きさを揃えたいなら画像にすりゃええ

145 ：Name_Not_Found：2010/11/23(火) 12:44:23 ID:???

IEの標準モードで描画したときだけ大きさがぐちゃぐちゃになるっぽいね
何でやろ

146 ：Name_Not_Found：2010/11/23(火) 15:18:29 ID:???

>>142
http://www.w3.org/TR/css3-lists/#glyphs
CSS3の仕様

147 ：Name_Not_Found：2010/11/25(木) 20:03:07 ID:???

CSS の仕様書読んでたんですが、px って relative unit なんですか？
computed value を計算するときいったんインチか何かに変換して、レンダリングするときまたピクセルに戻すんですか？
マヂで？

148 ：Name_Not_Found：2010/11/25(木) 21:32:41 ID:???

>>147
px は dpi によってサイズが変わるから相対値。

149 ：Name_Not_Found：2010/11/25(木) 22:41:54 ID:???

しかし実質的には絶対値

150 ：Name_Not_Found：2010/11/25(木) 23:02:29 ID:???

dpi を変更しない人にとっては絶対値といえなくもないか…

151 ：Name_Not_Found：2010/11/26(金) 16:55:53 ID:???

HTMLタグびっしりのソースが汚すぎるページを独学で作っていたのですが
CSSというのでスッキリ出来ると聞きました。

(´･ω･)何から始めたら宜しいでしょうか･･･オススメページや、サイト作成に役立つEDITツールなんてありますか？

152 ：Name_Not_Found：2010/11/26(金) 17:08:15 ID:???

>>151
CSSでググるとたくさんあるよ
こんなのとか
http://cssstyle.net/

HTMLタグ打てるならネットでわからないとこググれば大抵解決すると思う
フリーのCSSテンプレートをダウンしてソース見るなりいじってみるといいよ
ツール類はHTMLエディタでググるとこれもいろいろ
おいらHTMLProject2使ってます

153 ：Name_Not_Found：2010/11/26(金) 21:48:45 ID:???

>>151
いきなりスッキリしようとしないで、できるところから切り替えていけばいい。
たとえば、bodyタグに指定していた背景画像を background-image に替えるとか。

ただ、道を踏み外すとHTMLがdivだらけになるので、それだけは気をつけて。

154 ：Name_Not_Found：2010/11/26(金) 22:04:42 ID:???

DIVだらけの何が悪い？

155 ：Name_Not_Found：2010/11/26(金) 22:15:53 ID:???

デザインの為だけに必要のないdivを作りすぎるなって事じゃない？

156 ：Name_Not_Found：2010/11/26(金) 22:28:42 ID:???

そのデザインを作るのにdivしかなければdivだらけでもいいんじゃね？

157 ：Name_Not_Found：2010/11/26(金) 22:31:51 ID:???

>>156
>>155 と同じ内容を発言しているのに気が付いてる？
必要か不要かの判断材料には触れてないようだけど

158 ：Name_Not_Found：2010/11/26(金) 23:32:46 ID:???

こまけえことは（ｒｙ

159 ：Name_Not_Found：2010/11/26(金) 23:42:36 ID:???

>>157
俺には逆のことを言っているように見えるが？

160 ：Name_Not_Found：2010/11/27(土) 00:09:20 ID:???

>>159
・O のために不要な P をするな
・O のために必要な P をしてもよい

両者は同じだと思うけど

161 ：Name_Not_Found：2010/11/27(土) 00:18:39 ID:???

対偶法だな

162 ：Name_Not_Found：2010/11/27(土) 00:44:00 ID:???

深読みしすぎたっぽい？
・デザインの為だけに（内容を記述するのに）必要のないdivを作りすぎるなって事じゃない？
・そのデザインを作るのにdivしかなければ（デザインのためだけの）divだらけでもいいんじゃね？
そいでもって「作りすぎるな」が「無駄/必要」の境目に対してでなく、人間の感覚（例：5つ以上etc）に対してと考えたからずれた。

163 ：Name_Not_Found：2010/11/27(土) 00:48:57 ID:???

だいたいだね
「DIVだらけ｝って１ページでいくつDIVきった状態なんだよ　え？
あいまいだなぁ

164 ：151：2010/11/27(土) 00:56:06 ID:???

>>152 >>153
レス有難う御座います。頂いたアドバイスをスキルアップに役立たせて頂きます(*´ω｀*)
参考ページとツールの方もありがとうございます！

165 ：Name_Not_Found：2010/11/27(土) 07:59:32 ID:???

そもそもマークアップ以外の用途で要素を使うのはどうかと

166 ：Name_Not_Found：2010/11/27(土) 11:46:53 ID:???

>164 参考に他の人のサイト見たり、自分で作ったやつの微調整を試すのにFirebugもおすすめ。

167 ：Name_Not_Found：2010/11/27(土) 18:35:06 ID:???

おまえら「div病」でググって落ち着け

168 ：Name_Not_Found：2010/11/27(土) 19:18:33 ID:???

Firefoxだと
border-collapse:collapse;
としても線が太くなったりする箇所が出てくるんですが、これは防ぐ方法あるんでしょうか？

169 ：Name_Not_Found：2010/11/27(土) 20:00:42 ID:???

俺は、自分のは太くありたいね

170 ：Name_Not_Found：2010/11/28(日) 03:46:42 ID:???

>>168
テーブルの話です。
書き忘れてました、すいません。

171 ：Name_Not_Found：2010/11/28(日) 10:05:16 ID:???

divボックスを造りその中に文章を流し込んだところ、ブラウザで見た際に
文章の最上部（ボックスの上辺）に文章がオーバーフローしたかのような
文字列の下部（？）に見えるものが点在します。
実際に文章がボックスからはみ出ているわけではないのですが、原因が判
りません。回避法を教えてください。

172 ：Name_Not_Found：2010/11/29(月) 19:43:25 ID:???

＞文字列の下部（？）に見えるもの
文字が重なってるって事か？　ようわからんがline-heightは？
てかhtmlもcssも書かないで状況もあいまいで解決しろってのが無理があるぞ。

173 ：Name_Not_Found：2010/12/03(金) 07:08:23 ID:???

position: relative
left: 90px
bottom:-16px

などで、画像の位置を調整していると、ブラウザや解像度の違いで
ずれが出てしまいました。

ずれないやり方を教えてもらえないでしょうか？
もしくは、positionは使わないほうがよいのかな。

174 ：Name_Not_Found：2010/12/03(金) 12:26:24 ID:???

うん、使うなｗｗｗｗｗｗ

175 ：Name_Not_Found：2010/12/03(金) 12:30:18 ID:???

position使わないなぁ
大体marginで足りる

176 ：Name_Not_Found：2010/12/03(金) 18:19:25 ID:???

>>173
場合によって寸法が伸張しないなら大本にrelativeでその中はabsolute
でもpxが解像度に依存するもの、しなかったら余計にレイアウト崩れると思うｗ

177 ：Name_Not_Found：2010/12/03(金) 19:32:27 ID:???

日本語でおｋ

178 ：Name_Not_Found：2010/12/03(金) 22:02:18 ID:???

>>173
IEのBugかもしれない
position: relative　で検索したらトラブル例と対応策がいっぱいでるよ

179 ：Name_Not_Found：2010/12/03(金) 22:55:08 ID:5bu5x7cM

CSSとCoDシリーズはどっちの方がスペックいるの？

180 ：Name_Not_Found：2010/12/03(金) 23:06:28 ID:5bu5x7cM

やっぱりいいです

181 ：Name_Not_Found：2010/12/04(土) 09:43:13 ID:???

「ガチナンパ！素人さんにお願いしまくって生パン見せてもらった後に
マンコキまでさせてもらっちゃいました。 PART.2」に出てくる
ジーンズ生地のスカートに紫のブラジャーをしている女優さんは
誰でしょうか？宜しくお願い致します。

http://www.dmm.co.jp/digital/videoa/-/detail/=/cid=h_021nps00067/

182 ：Name_Not_Found：2010/12/06(月) 11:34:10 ID:???

>>3
このサイトリンク切れしてる

CSSを用いた段組の作成のコツ
http://www.fromdfj.net/html/column.html

183 ：Name_Not_Found：2010/12/07(火) 15:46:25 ID:VSzXP+M3

cssと印刷の関係について質問です。

<ul><li id="link">menu1</li><li …って感じでcssでメニューをつくるとき、
リンクボタンの画像をbackground-imageで指定した場合、印刷しても該当画像が表示されませんよね？

どうやったら表示できるようになりますか？
画像を<img src="....という風にスタイルシート使わない形で指定した印刷用ページを作るしかないですか？
それがいわゆる「印刷用ページを開く」って奴でしょうか？
他にもっと楽に実現する方法ないでしょうか？

184 ：Name_Not_Found：2010/12/07(火) 18:13:29 ID:???

>>183
出ないのはプリンタの設定でスレチ

185 ：Name_Not_Found：2010/12/08(水) 21:39:03 ID:mhE7UnDT

[html]

<div id="main">
<div id="navi">
<div class="navi-previous">
前のページへのナビ
</div>
<div id="navi-next">
次のページへのナビ
</div>
</div>
<h1 id="page-title">タイトル</h1>
</div>
<div id="menu">
サイドバー
</div>

[css]

#main,.navi-previous { float: left; }
#menu.navi-next { float: right; }
h1#page-title { clear: both; }

上記のように書くと、firefoxで#naviの上に余白が生じてしまいます（ＩＥでは無し）
ググった結果、#naviに display: inline;　を指定すると直ることがわかったのですが
なんだか気持ち悪いです。
display : inline; を使わずに余白を消すことはできないのでしょうか。

186 ：185：2010/12/08(水) 21:47:27 ID:mhE7UnDT

すみません書き忘れです。
#navi-previous , #navi-next { width: 50%; }

187 ：Name_Not_Found：2010/12/08(水) 22:26:24 ID:???

>>185
#naviのスタイルは？

188 ：185：2010/12/08(水) 22:32:24 ID:mhE7UnDT

すみません忘れてました。
#navi { margin-bottom: 20px; }

しかしこのマージンがなぜかききません。この解決方法も教えていただきたいです。

189 ：Name_Not_Found：2010/12/08(水) 23:16:21 ID:???

>>188
#naviの子要素がすべてfloatだから。
float要素は親要素に対して高さを持たない。
だから子要素が全部floatだとその要素の高さは0になる。
必要な高さをheightで指定してやれ。

>>185
余白ってのはわからんな。半角スペースでも入ってんじゃね？

190 ：Name_Not_Found：2010/12/09(木) 13:46:59 ID:???

>>185　CSS一番上に* {margin:0; padding:0;} 入れても無理？

191 ：Name_Not_Found：2010/12/09(木) 13:58:16 ID:7S76tLIq

border-radiusをかけたブロックの上にborderで線を引くとchromeで
おかしな表示になってしまうのですが、対処法はないでしょうか？
firefoxではこの現象は起きません。ソースは以下な感じです

<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><style type="text/css">
#container {
width: 700px; height: 50px; background-color: #ccc;
border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
}
#box {
border-left: 30px solid #f00;
border-radius: 10px 10px 0 0;
-webkit-border-radius: 10px 10px 0 0;
-moz-border-radius: 10px 10px 0 0;
}</style></head>
<body><div id="container"><h1 id="box">←何故か上部にradiusのbottomが適用される</h1></div></body></html>

192 ：Name_Not_Found：2010/12/09(木) 14:28:52 ID:???

接頭辞ついてるもんをサイト上で使うなよ……

193 ：185：2010/12/09(木) 17:24:01 ID:246im6WG

>>189
heightを指定して無事marginがききました！　ありがとうございました。
余白の正体はわかりませんでした。気持ち悪いですが、
display: inline;で対処することにしました。

>>190
既に指定してあります。display: inline;で問題無いようなのでこれでいきます。
ありがとうございました。

194 ：Name_Not_Found：2010/12/10(金) 07:46:00 ID:???

CSSで「または」って言う意味を表すことって出来ませんか？
「co.jp|com|org」みたいな感じに

195 ：Name_Not_Found：2010/12/10(金) 10:35:11 ID:???

>>194
何をどうしたいか具体的にわからんが
同じ内容を複数同時に定義したいなら,で区切る。
.hoge,
.foo,
.piyo { background:#fcc; }
これでクラスがhogeとfooとpiyoの要素は背景が#fccになる。
それ以上がやりたいならjQueryさんに頼め。

196 ：Name_Not_Found：2010/12/10(金) 10:39:02 ID:???

>>193
FirefoxのFireBag使えば
どの要素で何の空白が出来てるかわかるだろうから調べてみ。

197 ：Name_Not_Found：2010/12/10(金) 13:46:27 ID:???

ファイアバッグ

198 ：Name_Not_Found：2010/12/10(金) 15:06:10 ID:???

あ、ホントだバッグになってるｗ
すまんｗ　FireBugね

199 ：194：2010/12/11(土) 20:20:49 ID:???

>>195
レスありがとうございます

具体的にやりたいことは、たとえば
http://www.yahoo.co.jp　と　http://www.yahoo.com のリンクを同時に非表示にしたいとします
このとき通常ならば、
a[href="http://www.yahoo.co.jp"]
,a[href="http://www.yahoo.com"]
{ display:none; }
と記述しますが、これを
a[href^="http://www.yahoo."][href$="co.jp|com"]
{ display:none; }
こんな感じに表記したいのです

実際には「|」は使用できないみたいなので上記では動作しないのですが、これに代わる記述法がございましたらお教えください。

200 ：Name_Not_Found：2010/12/11(土) 22:54:22 ID:???

,で2つ入れれ

201 ：Name_Not_Found：2010/12/12(日) 00:10:00 ID:???

javascriptでやれ

202 ：194：2010/12/12(日) 00:31:18 ID:???

＞,で2つ入れれ
a[href^="http://www.yahoo."][href$="co.jp,com"]
こういうことでしょうか？これでも動きません・・・

>>201
CSSでは「または」の表記はどうするのかなと疑問に思いまして。

203 ：Name_Not_Found：2010/12/12(日) 00:43:24 ID:???

>>195

204 ：194：2010/12/12(日) 00:48:42 ID:???

>>203
>>202で
a[href="http://www.yahoo.co.jp"]
,a[href="http://www.yahoo.com"]
と書いたのですが・・
この記述法以外の方法をお尋ねしているのですが・・

205 ：Name_Not_Found：2010/12/12(日) 01:35:28 ID:???

>>204
で、何を聞きたいの？

206 ：194：2010/12/12(日) 03:07:13 ID:???

>>205
ですから、CSSで「または」って言う意味を表す語句はなんですか？と最初からお尋ねしているのですが。

207 ：Name_Not_Found：2010/12/12(日) 06:56:04 ID:???

>>195を最後まで読め

208 ：Name_Not_Found：2010/12/12(日) 11:09:26 ID:QyA57snE

>>194
どうしてこう日本語が通じないのか・・・
「,」区切りでは思ったように動作しなかったって事なんだろ？
だったら>>195に書いてある通りJavaScript使え
もしくは目的のリンクに全部同じクラスを振れ。

209 ：Name_Not_Found：2010/12/12(日) 12:14:25 ID:???

>>194,199
"," がまさに「または」を表しているわけだが、あなたの期待する動作は「属性セレクタの属性値でOR演算子が欲しい」というところだろうか。
CSSセレクタには正規表現のような仕組みはない。
http://zng.info/specs/css3-selectors.html

210 ：194：2010/12/12(日) 22:09:23 ID:???

>>207-209
(ﾟ△ﾟ)!!
言われてみれば「,」がまさしく「または」の意味を持ちますね
希望通りの「または」の動作をしないのでつい・・失礼しました。

CSSでは私の思う通りの動作を行うことが出来ないと言うことで諦めます
みなさんありがとうございました。

211 ：Name_Not_Found：2010/12/12(日) 22:28:42 ID:???

","は「または」じゃないだろ「アンド」だ。

212 ：Name_Not_Found：2010/12/12(日) 22:40:34 ID:???

>>211
"," が AND なら「p要素かつ class="hoge"」は

p, .hoge { color: red; }

で表せなければならない。

213 ：Name_Not_Found：2010/12/13(月) 16:42:45 ID:???

>>212
>>211がカタカナで書いた意味を考えるといいんじゃないかな

214 ：Name_Not_Found：2010/12/13(月) 18:35:46 ID:???

>>213
さっぱりわからん。
「または」でもなく AND でもなく「アンド」に特別な意味がある…？

215 ：Name_Not_Found：2010/12/13(月) 18:51:51 ID:???

まぁ「または」でも「あんど」でもないのは明白
単に箇条書きだってば

216 ：Name_Not_Found：2010/12/13(月) 19:07:23 ID:???

>>214
「AND」は「且つ」って意味でしょ？
そうじゃなくて「と」っていう意味で言いたかったから>>211はカタカナにしたんだと思うんだけど

217 ：Name_Not_Found：2010/12/13(月) 19:12:27 ID:???

何その屁理屈
または、でいいだろ……

218 ：214：2010/12/13(月) 19:25:31 ID:???

あー、論理学的な意味で AND を用いたわけではなかったのか。
「論理和」や「論理積」でぐぐってほしい。
>>194 の「または」は「論理和」を指していると思われる。(「論理和」「OR」「または」は全て同じ意味)
http://ja.wikipedia.org/wiki/%E8%AB%96%E7%90%86%E5%92%8C

>>216
その解釈だと "「または」じゃない" と矛盾しないか？
「と」は「または」と同義だと思うのだが…。

219 ：Name_Not_Found：2010/12/13(月) 19:31:23 ID:???

and　と
or　または
,　　区切り

220 ：Name_Not_Found：2010/12/14(火) 06:57:52 ID:???

body {
width: 700px;
margin-right: auto;
margin-left: auto;
}
として、bodyが真ん中に来るようにしてたんですが、
頭と尻の部分に横幅いっぱいの画像をいれるため、

bodyに
background: url(foo.jpg) no-repeat top center;
addressに
background: url(bar.jpg) no-repeat bottom center;
とやったら、address要素がbody要素の幅を継承しちゃって700pxの背景になってしまいます
bodyの横幅を継承しないようにする方法はありますか？

221 ：Name_Not_Found：2010/12/14(火) 07:59:54 ID:???

>>220
addressがbodyの内側にあればそりゃそうなるでしょうよ

222 ：Name_Not_Found：2010/12/14(火) 08:11:15 ID:???

>>221
『継承しない』って書き方はないってことっスか？

223 ：Name_Not_Found：2010/12/14(火) 08:12:26 ID:???

bodyは幅100%にして
中に幅700pxのdivを入れれ

224 ：Name_Not_Found：2010/12/14(火) 08:15:15 ID:???

>>223
代案をだすってことは、ないってことっスかね？

225 ：Name_Not_Found：2010/12/14(火) 09:52:58 ID:???

>>220
継承もなにもaddressはブロックレベルでしょ
だったら幅指定がない限り100％（＝親要素と同じ）になるのが普通なんじゃね？

<div id="Container">
　<div id="SiteWidth">
　　<address>--</address>
　</div>
</div>

body { background: url(bar.jpg) no-repeat bottom center; }
#Container { background: url(foo.jpg) no-repeat top center; width:100%; }
#SiteWidth { width:700px; margin:0 auto; }

226 ：Name_Not_Found：2010/12/14(火) 09:59:44 ID:???

>>225
親の幅におさまるのが普通だからこそ親の幅無視できる方法ねーの？ってイレギュラーな質問してんだろ
で、できねーの？
なんで屁理屈並べたがるかね
シンプルな質問じゃねーか
できる、できねー
能書き聞きにきてんじゃねーんだよ

と思いましたが
言わないで我慢しますね
回答ありがとうございました

227 ：Name_Not_Found：2010/12/14(火) 10:13:17 ID:???

変なdiv使わねーで、addressにstyle指定。ブロックなんだから。

228 ：Name_Not_Found：2010/12/14(火) 10:26:31 ID:???

>>226
狂人あらわる

229 ：Name_Not_Found：2010/12/14(火) 10:28:37 ID:???

正論じゃない？
質問と無関係な講釈垂れたがる自称中級者が多すぎる

230 ：Name_Not_Found：2010/12/14(火) 11:44:19 ID:???

なりすましの煽りでしょ

231 ：Name_Not_Found：2010/12/14(火) 12:01:30 ID:???

回答者は代替案と述べた上で発言すべきだった

232 ：Name_Not_Found：2010/12/14(火) 15:42:07 ID:???

>>226
久々に香しい逆切れ乞食だなｗ
初心者スレに来てそんなイレギュラーな深読み期待すんなよw

233 ：Name_Not_Found：2010/12/14(火) 15:47:11 ID:???

700の箱に1000を詰め込もうとかｗ

234 ：Name_Not_Found：2010/12/14(火) 15:58:09 ID:???

>>226
書かない我慢が出来てない時点で
モニタの前で叫んだ可能性すら否定できないww

235 ：Name_Not_Found：2010/12/14(火) 16:18:10 ID:???

>>233
親より大きいものを入れることを想定してるoverflowなんかもあるし、あながちおかしな発想でもないと思う

236 ：Name_Not_Found：2010/12/14(火) 16:37:13 ID:???

でも親要素からはみ出すことを想定した何かはないわけだから、おかしな発想だと思われるのも当然だよな

237 ：Name_Not_Found：2010/12/14(火) 16:46:29 ID:???

>>220,226
質問はシンプルなんだが、多分前提知識が間違ってる。
あなたのいう「横幅いっぱい」が曖昧すぎるんだが、ウインドウサイズの横幅を指すとしたら CSS では不可能。
代替案としては JavaScript でhtml要素の幅を取得する。

子要素の width が親要素に影響されるのは継承による動作じゃない。
もし、width が継承するのなら親要素が 700px なら子要素も 700px にならなければならないが、そうなってないだろう？
http://hp.vector.co.jp/authors/VA022006/css/visualren.html#width
http://hp.vector.co.jp/authors/VA022006/css/box.html

CSSの仕組みを根本から否定するような発想だから、異発想と思われるのは仕方ないかと。
考えるのは悪くないが、CSS を良く理解して欲しい。

238 ：Name_Not_Found：2010/12/15(水) 03:03:41 ID:???

Google Chromeでの文章の両端揃えは現状では無理なのでしょうか？

239 ：Name_Not_Found：2010/12/15(水) 03:43:32 ID:???

とある事情により、8*8ドット日本語フォント「美咲フォント」　を使いたいのですが

http://ymem.web.fc2.com/misaki-test.html　（試作してみたページ）

Opera(10.63)で見ると、文字が歪んでしまいます。
ローカルで試しても、Web上で@font-faceを使っても結果は同じでした。

何故でしょうか…？

240 ：Name_Not_Found：2010/12/15(水) 06:45:58 ID:???

Operaだから
詳細は本スレへ

241 ：Name_Not_Found：2010/12/15(水) 07:44:57 ID:???

>>240
本スレ…ここでしょうか？
　web制作管理板　Opera 質問スレッド Part22
　http://hibari.2ch.net/test/read.cgi/software/1289008250/
どちらかというと製作者側というより、閲覧者側としての対処法のスレのように思えますが…

それとも、他に「本スレ」というものがあるのでしょうか。

242 ：Name_Not_Found：2010/12/15(水) 08:36:09 ID:???

<html><head><style>
h3 {font-size:1em; width:1em; background:pink;}
</style></head><body>
<h3>ファイナルファンタジー</h3>
</body></html>

としたとき、ＩＥ以外では

ファ
イ
ナ
ル
ファ
ン
タ
ジー

となってしまうのですが、綺麗に縦書きするにはどうしたら良いでしょうか？
（スタイルをオフにしたときもおかしくならないようにしたいので、できたら<br />などを使わずに）

span {display:block;}
<span>フ</span><span>ァ</span><span>イ</span>（以下略）

とすれば綺麗にはなりますが、どうも府に落ちなくて…

243 ：Name_Not_Found：2010/12/15(水) 10:17:52 ID:???

>>241
そこであってる

CSSの記述は関係なく、Operaのフォントレンダリング自体に問題抱えてるから
対処法はOpera製作元にバグ報告・修正要望出すくらいしか無い

244 ：239=241：2010/12/15(水) 11:59:41 ID:???

>>241
web制作管理板じゃなくてソフトウェア板だった。

>>243
なんと…
素直に画像使うべきだろうか…

245 ：Name_Not_Found：2010/12/15(水) 19:27:09 ID:???

img要素に対するbefore/after擬似要素が機能しないのですが、これはそういう仕様なのでしょうか
　img:after { content: "hoge"; }
のように書いています
a要素やdiv要素などでは機能することを確認しました
動作確認をしたブラウザはIE8、Fx3.6、GC8です

246 ：Name_Not_Found：2010/12/15(水) 19:55:36 ID:???

img:after { content: "hoge"; }
<img src="" alt="" />
　↓
<img src="" alt="">hoge</img>
　↓
エラー

247 ：Name_Not_Found：2010/12/15(水) 20:34:44 ID:???

>>246
なるほど、理屈が解りました、ありがとうございます

248 ：Name_Not_Found：2010/12/16(木) 07:43:01 ID:???

>>242
禁則処理がかかるからCSSじゃ無理
縦書きのプロパティも存在する（writing-mode）が、IE以外ではあまり対応してないぽい
縦書きは画面の構成上見やすいもんじゃないしどうしてもやりたいなら画像にすりゃいいんじゃないかな

249 ：Name_Not_Found：2010/12/16(木) 19:12:31 ID:???

フッターを作ってます。
横長のdivに背景画像を入れて、divの中に、トップページ・料金等のテキストリンクをいれたいのですが

横長のdivの上下中央にテキストリンクを持ってこさせるには、どう書いたら正しいのでしょうか？
また中央ではバランスが悪いので、少し上下左右に調整したい場合も知りたいです。

宜しくお願い致します。

250 ：Name_Not_Found：2010/12/16(木) 21:02:55 ID:???

テンプレのリンク先にある

251 ：Name_Not_Found：2010/12/16(木) 22:43:14 ID:???

>>249
#footer {
background-image:url("～");
padding-top:3em;
padding-bottom:5em;
}
<div id="footer">初歩的過ぎる</div>

252 ：Name_Not_Found：2010/12/17(金) 05:36:19 ID:???

>>245の件なのですが
Operaでは期待に沿う表示をしてくれました
これは非正規だけど都合のいい解釈をしているに過ぎないと考えるべきですか？

253 ：Name_Not_Found：2010/12/17(金) 09:59:30 ID:???

解釈はブラウザごとに異なるからな。
非正規を都合良く解釈とか特にIEが顕著だけど、
その他のブラウザにだって無い訳じゃない。

254 ：Name_Not_Found：2010/12/17(金) 12:03:40 ID:???

CSS3のメディアクエリなんですが

<link rel="stylesheet" type="text/css" href="large.css" media="only screen and (min-width: 481px)" />
<link rel="stylesheet" type="text/css" href="large.css" media="screen and (min-width: 481px)" />

上記の違いは
上はメディアクエリをサポートしてないブラウザとスクリーンサイズの横幅が481px以上のものに適用
下はスクリーンサイズの横幅が481px以上のものに適用
って解釈で合ってますか？

255 ：Name_Not_Found：2010/12/17(金) 12:44:25 ID:???

違いますね

256 ：254：2010/12/17(金) 13:16:27 ID:???

違った…orz
違いを解説して頂けないでしょうか！

257 ：254（偽物）：2010/12/17(金) 15:46:59 ID:???

>>255
早く教えろよこの役立たず

258 ：255（偽物）：2010/12/17(金) 20:15:53 ID:???

あほたれ　わしはまだ勃つわい !

259 ：Name_Not_Found：2010/12/17(金) 20:37:16 ID:???

idとclassに指定する文字は大文字と小文字のどっちがいいんですか？
ホームページビルダーを使うとhtmlタグは大文字から小文字に修正されるんですが
idとclassはそのまま変わらず、大文字小文字が入り混じって汚らしくなってしまいました。

260 ：Name_Not_Found：2010/12/17(金) 22:00:03 ID:???

俺はローワーキャメルケースにしてる

261 ：Name_Not_Found：2010/12/18(土) 00:33:59 ID:???

>>259
特に規則はない。自分でわかりやすい名前であればいい。
http://okwave.jp/qa/q6299120.html

262 ：Name_Not_Found：2010/12/18(土) 00:50:02 ID:???

divの枠を作って、その中に文章を入れてます。
枠の中で空白を作りＦＩＲＥＦＯＸで確認したら、枠自体が大きくなってしまって困ってます。
どうしたら、枠の大きさはそのままで、枠の中の文章と枠の間隔だけを空けれるでしょうか？

■html
<div class="system_textcontents">
文章
</div>

■css
.system_textcontents {
padding: 10px;
border-right: 1px solid #333333;
border-bottom: 1px solid #333333;
border-left: 1px solid #333333;
background: #FFFFFF;
width: 726px;
}

263 ：Name_Not_Found：2010/12/18(土) 05:27:27 ID:???

大きくなった分だけ小さくする

264 ：Name_Not_Found：2010/12/18(土) 05:30:49 ID:???

>>261
ドキュメントタイプ次第では規則があるぞ

265 ：261：2010/12/19(日) 00:03:29 ID:???

>>264
言葉が不足していたかもしれない。
アルファベット([a-zA-Z]) の大文字小文字で使えない文字はないという意味。
(X)HTML 系の文書で [a-z] が使えなかったり、[A-Z] が使えない規定はないんじゃないかな。

266 ：Name_Not_Found：2010/12/20(月) 15:15:04 ID:???

>>262
paddingはwidthに含まれない
widthがautoの場合はpadding分も含めて自動調整するが
固定幅の場合は、width値＋padding値になるから
左右のpadding分を引いた分をwidth値にする

267 ：Name_Not_Found：2010/12/20(月) 20:03:04 ID:???

企業のイントラで事務関係のWebシステム作ってるとこに配属されました。
rowspan、colspanたっぷりの複雑な帳票、フォームばかりなんですが、
こういったのってtableでカリカリ書くより他どうしようもないですよね？
みんなどうしてるのか気になるんですが、書籍見ても一般サイトの話しかないし、
xhtml + cssを謳ってる地方自治体も、どうもこういう帳票は他の誰かが作ってるようで
非推奨属性使いまくりだったりしています。

例
http://www.google.co.jp/images?q=%E6%A7%98%E5%BC%8F%20%E5%8F%B7

268 ：Name_Not_Found：2010/12/20(月) 20:27:24 ID:???

企業であれこれやってるんだが、帳票の現物はエクセルで作成。配布はまんまかPDFで。
サイトにはそれをgifにして貼るだけでおｋなんだが・・質問の趣旨がもひとつわかんね。

269 ：Name_Not_Found：2010/12/20(月) 21:56:45 ID:/eR/+iXw

IE8で互換モードから標準モードに切り替えると、次のような枠線が非常に暗い色になってしまいます。

<div style="border:4px groove">TEST</div>

互換モード時の明るい色が気に入ってたのですが、#FFFとか色指定してもまだ暗いんですよね。
標準モードの時に、可変サイズの枠を互換モードの時と同じような見栄えにすることはできませんか？

270 ：Name_Not_Found：2010/12/20(月) 23:09:02 ID:???

>>269
仕様書には「溝っぽく見せろ」とだけ書いてある。その実装はUAによる。
groove,ridgeに頼っていいのはテキストサイトだけだ

271 ：Name_Not_Found：2010/12/20(月) 23:51:10 ID:???

そういうことを聞きたいんじゃないんですけどね

272 ：Name_Not_Found：2010/12/21(火) 00:49:20 ID:???

>>269
他も書いて欲しい

273 ：Name_Not_Found：2010/12/21(火) 01:00:59 ID:???

>>268
ユーザーが入力する部分でのフォームはどのようにされていますか？
うちの場合では申請業務をWeb化するにあたり、
今使っている紙の申請書をそのままWebで再現しろという依頼があったので、
tableでrowspan, colspan付けて、できる限り紙媒体の様式をHTMLで再現しています。

プログラム組む方の人間で、デザインはド素人なのですが、
tableをレイアウトのために使用しないということ程度は聞いたことがあります。
ただ、先の様式x号みたいな形式のものは、そうせざるを得ないのではないかと思った次第です。
が、自信がないのでデザイン専門の方の意見を伺いたかったのです。

274 ：Name_Not_Found：2010/12/21(火) 03:54:23 ID:???

>>273
紙まんまを再現しろとかいう要件を取ってくるなんて、三流の部署に配属されちゃったね…てのは置いといて
「表ではないもの」のレイアウトのためにtableを使うのが好ましくないのであって
「表」をtableで作るのはなにも間違ってない、そこんとこの区別はまず大丈夫だろうか

で、適当にhttp://goo.gl/b9Jv5を例にとって言うけど、まず用紙下部の「表っぽい」部分
俺はこういう帳票の理念については明るくないので正しくない指摘かもしれないが、これは情報としては表ではないと思う
でも体裁としては表であって、それを再現しろってんだから、表で作りゃいい
一方、この用紙の上部、いろんな文言とか表題とか、こいつらはまったく表ではない
だから、こいつらをまとめて一つのtableにぶっこむとか、そういうことは避けるべき

あとTextをうまくMarkupできないのは、自分がその文書をよく理解してないってことを意味するのは覚えとこうな
自分が何をやってるのかもよくわからず1000行の関数を書いちまうプログラマみたいなもんだ

275 ：：2010/12/21(火) 12:48:35 ID:???

>>273
帳票って要するに書類だよな。
それは単に印刷して書類として使うもの？
それともwebページとして一般公開するの？

Web文書として公開するなら適切なマークアップをして
デザインやレイアウト用途でのtable乱用は避けるべきだけど
あくまでそれを紙の書類として使う為の印刷用ページなら
別にガチガチのtableレイアウトでも問題ないんじゃない？
そもそもweb文書として読まれる事を前提としてないんだし。

276 ：Name_Not_Found：2010/12/22(水) 22:18:29 ID:???

>>275
広義には書類です。印刷用途の場合は大抵PDFで出力します。
それをiframeでブラウザ上で確認させろと言われることもあります。
狭義には検索結果の明細です。
例えばgoogleの検索結果をNoやサイト名、更新日時といった列で区切り
tableでやたらめったらcolspanとrowspanで
レイアウトしたら帳票と呼びます（業務系界隈では）。
デザイナーの方が見たら卒倒するものばかりです。
http://www.google.co.jp/images?q=%E5%B8%B3%E7%A5%A8+%E7%94%BB%E9%9D%A2

>>274
三流は部署であり会社であり、この業界だと思います。
COBOLの時代から大企業だろうが中小だろうが変わらない風習です。

2010年の現在でも「マウスは難しいからクリックしなくていいように」というユーザーがいる世界であり、
「先方の専務がああ仰っているので何とかするように」となる世界ですし。
何十年も昔からこちらから提案することなく、顧客のいいなりになっていたツケとも言えます。

ともかく、やはり「そもそもそのような体裁を取らない」というのが
真っ当な対応なのでしょうか。うちでは無理そうですが…。

277 ：276：2010/12/22(水) 22:22:18 ID:???

google画像検索でいいサンプルがありました。
例えば、↓をWebでそのまま起こせと言われている状態です。
http://www.pca.co.jp/area_product/images/product/ken/img_apdc_ken5_05.jpg

278 ：Name_Not_Found：2010/12/22(水) 22:31:03 ID:5ARHfYiS

WEBデザインについて学ばないといけないのですが、何かいい本はないでしょうか？

特にCSSについて学びたいです

279 ：Name_Not_Found：2010/12/22(水) 22:52:49 ID:???

ネットに情報なんていくらでもあるのになぜ本を

280 ：Name_Not_Found：2010/12/22(水) 22:59:40 ID:???

>>278
っつー事はだ、netの社会のはじっこで生きていくわけだよな ?
netの最大の利点は「情報の検索」と「情報の取捨選択」だ。
いい機会だからその「CSSの何かいい本」を検索してみたらどうだい ?

281 ：Name_Not_Found：2010/12/23(木) 01:31:37 ID:???

良い事言った！

282 ：Name_Not_Found：2010/12/23(木) 11:09:20 ID:???

>>280
馬鹿は書き込みしないほうがよいのでは？
話わからないなら消えろよ

283 ：Name_Not_Found：2010/12/23(木) 11:54:17 ID:???

どうした、なんか嫌なことでもあったのか、相談のろか ?

284 ：Name_Not_Found：2010/12/23(木) 12:17:03 ID:???

探す努力をしないやつが勉強できるはず無いよな

285 ：Name_Not_Found：2010/12/23(木) 13:10:45 ID:???

子要素に img を持つ a ってどうやって指定すればいいですか？

286 ：Name_Not_Found：2010/12/23(木) 14:11:05 ID:???

ない
クラスでも付けろ

287 ：Name_Not_Found：2010/12/23(木) 14:16:35 ID:???

>>278
スタイルシート辞典（翔泳社）

288 ：Name_Not_Found：2010/12/23(木) 16:47:31 ID:???

>>285
子要素って言い方を知っててなぜそれが分からないのか理解に苦しむ

289 ：Name_Not_Found：2010/12/23(木) 17:14:19 ID:???

えっ

290 ：Name_Not_Found：2010/12/23(木) 17:32:41 ID:???

やはり存在しませんか。ありがとうございました

291 ：Name_Not_Found：2010/12/23(木) 18:05:50 ID:???

>>288
JavaScript や XPath ならともかく、CSSセレクタでは無理だと思うが。

292 ：Name_Not_Found：2010/12/23(木) 19:46:18 ID:???

生きるの疲れた

293 ：Name_Not_Found：2010/12/23(木) 19:57:38 ID:???

>>291
キーワードが解るなら調べられるだろ？って意味なんじゃね。

294 ：Name_Not_Found：2010/12/23(木) 20:32:38 ID:???

>>293
キーワードで調べても分からないから聞いているんだろ、常考。

295 ：Name_Not_Found：2010/12/23(木) 20:33:46 ID:???

そりゃそうだｗ

296 ：Name_Not_Found：2010/12/23(木) 20:37:07 ID:???

>>292
自分の常駐スレかと思った

297 ：Name_Not_Found：2010/12/23(木) 21:05:40 ID:???

>>293
ないものをないと判断するのは難しい。
仕様書を読めるなら別だが、それなら質問しないだろうし。

298 ：Name_Not_Found：2010/12/23(木) 23:13:39 ID:???

classの位置って決まりっていうか推奨みたいなのってあるんですか？
<img class="abc" src="src.jpg" alt="src">
<img src="src.jpg" alt="src" class="abc">
こんな感じで前に来てたり後ろに来てたりサイトによってまちまちなんですが。

299 ：Name_Not_Found：2010/12/23(木) 23:19:58 ID:???

決まりはない
どういう順番にするかは好みの問題だな
自分の場合はid→class→その他→イベントハンドラ、って順番にしてる

300 ：Name_Not_Found：2010/12/23(木) 23:54:43 ID:???

>>299
自分の場合、大体同じだけど必須タグ (imgの場合src, width, height, alt)を一番先にしているな

301 ：Name_Not_Found：2010/12/24(金) 01:04:42 ID:???

CSSの理解はできても実践でどう使うかは難しい。
なんか、そのへんのいい入門書はないですか？

WEBサイトにおけるCSSの実際の例みたいなやつ

302 ：Name_Not_Found：2010/12/24(金) 01:07:15 ID:???

おまえのブラウザは右クリックから
ソースを見ることも出来ないのか。

303 ：Name_Not_Found：2010/12/24(金) 01:09:21 ID:???

>>301
実戦で難しいってのがわからん
htmlでプレーンな文書を作って、あと全部cssでレイアウトじゃないの
練習のつもりで何かやるんなら架空のwebサイトでも作ってみたら

304 ：Name_Not_Found：2010/12/24(金) 01:22:21 ID:???

あちこちのサイトのソース見るのは良い勉強になるよな

305 ：Name_Not_Found：2010/12/24(金) 01:25:18 ID:???

>>301
自分も初心者だけどカッコいいデザインのサンプル見つけて
そのCSSのパラメーターをいじったりして理解→自分でちょっとしたページ作る
ってのが面白いし理解しやすいと思う
まぁ基礎がしっかり身に付かないかもだけどモチベが保てるから継続して学べる

コリスとかかちびとのCSSサンプルは見てて面白いお（^ω^）

306 ：Name_Not_Found：2010/12/24(金) 03:57:32 ID:???

>>299
どうもありがとう。

307 ：Name_Not_Found：2010/12/25(土) 17:25:17 ID:RI9fhs9a

スタイルシートのセレクタって
divとかpとか無いと駄目なのか？

308 ：Name_Not_Found：2010/12/25(土) 18:08:14 ID:???

あ？

309 ：Name_Not_Found：2010/12/25(土) 18:27:15 ID:???

え？

310 ：Name_Not_Found：2010/12/25(土) 20:37:43 ID:???

ぎ？

311 ：Name_Not_Found：2010/12/25(土) 21:08:06 ID:???

ご？

312 ：Name_Not_Found：2010/12/25(土) 21:14:28 ID:???

ぐ？

313 ：Name_Not_Found：2010/12/25(土) 23:07:12 ID:???

>>307
タイプセレクタは必須じゃないよ

314 ：Name_Not_Found：2010/12/26(日) 15:17:40 ID:???

>>313
ｻﾝｸｽ
そうなのか
pだと反映されるんだが
適当なのだと反映されなかったんだ

315 ：Name_Not_Found：2010/12/26(日) 16:37:18 ID:???

>>314
「適当なの」が間違ってるんじゃない？
それだけじゃ何とも答えようがない。

316 ：Name_Not_Found：2010/12/26(日) 16:43:41 ID:???

要は<div id="***"><p class="***">とかでなく
適当に<A id="***"><Z class="***">でもOKか？と聞きたいのだろう

317 ：Name_Not_Found：2010/12/26(日) 17:08:32 ID:???

さすがにそれはないだろ

318 ：Name_Not_Found：2010/12/26(日) 17:38:24 ID:???

それなんてspan？

319 ：Name_Not_Found：2010/12/26(日) 18:29:32 ID:???

XMLなの？

320 ：Name_Not_Found：2010/12/26(日) 18:32:16 ID:???

はじめてやります
いろいろおしえてください。

321 ：Name_Not_Found：2010/12/26(日) 18:33:05 ID:???

>>320
はじめてかいとうします。
しつもんをおしえてください。

322 ：Name_Not_Found：2010/12/26(日) 18:33:13 ID:???

はじめてやります
いろいろおしえてください。

323 ：Name_Not_Found：2010/12/26(日) 18:35:54 ID:???

まずは浣腸をしてキレイにしましょう

324 ：314：2010/12/26(日) 20:39:01 ID:???

>>316の通りだ
fとかkとかでやろうとしてた

pだと段落になりそうだと思ったんだ

325 ：Name_Not_Found：2010/12/26(日) 20:48:40 ID:???

HTML勉強して来い

326 ：Name_Not_Found：2010/12/26(日) 21:15:19 ID:???

>>324
それは CSS の話じゃない。
<z> を定義した DTD を用意してやれ。
それとも、不正な (X)HTML であることを前提にしているのか？

327 ：Name_Not_Found：2010/12/26(日) 21:27:20 ID:???

>>324
文書型は何？
対応する仕様書を読め。

328 ：314：2010/12/26(日) 23:54:27 ID:???

文章型はHTML 4.01 Transitional・・・
と思ったら書き損ねてた

もっと勉強して来る・・・
ﾚｽｻﾝｸｽ

329 ：Name_Not_Found：2010/12/27(月) 00:51:45 ID:???

>>328
HTML4.01なら不正文書に対する規定はなく、実装依存。
http://www.asahi-net.or.jp/~sd5a-ucd/rec-html401j/appendix/notes.html#h-B.1

何が目的か知らないが、不正文書にするぐらいなら <div class="z"> の方がまだマシ。
でなければ、HTML4.01 のDTDを元に自分でDTDを作る。

330 ：Name_Not_Found：2010/12/27(月) 04:46:15 ID:???

#menu ul > li
{

}
などの > で指定するって大抵のブラウザでサポートされてますか?

331 ：Name_Not_Found：2010/12/27(月) 09:03:46 ID:???

>>330
WinIE6以下以外はサポートされてる

332 ：Name_Not_Found：2010/12/27(月) 09:27:56 ID:???

>>331
ありがとうございます。
安心して使えます

333 ：Name_Not_Found：2010/12/27(月) 13:14:22 ID:???

しかしまだIE6は半数以上というところが多いがな、ははっ

334 ：Name_Not_Found：2010/12/27(月) 13:52:16 ID:???

IEェ…こいつのせいでほんと手間かかる

335 ：Name_Not_Found：2010/12/27(月) 14:01:53 ID:???

IE6使ってる奴ってなんなんだよ・・・情弱にも程があるだろ(´・ω・｀)

336 ：Name_Not_Found：2010/12/27(月) 14:35:33 ID:???

どっちが情弱なんだか

337 ：Name_Not_Found：2010/12/27(月) 15:17:23 ID:???

普通は8にアップグレードされるから情弱は使えないんじゃない？

338 ：Name_Not_Found：2010/12/27(月) 15:18:11 ID:???

小さいエって、ブーイングのときに使う感じがするが
由来と読み方がわからない

339 ：Name_Not_Found：2010/12/27(月) 15:21:26 ID:???

サスケェでぐぐれ

340 ：Name_Not_Found：2010/12/27(月) 15:42:54 ID:???

>>337
勝手にはされないよ
あとOSによっては入れられないOSのところも企業では多い

341 ：Name_Not_Found：2010/12/27(月) 16:55:07 ID:???

IE6でしか動かない　業務用ASPやサービスを使ってる会社もまだあるから　なかなかね…

342 ：Name_Not_Found：2010/12/27(月) 17:34:41 ID:???

会社のPCだと勝手には入れられなかったりするしね
権限持ってる人が情弱な可能性とか単に数が多くて面倒とかってこともあり得る
俺が前いたところも今年の夏の時点でまだ全台6だった

>>337
いつの間にか自動的にされるわけじゃないからそれは無いと思う

343 ：Name_Not_Found：2010/12/27(月) 23:53:04 ID:???

うちも一応大企業に分類される会社にいるけど、IE6をIE7以上にアップデートすることは禁止されてる

344 ：Name_Not_Found：2010/12/28(火) 00:39:54 ID:???

結局、IE6を使い続けているのはほとんどが企業ユーザーだということ
つまりそいつらを相手にするかどうかでIE6への対応を決めればいい

345 ：Name_Not_Found：2010/12/28(火) 06:03:13 ID:???

ちょっと聞きたいんだけど、CSS3もう実務で使ってる？

346 ：Name_Not_Found：2010/12/28(火) 09:30:49 ID:???

>>345
うｎ　一部サイトでは使ってる
古いUAだと再現はされないから、情報の閲覧には支障がでないようにするのが大前提だね

347 ：Name_Not_Found：2010/12/29(水) 18:15:15 ID:???

<div class="clr"></divが出来るのですが"clr"とは何でしょう？？

348 ：Name_Not_Found：2010/12/29(水) 18:38:49 ID:???

使ってるソフトのスレで聞け

349 ：Name_Not_Found：2010/12/29(水) 18:39:42 ID:???

>>347
なに？クイズがしたいの？
じゃあ「上は大水、下は大火事。これなーんだ？」

350 ：Name_Not_Found：2010/12/29(水) 18:48:24 ID:???

>>374
日本語でおｋ

351 ：Name_Not_Found：2010/12/29(水) 18:54:19 ID:2o/k5x41

>>347
id、classは任意

352 ：Name_Not_Found：2010/12/29(水) 23:42:04 ID:9Z+1uLrQ

>>300
altは必須だけどwidthとheightは必須じゃないよ。（HTML5ではaltも必須じゃなくなる。）

353 ：Name_Not_Found：2010/12/30(木) 19:35:39 ID:???

現在、主にIE6（後方互換モード）,7対策で
・widthとpaddingまたはborderを同時に指定しない（widthの解釈）
・floatを指定した要素に左右marginを指定しない（IEで2倍になる）
・上下marginはできるだけ使わない（バグが多いような気がします）

上記のことを自分なりに決めてCSSを書いているのですが、他に注意するべきCSSのプロパティやそれらの組み合わせってありますか？
もしかしたら無意識のうちにやっているかもしれませんが...

354 ：Name_Not_Found：2010/12/30(木) 20:08:39 ID:???

当然Fxでも確認してるよね ?

355 ：353：2010/12/30(木) 20:16:56 ID:???

>>354
有り難うございます。
はい、最初はFirefoxで確認してその後IEとOperaで確認しています
chromeも追加しようかなと思っていますが...

356 ：Name_Not_Found：2010/12/30(木) 21:31:57 ID:???

IE6は官公庁、大企業、研究所などが多くて
「全く無知」と「解って使っている」の両極端だから
もう無視してもいいかも・・・

>353の3点で充分だと思うよ。

357 ：Name_Not_Found：2010/12/30(木) 21:40:12 ID:???

超基本なので既にクリアしていると思うが
・属性セレクタ([ ])、チャイルドセレクタ(＞)、white-space:pre あたりは未対応なので使わない
・bodyに font 設定する場合は、基本 table 要素にも同じ設定をする
とか

358 ：Name_Not_Found：2010/12/30(木) 22:04:31 ID:???

IE6,IE7だとはhasLayout絡みか
互換IE6だとブロック要素のセンター揃えも気をつけねば

359 ：Name_Not_Found：2010/12/30(木) 22:40:39 ID:???

>>353
標準準拠モードなら回避できるバグばかりではないか…。
後方互換モードを会えて選択するメリットはあるのかな。

360 ：Name_Not_Found：2010/12/31(金) 07:38:37 ID:???

単純にxml宣言が推奨されてるからじゃね？
UTF-8だと省略可だけど推奨ってことで俺も書いてるし

361 ：Name_Not_Found：2010/12/31(金) 10:28:28 ID:???

<!DOCTYPE html>でオールオッケーだと思ってるんだけど、なんかまずい事ってある？

362 ：Name_Not_Found：2010/12/31(金) 11:26:26 ID:???

363 ：Name_Not_Found：2010/12/31(金) 13:45:29 ID:???

>後方互換モードを会えて選択するメリットはあるのかな。
IE5対策

364 ：Name_Not_Found：2010/12/31(金) 14:58:28 ID:???

>>360
HTTPヘッダでちゃんと文字コードが指定されてたら、どの文字コードでも省略可能ってことになったよ

365 ：Name_Not_Found：2010/12/31(金) 15:04:57 ID:onsTJKN9

>>363
今時IE5なんて無視でしょ。

>>264
まじで？ソース希望。

というか、HTML 4.01でいいじゃん。

366 ：Name_Not_Found：2010/12/31(金) 15:18:40 ID:???

まだ少数ながらIE5ユーザも居るから、Webで不特定多数を相手にするなら
対応できるならしておいたほうがベター

367 ：Name_Not_Found：2010/12/31(金) 16:06:17 ID:???

シェア1%以下だろ
対応するコスト考えたらアホらしい
時間と労力の無駄

368 ：Name_Not_Found：2010/12/31(金) 16:06:24 ID:???

じゃあネスケ4.7にも対応しないといかんな

369 ：Name_Not_Found：2010/12/31(金) 16:29:01 ID:???

さすがに6まででしょ
それ以前への対応なんてほぼ骨折り損でベターですらない
よほど余裕があるなら好きにすればって感じだな

370 ：Name_Not_Found：2010/12/31(金) 16:35:01 ID:???

半年前のブラウザ占有シェア調査では１位がIE8(25%、連続1位)で、２位がIE6(15%、増加へ転向)だったからな。
最低この２つには対応で、後は任意かな

371 ：Name_Not_Found：2010/12/31(金) 16:39:11 ID:???

ベターっていうことなら、
>>370と、あと、FFとかOperaとか有名どころだけ押さえれば、まあ別にいいんじゃね、って思う。

372 ：Name_Not_Found：2010/12/31(金) 16:40:27 ID:???

ｽﾏﾝ、占有率の数値を間違えてた。
IE8 26%、IE6 17%
（ちなみにIE7とIE8互換モードは別集計）

373 ：Name_Not_Found：2010/12/31(金) 16:51:29 ID:???

>>372
ちなみに7は？よかったら教えて。
7にした人はたいてい8にしてるから
6よりもパーセンテージが低い、ってことなのかな

374 ：Name_Not_Found：2010/12/31(金) 17:07:29 ID:???

>>373
7は確か11%。

企業ユースは6が多いし、7使ってる人って不人気OSのVISTA使いが多いんでしょうかね

375 ：Name_Not_Found：2010/12/31(金) 17:15:22 ID:???

「やること無くて超暇なら対応」ぐらいでいいだろ

376 ：Name_Not_Found：2010/12/31(金) 19:37:21 ID:???

> HTTPヘッダでちゃんと文字コードが指定されてたら、どの文字コードでも省略可能ってことになったよ
http://logsoku.com/thread/hibari.2ch.net/hp/1276329188/#776
に近いものを感じる。

377 ：Name_Not_Found：2010/12/31(金) 19:41:54 ID:???

XML宣言推奨を打ち消す規定じゃないな。

378 ：Name_Not_Found：2010/12/31(金) 19:46:06 ID:???

w3c自体、xml宣言を入れないことを推奨してるわけじゃないんだよね
w3c自身も「IE6が面倒だから」という理由が見え隠れしているような･･･。
俺は無難にxml宣言してるけどね
IE6が後方互換でもよっぽど凝ったデザインにしない限り大丈夫だ

379 ：Name_Not_Found：2010/12/31(金) 19:53:47 ID:???

セキュリティアップデート終わったブラウザに対応したら逆にダメだろ

>>376
ごめん、>>360の二行目に突っ込んだつもりだった

380 ：Name_Not_Found：2010/12/31(金) 19:58:33 ID:???

HTTPヘッダに文字符号化を指定できるのはXMLに限らないHTTPの規定。
当然、HTMLも省略できる。
そもそも、XML宣言が文字符号化のためだけにあると思っているのがおかしい。

381 ：Name_Not_Found：2010/12/31(金) 20:00:02 ID:???

>>379
彼はHTTPヘッダで指定すれば省略可だけど推奨ってことで書くんじゃないか？

382 ：Name_Not_Found：2010/12/31(金) 20:13:47 ID:???

XHTML1.1 1st edition？ではUTF-8/16以外では省略不可だったと思う。今は2ndが勧告されてるけど
http://www.w3.org/TR/2001/REC-xhtml11-20010531/conformance.html#strict

383 ：Name_Not_Found：2010/12/31(金) 23:19:36 ID:???

某大手メーカーのWebサイトガイドラインではWinIE5.5もいまだ対象だった

384 ：Name_Not_Found：2011/01/01(土) 13:00:55 ID:uySdSDUj

>>383
そういうのは大抵ガイドラインの更新のし忘れ、あるいは怠り。

385 ：Name_Not_Found：2011/01/01(土) 17:07:14 ID:???

大手がIE6を切れば少しは早く撲滅するかな

386 ：Name_Not_Found：2011/01/01(土) 17:14:40 ID:???

>>385
2014年のWindowsXpサポート切れまで待て

387 ：Name_Not_Found：2011/01/01(土) 17:57:10 ID:???

IE6はもういいよ
IE8が問題

388 ：Name_Not_Found：2011/01/01(土) 18:08:05 ID:L+td9HwC

大人しくIE八苦で個別対応

389 ：Name_Not_Found：2011/01/01(土) 18:26:41 ID:???

下手なことしなければIEでもなんとかなってる
px単位で細かく揃えようとするときついね

390 ：Name_Not_Found：2011/01/01(土) 21:30:40 ID:???

そういう問題ではなかろう

391 ：Name_Not_Found：2011/01/01(土) 21:40:01 ID:???

px単位でっていうのがそもそもアレ過ぎて….

392 ：Name_Not_Found：2011/01/01(土) 22:26:36 ID:???

細かい位置指定より、border等がうまく機能しないバグの方が問題じゃないか

393 ：Name_Not_Found：2011/01/01(土) 22:30:35 ID:???

それのせいで位置指定が大変ってことも含んでるんじゃ？

394 ：：2011/01/04(火) 19:23:53 ID:???

その場合は大抵pxなんて単位を超越してる

395 ：Name_Not_Found：2011/01/04(火) 19:53:50 ID:???

じゃあそんなものをpx単位で揃えようなんてアホということで終了だよね

396 ：Name_Not_Found：2011/01/05(水) 00:38:15 ID:???

px使わない奴ってだっせえテキストサイトしか作ったことないの？

397 ：Name_Not_Found：2011/01/05(水) 01:00:17 ID:???

いきなり何だ

398 ：Name_Not_Found：2011/01/05(水) 06:09:57 ID:???

どっちがいいじゃなくて、それぞれ使いどころありますがな。

399 ：Name_Not_Found：2011/01/05(水) 15:39:34 ID:???

人を馬鹿にするのもいい加減にしたらどうだ！！

400 ：Name_Not_Found：2011/01/05(水) 16:25:20 ID:???

でした

401 ：Name_Not_Found：2011/01/05(水) 20:38:43 ID:???

お正月だ。餅つけ。

402 ：Name_Not_Found：2011/01/06(木) 16:06:37 ID:???

あの頃は♪

403 ：Name_Not_Found：2011/01/06(木) 19:43:38 ID:???

っは！

404 ：Name_Not_Found：2011/01/07(金) 10:55:45 ID:???

昨夜、ふと気付いてしまった

コーマンとコーモンは一字違い！！！

405 ：Name_Not_Found：2011/01/08(土) 01:03:18 ID:???

ま、隣同士だからね

406 ：Name_Not_Found：2011/01/08(土) 05:40:57 ID:???

コーチンを入れて！（挿入的な意味で）

407 ：Name_Not_Found：2011/01/11(火) 10:19:34 ID:HblpUKIT

とあるdivにマウスカーソルが乗ったときに背景色が変わるようにしたいんですが、
どうすればよいでしょうか？
リンクではないのでa:hover以外の方法でありませんか？

神の光臨お待ち申し上げ奉ります。

408 ：Name_Not_Found：2011/01/11(火) 10:35:27 ID:???

>>407
JavaScriptでやったらいいと思います

神とかいっておだてあげてレスを誘発しようとするのは
自分では効果的と思ってるのかも知れないけど
みすぼらしいだけなので、やめたほうがいいと思います

409 ：Name_Not_Found：2011/01/11(火) 12:12:48 ID:???

>>407
div:hover
IE6以下にも対応したければJavaScript併用

410 ：Name_Not_Found：2011/01/11(火) 12:15:10 ID:???

>>407
飛ばないリンク

411 ：Name_Not_Found：2011/01/19(水) 23:44:54 ID:RI1wcpYd

動作環境XP,IE8
ツール　VisualStudio2010
問題
Site.css内の記述で
.header
{
position: relative;
margin: 0px;
padding: 0px;
background-image: url("../Styles/071111.png");
width: 100%;
}
と、webアプリケーションの雛型の背景色の部分を背景画像として変更した所
Site.Masterにも他のaspxにも反映されているのにデバッグすると背景色があった
ころのままになっています。甚だ困惑です。原因、対処法の判る方よろしければ
教えて下さい。

412 ：Name_Not_Found：2011/01/19(水) 23:55:35 ID:???

キャッシュ

413 ：Name_Not_Found：2011/01/20(木) 00:06:36 ID:M6ipxN6v

>>412　俺頭悪いわｗｗｗｗ
ありがとうございました即時解決です。
aspxの中身はきちんと更新されてるから
CSSだけキャッシュ優先とか思いもよらなかった。

414 ：Name_Not_Found：2011/01/21(金) 09:02:33 ID:???

1. div > div:first-child + div + div + a.test
2. div > div:first-child + div + a.test
3. div > div:first-child + a.test

1,2,3を一度に表記する方法はありませんか？
div > div:first-child( + div){0,2} + a.test
みたいに量を指定したいんです

415 ：Name_Not_Found：2011/01/21(金) 12:03:27 ID:???

div > div:first-child + div + div + a.test ,
div > div:first-child + div + a.test ,
div > div:first-child + a.test

416 ：Name_Not_Found：2011/01/21(金) 12:19:23 ID:c/reoNen

携帯サイトに用いるCSSはみなさまどうしてますか？
外部ファイルにしたりもできるみたいだけど、実機で確認ができんから実際どのぐらいまでの人にきちんと表示してもらえるかわからん。
まとめサイト的なものも探したけど、２～３年まえのものばっかりなんだよな。

私はこうしてる、とか最近のこと書いてるページとかあれば、教えてください。

417 ：Name_Not_Found：2011/01/21(金) 12:49:48 ID:???

ドコモとかだと、link要素に加えて、style要素を使えないブラウザもまだ利用されてる

そういうブラウザだとstyle要素のセレクタには、a要素の疑似クラスしか指定できない
それ以外のセレクタを書いてしまうと、style要素の中身が晒されて、ページ内のstyle属性まで機能しなくなる
あとcolorやfontプロパティが指定できるのは基本的にspan要素のみ

418 ：Name_Not_Found：2011/01/21(金) 15:46:49 ID:c/reoNen

>>417　ありがとー

DOCOMOの場合、xhtmlがうんたらかんたらなんだよね。
いっぺんチョーシこいてxhtmlでつくったら
ウェブコンテンツヴューアでエラーでまくりで
上司からやめれと指示されたけど、
あのエラーってあてにしていいもんなの？

419 ：Name_Not_Found：2011/01/21(金) 15:47:32 ID:???

docomoの一般的なiモードブラウザだと、MIMEタイプをapplication/xhtml+xmlにしないとCSS有効にならないので注意

ガラケだと基本的には２～３年のテクが未だ定石という感じ

最近見た携帯サイトまとめ記事
http://design.kayac.com/topics/2010/09/mobile-template.php

420 ：Name_Not_Found：2011/01/21(金) 18:05:22 ID:???

>>419　おおこりゃいい

ガラケって言葉も今おぼえた。
感謝します。

421 ：Name_Not_Found：2011/01/21(金) 20:36:23 ID:???

そんなんでよく・・・

422 ：Name_Not_Found：2011/01/21(金) 23:34:07 ID:???

DoCoMoのXHTMLは、HTTPヘッダとmeta要素の両方でContent-Type指定しとかないと
機種によってはCSSいかれるよ

423 ：414：2011/01/22(土) 00:18:01 ID:???

>>415
確かにそれでも可能なんですが、動的なサイトで、 + divの量が可変するんです

あるときには
div > div:first-child + div + a.test
でも、また違うときには
div > div:first-child + div + div + div + div + a.test
みたいに+ divが増減するんです

その度に + divの量を変更するのでは手間なので一意的に表現する方法はございませんか？

424 ：Name_Not_Found：2011/01/22(土) 00:21:12 ID:???

CSS3 兄弟

425 ：Name_Not_Found：2011/01/22(土) 00:31:51 ID:???

動的ならクラス名を振れるだろ

426 ：414：2011/01/22(土) 02:02:24 ID:???

>>424
もうちょっとｋｗｓｋお願いします
ttp://www.htmq.com/css3/index.shtml
このどこを使えば実現できるんでしょうか。セレクタの所だとは思うのですが、いまいちピンときません

>>425
サイトのスタイルをユーザー側でCSSを使い、変更するというものでして、自分はサイト運営者ではないんです
スタイル変更にはfirefoxのstylishというものを使っています

427 ：Name_Not_Found：2011/01/22(土) 02:44:18 ID:???

>>426
div が a.test に先行するのは必要条件なの？
div>a.test:first-child ではダメ？

428 ：427：2011/01/22(土) 02:51:11 ID:???

あるいは、div>div:first-child~a.test かな。
繰り返し回数を任意にするセレクタはないので、完全に期待通りの動作にすることは出来ない。
GreaseMonkey でも使うか、セレクタの方を考え直すしかない。

429 ：Name_Not_Found：2011/01/22(土) 06:50:10 ID:???

<h2>ナビゲーション</h2>
<ul>
<ll>コンテンツ</li>
<li>...</li>
</ul>

よくあるマークアップだと思うのですが、CSSありだと見出しのナビゲーションを消す場合、SEOも考えるとどれが妥当でしょうか？
・display:none;
・背景色と文字色を同じにする
・z-indexでかぶせる
・インデントで画面外に飛ばす

見出し自体を消すとCSSオフのときに違和感があるのでテキスト自体は消したくないです。
悪気があって消すわけではないのですが、そう捉えられる可能性がありますよね？
検索エンジンでスパムになる境界がいまいち不明です

430 ：Name_Not_Found：2011/01/22(土) 09:46:38 ID:???

>>426
またサヨクがニワカで保守気取りか

431 ：Name_Not_Found：2011/01/22(土) 15:48:26 ID:???

>>429
境界がいまいち不明なら消すな。
素人サイトがSEOなど考える必要なし
もっとも効果的なのは内容を充実させることだ !

432 ：Name_Not_Found：2011/01/22(土) 16:05:19 ID:8A+F191Z

::selection { background: rgb(255,255,255); }

で選択文字の背景を白にしたいんだけど、何故か真っ白にならずに背景が透ける。
rgbaで不透明に指定してみたけど効果は無し。　-mozは指定通り真っ白になる。
スタイルを上記だけにしたものだと、真っ白になるのだけど
背景かテキストシャドウを記述すると、透けてしまう。

これどうしてでしょう？

433 ：Name_Not_Found：2011/01/22(土) 16:06:53 ID:???

>>429
そもそも「見出し」を消す理由は？

434 ：Name_Not_Found：2011/01/22(土) 16:09:39 ID:???

>>433
デザイン上の都合じゃね？
フッターの見出しとか自分も消すことあるよ

435 ：414：2011/01/22(土) 16:21:15 ID:???

>>427-428
ご回答ありがとうございます
お教えくださったことを試した結果、div>a.testで出来ました
兄弟の要素（ div:first-child + div + div ）は省略できたのですね。どうもありがとうございました。

436 ：：2011/01/22(土) 16:26:50 ID:???

>>435
遅レスだがそういった動的で複雑な条件を指定する場合は
htmlも書かんとなかなか理解しづらいぞ

>>432
#fffじゃだめなのか？

437 ：432：2011/01/22(土) 16:35:05 ID:???

>>436
レスありがとうございます
16進数、試してみたんだけど駄目でしたわ

ユニバーサルセレクタで不透明度100%にして、リセットを試みるも効果なし
デフォルトのライトブルーでも透けてるので、WebKitの仕様かなと思って一旦諦めます

438 ：Name_Not_Found：2011/01/22(土) 19:01:01 ID:???

>>437
::-moz-selection は有効で ::selection は無効ということかな。
Firefox では先行実装扱いになっているからベンダー接頭辞が必要となる。
他のブラウザでもベンダー接頭辞が必要な扱いとなっている可能性があるので、接頭辞を入れて検証してみるといいと思う。

439 ：Name_Not_Found：2011/01/22(土) 19:11:51 ID:???

ベンダー接頭辞は使ってもよいか | Web標準Blog | ミツエーリンクス
http://standards.mitsue.co.jp/archives/001469.html
CSS3 module: Syntax
http://www.w3.org/TR/css3-syntax/#vendor-specific
Vendor-specific Properties
http://reference.sitepoint.com/css/vendorspecific

440 ：432：2011/01/22(土) 19:38:23 ID:???

>>438
紛らわしくなってしまって申し訳ない。

Gecko用に ::-moz-selection で記述したものは、Gecko系ブラウザで望み通りになるのだけど
特に接頭辞の必要のないWebKit用に書いた ::selection では、WebKit系において透けてしまうという事ですわ。
因にWebKitでは、擬似要素selectionに接頭辞を付けると無効になってしまうようで。

441 ：think49 ◆bKk/qcAKuM ：2011/01/22(土) 21:05:14 ID:???

>>440
こういうことでしょうか？

http://jsbin.com/efagu3/1 (Fx のみOK / GC, Opera はNG)
http://jsbin.com/efagu3/2 (Fx, GC, Opera でOK)

442 ：Name_Not_Found：2011/01/22(土) 23:32:09 ID:???

>>441
そうです
無理っぽいですな

443 ：think49 ◆bKk/qcAKuM ：2011/01/23(日) 14:13:49 ID:???

>>442
::-moz-selection, ::selection { color: black; background-color: white; }

このようにカンマでセレクタをグループ化すると ::-moz-selection を解釈しないブラウザで動作しなくなりますが、カンマを使わなければ期待通りに動作すると思います。
http://d.hatena.ne.jp/think49/20110122/1295702670

444 ：432：2011/01/23(日) 22:03:09 ID:???

>>443
いやー色々とどうも有り難うございます。
仰るように、それぞれのエンジンに対応したコードを書き、それぞれに効いている上で
微妙に選択色を透けさせてしまうWebKitのレンダリングに対する疑問だったんです。>>432

大した問題ではないですし、仕様だと思うので諦めました。
誤解させてしまって申し訳ない。

445 ：Name_Not_Found：2011/01/26(水) 15:42:12 ID:6rqJuliC

散々出ている質問だと思うのですが
ブログにhtmlで記述した記事の個別のページをIE8で開くと、
文字やレイアウトがずれてしまいます。
Firefox3.6では問題なく開くことが出来ます。
いろいろググッたのですが答えにたどり着けなかったので
教えてください。
http://blog.livedoor.jp/risusoku/

446 ：Name_Not_Found：2011/01/26(水) 18:55:42 ID:???

一から作り直した方が早いんじゃない

447 ：Name_Not_Found：2011/01/26(水) 19:23:54 ID:???

ttp://www.google.co.jp/search?hl=ja&source=hp&q=http%3A%2F%2Fblog.livedoor.jp%2Frisusoku%2F&btnG=Google+%E6%A4%9C%E7%B4%A2

まず「色々調べた」とは何を調べたのか聞きたい
そもそも何がどう違うのかも言わずにこれ見て答えろは酷い

448 ：Name_Not_Found：2011/01/26(水) 19:38:36 ID:???

>>445
CSSの記述のどこかをミスってるんだよ
多分、凡ミス

449 ：Name_Not_Found：2011/01/26(水) 22:48:49 ID:6rqJuliC

445です
>>477
「IE CSS ずれる」とかで検索したり質問サイトを見たりです
CSSやHTMLの知識が無いからどこをさわったらどうなるかが
分からなかったので質問が悪かったのはすみません

450 ：Name_Not_Found：2011/01/26(水) 22:54:19 ID:???

まず、CSSの基本的な知識を身につけて、それでも分からなかったら質問して下さい。

451 ：Name_Not_Found：2011/01/26(水) 23:36:45 ID:???

>>449
子供はこんなとこに来ちゃダメだぞ

452 ：Name_Not_Found：2011/01/26(水) 23:42:57 ID:???

>>449
何食わぬ顔でマルチポスト先を削除するところがまた…。
http://okwave.jp/qa/q6475290.html

453 ：Name_Not_Found：2011/01/27(木) 00:07:58 ID:???

ボクもここで質問したかったんだけど、やめたよ。
ここ、怖いおじちゃんがいっぱいいるんだから。

454 ：Name_Not_Found：2011/01/27(木) 00:23:16 ID:???

>>453
まともな回答もあるんだよ、とはいっておきたい。
過度な期待をされても困るけど。
最近、答えようと思える質問がめっきり減ったよ。

455 ：Name_Not_Found：2011/01/27(木) 00:37:54 ID:???

>>452
指摘されて質問内容が悪かったと思ったから消しただけ

456 ：Name_Not_Found：2011/01/27(木) 00:50:02 ID:???

>>455
俺は後から来たので経緯は知らないんだが、誰かにマルチポストを指摘されたのか？
俺は当事者じゃないからしつこくいう権利はないが、「http://okwave.jp/qa/q6475290.html と http://knowledge.livedoor.com/48123 にマルチポストしていました。すみません。」ぐらいの謝罪はあっても良かったと思うな。
黙って削除されたら証拠隠滅と受け取られても仕方ない。

457 ：Name_Not_Found：2011/01/27(木) 00:55:18 ID:???

>>456
しつこい

458 ：Name_Not_Found：2011/01/27(木) 01:09:15 ID:???

もうちょっと穏やかな雰囲気にならないものか。
回答者には同情するが、それでもなあ…。

459 ：Name_Not_Found：2011/01/27(木) 01:20:17 ID:???

ゆとりの相手はしてられん

460 ：Name_Not_Found：2011/01/27(木) 01:20:34 ID:???

>>456
証拠隠滅の意味が分からないのですが何に対してですか？
>>447に「まず「色々調べた」とは何を調べたのか聞きたい
　　　　　　そもそも何がどう違うのかも言わずにこれ見て答えろは酷い」
って言われて、抽象的で分かりにくい質問だったと思ったから削除したまでです。

他のところで質問していることを聞いてはいけないルールでもあるのですか？
それならば謝罪しますけど。

461 ：Name_Not_Found：2011/01/27(木) 01:27:07 ID:???

追加
質問サイトにした質問に対する回答はまだゼロでした。

462 ：Name_Not_Found：2011/01/27(木) 01:31:58 ID:???

>他のところで質問していることを聞いてはいけないルールでもあるのですか？

そうです。詳しくは「マルチポスト」でぐぐれば分かります
謝罪して金輪際ネットから姿を消してください

463 ：456：2011/01/27(木) 01:36:13 ID:???

>>460
俺は>447ではないが…。
447は「抽象的でわかりにくいから、補足してくれ」といっているのでは？
「補足してくれ」を「質問を削除してくれ」と読み替えるのは無理がありすぎる。

> 他のところで質問していることを聞いてはいけないルールでもあるのですか？
ルールではないが、マナーに反しているといえるかと。
「ルールさえ守れば何をやってもいい」と思っているなら、社会勉強が足りないと思う。
http://www.google.co.jp/search?ie=UTF-8&q=%E3%83%9E%E3%83%AB%E3%83%81%E3%83%9D%E3%82%B9%E3%83%88

464 ：456：2011/01/27(木) 01:45:33 ID:???

一つ忘れた。

> 証拠隠滅の意味が分からないのですが何に対してですか？
「マルチポストをなかったことにする」という意味での証拠隠滅。
後からここを見た人はマルチポストがあったことさえわからない。

465 ：Name_Not_Found：2011/01/27(木) 02:14:28 ID:???

マナー違反してしまったことは謝罪します、すみませんでした。
回答しようとしてくれた方はありがとうございました。

466 ：Name_Not_Found：2011/01/27(木) 02:50:43 ID:???

>>465
もうあのサイトはダメだろ。
2chはおろかネットに疎いようだし
荒らされて終わり。
身の丈にあったサイト作りなよ。

467 ：Name_Not_Found：2011/01/27(木) 04:37:24 ID:???

>>449
>>2ちゃんねるのニュース☆ネタのまとめブログ

が下にずれるということでいいの？　何を聞いているのかはっきりしない
レイアウトや文字が具体的に何なのか言わないし、個別のページというのも存在しないから分からない

IE8で表示が標準モードだと、旧IEのバグは継承されないからずれない
互換モードだと、description の line-height が padding と競合して高さがずれるんだと思う(未検証)
IE7以下を無視して強制的に標準モードするMETAタグを付けるか、CSSでハックするか
line-height をバグを加味して font と padding から逆算した実数にするか、使わないようにするか

空のページの状況から先のことは分からない

468 ：Name_Not_Found：2011/01/27(木) 06:49:16 ID:???

CSSの継承について質問です
html
<body>
<p id="description">ああああ</p>
<p>いいいい</p>

css
* {margin: 0; padding: 0; font-size:100%;}
p#description {background: #ffffff;}
p {font-size: 150%}

例えばこの場合、p#descriptionのほうにもfont-size:150%が継承されますよね？
これを継承させないようにすることって可能ですか？
適宜、100%を指定しないと無理でしょうか？
「idやclassが指定されていない場合はこのフォントサイズを指定」みたいなことを想定しています。

469 ：Name_Not_Found：2011/01/27(木) 07:24:58 ID:???

p {font-size: 150%}
p[id], p[class] {font-size: 100%}

470 ：Name_Not_Found：2011/01/27(木) 11:55:17 ID:???

しつこく言っておく。
>>456は、非常にひつこい。

471 ：Name_Not_Found：2011/01/27(木) 11:59:45 ID:???

こういう類のやつを「ネット弁慶」と呼ぶ

472 ：Name_Not_Found：2011/01/27(木) 13:23:39 ID:???

>>467
わざわざ調べていただいてありがとうございます。

マルチポストのことを知らなかったので
質問サイトにも質問をしていました、すみませんでした。

怖いおにいさんにまた叩かれちゃうので書き込みは控えます。

473 ：Name_Not_Found：2011/01/27(木) 13:24:58 ID:???

自分のことは棚に上げて他人を怖い物扱い

474 ：Name_Not_Found：2011/01/27(木) 13:36:18 ID:???

爆釣ですね。おめでとう

475 ：Name_Not_Found：2011/01/27(木) 13:55:50 ID:???

いつまで引っ張るんだよ糞虫ども

476 ：Name_Not_Found：2011/01/27(木) 14:23:34 ID:???

>>467
個別記事の2chのコピペ文章が
カラムから外れフロートされていた

477 ：Name_Not_Found：2011/01/27(木) 16:12:49 ID:???

>>476
バグでfloatのmarignが倍になったか、中身のmarginが相殺されず肥大してカラムが崩れたとか
ソースだけじゃ面倒くさいしもう知らね

478 ：Name_Not_Found：2011/01/28(金) 05:17:02 ID:???

>>477
わざわざ調べていただいてありがとうございました。
理由は分からないけど記事のHTMLのタグの付け方が悪かったみたいで、
なんとか解決しました。
ご迷惑をおかけしてすみませんでした。

479 ：Name_Not_Found：2011/01/28(金) 19:28:32 ID:cSZTy+p4

ie6のバグでmargin:auto;がきかないので
このようにしてセンタリングしてますけど

body{
text-align:center;}
div.wrap{
width:800px;
margin-left:auto; margin-right:auto;}

body自体に横幅、margin:auto;を指定してやれば
ie6でも普通に機能するんですね。さっき気付いたｗ

body{
width:800px;
margin-left:auto; margin-right:auto;}

480 ：Name_Not_Found：2011/01/28(金) 22:00:37 ID:???

>>479
わりと良く勘違いされるが、margin-left:auto; margin-right:auto; が無効なのは後方互換モードの時だけ。

481 ：Name_Not_Found：2011/01/29(土) 23:14:44 ID:???

<div style="background-color:cyan;">
<img src="image.png" style="max-width:100px;max-height:100px;float:left;">
タイトル<br>説明文説明文
</div>
と、書きました
http://sakurasite.homeip.net/imgboard/img-box/img20110129231038.png
chromeだと一番上の画像の通りにレンダリングされますが、二番目、三番目の様に表示するにはどう書いたらよいでしょうか
文章量は画像より高くなったりならなかったりまちまちです

482 ：Name_Not_Found：2011/01/29(土) 23:37:24 ID:???

↓div厨だなこりゃ。
<div style="background-color:cyan; min-height:100px;">
<div style="background:url(image.png) no-repeat; min-height:100px;">
<div style="margin-left:200px;">
タイトル<br>説明文説明文
<br>
～<br>
説明文説明文
</div>
</div>
</div>
あるいは
<img>をpositionで位置調節してmargin-leftでいいんじゃね。
<table>でもいい気がするけど。

483 ：Name_Not_Found：2011/01/30(日) 01:19:17 ID:???

どうも

484 ：Name_Not_Found：2011/01/30(日) 03:18:20 ID:???

display:block

485 ：Name_Not_Found：2011/01/31(月) 00:44:54 ID:???

<a href="aaa.html"><img src="aiueo.jpg"></img></a>
aタグで囲まれた画像にマウスオーバーしたときには pointer 、
<img src="aiueo.jpg"></img>
imgタグのみの場合は default っていう風にする方法教えてください

a:hover
{ cursor: pointer; }
img:hover
{ cursor: default; }
とやってもどちらの場合もカーソルの形が default になってしまいます

486 ：Name_Not_Found：2011/01/31(月) 00:47:49 ID:STSQUKFG

a img:hover
{ cursor: pointer; }

487 ：Name_Not_Found：2011/01/31(月) 00:56:06 ID:???

どうもです

488 ：Name_Not_Found：2011/02/01(火) 13:20:39 ID:???

質問です
<div id="～"　class="～">
と1つのdivに同時に設定しているのを見かけたんですが
何か意味があるんでしょうか？

489 ：Name_Not_Found：2011/02/01(火) 13:29:52 ID:???

idはCSSだけのものじゃないよ
JavaScriptなんかでも使う

490 ：Name_Not_Found：2011/02/01(火) 15:06:14 ID:???

>>489　javascriptでも使うんですね！ありがとうござます
でももしこれがCSSのIDセレクタだったらどういう意味があるんでしょうか？

491 ：Name_Not_Found：2011/02/01(火) 15:23:43 ID:???

>>488,490
id はフラグメント識別子の役割もある。
CSS としてはカスケード処理の関係で複数付けることも良くある。

<div id="Sample" class="hoge foo piyo">

無理して #Sample にまとめるより分けた方が管理しやすいことも多い。

492 ：Name_Not_Found：2011/02/01(火) 16:51:03 ID:???

>>491
ありがとうございます！参考になりました！

493 ：Name_Not_Found：2011/02/01(火) 19:00:20 ID:???

いいえ！どういたしまして！

494 ：Name_Not_Found：2011/02/01(火) 20:03:15 ID:???

>>491
ＩＥ6では確かclassは２つまでしか指定できないんでしたよね。

495 ：Name_Not_Found：2011/02/01(火) 20:12:08 ID:???

で？

496 ：Name_Not_Found：2011/02/01(火) 20:14:49 ID:???

ぶ？

497 ：Name_Not_Found：2011/02/01(火) 20:28:54 ID:???

女

498 ：Name_Not_Found：2011/02/01(火) 20:42:04 ID:???

>>494
IE6 では .hoge.foo が効かないが、class="hoge foo" は出来るから運用次第では使えるはず。

例えば、タブ型のUIを作りたいとする。
全てのタブは統一されたデザインを持つので、class="tab" を指定する。
その中で一つだけアクティブなタブが存在するので、アクティブなタブには class="active" を追加指定する。
最後にフラグメント識別子のために id を指定する。

<style>
.tab { border: solid 1px black; background-color: glay; }
.active { background-color: white; }
</style>
</head>
<body>
<ul><li><a href="#HTML">HTML</a></li><li><a href="#CSS">CSS</a></li><li><a href="#JavaScript">JavaScript</a></li></ul>
<div id="HTML" class="tab">HTML の解説</div>
<div id="CSS" class="tab active">CSS の解説</div>
<div id="JavaScript" class="tab">JavaScript の解説</div>

499 ：Name_Not_Found：2011/02/02(水) 16:52:54 ID:???

htmlに

<div id="header">
<p>テスト</p>
</div>

と書かれている時のcssファイル指定には

#header{
border:solid 3px #000000;
}

と

div#header{
border:solid 3px #000000;
}

の二通りの書き方があると思いますが頭にdivを付けない場合と付ける場合とでは何か意味が変わるのでしょうか？
参考書にはよく　「　div#header{　」と書かれています
「　#header{　」は「　*#header　」の省略形とも書かれていますがID名は1箇所にしか指定できない事のことで
htmlに <div id="header"> と書いた場合、div#header{と書いた他に例えば「　ul#header　」という別の指定は出来ないと思うのですが
id名のheaderはdiv要素に使われていると一目で分かると言う以外に何か重要な役割を果たしているのでしょうか？

500 ：Name_Not_Found：2011/02/02(水) 17:03:51 ID:???

＞ID名は1箇所にしか指定できない事のことで
そう。だから明示的であるという以外の意味はない。本来はね。
＞参考書にはよく　「　div#header{　」と書かれています
そんなはずはないと思うがどちらにせよ書いた奴の考えまでは知らんな。もしかしたらdivから書かなきゃいけないと勘違いしてるかもしれんし。

501 ：499：2011/02/02(水) 17:47:30 ID:???

#header{ と div#header{ はどちらの書き方も文法的(?)な間違いではなく考え方や好みの違いであり、
どちらかに個々が統一して書いていれば問題はないとの事かな
私の持っている本は div#header、 div#global-nav p#bannerなどの書き方に統一されていたので
#header{ との違いにふと疑問を持った次第です
モヤモヤが解消されそうです　ありがとうございます

502 ：Name_Not_Found：2011/02/02(水) 18:05:46 ID:???

要素名をつけない方がごく微妙に早いらしい

503 ：Name_Not_Found：2011/02/02(水) 19:08:16 ID:???

やだあたしdiv付けてる怖い…

504 ：Name_Not_Found：2011/02/02(水) 20:56:23 ID:???

>>503
テーブルで抱いてあげるよ

505 ：Name_Not_Found：2011/02/03(木) 01:25:28 ID:???

>>500
ごめんなさい、あたしタチなの
footerがっちり芋系が好きなんだけどスペックは？

506 ：Name_Not_Found：2011/02/03(木) 06:08:59 ID:???

P16px

507 ：Name_Not_Found：2011/02/04(金) 23:15:30 ID:???

タチって何

508 ：Name_Not_Found：2011/02/04(金) 23:41:01 ID:???

>>507
「質」のことだろう。

509 ：Name_Not_Found：2011/02/05(土) 10:28:50 ID:???

テーブルで表がいくつもあるサイトを作ろうと思っています
サイズが違うので一つ一つcssで設定するつもりです
ただデザインは統一したいのでborderやbackgroundなどデザイン部分まとめてだけ設定することってできますか？

510 ：Name_Not_Found：2011/02/05(土) 11:00:23 ID:y+Zyzrxr

一つ一つ違うものはidで指定して、
共通して使うデザイン部分はclassで指定する

511 ：Name_Not_Found：2011/02/05(土) 11:18:39 ID:???

>>510
<table id=***** class=*****>とするってことでしょうか？
idとclassを一緒につけれるってことをはじめて知りました
ありがとうございます！

512 ：Name_Not_Found：2011/02/05(土) 16:46:22 ID:???

他のスレでも聞いたのですが、相手にされないのでこちらに移動しました
お忙しいところすみません
当社のDQN社長から2月19日までに会社のHPを作れと言われました
ブログしかやったことがない自分には難題すぎます
「実践 Web Standards Design Web標準の基本とCSSレイアウト&Tips」という
本を買って頑張ってみたのですが無理でした・・・

↓レイアウトは決まっているのですがCSSがわかりません
http://nagamochi.info/src/up53810.gif

どなたかCSSを教えてください
宜しくお願い致します

513 ：Name_Not_Found：2011/02/05(土) 18:51:23 ID:???

>>512
近所にホームページ教室がないかタウンページで調べて味噌

514 ：Name_Not_Found：2011/02/05(土) 18:55:49 ID:???

で、いくら払うんだい？

515 ：Name_Not_Found：2011/02/05(土) 19:33:35 ID:???

>>512
初心者には難易度が高すぎる。
基本のレイアウトも作れないレベルなら無理だと思う。
レイアウトができてもその先で必ずつまずく。

516 ：Name_Not_Found：2011/02/05(土) 19:42:01 ID:???

>>512
ブログにしたら？

ならテンプレに似たようなのがあるかも
もしかすると作者に頼めば作ってくれるかも

517 ：Name_Not_Found：2011/02/05(土) 20:28:42 ID:fDrWbt9R

＞ブログしかやったことがない自分には難題すぎます

ブログが自由自在に操れるならｃｓｓなんて簡単だろ

FC2ブログはhtmlとcssの両方をカスタマイズできるから
それでやってみれば？

518 ：タクト ◆g3WCyGKBb. ：2011/02/05(土) 20:29:54 ID:???

生活保護でこんな立派な部屋を手に入れました！
http://suzu2011.blog96.fc2.com/

519 ：Name_Not_Found：2011/02/05(土) 20:35:30 ID:???

>>517
自由自在に操れるとはどこにも書いてないぞ
ブログしかできない人って、htmlすら理解してない人が大半だ
普通のサイト作りに挫折してブログに流れた人も多い品

520 ：Name_Not_Found：2011/02/05(土) 21:32:29 ID:???

最低限の骨組み
http://www.dotup.org/uploda/www.dotup.org1321408.txt

521 ：Name_Not_Found：2011/02/06(日) 11:47:46 ID:NA0YtQF3

>>512は偽者です

Webサイト制作初心者用質問スレ part223
http://hibari.2ch.net/test/read.cgi/hp/1296794731/4

上記スレの>>4です
もう少し自分で頑張ってみることになりました
大変お騒がせいたしました

522 ：Name_Not_Found：2011/02/06(日) 13:55:21 ID:???

せっかく作ってくれた>>520はスルーなのね

523 ：Name_Not_Found：2011/02/06(日) 14:48:22 ID:???

>>520が何なのかも分かってないのかも？

524 ：Name_Not_Found：2011/02/06(日) 14:58:51 ID:???

そのようだなｗ

525 ：Name_Not_Found：2011/02/08(火) 15:34:02 ID:???

IE8ですが、XPと7で、表示が異なります。
原因は何が考えられますか。

D0CTYPE宣言してません。
MakeShopを使ってるんですが、そこの仕様のため。
それぞれ互換表示、非互換表示で比べましたが、
やはりXPと7で異なります。
XPのIE8をベースにしてたので、
7のIE8だと画像がずれてるところがあるんです。

ふたつの表示を合わせるのは難しいでしょうか。

526 ：Name_Not_Found：2011/02/08(火) 15:42:58 ID:???

いやDOCTYPE宣言しろよ

527 ：Name_Not_Found：2011/02/08(火) 15:52:10 ID:???

>>526
本当に、宣言したいです。
MakeShopの仕様で宣言できないから
ブラウザごとの表示ずれを解消するのに
苦労してます。
今回は、同じブラウザでずれが出てるので、
どうしていいのか、行き詰まってます。

528 ：Name_Not_Found：2011/02/08(火) 19:18:36 ID:???

問い合わせた方がいいんじゃない
文法滅茶苦茶でそもそも宣言のしようがないのかもしれないけど

529 ：Name_Not_Found：2011/02/08(火) 19:39:04 ID:???

>>525
標準フォントじゃね？

530 ：525：2011/02/08(火) 20:05:01 ID:???

>>528
<head>内を触れない仕様なんです。
だから、cssやjsを外部読み込みするためのコードは、
body内に記述しているんです。
それでも、動くので、
このへんは、柔軟性があるんですね。

>>529
MSとメイリオの違いは、忘れてました。
書体のツラは、メイリオのほうが横幅がありそうなので、
そのへんは気にして組んでたんですが、
いまずれてるのは、jpg画像が本来より下にずれてるという状況です。
でも、どこかでフォントが影響を及ぼしてないか、
一度チェックしてみます。
ありがとうございます。

531 ：Name_Not_Found：2011/02/10(木) 12:24:21 ID:???

>>530
そのソフトがどうであれ
メモ帳で開けばいいだけだがな

532 ：Name_Not_Found：2011/02/10(木) 14:07:44 ID:???

ソフトじゃなくて糞ホスティングらしいよ

533 ：Name_Not_Found：2011/02/10(木) 14:24:54 ID:n8wGoT44

>>531
MakeShopでぐぐってみれば判るのに

534 ：Name_Not_Found：2011/02/10(木) 15:06:46 ID:???

>>530
CSSはリセットしてあるの？
画像はa要素？

535 ：Name_Not_Found：2011/02/10(木) 16:35:33 ID:ENeYxcbB

┌────────┬──┐
｜┏━━━━━━┓｜　　｜↑
｜┃　　　　　　　　 .┃｜　　｜｜
｜┃　　　　　　　　 .┃｜　　｜ C
｜┃　　　　　　　　 .┃｜　　｜｜
｜┃　　　　　　　　 .┃｜　　｜｜
｜┗━━━━━━┛｜　　｜↓
└────────┴──┘
. ←──　A　───→← B →

A: ウィンドウの幅に合うように伸縮
B: ウィンドウの幅によらず固定
C: ウィンドウの高さに合うように伸縮
太線: ウィンドウの幅、高さによって伸縮するoverflow:scrollのボックス

↑みたいなボックスを実現したいのですが
　どうしたらいいか教えてください。

536 ：Name_Not_Found：2011/02/10(木) 18:21:58 ID:???

せめて「こうしてみたんですがうまくいかない」と書いた奴を貼るぐらいはしてほしい

537 ：Name_Not_Found：2011/02/10(木) 19:05:28 ID:n8wGoT44

>>535
まず全体のレクタングルを定義する
次にＡレクタングルを定義してから中のスクロール部分を定義
最後にBレクタングルを定義すればＯＫ
簡単だよ

538 ：Name_Not_Found：2011/02/10(木) 19:59:43 ID:???

>>537は頭の悪い回答の例です。
みんなは真似しないようにね！

539 ：Name_Not_Found：2011/02/10(木) 20:30:49 ID:???

>>538 が頭のいい回答をしてくれるようですので、皆沈黙して待つべし。

540 ：Name_Not_Found：2011/02/10(木) 20:57:20 ID:???

>>539はヘタクソな煽りの例です。
みんなは真似しないようにね！

541 ：Name_Not_Found：2011/02/10(木) 21:00:52 ID:???

ケチが付いた質問は >>538 に任せて、次の質問どうぞ

542 ：Name_Not_Found：2011/02/10(木) 21:24:56 ID:ENeYxcbB

では失礼して

┌────────┬──┐
｜┏━━━━━━┓｜　　｜↑
｜┃　　　　　　　　 .┃｜　　｜｜
｜┃　　　　　　　　 .┃｜　　｜ C
｜┃　　　　　　　　 .┃｜　　｜｜
｜┃　　　　　　　　 .┃｜　　｜｜
｜┗━━━━━━┛｜　　｜↓
└────────┴──┘
. ←──　A　───→← B →

A: ウィンドウの幅に合うように伸縮
B: ウィンドウの幅によらず固定
C: ウィンドウの高さに合うように伸縮
太線: ウィンドウの幅、高さによって伸縮するoverflow:scrollのボックス

↑みたいなボックスを実現したいのですが
↓からどうしたらいいですか？

<div style="width:1000px;">
　<div style="width:700px;float:left;">
　　<div style="width:600px;overflow-x:auto;overflow-y:auto;"></div>
　</div>
　<div width="width:200px;float:right;">
　</div>
</div>
　

543 ：Name_Not_Found：2011/02/10(木) 21:28:46 ID:???

では >>538 回答をどうぞ。

544 ：Name_Not_Found：2011/02/10(木) 22:20:20 ID:???

overflow-xとかって先行実装だよ

545 ：Name_Not_Found：2011/02/10(木) 23:25:35 ID:oed2uBP1

>>542
javascript使わないと無理じゃね？

546 ：Name_Not_Found：2011/02/11(金) 00:14:45 ID:???

>>542
http://jsbin.com/oreru3/1

547 ：Name_Not_Found：2011/02/11(金) 12:42:18 ID:???

少しはテーブルの使い方を勉強しろよ

548 ：Name_Not_Found：2011/02/11(金) 12:56:29 ID:???

>>547
誰に言ってるんだ？

549 ：Name_Not_Found：2011/02/11(金) 15:03:16 ID:???

レスアンカーぐらいつけろよ

550 ：Name_Not_Found：2011/02/11(金) 15:18:33 ID:o0lCCYmT

#container {
width:1000px;
margin:0 auto;
background-color:#fff;
}
#main {
width:800px;
float:left;
}
#side {
width:200px;
float:left;
}

<div id="container">
<div id="main">
aa<br>aa<br>aa<br>aa<br>aa<br>aa<br>aa<br>aa<br>aa<br>aa<br>aa<br>aa<br>aa
</div>
<div id="side">
aa
</div>
</div>

containerの要素（白地の背景、高さ）がmain,sideに受け継がれないんですがどうしたらよいでしょうか？

551 ：Name_Not_Found：2011/02/11(金) 15:34:32 ID:???

そもそもcontainerに高さを指定していないようだが
背景色もinherit使わんと継承されんよ

552 ：Name_Not_Found：2011/02/11(金) 15:36:33 ID:???

inherit

553 ：Name_Not_Found：2011/02/11(金) 15:38:38 ID:???

すみません。
カラーはできました。

ただmainとsideの高さを揃えるにはどうしたら良いのでしょうか？

554 ：Name_Not_Found：2011/02/11(金) 16:00:59 ID:???

>>553
display: box; か display: table-cell;
IE7以下に対応させたいなら、JavaScript で。
http://css-tricks.com/equal-height-blocks-in-rows/

555 ：Name_Not_Found：2011/02/11(金) 16:08:35 ID:???

>>553
http://www.google.co.jp/search?q=div+float+%8D%82%82%B3

556 ：Name_Not_Found：2011/02/11(金) 22:28:26 ID:1csCD0bU

>>550
#container {overflow:hidden;}
#main,#side{margin-bottom:-32768px;padding-bottom:32768px;}
追加すれば高さそろう

557 ：Name_Not_Found：2011/02/11(金) 22:45:12 ID:???

>>554->>556
ありがとうございます
出来ました！

558 ：Name_Not_Found：2011/02/13(日) 00:34:18 ID:???

text-indent:-9999pxが効かず画像置換ができません。
よろしくお願いします

ttp://codepad.org/22VEJ5sO

559 ：Name_Not_Found：2011/02/13(日) 09:28:48 ID:SaFohdPO

削除　#lie li {display:block;}
追加　#lie a {display:block;}
かな？？違ったらfloatかも
てか、text-indent:-9999pxとか初めて知った

560 ：Name_Not_Found：2011/02/13(日) 12:16:52 ID:???

タグごとにちゃんとブロックレベルなのかインラインなのか見ておいた方がよくないか？

561 ：Name_Not_Found：2011/02/13(日) 14:40:29 ID:???

> margin-bottom:-32768px;padding-bottom:32768px;
> text-indent:-9999px
何かまともでないHack臭がしますが、将来的にも大丈夫なの?

562 ：Name_Not_Found：2011/02/13(日) 16:07:48 ID:???

小手先こねくり集を見てｽｹﾞｰって思ってやってみたってとこかな ?

563 ：Name_Not_Found：2011/02/13(日) 17:34:38 ID:???

>>text-indent:-9999px

h1とかSpriteメニューのliを、画像だけにしたい時によく使われる
例えばYahooとかAppleとか
だんだんと減ってきている気がしなくもないけど

564 ：Name_Not_Found：2011/02/13(日) 17:49:02 ID:IjIxUKDf

IE 6とIE 7を無視できるようになったら、画像置換は、before/after疑似要素に生成内容としてdataスキームURIの画像を入れる手法が一般的になると思う。

565 ：Name_Not_Found：2011/02/13(日) 18:59:12 ID:???

>>561
後者はCSSの仕様的に将来的にも恐らく大丈夫
前者はUA依存らしいからそのうちポシャる

566 ：Name_Not_Found：2011/02/13(日) 19:07:09 ID:IjIxUKDf

>>565
> 後者はCSSの仕様的に将来的にも恐らく大丈夫
> 前者はUA依存らしいからそのうちポシャる

根拠を示せますか？

567 ：Name_Not_Found：2011/02/13(日) 19:15:23 ID:???

>>561
> margin-bottom:-32768px;padding-bottom:32768px;
そもそも>553の要件を満たせていない。
ボックスに border を適用したら border-bottom が見えなくなる。

> text-indent:-9999px
どんな形であれマークアップされたテキストを読めなくするのはSEO対策的によろしくないので、今はあまり使われない。

568 ：553：2011/02/13(日) 19:38:19 ID:???

marginの件は間違えて書いてましたｗ

text-indentを使わない方がいいとなると、みなさま画像置換はどうされていますか？

569 ：Name_Not_Found：2011/02/13(日) 20:16:40 ID:IjIxUKDf

>>567
> > margin-bottom:-32768px;padding-bottom:32768px;
> そもそも>553の要件を満たせていない。
> ボックスに border を適用したら border-bottom が見えなくなる。

確かにその通りです。
「margin-bottom:-32768px;padding-bottom:32768px;」は、正確には背景が描かれる範囲を拡げるテクニックであり、高さを合わせるテクニックではありません。
ということは、背景が描かれる範囲を拡げる目的であれば、使っても差し支え無いと思います。

>>568
現時点では素直にimg要素。
将来は>>564の方法を使うと思います。

570 ：Name_Not_Found：2011/02/13(日) 20:25:23 ID:???

>>567
いやいや適切なマークアップのために使うもんだろう

571 ：567：2011/02/13(日) 21:17:19 ID:???

俺は >565 ではないが、レスをもらったので…。

>>569
> 但し、ブラウザが理解できる値は-32767～32767ですので、その範囲外の数字は指定しないでください。
> http://scuderia-web.com/tips/xhtml_css/equal_box_heights.php
32767 の値に根拠が欲しい。
少なくとも CSS3 では規定されていない。http://www.w3.org/TR/css3-values/#numbers
実装依存なら 32768px に依存すべきではない。今後、実装が変化する可能性が高い。

>>568
>569の指摘通り、現在は <img src="foo.jpg" alt="テキスト" /> が妥当だと思う。
bot はaltテキストも解釈してくれる。

.hoge { background-image: url("hoge.jpg"); text-indent: -9999px; }

このスタイルには2つの問題がある。

・background-image を前景画像であるかのように使っている。(前景画像はimg要素でマークアップすべき)
・text-indent: -9999px; でテキストを読めなくしている。(検索エンジンスパムと判定される可能性がある。9999px の値に根拠がない。確実に見えなくなることが保証されない。)

基本的に実装を信用すべきではないと思う。

572 ：556：2011/02/13(日) 23:16:11 ID:SaFohdPO

>>567
>561
> margin-bottom:-32768px;padding-bottom:32768px;
> そもそも>553の要件を満たせていない。
> ボックスに border を適用したら border-bottom が見えなくなる。
divを被せてborder-bottomとゆー手があってな・・

>>571
>32767 の値に根拠が欲しい。
とりあえず、自分は20000ぐらいまでにしときます。

てか、553の現状がわからないw

573 ：Name_Not_Found：2011/02/13(日) 23:39:16 ID:???

＞32767
http://b.hatena.ne.jp/entry/coliss.com/articles/build-websites/operation/css/558.html
http://css-happylife.com/archives/2007/1025_1325.php

574 ：556：2011/02/13(日) 23:46:05 ID:SaFohdPO

とりあえず現状はIE6でも最新の5ブラウザでも32768で問題ないです。
将来はわかりませんけど。

575 ：567：2011/02/14(月) 00:13:00 ID:???

>>573
ありがとう。IE (バージョン未記入) の実装依存なのか…。

>>572,574
値の問題ではなく、「実装は仕様と比べて不安定だから仕様に準拠すべき」ということを伝えたかった。
全ての実装を確認したとして、ブラウザが更新されて実装が変わる度にコードに修正を加える、なんて面倒くさすぎるんじゃないだろうか。

また、固定値を与える方法は一定の条件を満たさないと期待通りに動作しない。

・32767px 以上の高さのボックスが形成されたときに margin-bottom:-32767px; は破綻する。
・9999px 以上の幅のボックスが形成されたときに text-indent: -9999px; は破綻する。

>554 のように既に CSS に用意されたプロパティがあるのだからそちらを優先して使うべきだと思う。
その上で IE7- だけ処理を分ければいい。JavaScript で対応するか、先述のCSSハックを使うか。(前者の方が安定している)
CSSに限らないが、最も低機能な実装に合わせて不安定なコードを全てのUAに適用するのは無駄に不安定要素を大きくするだけなので、お勧めしない。

576 ：556：2011/02/14(月) 00:34:27 ID:tvSEGdP8

>>575
勉強になりました。ありがとうございますｍ（＿　＿）ｍ

577 ：Name_Not_Found：2011/02/14(月) 01:45:36 ID:???

> そちらを優先して使うべきだと思う。その上で IE7- だけ処理を分ければいい。
そこまでするぐらいなら、素直にtableタグを使えば済むのにと思うんだが

578 ：Name_Not_Found：2011/02/14(月) 02:26:39 ID:???

この流れでなぜtableレイアウトを勧めるんだろう。

579 ：Name_Not_Found：2011/02/14(月) 03:38:07 ID:???

どのあたりが素直なのかわからんが
boxは先行実装だしtable-cellはtable-rowの中に入れないとあかんし

580 ：567：2011/02/14(月) 09:28:03 ID:???

>>579
box はまだ安定していないので現実的には table-cell を使うことになるかと。(Recommendation になれば box がより向いている気はするが)

CSS 2.1 table model では table-cell の親要素が table-row ではない場合に対応する要素を補完しなければならないので table-row に関しては問題ないと思う。
http://www.y-adagio.com/public/standards/tr_css2/tables.html#anonymous-boxes
http://www.w3.org/TR/CSS2/tables.html#anonymous-boxes

581 ：Name_Not_Found：2011/02/14(月) 15:33:04 ID:???

>>580
tableもrowもcellも省略できるのか。便利だなこれ

582 ：Name_Not_Found：2011/02/14(月) 22:18:55 ID:???

>>569
imgは全然素直じゃない
あれは画像がメインの場合であって、メニューの文字を画像に置き換える類のものではない

583 ：Name_Not_Found：2011/02/15(火) 00:00:43 ID:???

>>582
テキストを画像に置換する実装が素直じゃない、ということかと。
text-indent: -9999px; が素直な実装とは思えない。

584 ：Name_Not_Found：2011/02/15(火) 00:27:48 ID:???

並べてみればわかる。
http://codepad.org/Z9aUFU4D

585 ：Name_Not_Found：2011/02/15(火) 00:51:54 ID:???

素直＝楽って意味で言ったんじゃないん

586 ：Name_Not_Found：2011/02/15(火) 02:22:38 ID:???

みんなimgにしないのは、altが要素の代替ではないと考えるからかね
CSSで飛ばした方がHTMLに無理がないと

あとはz-indexか

587 ：569：2011/02/15(火) 03:05:33 ID:DNB9Oy2K

>>583
「現時点では（昔からの習慣に）素直に（従って）img要素（を使います）。」と補完してください。

img要素が理想的な画像置換じゃないことは私も承知しています。
本来内容となるべきテキストを属性値に追い遣るのは変だと思います。

しかしながら、それ以外には、もっと気持ち悪い方法か、理想的だけど実装が追いついていない方法のどちらかしかないのです。

テキストを飛ばす方法は、>>571の指摘する「2つの問題」がありますし、
さらに画像が読み込まれなかったときにテキストが表れないという欠点もあるので、好きではありません。

588 ：569：2011/02/15(火) 03:16:35 ID:DNB9Oy2K

CSS3では、疑似要素ではない、普通の要素の内容も生成内容で置換できるようになります。
（http://www.w3.org/TR/css3-content/#inserting3）

foo {
content: url(...), contents;
}

これが理想的な画像置換でしょうが、広く実装されるまで別の方法で我慢するしかありません。

CSS2で、生成内容はbefore/after疑似要素特有のプロパティでした。
じゃあ、before/after疑似要素に画像を生成して代替手段としよう……と言いたいところですが、
before/after疑似要素をサポートしないブラウザがまだ広く使われています――IE 6とIE 7です。

IE 6とIE 7を無視してよくなったら、before/after疑似要素による画像置換を採用し、
CSS3の時代になったら、普通の要素の内容を生成内容で置換する方法に切り替えると思います。

589 ：Name_Not_Found：2011/02/15(火) 10:08:03 ID:YPlNEjKd

糞IE6対策で標準モードの記述をし、
ローカルで問題無くセンタリングで表示したので鯖に転送したら左寄せ…。

なんだよ、ソースの先頭に自動広告が付いて、強制的に後方互換モードじゃん！

久々に初心者やらかしたｗ
あーあ、また「text-align:center;」のお世話になるのね。

590 ：Name_Not_Found：2011/02/15(火) 12:27:59 ID:???

糞広告が入った時点でそれはもはやHTMLじゃない……

591 ：Name_Not_Found：2011/02/15(火) 13:09:02 ID:???

ヘンテコな無料鯖の広告はHTMLを阻害する

592 ：Name_Not_Found：2011/02/17(木) 03:01:13 ID:8zKACwJ8

letter-spacingで横幅を取りたいのですが
1px以下の単位はないのでしょうか？

0だと窮屈ですが、1pxだと開きすぎな気がしてます

593 ：Name_Not_Found：2011/02/17(木) 04:37:04 ID:???

小数点知らないの？
でもIEだと0.5単位でしか効かなかったかな？

594 ：Name_Not_Found：2011/02/17(木) 13:24:50 ID:???

スクリーンで0.5pxとかできるのかよ

595 ：Name_Not_Found：2011/02/17(木) 17:48:58 ID:???

A:hoverにtext-decoration : underline;を記述しているのですがマウスを当てたときに下線が出てきません
要因として何が考えられるでしょうか？

596 ：Name_Not_Found：2011/02/17(木) 18:01:51 ID:???

マルチ止めれ

180 Name_Not_Found [sage] 2011/02/17(木) 17:50:35 ID:??? Be:
cssでA:hoverにtext-decoration : underline;を記述しているのですがマウスを当てたときに下線が出てきません
要因として何が考えられるでしょうか？

597 ：Name_Not_Found：2011/02/17(木) 18:27:48 ID:???

>>596
一々うるせえぞカス
お前にはまだ2ちゃんは早い回線切ってロムってろ

598 ：Name_Not_Found：2011/02/17(木) 18:32:44 ID:???

だまっとけよおっさん年がバレるぞ＾＾；

599 ：Name_Not_Found：2011/02/17(木) 18:38:45 ID:???

>>597
ﾜﾛﾀ

600 ：Name_Not_Found：2011/02/17(木) 18:42:54 ID:???

>>597
回線切ってROMｗｗｗｗｗｗｗｗｗﾃﾗ矛盾ｗｗｗｗｗｗｗｗｗｗｗｗｗｗ

601 ：Name_Not_Found：2011/02/17(木) 21:21:37 ID:???

よ～しパパ　回戦切ってROMちゃうぞ～～

602 ：Name_Not_Found：2011/02/17(木) 21:29:16 ID:???

回線切るとかテレホーダイかよ

603 ：Name_Not_Found：2011/02/18(金) 02:56:18 ID:???

ページを表示するときに背景色が遅れて表示されるんですが、CSSに問題があるんでしょうか？
HTMLが問題なのか、ブラウザが問題なのか、サーバーの性能が問題なのか分からないので原因を探ってます。

604 ：Name_Not_Found：2011/02/18(金) 13:49:42 ID:???

テレホタイムに保存して、後で読んだりしてたな

605 ：Name_Not_Found：2011/02/18(金) 14:20:19 ID:YSS34YOL

606 ：Name_Not_Found：2011/02/18(金) 21:52:34 ID:???

>>603
ソース

607 ：Name_Not_Found：2011/02/18(金) 22:21:12 ID:???

>>603
cssファイルを一番最後においてないか？
head内においてみ。

608 ：Name_Not_Found：2011/02/19(土) 06:24:43 ID:???

　な　ん　な　ん　だ　　こ　の　低　ラ　ベ　ル　は !

609 ：Name_Not_Found：2011/02/19(土) 10:26:04 ID:???

>>608
お前の寝てる間に、口の中にカメムシ１００匹入りますように。

610 ：Name_Not_Found：2011/02/19(土) 11:43:37 ID:???

まだカメムシは食ったことが無い

611 ：Name_Not_Found：2011/02/19(土) 14:29:20 ID:???

パクチーで代用すれば良し

612 ：Name_Not_Found：2011/02/20(日) 12:29:54.12 ID:idSymTrd

既出ならごめんなさい。

下記にbox-shadowを適用させる良い方法教えて下さい。
・IE7以後
・divの枠
・divの枠内背景は透過png(5×5を並べてる）

現状では、カラムが崩れたり、背景全部が黒くなったり、
まったく違う場所に影ができたりと、上手くいきません。
たぶん、私の技術不足が重なっておかしくなってるのだと思います。
そこで、皆様お勧めの方法に絞って、検討したいと思います。

613 ：Name_Not_Found：2011/02/20(日) 13:17:58.95 ID:6sOwfSHS

>>612
filter shadow

614 ：Name_Not_Found：2011/02/20(日) 13:39:24.90 ID:???

>>612
IE7 は box-shadow に対応していなかったはずだが…。
https://developer.mozilla.org/en/css/-moz-box-shadow

615 ：Name_Not_Found：2011/02/20(日) 15:54:01.25 ID:idSymTrd

>>613,614
ありがとうございます。

枠内の背景自体も黒くなってしまいます。
単一色の背景だと大丈夫です。
そこで、よろしければ追加質問させて下さい。
原因はどちらでしょう？
・そもそも透過pngと併用できない。
・私のやり方が間違ってる。

616 ：Name_Not_Found：2011/02/20(日) 22:15:49.70 ID:hzRvTuWp

>>615
#a{width:100px;height:100px;filter:progid:DXImageTransform.Microsoft.Shadow(Strength=4,Direction=135,Color='#999999');}
#a div{width:100px;height:100px;background:#fff url('hoge.png');}

<div id="a">
<div></div>
</div>

617 ：Name_Not_Found：2011/02/21(月) 01:29:32.88 ID:c+YD+p//

http://www.nicovideo.jp/watch/sm13661472
初心者はこういうのみて勉強するべき

618 ：Name_Not_Found：2011/02/21(月) 02:08:18.49 ID:???

IEのバージョン毎にバグを把握してコーディングするのが面倒だったら、こういうの使ったらどうかね？
使ってないので使用感は知らないまま勧めてるんだけど

ttp://code.google.com/p/ie7-js/

サンプルは外部リンクになってるけど、ダウンロードしてディレクトリにも置ける
これは何なのかって言うと…続きはGoogleで

ttp://www.google.co.jp/search?hl=ja&lr=lang_ja&safe=off&tbs=lr%3Alang_1ja&q=ie7.js+ie9&btnG=%E6%A4%9C%E7%B4%A2

619 ：Name_Not_Found：2011/02/21(月) 02:12:43.53 ID:???

肝心な事かを書き忘れたけど、バグだけじゃなくて未対応タグとかにも効く

620 ：Name_Not_Found：2011/02/21(月) 03:24:58.34 ID:???

DWMXをずっと使ってたんだけど
プレビュー機能の無能さにいい加減イライラするので
何かいい感じのCSSエディタないかなと思ってるけど無いですか
DWはCS3が欲しいんだけど今探してもないし
更にDWは学生の時に買ったのでその時は安かったけど
流石に卒業した今ではDW高くて手が出せない
MACだとCODAとかがいいって聞くけど
Windowsで探してます

621 ：Name_Not_Found：2011/02/21(月) 07:48:53.18 ID:???

>>620
DWはどこが使いやすかった？

622 ：Name_Not_Found：2011/02/21(月) 09:38:58.38 ID:j8NH73Li

>>616
ありがとうございます。
やっぱり透過無くさなくてはいけない感じですね。
>>618
ありがとうございます。
ちょっと私の技量では上手くいかなかったのですが、
このようなのを使う方向で検討進めたいと思います。

623 ：Name_Not_Found：2011/02/21(月) 11:35:10.69 ID:???

>>622
基本、フォトショップでデザイン組んで
素材作って、それをCSSでコーディングってスタンダードな方法なんだけど

以前はCSSじゃなくてテーブルだったから、DWMXだと
フォトショでスライス切ってDWでソース修正で鬼速だった

けど、MXのプレビュー機能がCSSに追いつかなくなってからはもうグダグダ
プレビュー機能が少しも役に立たないから便利な所が一つも無くなった

様はテーブル時代の時のようにCSSも問題なく
さくさく同時プレビューしてくれよという所です

624 ：Name_Not_Found：2011/02/21(月) 11:37:01.76 ID:???

すみません>>623は>>621へ

625 ：</a>：2011/02/21(月) 12:44:06.08 ID:???

test

626 ：Name_Not_Found：2011/02/21(月) 13:40:24.27 ID:???

ＭＸ古すぎだろw
テーブルレイアウトなんて
ださすぎ

627 ：Name_Not_Found：2011/02/21(月) 13:50:38.82 ID:???

HTMLコーディングするだけならMXで十分
日本語UTF-8も正常に動くし

628 ：Name_Not_Found：2011/02/21(月) 14:10:30.54 ID:???

>>620
CS3のプレビューは無能だよ
DWのプレビューがまとに使えるのは、WebKitに乗せ換えたCS4以降

629 ：Name_Not_Found：2011/02/21(月) 14:44:30.20 ID:???

>>626
いまテーブルは使ってないよ
CSSつってんですが

>>628
そうなんだ！
なんかCS3なら大丈夫って言われてた気がしたけど４からだったのか
有難う御座います助かります
にしても、高いよ・・・高いよDW・・・

630 ：Name_Not_Found：2011/02/22(火) 22:03:57.15 ID:???

ie6のコメントバグも結構困り者だったな



　　　　↓



cssの記述に間違いがあると思って何時間費やしたか。。。

631 ：Name_Not_Found：2011/02/24(木) 22:15:41.79 ID:???

>>630
それはバグなのか…。条件付きコメントなのでは？

632 ：Name_Not_Found：2011/02/24(木) 22:33:06.65 ID:???

条件付コメントにするのは、コメントバグの回避法らしいよ

633 ：Name_Not_Found：2011/02/24(木) 23:44:13.01 ID:???

コメントバグｗｗｗ
何年か前に発生したなぁ。

634 ：Name_Not_Found：2011/02/25(金) 00:24:29.77 ID:???

http://www.nicovideo.jp/watch/sm13674914
こういう動画で勉強してからＣＳＳこい

635 ：Name_Not_Found：2011/02/25(金) 02:06:17.99 ID:???

だからどんなバグなんだ…ってぐぐってみたが、これか

IE6 Duplicate Characters Bug - CSS fixes and workarounds
http://positioniseverything.net/explorer/dup-characters.html

636 ：Name_Not_Found：2011/02/28(月) 14:01:02.24 ID:???

初心者ですがお願いします。
このサイトのフォントを変更したいと思います。
http://kenji1234.blog75.fc2.com/

/* フォントを変更する */
body{
font-family :'IPAMonaPGothic','ＭＳＰゴシック',sans-serif !important;
}

上記の内容を、サイトのcssの何行目に挿入すれば良いですか？

637 ：Name_Not_Found：2011/02/28(月) 14:02:34.40 ID:???

文字コード指定以降ならどこでもいい

638 ：Name_Not_Found：2011/02/28(月) 14:06:59.59 ID:???

>>637
すばやい回答をありがとうございます。
本当にすみませんが、文字コード指定とはどこですか？
ぐぐったのですがよく分かりませんでした。
お願いします。

639 ：Name_Not_Found：2011/02/28(月) 14:11:18.80 ID:???

ぐぐって分からんとは重症だな

んじゃ猫でも分かるように教えてあげよう
「１行目じゃなければどこでもいい」

640 ：Name_Not_Found：2011/02/28(月) 14:16:36.71 ID:???

>>639
分かりやすい説明をありがとうございます。
１行目以外に挿入してみたのですが、なぜかフォントが変更されません。。
何がおかしいのでしょうか？

641 ：Name_Not_Found：2011/02/28(月) 14:26:15.89 ID:???

>>640
6行目を削除しないとダメだよ

642 ：Name_Not_Found：2011/02/28(月) 14:43:14.75 ID:???

>>641
できました！感動です！ありがとうございました！

643 ：Name_Not_Found：2011/02/28(月) 14:55:59.80 ID:???

>>636です、また失礼します。
http://kenji1234.blog75.fc2.com/
このサイトのフォントは変更できました。
次は２ちゃんねる全体のフォントを変更したいのですが、
そんなことって可能ですか？
（フォントをモナーフォントにして、AAを綺麗に見たいのです。）
重ね重ね心苦しいですがお願いします。

644 ：Name_Not_Found：2011/02/28(月) 15:17:26.15 ID:???

ユーザースタイルシートでぐぐれ

645 ：Name_Not_Found：2011/02/28(月) 15:19:44.18 ID:???

>>644
はい、やってみます！

646 ：Name_Not_Found：2011/02/28(月) 15:30:27.86 ID:???

ユーザースタイルシートを変更しました。（macでsafari使用です）
どうやら全てのサイトに適用されるみたいで…。
2ちゃんねるだけをモナーフォントにしたいです。
分かる方いらっしゃったらどうぞお願いします。

647 ：Name_Not_Found：2011/02/28(月) 15:54:54.45 ID:???

ユーザースタイルシート Safari でぐぐれ
上位300件くらい読んでも分からなかったらまた来なさい

648 ：Name_Not_Found：2011/02/28(月) 16:01:58.88 ID:???

>>647
ありがとうございます！やってみます！

649 ：Name_Not_Found：2011/02/28(月) 16:11:55.38 ID:???

・サイト毎にスタイル－シートを利用するには。
http://app.m-cocolog.jp/t/typecast/6082/6981/21054399

・SafariStand/ サイトごとにフォントを変更する
http://wakabamac.blog95.fc2.com/blog-entry-190.html

これらを参考にしたらできました！
本当にありがとうございました。感謝です。m(__)m

650 ：Name_Not_Found：2011/02/28(月) 16:27:25.53 ID:???

うむ、解決法をしっかり報告
模範的な質問者でござる(＾＾)ｖ

651 ：Name_Not_Found：2011/02/28(月) 18:03:07.94 ID:Z3DA+QVS

稀にみるw

652 ：Name_Not_Found：2011/02/28(月) 20:18:56.06 ID:???

外部CSSでテーブルを制御したいのですが二つ質問です

3列のテーブルで全体の幅を500pxとする時
100px、200px、200pxで固定したい場合は
どうすればいいでしょうか？

あと一行ごとに背景色を#FFFFFFと#CCCCCCで
交互に変えたいのですがこれもCSSで一括で指定できますでしょうか？

よろしくお願いします

653 ：Name_Not_Found：2011/02/28(月) 21:08:47.02 ID:???

1．それぞれのカラムにクラスを付与して横幅を指定する
2．「css nth-child(even)」でググれ

654 ：Name_Not_Found：2011/03/01(火) 13:07:40.80 ID:???

div{display:inline-block;vertical-align:top;}のときに、

☆<div>ａ<br>ｂ</div>とすると、
┏━━━━┓
┃☆ａ　　┃
┃　ｂ　　┃
┃　ｃ　　┃
┃　　　　┃
┃　　　　┃
となってくれますが、
☆<div>ａａａａａ<br>ｂｂｂｂｂ</div>とすると、
┏━━━━┓
┃☆　　　┃
┃ａａａａ┃
┃ａ　　　┃
┃ｂｂｂｂ┃
┃ｂ　　　┃
となってしまいます
これを、
┏━━━━┓
┃☆ａａａ┃
┃　ａａ　┃
┃　ｂｂｂ┃
┃　ｂｂ　┃
┃　　　　┃
とするにはどうしたらいいのでしょうか？
CSS2.1以下で優しく教えてください

655 ：Name_Not_Found：2011/03/01(火) 14:28:13.65 ID:???

>>654
body {font-size:80%;}

656 ：Name_Not_Found：2011/03/01(火) 15:04:57.65 ID:???

なにが
優しく
だ

657 ：Name_Not_Found：2011/03/01(火) 15:09:15.52 ID:???

>>654
それはどうみても inline-block の挙動じゃない…。

658 ：Name_Not_Found：2011/03/01(火) 15:21:06.09 ID:???

>>654
http://jsfiddle.net/umrux/

659 ：658：2011/03/01(火) 15:22:30.20 ID:???

失礼。CSS2.1 では無理だな。

660 ：Name_Not_Found：2011/03/01(火) 15:44:07.79 ID:???

>>654
HTML5 なら <wbr> が使える。Opera の実装が追いついてなかった気がするが。

661 ：Name_Not_Found：2011/03/01(火) 19:51:14.11 ID:???

質問失礼致します。

table内でpaddingを指定してもie6では表示されないのですが、以下のような場合、｢あ｣の前にpaddingをとろうとするならどういった記述にすればいいでしょうか？
文字列をclassで指定してmarginをとるべきでしょうか？

<table>
<tr>
<td>あいうえお</td>
</tr>
</table>

662 ：Name_Not_Found：2011/03/01(火) 19:59:16.13 ID:???

>>661
margin, padding はインラインボックスには適用できない。
inline-block にすればいいが、IE6 は inline-block に対応しないので擬似的に再現する。
http://www.yomotsu.net/wp/?p=390

663 ：Name_Not_Found：2011/03/02(水) 04:12:36.81 ID:???

すみません。
youtubeをブログに埋め込んだ時、画面を上にスクロールしたら、
埋め込んだyoutubeだけが最前面に表示されるのが嫌で、背面に直したいのですが。。。
対応できるCSSとかありますでしょうか＞＜
Firefoxでは問題なく背面でスクロールするのですが、IE8では最前面になります＞＜
初心者ですみません。。。

664 ：Name_Not_Found：2011/03/02(水) 04:18:58.86 ID:???

ブログに、PrettyPhotoをプラグイン追加したら、画像広告が出現したのですが、消す方法（CSS）はありますか？

665 ：Name_Not_Found：2011/03/02(水) 08:04:10.97 ID:???

>>664
PrettyPhotoの規約読みなおせ。
おまえのブログ、アクセスないだろw

666 ：Name_Not_Found：2011/03/02(水) 13:28:26.51 ID:???

>>665
アクセス少ない人だけに表示されるとかですか？ｗ

規約の場所分かりません。。。

667 ：Name_Not_Found：2011/03/02(水) 14:02:24.97 ID:???

ハッハワロス

668 ：Name_Not_Found：2011/03/02(水) 14:26:00.82 ID:???

>>666
広告は消しちゃだめなんだよ。
おまえ成績もわるいだろ。

669 ：Name_Not_Found：2011/03/02(水) 19:24:19.47 ID:???

>>662
ありがとうございます。
Googleの<if ～>でブラウザ別に対策できると聞いて、埋め込んだのですが改善されませんでした。
効果はあるのでしょうか？

670 ：Name_Not_Found：2011/03/02(水) 19:29:19.37 ID:???

>>668
あのぉダメなのは分かってますｗ
その上での質問となっております＾＾

671 ：Name_Not_Found：2011/03/02(水) 19:36:02.58 ID:???

そんな簡単なこと一々聞くなよ＾＾

お前が死ねばそんな悩みなんてなくなるよ＾＾

672 ：Name_Not_Found：2011/03/02(水) 19:57:29.26 ID:???

ハッハワロス

673 ：Name_Not_Found：2011/03/02(水) 21:01:12.78 ID:???

￣￣￣￣￣￣￣○￣￣￣￣￣￣￣￣￣￣￣￣￣
　　　　　　　　　　　O 。
　　　　　　　　　　　　　　　　 , ─ヽ
＿＿＿＿＿＿＿＿　　　　/,/＼ヾ＼　　／￣￣￣￣￣￣￣￣￣
|＿＿|＿＿|＿＿|＿　　 __（（´∀｀＼　）＜　というお話だったのサ
|＿|＿＿|＿＿|＿＿　／ノへゝ/''' 　)ヽ　　＼＿＿＿＿＿＿＿＿＿
||＿＿|　　　　　　　 | | ＼´-｀）　/　丿/
|＿|＿|　从.从从　　| ＼__￣￣⊂|丿/
|＿＿|| 从人人从.　|　/＼＿＿/::::::|||
|＿|＿|／//ヽヾ＼　 /　　　::::::::::::ゝ/||
────────(~～ヽ::::::::::::|／　　　　　　　　＝完＝

674 ：Name_Not_Found：2011/03/02(水) 23:44:37.53 ID:???

>>670
ママに許可とってから
パソコンさわろうな。

675 ：Name_Not_Found：2011/03/02(水) 23:52:41.89 ID:???

>>670
なっておりますってwww
偉そうだな

676 ：Name_Not_Found：2011/03/03(木) 00:33:43.19 ID:???

>>670
「ダメなのはわかっているけど、これから君のサイトを荒らしたいからURLを教えて」っていったら、教えてくれるのかな？

677 ：Name_Not_Found：2011/03/03(木) 01:02:43.11 ID:???

>>670
ダメなのはわかってるけど、今すぐ会いたいから電話番号教えてくれるよね
そしたら方法おしえるよ＾＾

678 ：Name_Not_Found：2011/03/03(木) 01:32:32.08 ID:???

CSS初心者の方のための質問スレッドです。
具体的な記述方法がわからない方、基礎知識がない方はこちらでどうぞ。

※気のいい人だけが答えてくれますので、解答はまったり待ちましょう。

679 ：Name_Not_Found：2011/03/03(木) 01:41:23.67 ID:???

但し、当然ながら違反行為の回答はNG

680 ：Name_Not_Found：2011/03/03(木) 01:55:50.18 ID:???

知らない人のレスはいりません

681 ：Name_Not_Found：2011/03/03(木) 11:36:36.98 ID:???

アナタはワタシを知りません

682 ：Name_Not_Found：2011/03/03(木) 11:37:36.25 ID:???

えっ ?　ひろちゃんだろ ?

683 ：Name_Not_Found：2011/03/03(木) 13:44:35.16 ID:???

>>680
知ってるがお前の態度が気に入らない

684 ：sage：2011/03/03(木) 15:53:46.72 ID:U5RlTzwm

質問させてください
普通のHTMLページにlightbox2を設置したのですが
レンタルサーバーにUPして確認してみるとうまく表示されませんでした。
cssもjsファイルも絶対パスに書き換えたのですが、なぜでしょうか？

685 ：Name_Not_Found：2011/03/03(木) 18:04:05.48 ID:???

>>684
> 普通のHTMLページにlightbox2を設置したのですが
普通とはなんぞ

> レンタルサーバーにUPして確認してみるとうまく表示されませんでした。
どう表示されたの？

> cssもjsファイルも絶対パスに書き換えたのですが、なぜでしょうか？
そのパスは合ってるの？

そしてはげしくスレ違い

686 ：Name_Not_Found：2011/03/03(木) 18:56:26.24 ID:???

>>654
そういうのは、ul>liでやるべきじゃないか？

687 ：sage：2011/03/03(木) 19:15:57.45 ID:U5RlTzwm

>>685
ごめんなさい。自己既決しました。
勉強しながらHP今作ってるんですが、ページ内で使うフォントは
1. "ＭＳゴシック", "MS Gothic", "Osaka－等幅", Osaka-mono, monospaceと
2. ＭＳＰ明朝, MS PMincho,ヒラギノ明朝 Pro W3, Hiragino Mincho Pro, serifと
3. ＭＳゴシック, MS Gothic, Osaka－等幅, Osaka-mono, monospaceの中なら
どれを設定するのが一般的ですか

688 ：Name_Not_Found：2011/03/03(木) 19:16:28.97 ID:???

何も指定しないのが一般的

689 ：Name_Not_Found：2011/03/03(木) 19:28:38.43 ID:???

2,3は書き方が間違ってるから消去法で1番

690 ：Name_Not_Found：2011/03/03(木) 20:23:04.58 ID:???

>>687
一般的なのがいいの？それより自分がよく見るとことおなじにすればいいんじゃね？

691 ：Name_Not_Found：2011/03/03(木) 20:40:05.94 ID:???

３つともダメだな

692 ：Name_Not_Found：2011/03/03(木) 20:50:53.79 ID:???

>>687
とりあえず、等幅かプロポーショナルかぐらいは自分で決めような。
後は、色んなOSや国(?)に合わせて無難なフォント選んでいけ。

ちなみに、yahoo見たらこんなんなってたぞ。
font-family:"MS PGothic","Osaka",Arial,sans-serif;

693 ：Name_Not_Found：2011/03/03(木) 21:33:18.50 ID:???

フォントのptとem、%の使い分けってどうやってますか？

694 ：Name_Not_Found：2011/03/03(木) 21:37:56.35 ID:???

適当

695 ：Name_Not_Found：2011/03/03(木) 21:40:21.81 ID:???

好きなので

696 ：Name_Not_Found：2011/03/03(木) 22:09:54.57 ID:???

>>694-695
そ、それぐらいの認識でよいのですね
ありがとうございます

697 ：Name_Not_Found：2011/03/07(月) 17:15:43.68 ID:???

ttp://www.dospara.co.jp/5top/

の左上のバナーのように、一定時間で別のバナーに変更するバナーを設置したいと思います。
解説されてるサイトやヒントがあればよろしくお願いいたします。

698 ：697：2011/03/07(月) 17:16:25.74 ID:XlTmgfE+

ageわすれ

699 ：697：2011/03/07(月) 18:53:46.83 ID:???

ローテーションバナーで検索したらでてきました。
ありがとうございます。

700 ：Name_Not_Found：2011/03/08(火) 06:50:29.82 ID:Lpx9d7kR

centerで中央配置した2つの要素(id="bbb"とid="ccc")を同じ位置に重ねたいのですがCSSだけでできますか？

<div id="aaa" style="text-align:center;">
<div id="bbb">BBB</div>
<div id="ccc">CCC</div>
</div>

701 ：Name_Not_Found：2011/03/08(火) 08:41:02.07 ID:Lpx9d7kR

重ねたいってのはdivブロックの左上端を同じにしたいってことです。

702 ：Name_Not_Found：2011/03/08(火) 12:45:55.40 ID:???

>>701
z-index

703 ：Name_Not_Found：2011/03/08(火) 13:32:52.37 ID:???

#CCCをマイナス補正すれば？

704 ：Name_Not_Found：2011/03/08(火) 14:00:39.10 ID:???

>>696
意識しないで製作する人間はド素人だけだよ。
ヒントは文字ベースのレイアウト

705 ：Name_Not_Found：2011/03/08(火) 14:10:10.67 ID:???

>>693
コンテンツによる。

・画像中心なら px
・文字中心なら em

% は親要素に依存する。親要素の font-size が em や px なら上と同じ原理。
ルート要素から % ならデフォルトスタイルシートに依存する。どんな font-size でもレイアウトできるように組まないとダメ。

706 ：700：2011/03/09(水) 15:18:20.57 ID:zUuYVIvM

text-align:centerで画像<img id="xxx">を<div id="aaa">の中央に配置して
画像<img id="xxx">と同じ幅・高さのボックス<div id="bbb">の中の
左上角に画像<img id="yyy">を、右上角に画像<img id="zzz">
を画像<img id="xxx">と重なるように配置したいのですが
CSSだけで可能でしょうか？

<div id="aaa" style="text-align:center;">
<div id="bbb">
<img id="xxx" src="xxx.jpg"/>
<img id="yyy" src="yyy.jpg"/>
<img id="zzz" src="zzz.jpg"/>
</div>
</div>

707 ：Name_Not_Found：2011/03/09(水) 16:20:42.43 ID:???

>>706
可能です。

708 ：700：2011/03/09(水) 16:54:14.33 ID:zUuYVIvM

どうすればよいですか？

709 ：Name_Not_Found：2011/03/09(水) 18:58:52.75 ID:???

>>706
テストしてないけどこんな感じ。

#bbb { position: relative; height: 300px; }
#xxx, #yyy, #zzz { position: absolute; }
#yyy { right: 0; }

710 ：Name_Not_Found：2011/03/09(水) 20:30:23.66 ID:???

>>706
数値***pxは画像に合わせて調整
<div id="aaa">
<div id="bbb">
<img id="xxx" src="xxx.jpg"/>
<img id="yyy" src="yyy.jpg"/>
<img id="zzz" src="zzz.jpg"/>
</div>
</div>

#aaa { text-align:center;}
#bbb { width:***px; margin: 0px auto;}
#xxx{}
#yyy {position: relative; bottom:***px; left:***px;}
#zzz {position: relative; bottom:***px; right:***px;}

711 ：Name_Not_Found：2011/03/09(水) 20:46:52.53 ID:???

>>710
右と左を間違えた。
#aaa{ text-align:center;}
#bbb{ width:***px; margin: 0px auto;}
#xxx{}
#yyy{position: relative; bottom:170px; right:***px;}
#zzz{position: relative; bottom:170px; left:***px;}

712 ：Name_Not_Found：2011/03/09(水) 20:48:55.58 ID:???

>>711
テスト用の数値を残したままだった。落ち着け自分。。。
#aaa{ text-align:center;}
#bbb{ width:***px; margin: 0px auto;}
#xxx{}
#yyy{position: relative; bottom:***px; right:***px;}
#zzz{position: relative; bottom:***px; left:***px;}

713 ：Name_Not_Found：2011/03/12(土) 16:54:03.78 ID:???

jpg画像を画面中央に配置したページを作りたいのですが
>>4のQ6がリンク切れで見つかりません。どなたか参考になる代替案を教えていただけないでしょうか？

714 ：Name_Not_Found：2011/03/12(土) 17:23:40.77 ID:???

>>713
Q6とは違うと思うけど、単に画像を画面中央に配置できさえすればいいなら、
その画像を背景画像にして

body
{background-image:url("hogehohge");
background-repeat:no-repeat;
background-position:center center;}

とかでいいのでは？

715 ：Name_Not_Found：2011/03/12(土) 17:39:57.85 ID:???

>>714
レスありがとうございます
コピペしてやってみたのですが中央に移動しただけで持ってくることはできたのですが
画面の「中心」に置くことはできませんでした
どのブラウザからも画像が中心に見えるように配置したいのですが……

716 ：Name_Not_Found：2011/03/12(土) 18:17:40.13 ID:???

>>713
http://hibari.2ch.net/test/read.cgi/hp/1296794731/640n- の質問は放置するの？

717 ：Name_Not_Found：2011/03/13(日) 07:09:59.67 ID:???

>>716
お前が答えてやれよ

718 ：Name_Not_Found：2011/03/13(日) 11:55:07.34 ID:???

>>717
？

719 ：Name_Not_Found：2011/03/13(日) 12:10:01.57 ID:???

>>718
？

720 ：Name_Not_Found：2011/03/13(日) 14:29:42.15 ID:???

>>719
？？

721 ：Name_Not_Found：2011/03/13(日) 15:23:28.41 ID:???

>>716
放置でいいだろ

722 ：Name_Not_Found：2011/03/13(日) 18:14:51.11 ID:???

>>716
html,body{
margin: 0px;
padding: 0px;
height:100%;
background:url(hogehoge) no-repeat center center;
}

723 ：Name_Not_Found：2011/03/14(月) 17:16:47.59 ID:???

p {margin-left:2em;}
img {margin-left:3em;}
で左に5emですが、
p {margin-left:2em;}
img {margin-left:3em;}
p img {margin-left:10em;}
にすると12emになりますか？

724 ：Name_Not_Found：2011/03/14(月) 20:25:45.26 ID:???

>>723
やってみてどうだった？

725 ：Name_Not_Found：2011/03/15(火) 07:41:55.59 ID:???

テーブルの行毎に背景色を変えたいのですが
<tr>などにclassを付けてないで一気に指定する方法ってありますか?

726 ：Name_Not_Found：2011/03/15(火) 07:43:32.40 ID:???

すみません。2色を交互に変えたいという意味です。

<tr class="r1"><td></td></tr>
<tr class="r2"><td></td></tr>
<tr class="r1"><td></td></tr>
<tr class="r2"><td></td></tr>
これをclassなしで指定できないものかと・・

727 ：Name_Not_Found：2011/03/15(火) 09:29:42.94 ID:???

>これをclassなしで指定できないものかと・・

tr:nth-child(even) td{
background: white;
}

th:nth-child(odd) td{
background: red;
}

IEとか除外して良いならこういうのは？

728 ：Name_Not_Found：2011/03/15(火) 09:40:46.74 ID:???

>>727
おおありがとうございます
スゴイこんな事もできるんですね

729 ：Name_Not_Found：2011/03/16(水) 22:15:47.44 ID:???

.test{
position: fixed;
top: 20%;
left 20%;
background-color: #85b9e9;
width: 200px;
height:100px;
}

これにpadding: 20px margin: 20px;
など混ぜると中身のテキストにも反映されますが、ボックスの位置自体もpx分ずれてしまいます
box内部のことだけ指定してやってるつもりなのですが、なぜなんでしょうか？

730 ：Name_Not_Found：2011/03/17(木) 00:23:13.14 ID:???

>>729
まーじんは内部じゃないだろ

731 ：Name_Not_Found：2011/03/17(木) 22:13:31.19 ID:???

>>730
そうでしたorz
しかしpaddingだけ指定してもずれてしまうのですが
ボックスの位置はpaddingの分も考慮して決めないといけないってことでしょうか？

732 ：Name_Not_Found：2011/03/17(木) 22:51:30.42 ID:???

そうですよ～

733 ：Name_Not_Found：2011/03/18(金) 17:57:04.45 ID:???

chrome10
IE8

<ol>
<li><div class="head">あああ</div><div class="body">3時間30分前</div></li>
<p class="however">むむむむむむむむむむむむむむむ</p>
<p class="however">とぅるるるるるるるるるるるるるるるるるるる</p>
<li><div class="head">さぼーん</div><div class="body">2時間30分前</div></li>
</ol>

こーいうマークアップで、
div.headとspan.bodyを横並び、olの横幅は500px、div.headは300px、span.bodyは200px、p.howeverは横500pxいっぱい
olはlist-style-type:decimal;で位置がくずれないようにスタイルしたいんですが、うまくいきません。

ol {　list-style-type:　decimal; text-align:left;　}
ol > li { font:　normal 12px/17px Arial; }
div.head { width: 300px; }
div.body {
width: 200px;
float: right;
margin-left: 300px;
color: #F00;
}
p.however {
white-space: nowrap;
font:　normal 12px/17px Arial;
color: #333;
}

よろしくおねがいします。

734 ：Name_Not_Found：2011/03/18(金) 22:21:52.64 ID:aARWUhdx

　　　　　　　　　画像
　　　　　この真下にボックス

と言う形でCSSを組みたいのですが、firefoxとかでサイドバーを出すと
ボックス要素が右側にずれてしまいます。topやleftで%を使ってるからでしょうか？
それとも別の原因があるのでしょうか？
画像はbackgroundにしてfixedやabsoluteなど色々試してみたのですがダメでした
どうすれば位置を固定できるか教えていただけないでしょうか？

735 ：Name_Not_Found：2011/03/19(土) 01:09:17.73 ID:???

>>733
HTMLの基礎を学べ

>>734
画像をボックスへ

736 ：Name_Not_Found：2011/03/19(土) 05:54:41.64 ID:???

>>733
ol直下にpは入れられない

737 ：Name_Not_Found：2011/03/19(土) 09:07:40.84 ID:???

>>735
なるほど、その方法がありましたか。
しかし、これだとボックスに入ってないことになるんですかね？

body {
color: #000000;
font-size: 82%;
font-family:'メイリオ',Meiryo,'ＭＳＰゴシック',sans-serif;

background-color: #000000;
background-image: url("../img/hogehoge.jpg");
background-repeat: no-repeat;
background-position: 50% 2.5%;
background-attachment:fixed;
}
}
.main{
position: fixed;
top: 52%;
left:26.20%;
background-color: #FFFFFF;
width: 645px;
height:400px;
padding: 0 5% 1% 5%;

line-height:130%;
letter-spacing: 0.5px;
text-decoration:none;
list-style-type: disc;
list-style-position: outside;
}

738 ：737：2011/03/19(土) 09:08:47.72 ID:???

backgroundの後の｝は消し忘れorx

739 ：：2011/03/19(土) 09:49:17.71 ID:???

htmlの方を書かんとワカランだろ

740 ：Name_Not_Found：2011/03/19(土) 10:54:29.69 ID:???

>>739
こんな感じです

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Strict //EN”
“http://www.w3.org/TR/html4/strict.dtd”>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Language" content="ja">
<meta http-equiv="Content-Style-Type" content="text/css">
<title> hogehoge </title>
<link rel="stylesheet" href="about.css" type="text/css">
</head>
div class="main">
<ul>
<li>HN<br>test</li>
<li>ああああああああああああ<br>ああああああああああああ</li>
<li>いいいいいいいいいいいいいい<br>ううううううううううううううううううううう</li>
</ul>
</div>
<body>
</html>

こんな感じです

741 ：Name_Not_Found：2011/03/19(土) 11:05:16.17 ID:???

>>740
ulがbody内にないじゃん
lintで間違いを全部なくす方が早い

742 ：Name_Not_Found：2011/03/19(土) 12:33:51.20 ID:???

>>741
何度も申し訳ないコピペミスでちゃんとbodyタグの中に全部入ってます

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Language" content="ja">
<meta http-equiv="Content-Style-Type" content="text/css">
<title> hogehoge </title>
<link rel="stylesheet" href="about.css" type="text/css">
</head>
<body>
<div class="main">
<ul>
<li>HN<br>test</li>
<li>ああああああああああああ<br>ああああああああああああ</li>
<li>いいいいいいいいいいいいいい<br>ううううううううううううううううううううう</li>
</ul>
</div>
</body>
</html>

ちゃんと確かめたのですが、やっぱりダメ、でし、たorz

743 ：Name_Not_Found：2011/03/19(土) 12:40:11.86 ID:???

画像の下にボックスって言ってなかった？

744 ：Name_Not_Found：2011/03/19(土) 12:42:22.27 ID:???

>>743
そうです、その中にリスト形式で文章を書きたいのですが>>734の状態で……

745 ：Name_Not_Found：2011/03/19(土) 12:51:38.53 ID:???

lintと言うところでググって見たのですが
divの中で<li>タグは使えないと言うだけで、実際表示上は問題なくリスト化できているのですが
ボックスがずれる原因は分かりませんでした……

746 ：Name_Not_Found：2011/03/19(土) 13:00:45.84 ID:???

firefoxで表示すると正常なのに、IEtabを使って切り替えたらボックス位置が初期値に戻って左上に表示されるんですが
これってどうすれば治るんでしょうか

747 ：Name_Not_Found：2011/03/19(土) 13:17:22.26 ID:???

>>745
ul書き忘れてるだろ

748 ：Name_Not_Found：2011/03/19(土) 13:18:12.48 ID:???

>>746
DTDをへんなのに指定してんじゃね？

749 ：Name_Not_Found：2011/03/19(土) 15:11:45.09 ID:???

>>745
レスありがとうございます
ulを別にクラス化（ul.hogehoge)で別定義すれば解決するかもしれないと言うことでしょうか
ちょっとチャレンジしてみます！

750 ：Name_Not_Found：2011/03/19(土) 15:12:30.10 ID:???

>>747さんでしたすみませんorz

751 ：Name_Not_Found：2011/03/19(土) 17:09:50.85 ID:???

>>749
違う
div内に直接liを書けないという警告がでるってことは
<div>
<li>なんとか</li>
という形（<ul>が書かれていない）になってるってこと
勝手に回答を妄想解釈せず素直に読めよ
あととりあえずまずlintで警告でてるとこ全部解消してみろ
そしたら解決するから
おまいの問題のほとんどがHTMLがでたらめなことが原因
ここに貼ってるソースと問題が発生してるソースは違うだろ

752 ：Name_Not_Found：2011/03/19(土) 18:21:00.15 ID:???

>>734だけどやっぱりボックスを指定する状態でサイドバー出すだけでもう既にずれてしまう
もはや意味が分からない

753 ：Name_Not_Found：2011/03/19(土) 19:42:35.20 ID:???

>>752
htmlがめちゃくちゃだからだってば
ほんと飲み込みの悪いやつだな

754 ：Name_Not_Found：2011/03/19(土) 19:44:41.75 ID:???

なんか意味不明な人がきたな

755 ：Name_Not_Found：2011/03/19(土) 19:55:46.53 ID:???

ここは昔から意味不明のスレなんだが

756 ：Name_Not_Found：2011/03/19(土) 19:57:17.16 ID:???

>>755
>>754は誤爆です。

757 ：Name_Not_Found：2011/03/19(土) 20:12:31.00 ID:???

>>753
頭が悪いのはあれですがlintで全部問題解決してもずれるんですけど……
上記条件で>>737で指定した画像ファイルの直下に>>740のリストタグ外してボックス置いてもずれます
htmlがおかしいならどこが変なのか具体的に指摘してくれないと分からないです
とにかく画像の下のボックスがサイドバー出た時点でずれることの解決とhtmlファイルはあまり関係ないと思うんですけど

758 ：Name_Not_Found：2011/03/19(土) 20:40:13.60 ID:???

>>734
> firefoxとかでサイドバーを出すとボックス要素が右側にずれてしまいます。
仕様。ウインドウが右にずれるのだからコンテンツも右にずれる。

759 ：Name_Not_Found：2011/03/19(土) 20:45:48.63 ID:???

え
サイドバーは右に出るんだから左にずれるのが仕様だろ

つか画像も置いた本物のHTMLソースを提示してくれ
あとずれてるSSと
嘘のソースから原因を判明すんのは無理

760 ：Name_Not_Found：2011/03/19(土) 20:49:51.73 ID:???

Firefoxのサイドバーは左側に出るが、俺の環境が特殊なのか？

761 ：Name_Not_Found：2011/03/19(土) 21:04:07.23 ID:???

スクロールバーとは違うの？
今時FFなんか使わんからわからん

762 ：Name_Not_Found：2011/03/19(土) 21:26:03.21 ID:???

人を馬鹿にするのもいい加減にしたらどうだ。
こうした若者が増えていること自体、本当に日本の未来が心配な気がする。
自分の人生が正しいのかどうかを、荒待てて振り返る必要があなたにはありますよ、
ということだけは断言しておきたい。神様

763 ：Name_Not_Found：2011/03/19(土) 22:26:45.22 ID:???

>>761
Firefoxでなくてもサイドバーは左側に出るのが普通だぞ。Windowsエクスプローラでも左だ。
スクロールバーと混同するぐらいの知識なら回答するなよな。

764 ：Name_Not_Found：2011/03/19(土) 22:40:19.84 ID:???

>>763
そんな必死に怒るほどの話じゃないだろ
なんにせよずれる理由はhtmlの不備で確定してるし

765 ：Name_Not_Found：2011/03/19(土) 22:49:35.49 ID:???

>>764
何故確定してるの？

766 ：Name_Not_Found：2011/03/19(土) 22:54:51.78 ID:???

FF儲がマジギレしたｗ

767 ：Name_Not_Found：2011/03/19(土) 22:58:38.13 ID:???

>>765
噛み付きたいだけならよそでやってくれ

768 ：Name_Not_Found：2011/03/19(土) 23:20:47.34 ID:???

>>758でFA

769 ：Name_Not_Found：2011/03/19(土) 23:57:05.99 ID:???

お前らくだらない事で喧嘩すんな

770 ：Name_Not_Found：2011/03/20(日) 00:28:36.60 ID:???

こうやって煽りにくるあほはどこにでも沸くんだな

771 ：Name_Not_Found：2011/03/20(日) 03:25:06.30 ID:???

次の方どうぞー↓

772 ：Name_Not_Found：2011/03/20(日) 04:36:31.85 ID:???

ふんにゃかふんにゃか

773 ：Name_Not_Found：2011/03/25(金) 17:50:40.20 ID:???

服を着たままの状態で、女子の肛門の位置を正確に割り出す方法を教えてください。

スレ違いだったら申し訳ありません。

774 ：Name_Not_Found：2011/03/25(金) 18:59:38.08 ID:???

>>773
http://toki.2ch.net/test/read.cgi/esp/1283841572/

775 ：Name_Not_Found：2011/03/26(土) 07:04:52.92 ID:???

春だなあ・・・

776 ：Name_Not_Found：2011/03/26(土) 13:16:04.80 ID:???

>>774
ありがとうございます！やってみます！

777 ：Name_Not_Found：2011/03/28(月) 05:39:11.67 ID:zuNWupxm

背景の色を指定したいのですが、初めにhtmlファイルのヘッダーの中に

body {background-color: #FFEEFF;}

を入れると普通に色が出るんですが、これをcssファイルにコピーすると出なくなります…
なぜでしょうか…？

778 ：Name_Not_Found：2011/03/28(月) 06:07:46.89 ID:???

別の部分でもダブって違う色指定してるとか
cssへのリンクが間違ってるとか

779 ：Name_Not_Found：2011/03/28(月) 07:04:03.67 ID:zuNWupxm

cssに入力した他のやつはちゃんと出ていて、bodyのとこに入力したやつだけ丸々ダメみたいなんですよね。。。
だからリンクが間違ってるということはないと思うのですが、別の部分で違う色を指定してるというのも探した感じそういったものは見当たりません。。。

昨日から始めた者で専門用語がわからず申し訳ないです…

780 ：Name_Not_Found：2011/03/28(月) 07:24:38.47 ID:zuNWupxm

自己解決しました！
答えてくれた方ありがとうございました！

781 ：Name_Not_Found：2011/03/29(火) 01:41:25.23 ID:AOVl6KRt

昨日に引き続き質問させていただきます！

#wrap {width:720px; text-align:center; vertical-align:middle; padding: 2px; margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto; border: 1px solid #00F;}
#inner {margin: 10px;}
#mainwrap {width:480px; height:50px; float:left; font-size: 34px; color: #FF2683;}
#sidewrap {width:220px; height:50px; float:right;}

と入力して、htmlは

<div id="wrap">
<div id="inner">
<div id="mainwrap">文字</div>
<div id="sidewrap">文字</div>
</div>
<div class="clear"><hr /></div>
<div id="footer">文字</div>
</div>

と入力して、文字を上下左右真ん中に置きたいのですが、
上下の真ん中に置くことが出来ません。
左右の中央にはなっています。

どうすればできますか？

782 ：Name_Not_Found：2011/03/29(火) 03:23:01.10 ID:???

テンプレの>>4を読め

以降もちゃんとスレテンプレのリンク先を全て読んでから質問するように
初心者が質問したくなるような事例の大半はそれで済む

783 ：Name_Not_Found：2011/03/29(火) 10:23:35.57 ID:???

>>782
それは君がイケメンだからじゃないかな？俺だったらたぶん無理。

784 ：Name_Not_Found：2011/03/29(火) 10:33:07.06 ID:???

2chはイケメン専用ですよ.。そうでない奴は一生ROMってなさい。

785 ：Name_Not_Found：2011/03/29(火) 13:34:21.99 ID:???

初めからイケメンの人もいないだろうさ

786 ：Name_Not_Found：2011/03/29(火) 17:28:09.62 ID:???

それは整形したイケメン

787 ：Name_Not_Found：2011/04/01(金) 16:59:49.51 ID:???

画像を重ねて表示するのはcss3で楽になったと聞きました
どのプロパティで出来ますでしょうか？

788 ：Name_Not_Found：2011/04/01(金) 20:34:02.97 ID:???

ググるのは嫌ですか ?

789 ：Name_Not_Found：2011/04/02(土) 05:50:27.90 ID:???

座標が同じなら何枚でも勝手に重なるけど？

790 ：Name_Not_Found：2011/04/02(土) 22:04:54.98 ID:???

<span class="abc def">とすると、.abcと.defという二つのクラス名を使用できますが、
これをidにも同じようにすることは可能でしょうか。

791 ：Name_Not_Found：2011/04/02(土) 22:49:32.02 ID:???

idは一意
複数指定はclassの役目。

792 ：Name_Not_Found：2011/04/02(土) 23:44:10.10 ID:???

>>791
ありがとうございました。

793 ：Name_Not_Found：2011/04/04(月) 04:19:47.09 ID:???

リストのタイトルのつけ方で質問

<ol>
<li class="title">a</li>
<li value="1">b</li>
<li>c</li>
</ol>
と
<div>
<h2>a</h2>
<ol>
<li>b</li>
<li>c</li>
</ol>
</div>
を考えたんですが、どちらがお勧めですか？それとも、もっと良い書き方ありますか？

794 ：Name_Not_Found：2011/04/04(月) 06:46:21.32 ID:???

タイトルと内容を同列にしてる前者はダメっしょ
CSSを無効にしたときにどう表示されるか考えてみれ

795 ：Name_Not_Found：2011/04/04(月) 11:16:21.62 ID:???

cssだけで１枚の30x30のgif画像を横に5回繰り返す方法ってございませんか？
background:url(30x30.gif) repeat-x 5;

796 ：Name_Not_Found：2011/04/04(月) 14:54:19.03 ID:???

背景色だけ透過して文字色だけは透過しないままにする方法ってないですか？
背景色にopacity:0.2ぐらいにすると文字も極端に薄くなってしまいます

797 ：Name_Not_Found：2011/04/04(月) 16:16:33.14 ID:???

>>796
RGBaにするかアルファPNG

798 ：Name_Not_Found：2011/04/04(月) 16:38:23.07 ID:???

>>797先生、ありがとうございます！！！！！！！！！！！！！！！！！

799 ：796：2011/04/04(月) 16:53:48.70 ID:???

ぼくのは無理層ですよね？

800 ：Name_Not_Found：2011/04/04(月) 18:41:00.42 ID:e/yY687M

ボックスを中央に配置したいのですが
ボックスと親要素に対してposition:relative;を、ボックスにtop:50%;left:50%;で位置的には中央になったのですが
これだと左上が基点になってますので、結果中央から右寄りにボックスがあることになります
これをtext-align:centerと同じような感じでぼっくを中央に寄せるにはどのようにしたらよいのでしょうか？

801 ：Name_Not_Found：2011/04/04(月) 18:47:21.61 ID:YpHaPJey

http://store.uniqlo.com/jp/store/feature/chino/women/
ユニクロのグローバルメニューはある一定以上のスクロールをすると
バーを動かしてもずっと固定され表示され続けています。

この記述の仕方をお教えさい。簡易サンプルがあれば
お教えください。

802 ：Name_Not_Found：2011/04/04(月) 18:54:06.61 ID:???

>>796
その使い方なら、背景色用に透過pngを作ったほうが早い。

803 ：Name_Not_Found：2011/04/04(月) 18:56:02.19 ID:???

>>801
スクロール量を調べて特定の量だけスクロールしてあればfixedでメニューを固定してるんだと思う

804 ：Name_Not_Found：2011/04/04(月) 18:57:23.96 ID:???

>>799
だれ？ｗ

805 ：８０１：2011/04/04(月) 19:20:31.36 ID:YpHaPJey

さっそくのご回答ありがとうございます
８０３＞
素人なもので、簡単なもので構いませんので、
その記載の仕方をお教えいただけませんか？

-----------------------
スクロール量を調べて特定の量だけスクロールしてあれば
fixedでメニューを固定
-----------------------

よろしくお願いいたします。

806 ：Name_Not_Found：2011/04/04(月) 19:28:31.89 ID:???

これマッチングサイトでも２～５万円ぐらいで成立してる作業だからちったぁ自分で努力しろ
jqueryで使うならスクロールはtp://stacktrace.jp/jquery/api/css/scrolltop(val).html
スクロール量を見てメニューのcssを変更するならtp://stacktrace.jp/jquery/api/css/css(properties).html

807 ：Name_Not_Found：2011/04/04(月) 22:31:55.55 ID:???

>>793
内容によっては
<dl>
<dt>a</dt>
<dd>b</dd>
<dd>c</dd>
</dl>
これもあり

808 ：Name_Not_Found：2011/04/04(月) 22:38:52.09 ID:???

809 ：Name_Not_Found：2011/04/05(火) 00:29:03.95 ID:???

春だねぇ

810 ：Name_Not_Found：2011/04/06(水) 11:47:55.03 ID:???

教えて下さい。
多々ある画像を1枚の画像に結合し、CSSのbackground-positionで指定してやるとサイトが軽くなるという記事を見ました。この場合、
<style>
.test1{
background-image: url(images/AA.gif);　width:20px;　height: 20px;
background-repeat: no-repeat;
background-position: 0px 0px;
}
.test2{
background-image: url(images/AA.gif);　width:20px;　height:20px;
background-repeat: no-repeat;
background-position: -20px 0px;
}
</style>
このように指定してやっても軽くなるのでしょうか。それとも、
<style>
#test{
background-image: url(images/AA.gif);　width:20px;　height:20px;
background-repeat: no-repeat;
}
#test .test1{
background-position: 0px 0px;
}
#test .test2{
background-position: -20px 0px;
}
</style>
このように親要素で指定した上で子要素で位置を指定してやらないと軽くならないのでしょうか。
下の方法でやると、とても大変になりそうで困っています。
知っている方がいましたら教えて頂けないでしょうか。
このスレでの質問と違う内容でしたら申し訳御座いませんがスレの名前でも良いので教えて頂けると助かります。宜しくお願い致します。

811 ：Name_Not_Found：2011/04/06(水) 12:00:26.14 ID:???

ここ読んでメリットとデメリットを知ってから来てくれ
ttp://coliss.com/articles/build-websites/operation/css/transparent-css-sprites.html

812 ：Name_Not_Found：2011/04/06(水) 12:43:55.04 ID:???

早いお返事ありがとう御座います。
デメリットに関しまして、ブラウザのメモリに関する問題点が上げられていますが、英語のサイトで理解が出来ませんでした。。申し訳御座いません。
具体的にどの程度デメリットが体感出来るのかとても興味深く思います。後で翻訳サイト等にかけて読んでみようと思います。
教えて下さったサイトはとても参考になり、親要素関係なく指定出来る事がわかりました。
このサイトの記述による解釈によると1枚の画像をポジション指定により表示するので、はやり私の書いた上の方法では意味のない、むしろ重くなってしまうという解釈で宜しいのでしょうか？
そこらへんが詳しく書かれていないので最終判断に困っております。宜しければ教えて頂ければ幸いです。

813 ：Name_Not_Found：2011/04/07(木) 13:49:25.19 ID:ATZ3VhwY

背景を透過させたサイトを作っているのですが、
背景だけを透過させたいのに、サイト内のすべての画像が透けてしまいます。
背景のみ透過させる方法はないのでしょうか？

814 ：Name_Not_Found：2011/04/07(木) 13:50:13.20 ID:???

>>813

>>796-

815 ：Name_Not_Found：2011/04/08(金) 06:07:05.68 ID:???

>>812
十分理解してるじゃん。
それ以上なにがしたいの？

816 ：Name_Not_Found：2011/04/11(月) 11:30:27.32 ID:5LPARI1S

cssで表の角を丸くする方法で簡単な方法を教えてください。
ネットで見てたらいろいろありますけど、簡単な方法を知りたいです。
できれば、ｃｓｓのみの方法と、画像(丸)1枚を使用する方法の両方を知りたいです。

817 ：Name_Not_Found：2011/04/11(月) 11:33:21.09 ID:???

http://lmgtfy.com/?q=css+%E8%A7%92%E4%B8%B8+%E7%94%BB%E5%83%8F
http://lmgtfy.com/?q=css3+%E8%A7%92%E4%B8%B8

818 ：Name_Not_Found：2011/04/11(月) 17:39:09.73 ID:???

>>816
表の角を丸くしてるサイトのソースをパクる

819 ：Name_Not_Found：2011/04/12(火) 06:33:40.97 ID:???

>>816
ネットで見つけた方法の中で、簡単な方法を使う。

820 ：Name_Not_Found：2011/04/12(火) 23:13:54.32 ID:???

CSS3で使えなくなったプロパティや値ってありますか？
基本的にCSS2.1に新しいプロパティが加わったと考えて使っても問題ないですか？

821 ：Name_Not_Found：2011/04/12(火) 23:17:36.30 ID:???

>>820
CSS3 はモジュール化されているからすべてのモジュールを知っている人は少ないと思う。
自分で調べてくれ。http://www.w3.org/Style/CSS/current-work

822 ：Name_Not_Found：2011/04/12(火) 23:31:03.60 ID:???

わかりました
せっかくなのでまとめた情報をサイトに残したほうがいいですか？

823 ：Name_Not_Found：2011/04/12(火) 23:37:52.71 ID:???

>>822
まとめてくれるなら助かる。

CSS2.1 は http://www.w3.org/TR/CSS21/propidx.html に property table が用意されている。
CSS3 は http://www.w3.org/Style/CSS/current-work と http://www.w3.org/TR/#tr_CSS を参考に。
CSS3 も http://www.w3.org/TR/css3-roadmap/ に一覧があると良かったんだが、Draft 段階の文書が多くある中でまとめるのは大変なんだろうな…。

824 ：Name_Not_Found：2011/04/12(火) 23:42:47.99 ID:???

どうやってまとめるの？

825 ：Name_Not_Found：2011/04/13(水) 00:41:29.88 ID:???

>>824
あなたは>>820なのか？
CSS2.1 のように property table を作って各セルに「対応/非対応」を入れてみては？

826 ：Name_Not_Found：2011/04/13(水) 05:17:07.71 ID:???

CSS3って、もう一般化してるの？

827 ：Name_Not_Found：2011/04/13(水) 06:56:41.58 ID:???

>>826
何を持って一般化と言うか知らんが、
２つ以上のブラウザが実装済みのCSS3プロパティは結構ある。

828 ：Name_Not_Found：2011/04/13(水) 10:42:09.07 ID:???

>>825
俺は824だよ
何でいきなり自演みたいに認定するの？

829 ：Name_Not_Found：2011/04/13(水) 12:43:14.27 ID:???

>>828
自演とは思ってないが、便乗質問ならわかるようにしてほしい。回答する方も気を遣うんだ。

830 ：Name_Not_Found：2011/04/13(水) 18:32:01.24 ID:???

質問の内容と口調的に別人だと思ったけどな。
むしろ822と824の方が近いだろう。

831 ：Name_Not_Found：2011/04/13(水) 19:28:29.85 ID:???

CSS3まとめ用

IE9
Firefox4
Opera11
chrome10
safari5

832 ：Name_Not_Found：2011/04/13(水) 20:26:33.44 ID:???

まとめ方なんて人それぞれだろうけど、モジュール名まで書いてくれると親切だな。

+-----------------+------+----------------------------------------+
| property name　 | CSS2 | CSS3　　　　　　　　　　　　　　　　　 |
+-----------------+------+----------------------------------------+
| background　　　|　○　| Backgrounds and Borders Module Level 3 |
+-----------------+------+----------------------------------------+
| background-clip |　○　| Backgrounds and Borders Module Level 3 |
+-----------------+------+----------------------------------------+

833 ：Name_Not_Found：2011/04/13(水) 20:54:49.59 ID:???

>>826
2012年に出すIE10ではCSS3への対応度が向上するらしいよ

834 ：832：2011/04/13(水) 20:59:23.39 ID:???

background-clip は CSS2 にはないね…。すまんかった。

835 ：Name_Not_Found：2011/04/13(水) 21:12:41.36 ID:???

一人の人にやらせようとせずてめえも一緒にやれや

836 ：Name_Not_Found：2011/04/13(水) 21:27:05.51 ID:???

>>824に答えただけで怒られるとは思わなかった

837 ：Name_Not_Found：2011/04/13(水) 21:33:49.49 ID:???

>>835
つ鏡

838 ：Name_Not_Found：2011/04/13(水) 21:39:01.58 ID:???

俺は必要に迫られて去年からやってるけどここの連中に見せたいと思わない

839 ：Name_Not_Found：2011/04/13(水) 21:51:59.06 ID:???

ほぼ煽りしかいないからなあ。
少しでも良くなればとたまに回答しているけど難癖をつけてくる人はいるし、質問者はスルー気味だし、ここの人にお世話になった実感はごく僅かだ。

840 ：Name_Not_Found：2011/04/14(木) 20:02:43.62 ID:PM29wuPy

礼を求めるなら２ちゃんは止めた方がいいよ
質問に対して好き勝手に答えるだけでいいんだよ。
間違ってたら誰かが指摘してくれる。

841 ：Name_Not_Found：2011/04/16(土) 17:04:41.82 ID:???

<span style="background: no-repeat url('img/creditcard.png');">クレジットカード</span>

文字を見えなくしたいのですが背景画像を前に表示するにはどうしたらいいでしょうか？

842 ：Name_Not_Found：2011/04/16(土) 17:24:30.38 ID:???

<span style="display:none;">クレジットカード</span>

843 ：Name_Not_Found：2011/04/16(土) 17:45:50.78 ID:???

>>842
width 指定しても画像は表示されないです。。

844 ：Name_Not_Found：2011/04/16(土) 17:46:19.49 ID:lDo7GZYV

AとBとfloatでわけてBの背景にいろつけたいのですけど
Aの文章が長いせいかBに白い隙間が出来てしまします。

min-hight とかつかってもブラウザによって変わってきます。
対策はあるのでしょうか？

845 ：Name_Not_Found：2011/04/16(土) 17:49:19.26 ID:lDo7GZYV

AとBと色違いで高さをいっしょにしたいってこっとです

846 ：Name_Not_Found：2011/04/16(土) 19:02:11.94 ID:???

>>841
text-indent -9999pxだっけ。mixiとかそこらじゅうで使われてる。

847 ：Name_Not_Found：2011/04/16(土) 19:18:02.61 ID:Xuq06yW1

css3での質問です。
このサイトのフッターを一番下に表示させたいのですが
sectionのheightを100%にするなど、色々試してみたのですが出来ません！
http://mrgrotesque.com/

なにかアドバイスよろしくお願い致します！

848 ：Name_Not_Found：2011/04/16(土) 19:26:33.83 ID:???

>>846
できました。ありがとうございます

849 ：Name_Not_Found：2011/04/16(土) 20:20:51.09 ID:Xuq06yW1

解決しました

850 ：Name_Not_Found：2011/04/16(土) 22:46:43.41 ID:???

全体的に欧文のページで、一部のセルにだけ和文を使いたいのですが、
<td class="ja">和文</td>
td.ja {font-family: "和文フォント";}
としたところ、文字の上下に妙な余白が出来てしまいました。
margin、padding、vertical-align、line-height、position、displayを使って修正を試みましたが、
ブラウザによっては悪化したり、そもそも根本的な解決になっていなくて気持ち悪かったりで、行き詰まりました。

余白の原因をお教えください。

851 ：Name_Not_Found：2011/04/16(土) 23:37:35.95 ID:???

自己解決しました。読んでいただいた方、ごめんなさい。
td.ja {line-heightではなく
* {line-heightとしたら、
全体的に若干のレイアウト崩れを起こしたものの、問題の余白は綺麗に消えました。

852 ：Name_Not_Found：2011/04/16(土) 23:52:46.17 ID:???

最近は質問してから自分で考えるのが流行ってるのか？

853 ：Name_Not_Found：2011/04/17(日) 08:41:50.42 ID:???

↑は解決しました

854 ：Name_Not_Found：2011/04/17(日) 10:10:40.23 ID:???

お前の寝てる間に、口の中にカメムシ１００匹入りますように。

855 ：Name_Not_Found：2011/04/17(日) 16:14:24.35 ID:???

このスレって他のとこと較べて程度低いよね。
読むと気分悪いからブックマークから外した。
たまに気になって見に来たら、この有様ｗ

856 ：Name_Not_Found：2011/04/17(日) 17:32:52.47 ID:???

>>855
あなたが回答してくれなくなってからこの有様ですよ。

857 ：Name_Not_Found：2011/04/18(月) 03:03:17.56 ID:???

それコピペ

858 ：Name_Not_Found：2011/04/18(月) 04:38:20.22 ID:???

firefoxのstylishでGoogleトップの検索フォームの形をいじってるんだけど
検索結果のURLが/search?q=～から#hl=ja&～に変わったため検索結果のフォームまで変わってしまうんだけど対処法ありますか？

859 ：858：2011/04/18(月) 05:20:46.91 ID:???

自己解決しました！

860 ：858：2011/04/18(月) 05:29:28.77 ID:???

>>859
その発想はなかった
この板はだめだな

861 ：Name_Not_Found：2011/04/18(月) 08:45:46.07 ID:???

ID出せよ

862 ：Name_Not_Found：2011/04/18(月) 15:50:52.00 ID:???

Yahoo!トピックスなどにあるNewの画像を消して文字に置き換えたいです
Userstyles.orgにあるスタイルを参考に
IMG[src="http://i.yimg.jp/images/new2.gif"]{width:0!important;}
IMG[src="http://i.yimg.jp/images/new2.gif"]:after{
content: "New";
}
などと見よう見まねでやってみましたができませんでした
やり方を教えてください

863 ：Name_Not_Found：2011/04/18(月) 15:55:47.30 ID:???

>>862
>>246参照

864 ：Name_Not_Found：2011/04/18(月) 16:02:25.88 ID:???

>>863
ありがとうございます
スレ内検索すべきでした　すみません

865 ：858：2011/04/18(月) 23:17:08.49 ID:???

>>858-860
ワロタ

866 ：858：2011/04/19(火) 06:38:29.41 ID:???

よし！俺も

867 ：Name_Not_Found：2011/04/19(火) 07:03:17.51 ID:???

CSSめんどくさい

868 ：Name_Not_Found：2011/04/19(火) 09:08:07.43 ID:???

この明日も見えない大変な時代やからアムウエイや。
アムウエイやってがんばって成功したら幸せな老後が待ってるんやで。
ねずみ講ちゃうで。アムウエイはすごいビジネスなんや！

869 ：Name_Not_Found：2011/04/19(火) 20:28:13.56 ID:???

>>868
も、もしかして哲さん？

870 ：Name_Not_Found：2011/04/19(火) 20:47:13.78 ID:???

IE８、sleipnirでデザインが崩れているという指摘をされて
自分もIE８、sleipnirで確認したのですが、デザインが崩れていませんでした。

ＰＣの環境によってデザインが崩れる場合cssのどの部分に原因があるか
教えて頂けないでしょうか。

IE８、sleipnirでデザインが崩れていると指摘して下さった方はFire foxだと
普通にみれたようです。

871 ：Name_Not_Found：2011/04/19(火) 21:02:02.51 ID:???

フォント設定とか

872 ：Name_Not_Found：2011/04/19(火) 21:10:17.01 ID:???

>>870
デフォルトスタイルシートが違う

873 ：Name_Not_Found：2011/04/20(水) 07:40:39.84 ID:???

IEでクライアント領域の境界線を消すのに <body style="border:0;">
としていたんですが、DOCTYPEを指定すると消えなくなりました。
DOCTYPEを指定しても消す方法ありませんか？

874 ：Name_Not_Found：2011/04/20(水) 23:23:05.14 ID:???

input要素のbuttonで、押す前と押した時の表示を変えたいです（へこませたい）
hoverを使うとマウスが上に来たときに変えることはできますが、
クリックしているときだけ変えることってCSSで可能でしょうか？javascriptとか併用が必要？

875 ：874：2011/04/21(木) 00:45:39.39 ID:???

hoverではなくてactiveで期待通りの動作でした
ちょっと勘違いしてました　自己解決

876 ：Name_Not_Found：2011/04/21(木) 01:29:05.43 ID:???

先行実装だからscript使った方がいい気もするけどね

877 ：Name_Not_Found：2011/04/21(木) 06:11:59.40 ID:MumpncBS

YUIのDataTableのスタイルシートを抽出できないでしょうか。
http://developer.yahoo.com/yui/datatable/

元はといえば、やりたいことはよくある入力フォームでテーブルの左側が見出し(項目名ヘッダ？)になってるやつを、
同じ画面にDataTableがあるので見た目を統一したいのです。

なので、
１．単にCSSだけぱくる
２．YUI DataTableを行列変換(！？)して適用
のどっちも解決方法としてありなのですけど。

878 ：858：2011/04/21(木) 06:12:05.81 ID:???

えっ!?

879 ：Name_Not_Found：2011/04/24(日) 23:07:27.09 ID:???

id 属性と name 属性の違いがイマイチわかりません。
name は一切使わず、全てのタグで id のみを使うという方針で問題ないのでしょうか？

880 ：Name_Not_Found：2011/04/24(日) 23:08:20.38 ID:???

問題ありませんよ

881 ：Name_Not_Found：2011/04/24(日) 23:14:25.02 ID:???

inputはname属性必須の時があるから

882 ：Name_Not_Found：2011/04/25(月) 01:09:23.10 ID:???

文書内全体で一意か、同じ要素で一意か

883 ：Name_Not_Found：2011/04/25(月) 01:14:13.26 ID:???

>>879
nameは汎用属性ではない。まずどの要素のname属性を指しているか、をはっきりさせる必要がある。HTML4 と HTML5 でも若干違う。

884 ：Name_Not_Found：2011/04/25(月) 14:19:01.25 ID:???

すべての要素の、すべての属性に「font-style: italic;」の値が与えられているものを表すにはどうすればいいんでしょうか。
*[*="font-style: italic;"]　や　["font-style: italic;"]
としたんですけどエラーが出ました。

表記法を教えてください。よろしくお願いします

885 ：Name_Not_Found：2011/04/25(月) 15:11:29.33 ID:???

>>884
「すべての属性」に該当するセレクタはないので不可能です。
http://zng.info/specs/css3-selectors.html#attribute-selectors

886 ：Name_Not_Found：2011/04/25(月) 15:32:17.33 ID:???

>>884
規定にある要素、属性を一つ一つ指定していけば原理上は可能だな。泥臭い方法だが。
http://www.whatwg.org/specs/web-apps/current-work/multipage/section-index.html#elements-1

887 ：Name_Not_Found：2011/04/25(月) 20:29:06.20 ID:???

>>886
スタイルが指定されてるかを判定する方法なんてあるの？

888 ：Name_Not_Found：2011/04/25(月) 22:11:16.48 ID:???

>>887
ない。

> すべての要素の、すべての属性に「font-style: italic;」の値が与えられている
これが満たせるだけ。

889 ：Name_Not_Found：2011/04/25(月) 22:15:23.84 ID:???

すべての属性の定義が曖昧すぎる

<style>
div[id="font-style: italic;"][class="font-style: italic;"][style="font-style: italic;"] { color: red; }
</style>
</head>
<body>
<div id="font-style: italic;" class="font-style: italic;" style="font-style: italic;">sample</div>

890 ：Name_Not_Found：2011/04/25(月) 22:26:35.00 ID:???

じゃあstyleとtitleとaltくらいでいいか

891 ：Name_Not_Found：2011/04/25(月) 22:30:20.43 ID:???

>>890
styleとtitleは汎用属性だが、altは汎用属性ではないのでタイプセレクタを併用しないと実装できないよ

892 ：884：2011/04/26(火) 13:55:20.60 ID:???

みなさんご回答ありがとうございます。
一括で指定するという方法はないようですので、一つ一つ属性を指定していくことにします

ご回答ありがとうございました。

893 ：Name_Not_Found：2011/04/26(火) 14:46:39.18 ID:PPfIx3xx

IE9で出たバグっぽい症状なんだけど、どうしたら解決できるかな？
overflowで横スクロールできるようにして、その中のaタグにマウスカーソルを
持っていったり外したりするたびに、その下の方にある文章がだんだん下がっていく。
IE8以下ではでない。Firefox、Chrome、Safari、Operaでもでなかった。

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style>
a { color: #000000; }
a:hover { color: #ff3333; }
div { width: 5em; overflow: auto; }
p { width: 15em; }
</style>
</head>

<body>
<div>
<p><a href='test.html'>テスト</a></p>
</div>
ここが下がっていく。
</body>
</html>

894 ：Name_Not_Found：2011/04/26(火) 15:55:06.40 ID:???

>>893
divにheightで回避できるが、それじゃ根本的な解決にはなってないんだよな？

895 ：Name_Not_Found：2011/04/26(火) 16:44:29.54 ID:PPfIx3xx

>>894
高さの決めうちは無理な場所でしたけど、height: 100%;で回避できました。
助かりました。ありがとう。
（positionとかfloatとか試したけど結局だめだったな。）

div { width: 5em; overflow: auto; height: 100%; }

896 ：Name_Not_Found：2011/04/26(火) 22:44:02.99 ID:???

IE9を使える環境の方に質問します。
IE9で-ms-filter (又はfilter)って効果が有効になってますか？それとも無視されますか？

897 ：Name_Not_Found：2011/04/26(火) 23:08:52.32 ID:???

>>896
IE9 は opacity が使えるけど、それじゃダメ？
http://msdn.microsoft.com/ja-jp/ie/ff468705.aspx#_CSS3_Colors

898 ：Name_Not_Found：2011/04/26(火) 23:15:14.21 ID:???

MSDNではIE8までしか触れられてないな
http://msdn.microsoft.com/en-us/library/ms530752.aspx

899 ：Name_Not_Found：2011/04/26(火) 23:16:23.87 ID:???

>>897
こちらはIE9使えないので、filterのIE9での対応状況を知りたいのです。

900 ：Name_Not_Found：2011/04/26(火) 23:31:39.40 ID:???

>>899
-ms-filter は IE9 でも使えるんじゃないかな…。
https://github.com/paulirish/html5-boilerplate/pull/354
http://stackoverflow.com/questions/5255730/css-with-ie-is-the-ms-filter-required-or-not

901 ：Name_Not_Found：2011/04/28(木) 14:38:01.14 ID:???

>>896は逃げたか

902 ：Name_Not_Found：2011/04/28(木) 14:59:10.36 ID:???

逃げたとかイミフ

903 ：Name_Not_Found：2011/04/28(木) 19:20:47.25 ID:???

896です。ずっと待ってますが、IE9で実際に試せる環境を持ってる人は居ないんですかね？

904 ：Name_Not_Found：2011/04/28(木) 19:40:53.39 ID:???

わし　Winちゃうねん

905 ：Name_Not_Found：2011/04/28(木) 21:31:56.82 ID:???

>>903
ここで人に試してもらうのと>>900のリンク先で試した人のログを見るのは信頼性に大差はないと思うんだけどな。

906 ：Name_Not_Found：2011/04/28(木) 22:01:01.96 ID:???

>>905
900はIE9リリース前の書き込みじゃないの

907 ：Name_Not_Found：2011/04/30(土) 07:25:05.29 ID:???

css のクラスの指定で
<div class="a">a</div>
<div class="b">b</div>
<div class="a b">a and b</div>
とある時に
3つめの要素のみにスタイルシートを当てる事は
javascriptをつかわずに出来ますか？

908 ：Name_Not_Found：2011/04/30(土) 09:49:58.95 ID:???

.a.b { }

909 ：Name_Not_Found：2011/04/30(土) 12:07:05.81 ID:???

>>908
そんなふうにかけたんですね。
ありがとうございます。

910 ：Name_Not_Found：2011/05/01(日) 18:57:54.15 ID:i4M9F+/0

>>612
背景透過PNGと背景影画像のBOXをずらして表示

911 ：Name_Not_Found：2011/05/02(月) 20:37:35.08 ID:???

>>910
そういうダメテク教えるなよ

912 ：Name_Not_Found：2011/05/02(月) 21:10:54.87 ID:???

ウソテックイズ

913 ：Name_Not_Found：2011/05/03(火) 07:56:59.85 ID:???

すみません質問させてください
http://iup.2ch-library.com/i/i0297675-1304376727.jpg
この画像にあるように自分のブログにも、画面の上に戻ったり
コメントをするボタン？みたいなのを付けたいのですが
これはどこのサービスなのでしょうか？
もしスレ違いでしたら該当スレを教えていただけませんでしょうか？
よろしくお願いします

914 ：Name_Not_Found：2011/05/03(火) 12:57:33.63 ID:???

この画像をどこから拾ったのか書いてよ

915 ：Name_Not_Found：2011/05/03(火) 13:32:13.37 ID:???

>>914
レスありがとうございます
２ちゃんブログの俺的ゲーム速報っていうところが使っていて
すごく便利そうだなと思って自分も付けたいと思ったのですが
いくらググッても全然ヒットしなくて質問を書かせてもらいました
なにか情報をお持ちでしたらお願いいたします

916 ：Name_Not_Found：2011/05/03(火) 13:44:56.07 ID:???

>>915
positionプロパティと、HTMLのフラグメント
てか自分でソース見りゃ早いんじゃないの

917 ：Name_Not_Found：2011/05/03(火) 14:01:58.14 ID:???

サービスじゃなくて自分で実装してるんでしょ
ソース見たけど単純なものだよ

918 ：Name_Not_Found：2011/05/03(火) 14:08:13.36 ID:???

>>916
返信ありがとうございます
>>916さんの書いた内容がまったく理解できないほどの
素人なんです
でも一つだけ分かったのは、どこかのサービスを利用してるわけではなく
HTMLというのをいじって自分で作ってるものなんでしょうね
ちょっと初心者にはハードル高そうです
返信ありがとうございました

919 ：Name_Not_Found：2011/05/03(火) 14:10:29.99 ID:???

>>917さんもありがとうございます
やっぱり自分で実装してるものなのですね
勉強になりました
ありがとうございます

920 ：Name_Not_Found：2011/05/03(火) 14:12:13.21 ID:???

>>896について、実際に試せる方よろしくお願いします。
IE9標準モードでも-ms-filter (又はfilter)は使えますか？

921 ：Name_Not_Found：2011/05/04(水) 02:28:21.86 ID:???

>>920
自分で環境用意しなよ

922 ：Name_Not_Found：2011/05/04(水) 03:00:33.92 ID:???

マジでIE9インストールした奴このスレには居ないの？俺はXpだから無理

923 ：Name_Not_Found：2011/05/04(水) 10:08:53.15 ID:???

MacのVMにWin7+IE9入ってるけど、なにすればいい？
filter動くか試せばいいの？

924 ：Name_Not_Found：2011/05/04(水) 12:20:11.14 ID:???

> filter動くか試せばいいの？
その通りです。よろしくお願いします。
Mac上のWin7でもIE8ではfilterは使えたのですよね。

できましたら、HTMLの先頭行にDOCTYPE（＜!DOCTYPE html＞等）宣言文の有無で
filter表示が変わらないことも確認して戴けたらありがたいです。

925 ：Name_Not_Found：2011/05/04(水) 12:32:18.47 ID:???

どっちも使えたけど

926 ：Name_Not_Found：2011/05/04(水) 13:00:38.42 ID:???

ありがとうございました。

CSS3を使えるブラウザではfilterと似たような効果で代用していましたが、
そうするとIE9では効果が重複してしまうので片方を殺さないといけないですね。

927 ：Name_Not_Found：2011/05/04(水) 23:12:38.61 ID:???

次の患者さんどうぞー↓

928 ：Name_Not_Found：2011/05/06(金) 11:30:45.04 ID:???

　　zzz
　＜⌒／ヽ-、_＿
／＜_/＿＿＿＿／

929 ：Name_Not_Found：2011/05/10(火) 16:22:09.14 ID:???

左から2番目のセルのみ背景を変えたいのですが
td:eq(1){
background:#f00;
}
としても変わりません
eqを使うものだと思ってたのですが方法ございませんか？

930 ：Name_Not_Found：2011/05/10(火) 16:29:07.22 ID:???

eq() は jQuery の独自拡張じゃなかったっけ？
http://api.jquery.com/eq-selector/

931 ：Name_Not_Found：2011/05/10(火) 16:30:25.40 ID:???

>>929
http://zng.info/specs/css3-selectors.html#nth-child-pseudo

932 ：Name_Not_Found：2011/05/10(火) 16:32:53.11 ID:???

929は1000のダメージを受けた
eqじゃないのですね
nth-childでした
ありがとうございます

933 ：Name_Not_Found：2011/05/11(水) 00:27:03.42 ID:???

は？

934 ：Name_Not_Found：2011/05/11(水) 17:15:25.95 ID:???

<li>タグの中のテキストを上下左右中央にするのはどうすればいいですか？
一応<li>にwidth170pxとheight30pxの設定をしてます。

935 ：Name_Not_Found：2011/05/11(水) 17:47:50.66 ID:???

>>934
line-height:30px; text-align:center;

936 ：Name_Not_Found：2011/05/11(水) 18:10:59.96 ID:???

>>935
あほか？そんなんで中央にくるわけないだろｗｗｗ
知らないくせに黙ってろよｗｗｗ

937 ：Name_Not_Found：2011/05/11(水) 20:10:29.89 ID:???

>>936
じゃあどうすればいいの？

938 ：Name_Not_Found：2011/05/11(水) 20:11:13.98 ID:???

企業HP程cssを@importで読み込んでるのを見かけるんですが
これはどのようなメリットがあってcssを分けて読み込んでるんでしょうか？

939 ：Name_Not_Found：2011/05/11(水) 20:16:50.57 ID:???

>>937
だからさ、分からないなら黙ってりゃいいんだよ
わざわざ間違ったレスしなくていいから

940 ：Name_Not_Found：2011/05/11(水) 20:29:32.07 ID:???

>>935で合ってるだろ
何がどう間違ってるか説明しような

941 ：Name_Not_Found：2011/05/11(水) 21:06:32.51 ID:???

フォントの設定について教えて下さい。
一般的にフォントは何が一番標準なんですか？あとフォント設定する時はfontとfont-familyの両方設定するんですか？

942 ：Name_Not_Found：2011/05/11(水) 21:29:37.10 ID:???

指定しないのが標準です

943 ：939：2011/05/11(水) 22:44:50.03 ID:???

>>940
もうしわけありません

944 ：Name_Not_Found：2011/05/11(水) 23:11:46.60 ID:???

>>935
これで出来ました！ありがとうございました(^O^)

945 ：Name_Not_Found：2011/05/12(木) 17:25:24.26 ID:YW3+VsL/

>>941
フォントの指定はしてはいけません
それはｗｉｎｄｏｗｓ厨のわがままです。
全ての悪はマイクロソフトです
絶対にフォントの指定はしてはいけません。

946 ：Name_Not_Found：2011/05/12(木) 18:23:41.95 ID:???

ブログなどのページで縦にずらっと長いページの全体をラップしている<div>に高さは指定しなくていいんですよね？

947 ：Name_Not_Found：2011/05/12(木) 18:51:01.29 ID:???

しなくていい

948 ：Name_Not_Found：2011/05/12(木) 21:09:35.51 ID:???

dreamweaverでflashを挿入したらIEで見たときに毎回ActiveXコントロールのダイアログが表示されるんですけど、これを消すことってできないんですか？

949 ：Name_Not_Found：2011/05/12(木) 21:28:02.04 ID:???

css3のプロパティ一覧ってありませんか？
各ブラウザで検証してて最新情報の。
古いのは海外ので知ってるんですけど古すぎるので

950 ：Name_Not_Found：2011/05/12(木) 21:51:04.87 ID:???

>>948
swfobject使え

951 ：Name_Not_Found：2011/05/12(木) 22:24:06.45 ID:???

命令するなっ！

952 ：Name_Not_Found：2011/05/12(木) 22:26:16.51 ID:???

じゃあ使うわないで
好きにしていいのよ

953 ：Name_Not_Found：2011/05/12(木) 22:26:21.12 ID:???

初心者どもは黙って俺の言うとおりしてりゃいいんだよ

954 ：Name_Not_Found：2011/05/12(木) 23:23:40.29 ID:???

>>949
ありますん

955 ：Name_Not_Found：2011/05/13(金) 00:02:28.90 ID:???

あるなら書けよ

956 ：Name_Not_Found：2011/05/13(金) 09:53:27.76 ID:???

無いアルよ

957 ：Name_Not_Found：2011/05/13(金) 17:56:48.63 ID:???

<li>(width:170px height:30px)の中にある文字のリンクのクリック範囲について、そのままにするとクリック範囲は文字だけに適応されますが、<li>のなか全体をクリック範囲にしたいのですがどうすればいいでしょうか？
<a>にdisplay:block;を定義すると聞いたのですがそれをすると他のリンクにも反映されてしまいます。
できれば<li>のなかのリンクにだけ反映したいです。

958 ：Name_Not_Found：2011/05/13(金) 18:29:19.20 ID:???

li a { display:block; width:170px; height:30px; }

959 ：Name_Not_Found：2011/05/13(金) 19:16:15.63 ID:???

>>958
出来ました！天才でした！

960 ：Name_Not_Found：2011/05/15(日) 06:14:57.54 ID:???

IE9はこれ使えん。使ったら、真っ白になる。

<!--[if lte IE 8 ]> ]

961 ：Name_Not_Found：2011/05/15(日) 14:50:01.37 ID:???

使うな

962 ：Name_Not_Found：2011/05/15(日) 14:58:20.06 ID:???

>>960
コメントを閉じてないからじゃないの

963 ：Name_Not_Found：2011/05/15(日) 15:01:28.98 ID:???

こいつすげーアホだな

964 ：Name_Not_Found：2011/05/15(日) 16:19:10.94 ID:???

>>960
笑ったｗ

965 ：Name_Not_Found：2011/05/15(日) 17:29:46.89 ID:???

釣りにしても酷すぎる

966 ：Name_Not_Found：2011/05/15(日) 22:44:43.89 ID:???

ｽﾞｺｰ　思わず二度見した
流石に釣りだよなあ…

むかしセミナーで、条件付きコメントは使わないでってmsの人が言ってたな
業務では使ったコト一度も無いけれど、HTML5とCSSハック絡みで使ってるサイトはたくさんあるね

967 ：Name_Not_Found：2011/05/16(月) 22:11:29.34 ID:???

ほんだらさっさとIE8以下のサポートを切ってほしいところだ

968 ：Name_Not_Found：2011/05/16(月) 22:43:57.99 ID:???

一番危険なIE9は残すのかよｗ

969 ：Name_Not_Found：2011/05/17(火) 06:25:53.76 ID:???

>>966
あれ作ったのieの中の人だろ
自分で否定してるのか

970 ：Name_Not_Found：2011/05/17(火) 07:29:58.39 ID:???

>>969
まあ自民と民主の関係みたいなもんだろ

971 ：Name_Not_Found：2011/05/24(火) 12:18:00.59 ID:???

テキストの選択が出来なくなりました。直すにはどうしたらいいんでしょうか？
自分で作っておきながらなんですが、すごく鬱陶しいので直したいんですが方法がわからないので直しようがないです。
お願いします。
UbuntuのFirefox3.6です。

972 ：Name_Not_Found：2011/05/24(火) 12:43:57.68 ID:???

コードも張らずに？ｗ

973 ：Name_Not_Found：2011/05/24(火) 12:47:30.44 ID:???

>>972
コードってなんですか？直すのに関係無いと思いますが。
環境は書きましたが？

974 ：Name_Not_Found：2011/05/24(火) 13:05:23.30 ID:ZLF/lP3e

cssの質問じゃなければスレ違い、死ね
cssに関するならコード貼れ、ぼけ

975 ：Name_Not_Found：2011/05/24(火) 13:07:11.64 ID:???

おめぇが書いたCSSやHTMLのせいじゃねぇのってことじゃね？
他のサイトでもテキスト選択できなくなっているのだとしたら
おめーのPCぶっ壊れてる

976 ：Name_Not_Found：2011/05/24(火) 13:09:10.04 ID:???

釣れたｗｗｗ

977 ：Name_Not_Found：2011/05/24(火) 13:52:24.90 ID:???

idを晒さない質問者のレスは信用しない方がいいな
このところ騙りが多いし

978 ：Name_Not_Found：2011/05/24(火) 16:18:13.73 ID:???

>>976
そんなに悔しかったのか？ｗｗｗ
後だし釣り宣言ほど恥ずかしいものはないんだがｗｗｗｗ

979 ：Name_Not_Found：2011/05/24(火) 16:21:08.24 ID:???

>>971を翻訳してくれ

980 ：Name_Not_Found：2011/05/24(火) 17:13:48.41 ID:???

「いつまでも割れwindowsを使ってるのは気が引けるからUbuntuにしたらテキストの選択が出来なくなったんだけど、どうするの？」

ってこと。

981 ：Name_Not_Found：2011/05/24(火) 17:17:20.35 ID:???

OSの話はスレ違い

982 ：Name_Not_Found：2011/05/25(水) 03:35:46.20 ID:NNaTPDR6

classがaaaのdivの中にあるidがbbbのものは # や . を使ってどう指定できますか？

983 ：Name_Not_Found：2011/05/25(水) 03:43:59.14 ID:???

div.aaa #bbb

984 ：Name_Not_Found：2011/05/25(水) 04:47:43.02 ID:Y7P/3aQ3

キタっ、SEO対策に使っても削除しないブログ
http://www.c-recipe.biz/

985 ：Name_Not_Found：2011/05/25(水) 19:48:13.27 ID:???

986 ：Name_Not_Found：2011/05/25(水) 19:52:40.31 ID:???

キタっ、検索エンジンスパム
http://www.c-recipe.biz/

987 ：Name_Not_Found：2011/05/25(水) 20:06:53.60 ID:???

ある書籍のサンプルで、これでも動作しましたが、下から４行目<h1 class="text">は、
おそらく<h1>の間違いでしょうかね？<h1>タグと<p>タグをスタイル指定するって趣旨のサンプルです。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/htm14/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=utf-8">
<title>サンプルページだよ</title>
<style type="text/css">
h1 {
font-family: Arial;
font-size: 16pt;
font-weight: 100;
font-style: italic;
}

p {
font-family: "メイリオ";
font-size: 10pt;
font-weight: 700;
font-style: normal;
}
</style>
</head>
<body>
<h1 class="text">Font Family</h1>
<p>スタイルシートでスタイルを変更した例です。</p>
</body>
</html>

988 ：Name_Not_Found：2011/05/25(水) 23:28:55.56 ID:???

>>987
別にクラス名を使用してないだけで、間違いではないでしょ。

989 ：Name_Not_Found：2011/05/26(木) 00:08:55.55 ID:???

>>988
ありがとうございます。
間違いというか、サンプルとしては<h1>として記述するのが普通ですよね？というのが一番の疑問だったの
ですが、そんなもの書籍を見なきゃわからないですよね。

このサンプルが出る部分まで、この本class=""の""の中は、<style/><style>のなかで記述されてるか、
タグの中で新しく定義？する方法しか解説が無く、いきなり単発ででてきた"text"はなんぞ？と思ったのです。

同書で自分が見落としてる部分があるかも知れないし、この記述が別に普通ならそれが理解できるよう勉強
します。

990 ：Name_Not_Found：2011/05/26(木) 06:33:12.80 ID:???

>>989
確かに勉強用のサンプルとしては、混乱の元かもね。
このサンプルだけでいうと、クラスの有無はスタイルに影響ないってだけ。

ちなみに、pにも同じクラス名をつければ、h1とp共通のスタイルを定義できる。

991 ：Name_Not_Found：2011/05/26(木) 10:08:34.55 ID:???

>>980次スレは・？

992 ：Name_Not_Found：2011/05/26(木) 10:31:14.88 ID:???

おまえが建てろぼけが

993 ：Name_Not_Found：2011/05/26(木) 18:55:23.95 ID:???

ふる

994 ：Name_Not_Found：2011/05/27(金) 18:51:21.67 ID:???

どあ

995 ：Name_Not_Found：2011/05/28(土) 04:16:29.95 ID:???

てぃゅ

996 ：Name_Not_Found：2011/05/28(土) 05:40:02.22 ID:???

次スレきたな
埋め

997 ：Name_Not_Found：2011/05/28(土) 12:18:05.64 ID:???

CSS初心者スレッド＝10th＝
http://hibari.2ch.net/test/read.cgi/hp/1306489752/l50

998 ：忍法帖【Lv=1,xxxP】：2011/05/29(日) 11:11:40.14 ID:???

梅テスト

999 ：忍法帖【Lv=1,xxxP】：2011/05/29(日) 13:27:13.45 ID:???

埋め

1000 ：忍法帖【Lv=1,xxxP】：2011/05/29(日) 13:29:14.67 ID:???

1000ならオレ億万長者になっちゃうぅううう＼(＾o＾)／

1001 ：１００１：Over 1000 Thread

このスレッドは１０００を超えました。
もう書けないので、新しいスレッドを立ててくださいです。。。