5ちゃんねる ★スマホ版★ ■掲示板に戻る■ 全部 1- 最新50  

■ このスレッドは過去ログ倉庫に格納されています

CSS初心者スレッド=10th=

1 :Name_Not_Found:2011/05/27(金) 18:49:12.73 ID:???
CSS初心者の方のための質問スレッドです。
具体的な記述方法がわからない方、基礎知識がない方はこちらでどうぞ。

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

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


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

《過去スレ》
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初心者スレッド=4th=
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:2011/05/27(金) 19:02:58.22 ID:u3eRIkd5
あ、立てれた。

ということで、前スレは残り少ないのでこちらで質問させてもらいます。
非常に恥ずかしい質問なんですが、外部CSSを一切読み込ませてない状況で
以下のようにしたとき、
<div style="background:#FFCC33;">
 <div style="margin-bottom:20px;">ABC</div>
</div>
<p>XYZ</p>
外側のdivの背景色(オレンジ色)が「ABC」の下に20px分伸びるのかと思ったらそうならず、
XYZの上に白いスペースが20px分できます。

これってこの挙動で正しかったでしょうか? オレンジ部分が20px伸びるのかと考えていたんですが。
また、外側のDIVにpadding:1px 0px;を指定すると最初思っていたようにオレンジ部分が20px伸びます。
(XYZはオレンジの真下にくっつくように配置されます、当たり前ですが)

なぜpadding:1px 0px;を指定したけっか正常に(?)動くのかもわかりません。

この挙動は正しいのでしょうか?
おかしいとしたら他にCSSは使っていないのですが、どんな原因が考えられるでしょうか?
すみませんが誰かご意見お願いします

3 :Name_Not_Found:2011/05/27(金) 20:34:12.44 ID:???
すみません、解決しました
マージン相殺って奴だったみたいです、恥ずかしい。はぁー

4 :Name_Not_Found:2011/05/28(土) 15:00:13.49 ID:???
>>2-3

マージン相殺というのを今日初めて知りましたが、
CSSは何のメリットがあってそういう仕様にしているのでしょうか。

5 :Name_Not_Found:2011/05/28(土) 23:54:28.57 ID:???
 下記を読むと書いて有るかも・・・

CSS1の仕様書(W3C勧告)
http://www.w3.org/pub/WWW/TR/REC-CSS1
CSS2の仕様書(W3C勧告)
http://www.w3.org/pub/WWW/TR/REC-CSS2
CSS1仕様書の日本語訳(どら猫本舗)
http://www.doraneko.org/webauth/css1/
Positioning(W3Cワーキングドラフト)

 とほほより転載 http://www.tohoho-web.com/css/basic.htm
http://www.w3.org/pub/WWW/TR/WD-positioning

6 :Name_Not_Found:2011/05/28(土) 23:55:42.80 ID:???
あっ ごめんにゃ・・・

Positioning(W3Cワーキングドラフト)
http://www.w3.org/pub/WWW/TR/WD-positioning

7 :Name_Not_Found:2011/05/29(日) 00:14:47.31 ID:???
>>5
とほほ は内容もとほほだからオススメしない方がいいような。

8 :Name_Not_Found:2011/05/29(日) 00:32:47.75 ID:???
仕様書はとほほと関係ないでしょ ? >7

9 :Name_Not_Found:2011/05/31(火) 14:17:46.78 ID:???
10px * 10pxの範囲に
3px * 10pxの画像をrepeat-xした場合
12px表示されてはみ出るんでしょうか?
それとも画像が切れた感じで10px分になるんでしょうか?

10 :Name_Not_Found:2011/05/31(火) 19:52:53.79 ID:???
やってみたらええやん

11 :Name_Not_Found:2011/05/31(火) 19:55:43.81 ID:???
実際にやってみれば分かることを聞くな

12 :Name_Not_Found:2011/05/31(火) 20:45:33.63 ID:???
きっと実行結果を見ても信用できないんだろ
筋金入りの他力本願w

13 :Name_Not_Found:2011/06/08(水) 16:52:53.33 ID:???
IE対応する場合ってIEのみCSSを分けるべきでしょうか?

14 :Name_Not_Found:2011/06/08(水) 22:07:06.97 ID:f6ICMU0G
リンク付き画像のボーダーを一括で0にしたいのでググったら
a img { border:none} を書けばいいということはわかったのですが
どこに書いたらいいのかわかりません
<head></head>の中に書いたら、文字として出力されてしまいました。
解決策を教えてください。


15 :Name_Not_Found:2011/06/08(水) 22:31:06.06 ID:???
>>14
ホームページ制作入門的な本を読む

16 :Name_Not_Found:2011/06/09(木) 00:11:38.73 ID:???
>>13
分けない方がいい

17 :Name_Not_Found:2011/06/10(金) 19:18:42.61 ID:???
http://10plate.blog44.fc2.com/blog-entry-229.html
img { border-style:none; }を加えたいのですが
「スタイルシート末尾」とはどこになるのでしょうか?
一番下でいいのでしょうか?

18 :Name_Not_Found:2011/06/10(金) 19:31:18.30 ID:???
<style type="text/css">
<!--
  ・
  ・
  ・
a img { border-style:none; }
-->
</style>



19 :17:2011/06/10(金) 19:33:28.59 ID:???
>>18
すいません
自己可決しますたすた・・・

20 :Name_Not_Found:2011/06/10(金) 19:35:17.08 ID:???
回答もらっときながら自己解決って失礼だな
形だけでも礼は言っとくもんだ

21 :17:2011/06/10(金) 20:06:41.05 ID:???
はい
ありがとうございました

22 :Name_Not_Found:2011/06/11(土) 11:32:02.85 ID:???
>>18
XHTMLでコメントアウトすんなw

23 :Name_Not_Found:2011/06/11(土) 14:50:28.04 ID:???
全くだ。XHTMLならCDATAだろうが。
IEも対応するなら外部スタイルシートだろうが。

24 :Name_Not_Found:2011/06/11(土) 19:35:57.76 ID:???
酷い回答だな

25 :Name_Not_Found:2011/06/11(土) 23:15:58.36 ID:???
どの辺が酷い?

26 :Name_Not_Found:2011/06/12(日) 05:04:28.79 ID:???
コメアウ

27 :Name_Not_Found:2011/06/12(日) 05:21:18.52 ID:???
コメントアウトが適切な表現じゃないってこと?

28 :Name_Not_Found:2011/06/12(日) 11:05:09.54 ID:???
それぐらいわかると思うが、普通はどう表現するんだ?

29 :Name_Not_Found:2011/06/12(日) 12:26:28.28 ID:???
もうとっくに答えは出てるだろ

30 :Name_Not_Found:2011/06/12(日) 12:42:59.23 ID:???
少なくとも>>22以降にはないな

31 :Name_Not_Found:2011/06/12(日) 14:14:27.52 ID:???
またDoCoMoの話かい?

32 :Name_Not_Found:2011/06/12(日) 15:19:55.43 ID:???
DoCoMoとか関係ないだろ
XHTMLならコメントにしたら動かん

33 :Name_Not_Found:2011/06/12(日) 18:13:26.68 ID:???
えっ ?

34 :Name_Not_Found:2011/06/12(日) 18:53:13.24 ID:???
この流れ何度目だろ
非似XHTMLなら動くから勘違いする人が多いんだよな
明確に文法違反なのに

35 :Name_Not_Found:2011/06/12(日) 19:04:11.98 ID:???
わからない人は Content-Type application/xhtml+xml でぐぐるといい

36 :Name_Not_Found:2011/06/12(日) 22:58:08.06 ID:???
ドコモはstyle要素を解釈できないって話

37 :Name_Not_Found:2011/06/12(日) 23:10:49.71 ID:???
それはコメントの話と関係ない

38 :Name_Not_Found:2011/06/12(日) 23:11:05.12 ID:???
>>35
サーバのヘッダにこれつけないと発生しないからねぇ。

39 :Name_Not_Found:2011/06/13(月) 00:02:33.39 ID:???
コメントアウトってstyle要素解釈しないブラウザ向けのバッドノウハウじゃないの?

拡張子.xhtmlにしてローカルで開けば、FirefoxとかはXHTMLとして解釈してくれるっぽいよ
MIMEタイプxmlで実際に使うときは拡張子.htmlにしないと、IEでダウンロードされてしまうけど

40 :Name_Not_Found:2011/06/13(月) 02:36:11.66 ID:???
>>38
動くことと仕様を守ることは話が別
text/html で動けばいいなら空要素を閉じなくていいし、終了タグを省略していいし、属性値をクオートでくくらなくていい。HTML と変わらない。
でもはれは XHTML にする意味がないだろ

41 :Name_Not_Found:2011/06/13(月) 03:00:20.93 ID:???
>>38は、だから気付かない って言ってるだけだと思うが

42 :Name_Not_Found:2011/06/13(月) 14:15:17.95 ID:???
application/xhtml+xml では style要素の内容は #PCDATA、text/html では CDATA、
つまり、マークアップ区切り文字を認識するのかしないのか、違いがある。
ただ、XHTML+text/html の場合、どう考慮するべきかは難しい。
最終的にはブラウザの実装に合わせるしかないのが現状。

どうでもいいけど、XHTMLにする意味は何?
ドコモ対策のみ?


43 :Name_Not_Found:2011/06/14(火) 01:30:40.05 ID:???
ドコモ対策ならXHTMLにしない方がいいだろ

44 :Name_Not_Found:2011/06/14(火) 05:06:09.27 ID:???
iモードブラウザ1.0には、CSS無しで対応しろ、と?
ある意味納得。


45 :38:2011/06/14(火) 06:14:49.74 ID:???
>>40
>>41の言ってるとおりです。
仕様を守らなくていいとかそういう意味じゃないっす。

46 :40:2011/06/14(火) 20:57:09.47 ID:???
>>45
見当違いだったのか…、すまなかった

47 :Name_Not_Found:2011/06/22(水) 20:35:30.25 ID:???
よく「W3C勧告に準拠」などと言われる一方で、CSSMANIA等にアップされてるサイトに対して
Web Develperで「CSSファイルの検証」を試みると、エラーがズラリと列挙されるサイトも
少ないないのですが、あまり重要視されていないということでしょうか?

48 :Name_Not_Found:2011/06/22(水) 20:45:15.57 ID:???
>>47
重視しないサイトもあるとしか
それが多数派かどうかは知らないし、関係ない

49 :Name_Not_Found:2011/06/23(木) 00:33:50.35 ID:???
多くのブラウザで表示させようとしてハックを使うと、バリデータは通らなくなったりする

50 :Name_Not_Found:2011/06/23(木) 10:43:13.65 ID:???
横幅を1000pxで作る場合、以下のようなHTMLだったら
#box{width:1000px;}と単純に1000px指定するだけで問題ないですか?
もしboxにborder:1px solid #000000;を書く場合は#box{width:998px;}とborderの太さ分引くべきでしょうか?

<html>
<head>
</head>
<body>
<div id="box">
</div>
</body>
</html>

51 :Name_Not_Found:2011/06/23(木) 11:47:09.16 ID:???
>>48
お前朝鮮人か?
句読点の位置がおかしいぞ。

52 :Name_Not_Found:2011/06/23(木) 11:47:54.84 ID:???
>>51
2ちゃん初心者か?まあ肩の力抜けや

53 :Name_Not_Found:2011/06/23(木) 13:21:15.52 ID:???
>>51
「1番好き」とか「第3者」とか「50歩100歩」よりはまだマシだよw

54 :Name_Not_Found:2011/06/23(木) 19:45:44.12 ID:???
>>50
HTMLの準拠モードによって答えは違う。

55 :Name_Not_Found:2011/06/23(木) 20:47:35.77 ID:???
54先生どもです
標準モードで作ってます

56 :Name_Not_Found:2011/06/23(木) 21:53:53.15 ID:???
>>55
borderとmarginとpadding分は引く

57 :Name_Not_Found:2011/06/23(木) 23:51:50.20 ID:???
質問です。
CSSで背景に画像を指定して、その画像が常に中央に来るようにしたい。
例えば横幅1000pxの画像を指定して、ブラウザを100pxに狭めても画像の中央が常に画面の中央に来るようにしたいと思っています。
この説明でわかるかな?説明が下手ですみませんがよろしくお願いします。


58 :Name_Not_Found:2011/06/24(金) 01:39:22.48 ID:???
background-positionのこと?

59 :Name_Not_Found:2011/06/24(金) 02:00:36.75 ID:???
>>57
敬語なのにバカにされてる感じがする

60 :Name_Not_Found:2011/06/24(金) 02:06:06.17 ID:???
>>59
そう?

61 :Name_Not_Found:2011/06/24(金) 07:10:09.17 ID:???
>>59
慇懃無礼って奴だな。

62 :Name_Not_Found:2011/06/24(金) 08:21:13.01 ID:???
>>58
それと calc か

63 :Name_Not_Found:2011/06/24(金) 09:54:13.97 ID:???
>>56
先生のゆうとおりにやってみます
ありがとうございます

64 :Name_Not_Found:2011/06/24(金) 16:39:23.84 ID:???
質問
CSSで左側が四角で右側が三角のボックスを作りたい。

┌─
│  >
└─
こんな感じ
どうやったらいいですか?

65 :Name_Not_Found:2011/06/24(金) 17:43:48.64 ID:???
制作会社に依頼したら出来ます

66 :Nane_Not_Found:2011/06/24(金) 18:57:27.61 ID:???
文章主体のページで、ボディー内の本文に当る部分を#includeするようなことは
出来ないものでしょうか?
もし、できれば、管理しやすいように思うんですが。
インラインフレームじゃなくて

67 :Name_Not_Found:2011/06/24(金) 19:24:19.48 ID:???
出来るよ
でもCSS関係ないよね

68 :64:2011/06/24(金) 19:26:16.48 ID:???
>>65
2chでは難しいってことですか
ありがとうございました

69 :Name_Not_Found:2011/06/24(金) 19:30:02.36 ID:???
そうですね
質問でなく制作依頼を引き受けてくれる人はいないので難しいですね

70 :Name_Not_Found:2011/06/24(金) 19:50:27.73 ID:???
俺に作らせてよ

71 :Name_Not_Found:2011/06/24(金) 20:58:47.52 ID:???
>>64
CSSの斜め線はborderの角を使うんだってさ

72 :64:2011/06/24(金) 22:50:24.10 ID:???
>>70>>71
よろしくお願いします
一応やってみたけどこれが限界でした


/* CSS */
.togatta_kado {
background-color: #999999;
padding: 20px;
-moz-border-radius: 20px 30px 40px 50px / 30px 40px 50px 60px; /* Firefox用 */
-webkit-border-radius: 0px 40px 40px 0px / 0px 40px 40px 0px; /* Safari,Google Chrome用 */
-o-border-radius: 20px 30px 40px 50px / 30px 40px 50px 60px; /* Opera用 */
}

/* HTML */
<div class="togatta_kado">
<p>右だけ尖った角</p>
</div>

73 :Name_Not_Found:2011/06/25(土) 01:13:36.51 ID:???
border-radiusに接頭辞付けんな
てか三角部分のCSSは?

74 :Name_Not_Found:2011/06/26(日) 14:17:41.85 ID:???
::selection {
background: #ffb7b7;
}

::-moz-selection {
background: #ffb7b7;
}

このようにして、選択範囲の背景色を変更しようとしています。
が、これだと<input type="text">の入力値の選択範囲には適用されないようです。
<input type="text">にも適用するには、どうしたらいいでしょうか。

75 :Name_Not_Found:2011/06/26(日) 19:30:14.21 ID:???
使っちゃあかん

76 :74:2011/06/26(日) 21:01:55.04 ID:???
>>75
input要素の背景色を変更してはいけないということですか?
それとも-moz-selectionだけでなく、selectionもあまり使ってはいけないということなんでしょうか?

77 :Name_Not_Found:2011/06/26(日) 22:09:44.93 ID:???
草案のセレクタだし、接頭辞ついてるし、>>74の通りブラウザごとに挙動違うし
早いと思う

78 :Name_Not_Found:2011/06/26(日) 23:39:48.75 ID:???
デザインはオナニーじゃなくて思いやり

79 :Name_Not_Found:2011/06/27(月) 23:07:53.77 ID:???
>>77
ありがとうございます。
ベース色が暗い色のページを閲覧する際、通常の選択色だととても見難く、解決策として見つけたのが>>74の方法でした。proxiomitronでスタイルを書き換えればいいと。初めに書いておくべきでした。すみません。

-moz-selectionをはずしてFirefoxで確認したところ、スタイルシートで云々しなくても背景が黒っぽいと選択範囲の色が反転色に変わってくれるようなので、今のところは::selectionのみを使うことにします。
あとinputの件はやっぱり無理ですかね?

80 :Name_Not_Found:2011/06/28(火) 03:12:22.73 ID:AVodAWsP
floatレイアウトでサイドバーを付けてるページがあります。
下のようなイメージです。上下にヘッダ、フッタ(clear:both;)はありますが重要ではありません。

contents    sidebar(幅固定)
  ↓        ↓
「         「
  float:left;  float:right
        」      」

contentsの中身が文字なら全く問題なくsidebarがサイドバーとして表示されるのですが、
contentsの画面の横幅を超える大きいテーブルだった場合に、サイドバーが右下部分に表示されてしまうようです。
<- 画面幅 ->

  float:left;
        」
   「
   float:right ←サイドバーがここに移動
        」
これではサイドバーでなくフッタ右バーになってしまいます。
・コンテンツが文字列など場合はサイドバーが右端
・テーブルがある場合はサイドバーが画面からはみ出ても構わない
とかするうまい方法はあるでしょうか?

81 :Name_Not_Found:2011/06/28(火) 03:46:33.77 ID:???
>>80
2つ目の問題がよく分からなかったけど…
サイドバーもfloat:leftにする。
一番いいのはテーブルがはみ出ないようにサイズ指定。

82 :Name_Not_Found:2011/06/28(火) 06:00:01.95 ID:???
>>81
それだとサイドバーが下に行っちゃいませんか?

テーブルのサイズを小さくするのは無理です。
と、いうよりブラウザの横幅を小さくされたときにサイドバーが下に飛んでしまうのを何とかしたいというのが発端なので。

83 :Name_Not_Found:2011/06/28(火) 06:22:43.66 ID:???
>>82
もう少し自分で工夫したら?

84 :Name_Not_Found:2011/06/28(火) 22:19:35.04 ID:???
>>80
floatって単語の意味知ってるの?

85 :Name_Not_Found:2011/06/28(火) 22:25:45.93 ID:???
浮く 浮かせる(´・ω・`)

86 :Name_Not_Found:2011/06/28(火) 23:46:51.25 ID:???
>>85
それを知ってたらどうすればいいかもう分かるよね!(^o^)v

87 :Name_Not_Found:2011/06/28(火) 23:58:46.41 ID:???
いちごフロートを食べるん ? >>86

88 :Name_Not_Found:2011/06/29(水) 00:46:57.37 ID:f5DOaIra
質問
UTF-8環境でアスキーアートを表示するための
font-family等の設定はどのようにすると良いでしょうか?

89 :Name_Not_Found:2011/06/29(水) 15:01:03.98 ID:???
フロートって浮動小数点扱う時の型でしょ

90 :Name_Not_Found:2011/06/29(水) 19:34:34.53 ID:???
ここで質問していいどうか分かりませんが、一応質問させて頂きます。
初心者でホームページ作成してて、
メニューのとこに小さい線がで来て、それを消したいんですが、
どう直しても消えません。
http://db.tt/EOITpCQ
スクリーンキャプチャで赤丸のとこ
http://db.tt/V9HK4IQ
CSS

#menu a menu a:linkのあたりのCSSが間違ってるでしょうか?
display:inline-block;をblockにすると、メニューの文字が一行ずつズレます。

91 :Name_Not_Found:2011/06/29(水) 19:42:29.76 ID:???
質問するときにすぐ試せるようにhttp://cssdesk.com/みたいにすぐ確認できるようなとこに張ってもらえると俺は助かる

92 :Name_Not_Found:2011/06/29(水) 19:45:35.18 ID:???
>>91
ありがとう。出直して来ます。
あとで教えて下さい!!

93 :Name_Not_Found:2011/06/29(水) 20:53:20.82 ID:???
http://cssdesk.com/ERgqw

出来ました。助けて下さい。


94 :Name_Not_Found:2011/06/29(水) 21:17:49.73 ID:???
http://phpspot.org/blog/archives/2011/06/csscss_prism.html
見出しタイトルの「CSSのアドレスを入力すると使われている色の一覧をプレビューできる「CSS Prism」」
の部分の文字列が何かかっこいいんですが
これはどうやってるのでしょうか?

95 :Name_Not_Found:2011/06/29(水) 21:39:20.22 ID:???
>>94
っ 開発ツール

96 :Name_Not_Found:2011/06/29(水) 22:57:13.82 ID:???
>>91
まだー?

97 :94:2011/06/29(水) 23:06:30.11 ID:???
こっち沙希にお願いします

98 :91:2011/06/29(水) 23:14:45.26 ID:???
>>96
うるせーはげ!

#menu a,#menu a:link,#menu a:visited {
font-size: 18px;
text-decoration: none;
color: #b3b3b3;
background-color: transparent;
width: 100px;
height: auto;
text-align: center;
padding: 2px 5px;
display: inline-block;

}
の部分を見直せ!

99 :Name_Not_Found:2011/06/29(水) 23:21:25.14 ID:???
>>98
見直しても分からないんだよな。
ほぼ本の丸写しなのに、上手く行かなくて涙目。
display: inline-block; ここら辺間違ってると思うが、どうやって直せばいいのかしら
>>96
ありがとう

100 :Name_Not_Found:2011/06/29(水) 23:52:22.08 ID:???
別ディレクトリに開発環境作ってガシガシやる !  って頭は無いのか ?

101 :Name_Not_Found:2011/06/30(木) 00:47:37.61 ID:???
>>99
お前には無理

102 :Name_Not_Found:2011/06/30(木) 01:51:09.90 ID:???
>>99
間違ってると思うなら、
色々自分で試すなり、
ググるなり何でしないのかしら。
一発で正解にたどり着こうとは思わないことだね。

103 :Name_Not_Found:2011/06/30(木) 03:42:55.82 ID:???
色々試した結果で上手く行かないから、聞いてるんですけど………

CSSは挫折して一年ぶり再挑戦だが、やっぱ無理でした\(^o^)/
iWebで我慢するわ

104 :Name_Not_Found:2011/06/30(木) 05:29:57.33 ID:???
>>103
そうしてください

105 :Name_Not_Found:2011/06/30(木) 10:33:05.08 ID:???
めでたしめでたし

106 :103:2011/06/30(木) 14:53:02.25 ID:???
お前らに聞いたのが間違いだったw
HTMLが間違ってた。クソか
<span></span>消したら治った

107 :Name_Not_Found:2011/06/30(木) 14:55:23.35 ID:???
負け犬の遠吠えうぜえ

108 :Name_Not_Found:2011/06/30(木) 18:43:27.98 ID:???
100x100のサイズの透過png、2枚をズレが無く、端が完全に一致するように重ねたいです。
CSSでこれはできるのでしょうか?できるのであれば、教えていただけると助かります。

109 :Name_Not_Found:2011/06/30(木) 19:49:06.09 ID:???
画像を重ねる方法はまずggったの?

110 :Name_Not_Found:2011/06/30(木) 19:53:31.71 ID:???
#hoge1 {background:url(hoge1.png); position:absolute; top:0px; left:0px; z-index:1; width:100px; height:100px;}
#hoge2 {background:url(hoge2.png); position:absolute; top:0px; left:0px; z-index:2; width:100px; height:100px;}

111 :Name_Not_Found:2011/07/02(土) 00:40:13.47 ID:???
>>106
またおまえか

112 :Name_Not_Found:2011/07/03(日) 22:04:34.21 ID:2Rq9N8sk
ちょっとお聞きしたいんですが、
mac版とwindows版のsafariやfirefoxはcssの解釈の仕方って違うんでしょうか??


113 :Name_Not_Found:2011/07/03(日) 22:20:40.30 ID:???
>>112
違いますん

114 :Name_Not_Found:2011/07/03(日) 23:32:01.72 ID:???
>>113
やっぱり違うものなんですね
macで色々作ってみた後、winで確認したらie以外動作は一緒だったので
winでの検証は必要ないのかなーと思っちゃいました

ありがとうございました

115 :Name_Not_Found:2011/07/05(火) 11:25:25.42 ID:???
ツイートするボタン、いいねボタン、Google+1ボタンをliタグで横に並べる場合、
ul,liのスタイルはどんな風に指定するのがいいのでしょうか?
display:inline-blockしましたが、ブラウザによっては縦に並んだり、横に余計な空白ができてしまい困ってます。

116 :Name_Not_Found:2011/07/07(木) 23:28:33.24 ID:IO9NQol+
左にメニューバーA、B、Cがあって、それを押すとメインに画像(Aを押すとAが出る)
という構造にしたいんですが、「擬似フレーム」というのを
使うしかないんでしょうか?

その場合ベースhtmlをコピーして、貼る画像の数だけ増やすと
膨大になりそうなのですがいい方法はありませんか?

それともCSSの#mainでなんとかできますか?

お願いします。

117 :Name_Not_Found:2011/07/08(金) 02:24:35.76 ID:???
っ ECMAScript or SSI or PHP や Ruby

118 :Name_Not_Found:2011/07/08(金) 07:47:32.48 ID:???
CSSのプロパティ値に
・コンマ区切り font-family: A, B, C
・スペース区切り background-position: center center
・スラッシュ区切り font: 100%/150% normal
がありますが、使い分けルールや優先順位はありますか

119 :Name_Not_Found:2011/07/08(金) 08:10:39.42 ID:???
>>118
プロパティごとに違うから仕様書を確認すべし

120 :116:2011/07/08(金) 17:54:36.74 ID:???
>>117
ありがとうございます

121 :Name_Not_Found:2011/07/08(金) 18:43:06.12 ID:???
ベンダープレフィックスについて各ベンダーごとの実装状況を知りたいのですが、
参考になるサイトはありますでしょうか。

例えば、あるプロパティについて
webkit系はベンダープレフィックスをつけてもつけなくても動作するが、
moz系はつけないとダメなどの情報が知りたいです。

よろしくおながいします

122 :Name_Not_Found:2011/07/08(金) 21:47:12.49 ID:???
ベンダー接頭辞は実験的・先行実装を示すものだから
デメリットを理解した上で自分で探すものじゃないの
「つけないとダメ」という発想自体が何かおかしい
接頭辞つきのものは原則として「よく分からないなら使っちゃいけない」

123 :Name_Not_Found:2011/07/08(金) 22:02:13.05 ID:???
いちおうこういうのもあるけど
http://peter.sh/experiments/vendor-prefixed-css-property-overview/

前、先行実装の-moz-opacityと正式実装のopacityの挙動が違うってことで
問題になってたような記憶があるようなないような

仕様自体がころころ変わって接頭辞付きの方が古い挙動になってることもあるから
俺も先行実装をむやみに使うのはすすめないぜ

124 :Name_Not_Found:2011/07/09(土) 17:24:12.67 ID:aXaGahbP
なんでブラウザで統一しようとしないんだろうね
実際ブラウザがそれぞれ話し合って、cssについてひとつにまとめるべきでしょ
IEはもちろんだし、firefoxもいつまでもリンク画像に線つけるのやめて欲しい

125 :Name_Not_Found:2011/07/09(土) 17:35:15.07 ID:???
>>124
ブラウザは一種の宗教だから、そこで統一は無理でしょ。

126 :Name_Not_Found:2011/07/09(土) 19:00:41.76 ID:???
国際標準とか知らんの?

127 :Name_Not_Found:2011/07/09(土) 19:58:50.22 ID:???
どうせ弱小サイトなんだから気にすんじゃねえよ

128 :Name_Not_Found:2011/07/09(土) 20:31:41.90 ID:???
>>124
あのな、なんでもひとつにまとめちゃうとな、新しい技術の開発が無くなるか遅れるの。
いろんなものがあるから進歩すんのよ。

 多様性は進化の母  な。

129 :Name_Not_Found:2011/07/09(土) 20:55:20.91 ID:???
>>124
いや、一つにまとまってるからCSSがあるんでしょ
ドラフト仕様に過度な期待は禁物、っていうか仕様が変動する可能性あるんだからベンダープレフィックスつけるんで正しいよ

130 :Name_Not_Found:2011/07/09(土) 22:05:18.99 ID:???
>>126
その標準とやらも人によって解釈が違うんだよ。
だから余計に宗教臭い。

131 :Name_Not_Found:2011/07/10(日) 04:17:24.29 ID:???
IEとNNが拡張競争やった反省からベンダー接頭辞が追加されたんだから
むやみに接頭辞付きのを宣伝して他人を巻き込まないでほしい
あれはバグフィクスとか開発者の意見調整用、アルファ版だろ

NN4とIE6の亡霊に悩まされなかった奴だけで遊んでればいいのに

132 :think49 ◆bKk/qcAKuM :2011/07/10(日) 09:26:44.58 ID:???
ベンダー接頭辞の意義は CSS3 にあるので一読すると良いかと。
http://www.w3.org/TR/css3-syntax/#vendor-specific
一般に独自拡張は回避すべきですが、独自拡張が便利な状況(実験的, W3C Draft, Candidate Recommendation等)があります。
CSS3 の多くは Recommendation になっていないのでベンダー接頭辞はむしろ使うべきです。仕様にない新しい機能を実装し、CSS に推薦する場合も使うべきです。

opacity を規定する CSS Color Module Level 3 は 2011/06/07 に Recommendation になったのでベンダー接頭辞は不要ですが、Recommendation になる前の段階で実装していたならベンダー接頭辞をつけ、Recommendation になった時点でベンダー接頭辞を外すことになります。
「Recommendation になってるんだからベンダー接頭辞は外しなさいよ」って指摘なら理に適っていると思います。
http://www.w3.org/TR/css3-color/

133 :Name_Not_Found:2011/07/10(日) 19:38:38.09 ID:???
2.1勧告されたの知らなかった

134 :Name_Not_Found:2011/07/10(日) 23:33:52.73 ID:???
せっかくcss3でつくりあげたのに
w3cでは「いいんだけど・・・ふーむ」とか
言われちまいました

135 :Name_Not_Found:2011/07/11(月) 00:41:06.58 ID:???
>>134
何のこと?

136 :Name_Not_Found:2011/07/11(月) 01:57:54.99 ID:???
http://cssglobe.com/lab/easyslider1.7/01.html
このようなスライダーを作ろうとしています
スライダーの本体部分のul要素で" width:4176px; margin-left:2088px; "が設定されていますが
これはどういう意味なんでしょうか?


137 :Name_Not_Found:2011/07/11(月) 03:00:59.68 ID:???
jQueryですね
昨今wordpressなんかで流行の

138 :Name_Not_Found:2011/07/11(月) 03:15:54.80 ID:???
>>132
勧告済みの2.1ではなくドラフトの3を持ってきた意図はわからないが
利用者がベンダー接頭辞をむやみに使ったページを作っていたら
勧告後も接頭辞付きをサポートし続けないといけなくなるだろが

だからMozillaでも-webkit-をサポートすべきだとか
vendor-prefix considered harmfulとか言われてんだよ
本末転倒な話になりつつあんだよ

139 :Name_Not_Found:2011/07/11(月) 06:21:48.95 ID:???
>>134
ふーむって何だよw

140 :Name_Not_Found:2011/07/11(月) 11:33:47.16 ID:???
>>136
それスクリプト切ってると悲惨な表示になるけど・・・

Linux Fx5 NoScript

141 :Name_Not_Found:2011/07/11(月) 19:56:04.14 ID:???
jQueryって何て発音してますか?

142 :Name_Not_Found:2011/07/11(月) 19:57:12.95 ID:???
じぇーくえりー

143 :Name_Not_Found:2011/07/11(月) 20:32:50.62 ID:???
>>138
通じあってない気がするなー

144 :think49 ◆bKk/qcAKuM :2011/07/11(月) 21:36:48.64 ID:???
>>138
私の意見は「ブラウザは何でベンダー接頭辞つけるの?初めから接頭辞なしで実装すればいいじゃない。」に対する意見であって、多分あなたの意見とそれほどには違いません。


145 :121:2011/07/11(月) 21:54:03.51 ID:???
すみません。
質問したことをすっかり忘れていました。
教えていただいたサイト、参考にさせていただきます。
ご回答いただいた方ありがとうございました。


146 :Name_Not_Found:2011/07/11(月) 23:03:16.75 ID:???
>>144
>>138
>ベンダー接頭辞はむしろ使うべきです

開発者と利用者のどっちが?つー部分で誤解を招きそうだったからだよ
CSS2.1には「Authors should avoid vendor-specific extensions」とあるんだから

147 :Name_Not_Found:2011/07/11(月) 23:30:06.35 ID:???
わざわざCSS3のリンク入れてるんだからそれぐらいわかるだろ

148 :Name_Not_Found:2011/07/11(月) 23:42:00.00 ID:???
数年前に少しかじって挫折したものです。
再度真剣にCSSを勉強しようと思うのですが、今からだとCSS3をしたほうがよいんでしょうか?
目標はある程度wpのテーマがいじれるです。

149 :Name_Not_Found:2011/07/12(火) 23:04:05.48 ID:???
今からならCSS2とCSS3を両方。(現時点ではCSS3は半分以上のユーザが非対応なブラウザを使ってることに注意)

150 :Name_Not_Found:2011/07/13(水) 00:05:52.32 ID:???
>>149
半々ですか…。
それならCSS2をみっちりやってから3にいく感じでやってみます。ありがとうございます

151 :Name_Not_Found:2011/07/13(水) 07:40:29.71 ID:???
CSS3なんて覚えようとする必要ないよ
CSS2に関してもAptanaやDW使えば、プロパティ選ぶだけだから、判らなければ都度CSSの学習ページ見ればすぐ覚える


152 :Name_Not_Found:2011/07/13(水) 16:07:50.08 ID:MknxO2g8
勧告された仕様のみを利用するという縛りについての質問です

先日、CSS 2.1 と CSS Color Module Level 3 が勧告されました
CSS 2.1 において、値に <color> が含まれているプロパティに対しては
RGBA color values 等を使っても問題ない。ということであっていますでしょうか

153 :Name_Not_Found:2011/07/13(水) 21:57:35.01 ID:???
>>152
合ってません。
CSS3 で <color> を指定しているプロパティと組み合わせてください。

154 :152:2011/07/13(水) 23:46:53.40 ID:MknxO2g8
>>153
ありがとうございます
CSS 2.1 の <color> とは別物として扱うのですね

現在 CSS3 は 一部だけが勧告されている状態ですが
その勧告の color: rgba(0, 0, 0, 0.5) などは現行の CSS 2.1 と一緒に使用しても良いのでしょうか

155 :Name_Not_Found:2011/07/14(木) 08:23:22.84 ID:???
>>154
CSS2 と CSS3 を組み合わせる事は出来ないと思って下さい。
後方互換性はありますが、仕様は別です。
CSS2 で定義されている仕様は CSS3 で再定義されます。

156 :Name_Not_Found:2011/07/14(木) 18:10:09.22 ID:???
フルCSSという表現がよくわからないのだが・・・

157 :Name_Not_Found:2011/07/14(木) 21:09:29.56 ID:???
>>156
CSSを最大活用するぐらいの意味しかない

158 :Name_Not_Found:2011/07/14(木) 21:09:29.95 ID:???
div厨のことじゃね?

159 :Name_Not_Found:2011/07/14(木) 22:07:32.09 ID:???
<div class"2年A組み">春 </div>

160 :Name_Not_Found:2011/07/14(木) 23:17:35.67 ID:???
>>159
整形式違反

161 :Name_Not_Found:2011/07/16(土) 00:34:41.58 ID:???
解像度変更はありがたいわ

162 :Name_Not_Found:2011/07/16(土) 23:12:50.77 ID:???
http://www.kanzaki.com/book/css/3-1-6.html#s3-1-6-2
主ブロックボックスの中に直接含まれるは「ブロックボックスのみ、もしくはインラインボックスのみ」
とありますが、こういう仕様だと何かいいことあるんでしょうか?

163 :Name_Not_Found:2011/07/16(土) 23:24:47.45 ID:???
>>162
決めなかったらブラウザ毎に動作が異なるでしょ

164 :Name_Not_Found:2011/07/16(土) 23:30:01.66 ID:???
>>162
どこが疑問なのかわからない
こんないい仕様があるよ、とかアイデアがあるの?

165 :Name_Not_Found:2011/07/17(日) 21:38:01.02 ID:QiofV2a+
tableかdivを下側に表示したいんですが、vertical-alignでbottomを指定しても中身しか下に表示されません。
何か方法はないんでしょうかね?


166 :Name_Not_Found:2011/07/17(日) 22:20:37.36 ID:???
エスパーすると、position使え

167 :Name_Not_Found:2011/07/17(日) 22:50:33.90 ID:???
>>166
質問の内容から容易に想像できるし、そんなのエスパーとは言わんw

168 :Name_Not_Found:2011/07/17(日) 23:57:42.24 ID:???
positionアブノーマルを

169 :90:2011/07/19(火) 19:57:11.55 ID:???
久々また来ました。質問させて頂きます。
まだ一部分しか出来てません。。。

ttp://citywood.web.fc2.com/sites/works/bags01.html

<link rel="stylesheet" media="all and (orientation:landscape)" href="landscape.css">
<link rel="stylesheet" media="all and (orientation:portrait)" href="portrait.css">

会社のwindows7のIE、スレプニルだとCSS全く反映されません。(プロクシあり)
自宅のMacのOSXで、safari、Chrome、Opera、iPadのSafari、iLunaで問題なく反映されます。
(iPadのOperaは反映されません)

iPad用にCSSしか作ってないのがいけないでしょうか?

170 :Name_Not_Found:2011/07/19(火) 22:18:16.39 ID:KrhDgo6r
<div id="oya" style="margin-left:10px">
<div id="ko"></div>
</div>

koに親のmarginを無視させたいんですが何か良い方法ってあるんでしょうか?

171 :Name_Not_Found:2011/07/19(火) 22:22:07.73 ID:???
>>170
<div id="oya" style="margin-left:10px">
<div id="ko" style="margin-left:-10px"></div>
</div>

これでいいか?

172 :Name_Not_Found:2011/07/27(水) 18:24:57.41 ID:K8T/UJoQ
Webデザインの基金訓練を受講してる人 Part2
http://yuzuru.2ch.net/test/read.cgi/dame/1308059991

>>520

飛び込みはなかったけど、チラシ配りとか。
あとちょっとでも脈ありそうな家に通うとか。住宅営業だった。

WEBの営業となるとHPまだ持ってない企業にアタックして〜
って感じなのかな
俺もぶっちゃけ独立考えてるからいろいろ想像してる。


173 :Name_Not_Found:2011/07/28(木) 06:27:44.45 ID:YHbKR4W+
文字の長さが違う物を同じ幅にしたいのですがどうやればいいのでしょうか?

<div>
<span>ほげ</span><br>
<span>ほげほげほげほげほげほげ</span><br>
<span>This is a pen.</span>
</div>
↓↓↓

ほ               げ
ほげほげほげほげほげほげ
T h i s  i s  a  p e n .

こんな感じになってほしいのですが。

174 :Name_Not_Found:2011/07/28(木) 07:47:05.16 ID:???
>>173
CSSでは無理だと思うな
JSならできそうだけど面倒だな

175 :Name_Not_Found:2011/07/28(木) 07:59:20.29 ID:???
>>172
勉強が足りんぞ

>>173
letter-spacing を使いなさい

176 :Name_Not_Found:2011/07/28(木) 08:02:24.49 ID:???
あっ ・・・
>>174
勉強が足りんぞ

  俺は2ch修行が足りんな orz

177 :Name_Not_Found:2011/07/28(木) 08:15:05.98 ID:???
>>176
文字間を均一にすることができる?

178 :174:2011/07/28(木) 08:48:12.48 ID:???
>>175
出先だから仕様書は読めないんだが、widthやfont-sizeから文字間を計算して固定値を指定することは勿論出来る
だがそんな面倒な作業は現実的でないから出来ないといった
面倒な作業をJSに任せればコーディング以外は楽になる
CSSで簡単な方法があるなら申し訳ない

179 :Name_Not_Found:2011/07/28(木) 08:57:27.27 ID:???
500px内に収めたい→文字数カウント→500/文字数 pxのletter-spacingを指定
ならわかるけど
letter-spacingは1文字の幅を指定するものだから
単純に20px指定した場合>>173の例だと上から順に40px 240px 280pxになる
つまりletter-spacingは解決策ではない

180 :Name_Not_Found:2011/07/28(木) 12:24:42.03 ID:???
letter-spacing は1文字の幅じゃなくて、1文字ごとの余白じゃないの?

181 :Name_Not_Found:2011/07/28(木) 12:50:37.07 ID:???
均等割り付けしたいように見えるけど、CSS3のtext-justify使わないと難しいんじゃないかな

182 :Name_Not_Found:2011/07/28(木) 13:37:45.66 ID:???
>>178-179
やってみてから言おうな

183 :Name_Not_Found:2011/07/28(木) 13:52:23.92 ID:???
上から目線もほどほどに

184 :Name_Not_Found:2011/07/28(木) 13:53:13.77 ID:???
>>173
なげーうんこしてねえで↓にしろ
先ずはとらいあんどえらーで勉強すろ

<div>
<p style="letter-spacing:**px;">ほげ</p>
<p style="letter-spacing:**px;">ほげほげほげほげほげほげ</p>
<p style="letter-spacing:**px;">This is a pen.</p>
</div>

185 :Name_Not_Found:2011/07/28(木) 14:22:51.08 ID:???
text-justify: *-all-lines みたいな値は草案に無いけど
正式に勧告されたとして、強制改行が入ってる文章の均等割り付けって出来るんだろうか

186 :Name_Not_Found:2011/07/28(木) 18:09:56.94 ID:???
pxじゃなくてemで指定するほうが環境に優しいと思います

187 :Name_Not_Found:2011/07/28(木) 18:36:12.57 ID:???
つうか>>184は全然均等にならんぞ

188 :Name_Not_Found:2011/07/28(木) 18:54:48.97 ID:???
**px これ変えたらなったな

189 :Name_Not_Found:2011/07/28(木) 18:56:06.65 ID:???
ほ               げ
ほげほげほげほげほげほげ
T h i s  i s  a  p e n .

こんなふうになったよ

190 :Name_Not_Found:2011/07/28(木) 19:16:08.38 ID:???
>>184はブラウザ毎に最適値が変わるけど


191 :Name_Not_Found:2011/07/28(木) 20:19:34.88 ID:???
HTMLに依存するCSSが使いやすいわけがない

192 :Name_Not_Found:2011/07/28(木) 21:28:43.85 ID:???
>>184
ウィンドウサイズをトライアンドエラーする訓練ですね、わかります

193 :Name_Not_Found:2011/07/28(木) 21:53:02.25 ID:???
>>192
今どきそんな物言いするのは情弱の田舎者だけ

194 :Name_Not_Found:2011/07/29(金) 01:30:06.07 ID:???
もしかして全部同じ数値じゃなくて個別に文字数数えて指定しろとかいうオチ?

195 :Name_Not_Found:2011/07/29(金) 04:43:59.72 ID:???
* が何を意味するか知らない奴がいたのか・・・

196 :Name_Not_Found:2011/07/29(金) 04:55:57.40 ID:???
いや俺プログラマーですし
正規表現だってバリバリ書きますよ
動くコードちょうだいよ

197 :Name_Not_Found:2011/07/29(金) 05:11:35.27 ID:???
プログラマならなおさら**pxと書かれたものが同じ数値とは思わんはずだが ?

198 :Name_Not_Found:2011/07/29(金) 05:17:27.25 ID:???
え?なんで?
それだけで違う数値なんてわからねえよww
なんでもいいってことは全部同じでもいいってことだぞ

199 :Name_Not_Found:2011/07/29(金) 05:25:50.11 ID:???
同じで駄目なら変えてみるってのが人間の常識だよ。

200 :Name_Not_Found:2011/07/29(金) 05:39:45.73 ID:???
答になってねーww
結局個別に指定する必要があるならJavaScriptでやれが親切な答えだったな

201 :Name_Not_Found:2011/07/29(金) 06:39:18.07 ID:???
>>193
わかってないな
ウィンドウサイズが変われば横幅も変化するだろ

202 :193:2011/07/29(金) 09:33:15.31 ID:???
>>201
白痴かお前は。
俺が言ってるのは後半の9文字のことだ。

203 :Name_Not_Found:2011/07/29(金) 12:54:22.76 ID:???
言い方一つで情報弱者ってわかるものなの?

204 :Name_Not_Found:2011/07/29(金) 12:54:35.63 ID:???
>>189はそれぞれの文字の幅を算出して合計したら、ってこと?

205 :Name_Not_Found:2011/07/29(金) 12:57:35.00 ID:???
俺も>>189のソースを見たいわ

206 :Name_Not_Found:2011/07/29(金) 14:02:29.18 ID:???
ここは手取り足取りスレかいな・・・

207 :Name_Not_Found:2011/07/29(金) 14:20:27.39 ID:???
できたっていってソースを出し惜しみする理由がわからないわ

208 :Name_Not_Found:2011/07/29(金) 17:58:10.22 ID:???
>>184
これはJavaScript使って文字数計算したら完璧か?

209 :Name_Not_Found:2011/07/29(金) 21:48:37.67 ID:???
ヒントを出したつもりなんだろうが、そのヒントが的外れだからなー

210 :Name_Not_Found:2011/07/30(土) 01:14:14.31 ID:???
別個に指定するのがめんどくさかったから聞いたんだろうにね

211 :Name_Not_Found:2011/07/30(土) 08:02:48.26 ID:???
ところで、質問主は逃亡かい ?

212 :Name_Not_Found:2011/07/30(土) 08:21:18.57 ID:???
こんな流れじゃ逃亡もするわな

213 :Name_Not_Found:2011/07/31(日) 08:32:24.63 ID:???
聞きたいことくらいちゃんと説明できないのか

214 :Name_Not_Found:2011/07/31(日) 08:46:27.51 ID:???
>>173見て理解できないならリアル池沼なんじゃないかと思う

215 :Name_Not_Found:2011/07/31(日) 14:29:27.57 ID:???
(親要素の横幅 − 文字列の横幅) ÷ 文字数
を letter-spacing に指定すればいいんかな

216 :think49 ◆bKk/qcAKuM :2011/07/31(日) 16:13:58.32 ID:???
string-length (文字数) とすれば、以下のように。

(width - padding-left - padding-right - font-size * string-length) / string-length - 1

CSS のみで定義するなら全ての単位を合わせる必要があります。
JavaScript なら getComputedStyle を使用できるので CSS で指定する単位を気にする必要がありません。
(text-indent も 0 にリセットする必要がありますね。)
http://hp.vector.co.jp/authors/VA022006/css/box.html#introduction-box
http://www.w3.org/TR/DOM-Level-2-Style/css.html#CSS-CSSview-getComputedStyle

ちなみに、自動改行しないことが前提となります。
JavaScript なら window.onresize のタイミングで再計算させることが可能ですが、筋のいい方法とは思いません。

217 :think49 ◆bKk/qcAKuM :2011/07/31(日) 16:29:55.97 ID:???
失礼。>>216の計算式を訂正します。

(width - padding-left - padding-right - font-size * string-length) / (string-length - 1)

# 蛇足。
CSS Text Level 3 の text-justify プロパティは >>173 が求める機能に近いですが、単語単位で均等割付してしまいます。
http://jsfiddle.net/UEjkm/1/
全ての文字を半角スペースで間隔を開ければ期待通りに動作しますが…。
http://jsfiddle.net/UEjkm/3/

218 :Name_Not_Found:2011/07/31(日) 16:33:24.95 ID:???
その計算式って固定幅フォントが前提じゃない

219 :think49 ◆bKk/qcAKuM :2011/07/31(日) 16:55:34.71 ID:???
>>218
CSS のみで実装するならその通りです。基準となる部分全てを固定値で指定しなければなりません。font-size を利用する都合上、固定値を使わざるを得ないので…。
JavaScript の場合は getComputedStyle で取得する単位のデファクトスタンダード(確か実装依存)が px なので固定値でなくても良いです。

>>216でも書きましたが、私は筋のいい方法とは思ってません。Webページの利点を相殺してますからね…。
text-justify と JavaScript を組み合わせる方がまだ現実的だと思います。

220 :Name_Not_Found:2011/07/31(日) 17:07:54.03 ID:???
強制改行無しなら、text-justify: distribute とかで出来るんじゃないかな
http://www.w3.org/TR/css3-text/#text-justify

>>217の後者(半角スペース挟み)って、IEの互換表示でしか機能しないんじゃない

221 :think49 ◆bKk/qcAKuM :2011/07/31(日) 17:07:58.44 ID:???
>>218
あ、プロポーショナルフォントのことですね。すみません誤読です。
プロポーショナルフォントの幅計算は無理なので letter-spacing を使用するなら固定幅フォントを使うしかないんじゃないでしょうか。
目測でトライアンドエラーするのはあまりにも…。

222 :220:2011/07/31(日) 17:11:00.02 ID:???
あ、削除された値使ってたのか
ごめん何か勘違いしてた

223 :Name_Not_Found:2011/07/31(日) 17:19:52.36 ID:???
*-all-linesがなくなった?以上、JavaScriptでこんなんするしか無いんじゃないかな
わからんけど

http://jsfiddle.net/MwxG6/

・HTML
>>173

・CSS
div{
width: auto;
float: left;
}
span{
display: inline-block;
}

・JavaScript
var parent = document.getElementsByTagName('div')[0];
var parentWidth = parseInt(document.defaultView.getComputedStyle(parent, '').width);
var lines = parent.getElementsByTagName('span');
for(var i = 0; i < lines.length; i++){
var stringWidth = parseInt(document.defaultView.getComputedStyle(lines[i], '').width);
var stringLength = lines[i].firstChild.length;
lines[i].style.letterSpacing = (parentWidth - stringWidth) / (stringLength - 1) + 'px';
}

224 :Name_Not_Found:2011/07/31(日) 17:23:32.34 ID:???
最終行での(強制改行ありの文章での)均等割り付けって
使い道なさそうだから消されたんかな?

225 :think49 ◆bKk/qcAKuM :2011/07/31(日) 17:24:10.50 ID:???
>>220,222
ああ、いや私も distribute-all-lines が IE の独自拡張と気がついてませんでした。
http://msdn.microsoft.com/ja-jp/library/gg721783%28v=expression.40%29.aspx
>>217は IE8 の標準準拠モードで動作確認済みですが、CSS3 的には distribute-all-lines を distribute に置き換えるべきですね。
distribute を実装しているブラウザがないので将来に期待かな。(GC12, Fx4, Op11.50, IE8 でNG)
http://msdn.microsoft.com/ja-jp/library/gg721783%28v=expression.40%29.aspx
http://jsfiddle.net/UEjkm/4/
http://jsfiddle.net/UEjkm/5/

226 :Name_Not_Found:2011/07/31(日) 17:29:56.26 ID:???
>>225
もう限界みたいだな。
これ以上ボロ出さんうちに、そろそろ引っ込んだ方がいい。

227 :Name_Not_Found:2011/07/31(日) 17:34:54.12 ID:???
限界?

228 :Name_Not_Found:2011/07/31(日) 17:38:08.00 ID:???
>>223
さかのぼってみたけど*-all-linesはもともとないみたい

229 :220:2011/07/31(日) 17:38:42.02 ID:???
削除じゃなくて独自拡張か
昔のCSS3草案にはあったと勘違いしてた
重ね重ねごめんなさい

230 :Name_Not_Found:2011/07/31(日) 17:52:11.89 ID:???
いろいろ勉強になった
失敗を恐れず積極的に書き込んでくれると嬉しいな

231 : 忍法帖【Lv=3,xxxP】 :2011/08/01(月) 18:16:30.29 ID:???
スレの趣旨から出された課題に対して、例え現実的でなくてもなんとかCSSで解決というのは分かる
しかし、ここで出された回答が表現する上で唯一の手段、正解であると思ってしまうのは非常に危険だと思うし、質問者にもよろしくないと思う
何もすべてCSSで片付けなくてもいいと思うから敢えて言う

画像にしろ

232 :Name_Not_Found:2011/08/01(月) 18:43:36.48 ID:???
     ___
   /|∧_∧|
   ||. (・ω・´| 話は聞いた!
   ||oと.  U|
   || |(__)J|
   ||/彡 ̄ ガチャ

233 :Name_Not_Found:2011/08/01(月) 22:05:26.97 ID:aa6NNPYw
位置指定をしてなくてブラウザに配置を任せてる<divid="a">があって、
その<div id="a">に<div id="b">を全く同じ位置、大きさで重ねたいんだけど
どうしたらいい?

JavaScriptで<div id="a">要素取得してtopとかhightを<div id="b">代入しようとしたけど、値はautoだった。

234 :Name_Not_Found:2011/08/01(月) 22:24:54.44 ID:???
aにabsolute指定してからtopとか取ればいいんじゃね

235 :Name_Not_Found:2011/08/02(火) 12:21:04.55 ID:???
http://omt.quu.cc/

236 :Name_Not_Found:2011/08/02(火) 19:26:57.06 ID:NeoNa2dH
<div id="a">にabsolute指定すると表示が崩れちゃう

237 :Name_Not_Found:2011/08/02(火) 19:38:15.10 ID:???
offsetTop使えば

238 :Name_Not_Found:2011/08/02(火) 23:35:11.46 ID:UYYP3zLF
質問

divで作ったボックスの中にformのinputタグを入れて
それを縦方向で中央に揃えたいと思いvertical-align:middleを設定しても効きません。
こういう場合どうやって縦方向中央に揃えるのでしょうか?


239 :233:2011/08/02(火) 23:42:20.56 ID:???
<div id="a">の中に<div id="b">を入れて
position: relative; を指定してtop, leftを相対位置で調節したらできた

>>238
ボックスの高さをline-heightに設定してみるとかは?



240 :Name_Not_Found:2011/08/03(水) 01:19:02.57 ID:???
>>239
行の高さなのに

241 :238:2011/08/03(水) 01:21:56.58 ID:???
>>239
できました。ありがとう。
line-heightは必要なかったです。

242 :Name_Not_Found:2011/08/03(水) 09:28:45.56 ID:???
twitterの背景画像はどうやって設定されてるのでしょうか?
ページを開いてurlでgrepしてひたすらクリックしても関係ない画像ばかり表示されてしまいました

243 :Name_Not_Found:2011/08/03(水) 09:39:58.56 ID:???
>>242
JavaScriptで書き出してるっぽいな
DOMツリーをみればstyle要素の中にあることがわかる

244 :Name_Not_Found:2011/08/03(水) 12:07:04.73 ID:???
http://userstyles.org/style_screenshots/18192_after.png
液晶のバックライトが強く目が疲れやすいのでこのような配色にしているのですが
全てのテキストカラーを薄灰色にしてしまうため、例えば通販サイトの「在庫なし」といった
赤文字に気付かずに進めてしまったといった事があります。

それで黒い文字だけをグレーに変更し、それ以外の色はそのままで表示させるには
どのような記述にしたらいいのでしょうか?

今のcssではこのように一括で置き換えるようになっています。
body,span,div,table,tr,th,td,ul,li,a,h1,h2,h3,h4,h5,h6,dd,dt,dl,p,fieldset,form {
background-color:#000!important;
border-color:#222!important;
-webkit-box-shadow:none!important;
color:#999!important;
}

245 :Name_Not_Found:2011/08/03(水) 13:20:38.99 ID:???
その前に液晶の輝度落とせばいいんでね ?

246 :Name_Not_Found:2011/08/03(水) 13:32:42.54 ID:???
あ、すみません。モニタ輝度は最低でradeon catalyst CCCでも明るさを下げており
如意スクリーンという、モニタに半透明の黒いフィルタを掛けて輝度を落とすソフトも時には併用してるという状態なんです・・・

247 :Name_Not_Found:2011/08/03(水) 16:26:07.61 ID:G00vZZBp
@TABLEタグ
<table width="950">
<tr>
<td width="200"></td>
<td align="center"><img src="image.jpg" /></td>
<td width="200">hoge</td>
</tr>
</table>

ACSS
<div style="float:left; width:200px;"></div>
<div style="float:left; width:550px; text-align:center;"><img src="image.jpg" /></div>
<div style="float:left; width:200px;">hoge</div>

@のTABLEタグをAのCSSに置き換えたいと思っています。
しかし最初のdivが空のため?width:200pxが効きません。
どうしたら良いでしょうか?よろしくお願いします。

248 :Name_Not_Found:2011/08/03(水) 17:08:09.22 ID:???
>>246
部屋の照明をもっと明るくしろ

249 :Name_Not_Found:2011/08/03(水) 17:09:11.70 ID:???
>>246
虹彩炎かも?

250 :Name_Not_Found:2011/08/03(水) 17:23:50.11 ID:???
>>244
ユーザCSSでは無理だからユーザJSを使うしかないと思う

251 :Name_Not_Found:2011/08/03(水) 18:03:28.74 ID:???
>>247
margin

252 :Name_Not_Found:2011/08/03(水) 18:40:35.50 ID:???
>>250
text-color:black {color: #222} みたいな指定法でもあるのかと思っていました。
無理でしたか、なるほど。
javascriptについて調べてみますね、どうもありがとうございました。


253 :Name_Not_Found:2011/08/03(水) 21:12:16.34 ID:???
かれこれ1時間半ほど悩んで解決しないのでお願いします。

HTMLが
<h1><a href="../index.html"><img src="../images/logo.gif" alt="xxx" width="150" height="40" id="logo" /></a></h1>

これで場所指定してて
#header #logo {
position: absolute;
left: 20px;
top: 20px;
}

ロゴなのですが、これをロールオーバーで違う画像を表示させたいです。
#header #logo a:hover とか色々試しても全然ダメで。
どうかよろしくお願いいたします。

254 :Name_Not_Found:2011/08/03(水) 22:59:52.61 ID:???
IEの禁則処理を禁止する方法はないでしょうか?
line-breakを無効にしたいのですが。

255 :Name_Not_Found:2011/08/04(木) 09:53:38.79 ID:???
>>253
ロゴを画像じゃなく背景にしないとa:hoverで画像は切り替わらないです。
それかjavascriptで画像切り替え。

256 :Name_Not_Found:2011/08/04(木) 10:18:06.00 ID:???
>>254
word-break

257 :Name_Not_Found:2011/08/04(木) 12:42:52.46 ID:???
>>255
なるほど!なんとなくわかりました。
ちょっとやってみます。
ありがとうございました。

258 :Name_Not_Found:2011/08/06(土) 01:05:05.24 ID:jg7MGe1B
a { color:#000000; }
a:hover { color:#ff0000; }

これをタグのstyle=""に直接書くにはどうしたらいいでしょうか?
<a href="a.html" style="ここに直接書きたいです">

259 :Name_Not_Found:2011/08/06(土) 06:17:32.17 ID:???
>>258
ちょちょちょ
どゆこと?

ぐぐってみたけど答え見付からず…

それと逆に質問なんだけど
<a href="###" style="ココに書く理由">ほげほげ</a>
ってのを教えてほしいです
一箇所だけ色を目立たせたい!ってならclassでイイやんと思うんよ

260 :Name_Not_Found:2011/08/06(土) 06:57:21.94 ID:???
:hoverをstyleタグで使いたいってことか?

aタグに直接style=""で:hoverをしたいしたい - HTML - 教えて!goo
http://oshiete.goo.ne.jp/qa/2170402.html

結論から言うと「できない」けどこのリンクに書いてあるように代替案はある
classタグを使ってCSSを参照するか、JavaScriptになるがonmouseoverとonmouseoutで対応する手もある

261 :Name_Not_Found:2011/08/06(土) 11:15:48.74 ID:???
>>260
結論はそれでいいけどclassタグはないよ
class属性ならあるけど

262 :Name_Not_Found:2011/08/06(土) 13:00:18.05 ID:???
http://www.geocities.jp/horisappu2005/tt.html
IEだとちゃんと表示されるのに
Firefox、Chrome、Operaだと崩れてしまう

みんなちゃんと表示させる方法ありませんか?

263 :Name_Not_Found:2011/08/06(土) 13:27:15.41 ID:UkfT4Fl8
>>262

ul,li{margin:0;padding:0;}

#link li {
list-style-type:none;
float:left;
}

#link li a {
display:block;
text-decoration:none;
padding:10px;
width:200px;
color:#000;
}

#link li a:hover {
background:#cccccc;
}


264 :Name_Not_Found:2011/08/06(土) 18:28:50.26 ID:???
ありがとうございます
ホームページビルダーで作るとどうしても
IE以外のブラウザで崩れてしまうんですよね

265 :Name_Not_Found:2011/08/06(土) 18:34:26.85 ID:UkfT4Fl8
>>264
ビルダーだからってことは無いと思うぞ。
(X)HTMLとCSS理解してれば、エディタやツールなんて自分に合ったもの使えば良いし、
分かってなけりゃ何使ったって躓くことになる。

266 :Name_Not_Found:2011/08/06(土) 18:48:32.09 ID:???
あれってビルダーで作ったやつなの?
liが閉じてないしcenter使いまくり
シロートな僕が手打ちしたのより酷くてびっくりしたよ

267 :Name_Not_Found:2011/08/06(土) 18:52:22.32 ID:???
>>267
確認画面でプレビューするとき元の画像が90度回転して表示されてしまいます
元は縦長だった画像が横回転して横長画像として表示されてしまいます
何が原因でしょうか? 何度も質問してすみません

268 :Name_Not_Found:2011/08/06(土) 18:52:36.72 ID:???
>>264
ビルダーのプレビュー画面を見て作るんじゃなくて作った後、各種ブラウザで開いて確認するんだよ
面倒だと思うかもしれないが、皆そうしてる

269 :Name_Not_Found:2011/08/06(土) 18:53:22.63 ID:???
>>267
おいアンカーがループしてるぞ

270 :Name_Not_Found:2011/08/06(土) 18:56:10.21 ID:UkfT4Fl8
>>267
自問自答するのかw

271 :Name_Not_Found:2011/08/06(土) 18:57:01.35 ID:???
>>269-270
http://hibari.2ch.net/test/read.cgi/php/1311803617/268n

272 :Name_Not_Found:2011/08/06(土) 19:00:45.83 ID:UkfT4Fl8
釣られちまったわw

273 :267:2011/08/06(土) 19:08:37.68 ID:???
白状すると投稿欄にキャッシュが残っていて誤って投稿した
お騒がせして済まない

274 :Name_Not_Found:2011/08/07(日) 18:17:21.27 ID:pI4wFMsj
http://39kn.com/2009/04/08/1610/
上記ページのDEMO-B「Horizontal Accordion」の複製を1ページ内に縦に2段並べたいのですが巧くゆきません。
(このページの「DEMO-A」「DEMO-B」の様な状態です。)※複製した下段が動作しません。
また上段・下段でスライド方向を逆にしたいと考えています。
以上2点、HTML及びCSSの書き方をご教示願います。

275 :Name_Not_Found:2011/08/07(日) 19:11:23.49 ID:???
断る !
そこに訊け !

276 :Name_Not_Found:2011/08/07(日) 19:14:04.07 ID:???
ビクンビクンリストはウザいだけだから止めといたが吉

277 :Name_Not_Found:2011/08/11(木) 23:23:39.92 ID:???
CSSファイルを別に用意したページを作る際に
サイト全体でその一カ所しか設置しない部品(画像など)の
位置情報等をわざわざCSS側に記述する事は
なにかメリットはあるんでしょうか?

HTMLソース自体はすっきりするかもしれないですが
後々修正するときに見辛い様な気がしてます。

278 :Name_Not_Found:2011/08/11(木) 23:50:05.42 ID:???
デザインはCSS側に分離するもんです
使用頻度とか関係ないんです

279 :Name_Not_Found:2011/08/12(金) 02:44:41.37 ID:???
サイト全体に対して
一箇所しか使わないけど画像って事は
そのページの内容に関わる事なのかな?
だったらHTMLに直接でも良いはず
>>277さんが言う様に
デザインだけならcssに書くべきかもね

280 :Name_Not_Found:2011/08/12(金) 06:13:41.75 ID:???
>>277
絶対にその一箇所だけなら、html内にcssを書くのも有り。

281 :Name_Not_Found:2011/08/12(金) 12:37:11.96 ID:???
別に効率良く別ファイルにできるだけであって、
>>277がやりやすいようにすればいい
全部のファイルにcssをコピペするのでも間違いではない。
1カ所だけのために別ファイルにcssを書くのも間違いではない。

ただ、手間とか見通しとか考えてやっていくと自然と>>280に形に最終なるとは思うけど。
好きなようにやってれば自然とどれが楽かわかってくる

282 :Name_Not_Found:2011/08/12(金) 19:42:29.74 ID:???
ルールとしてはHTMLにデザインを含むべきではない
デザインをウリとしてるなら
ドキュメントの一部だから含んでも良いと思う

283 :Name_Not_Found:2011/08/12(金) 21:04:15.66 ID:???
なんか勘違いしてる人がいるみたいだけどstyle要素の内容もCSSだよ
外部化とスタイル分離を混同してる

284 :Name_Not_Found:2011/08/12(金) 22:37:13.90 ID:???
夏だからなぁ・・・

285 :Name_Not_Found:2011/08/12(金) 23:32:58.71 ID:???
style要素の話誰かした?

286 :Name_Not_Found:2011/08/13(土) 00:09:04.27 ID:???
数千ページの大規模サイトじゃなければ
外部化する必要なんてない
ぶっちゃけどっちでも良い

287 :Name_Not_Found:2011/08/13(土) 01:49:08.22 ID:???
>>286
大規模サイトならむしろ出来る限り統合するだろ

288 :Name_Not_Found:2011/08/13(土) 03:48:06.53 ID:???
>>282
style要素使えばいいだけでしょ。


289 :Name_Not_Found:2011/08/13(土) 05:23:47.04 ID:???
>>282
style要素ならわからないでも無いですが
どうしても画像でオシャレな感じにしたいとなると…
あぁそうか
画像もstyleで指定できるのですね
古い思考なのでimg使いそうになる

290 :Name_Not_Found:2011/08/13(土) 08:33:04.55 ID:???
CSS:全体
style:個別

291 :Name_Not_Found:2011/08/13(土) 09:35:53.60 ID:???


292 :Name_Not_Found:2011/08/13(土) 10:59:22.35 ID:???

   @@@@@  / ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄
   (´・ω・`@ < 全然解ってないのね〜
   ┳⊂ )  \____________
  [[[[|凵ノ⊃
   ◎U□◎ =3 キコキコキコ

293 :Name_Not_Found:2011/08/13(土) 11:14:06.63 ID:???
CSS = Cascading Style Sheets
全体とか個別とか関係ないただの名前

294 :Name_Not_Found:2011/08/13(土) 17:59:42.26 ID:???
>>289
前景ならimg要素が適切だよ

295 :Name_Not_Found:2011/08/13(土) 22:55:41.84 ID:???
外部化しないのは、特殊な場合だけでしょ。

296 :Name_Not_Found:2011/08/13(土) 23:34:10.40 ID:???
>>295
いや、そういうのは、俺ルールであって、
こうでないといけないなんてのは無いだろ
自分がいいと思うなら全部のタグに一つずつ指定してもいい訳で

297 :Name_Not_Found:2011/08/14(日) 02:14:09.11 ID:???
何が言いたいのか
style属性自体非推奨だけど

style属性使わないといけないってのは、マークアップがおかしいんじゃないの

298 :Name_Not_Found:2011/08/14(日) 09:40:35.80 ID:???
>>297
まぁそういうなら、おまえはそうすればいいさ。
非推奨ってのは、「それは本来の便利さをなくすし見通し悪くなるから使わない方がいいよ」って事であって、
別に使っちゃいけないって禁止されてる訳じゃない

まぁ、そこまでいう>>297なんだから、imgタグやら改行タグも全部閉じてるんだろうけど。
でも、それすらも絶対守らないといけない約束じゃない
ヤプーですら、おまえのいう非推奨使ってるよ

自分が作りやすいように作る。これが一番いい
ソースを見せる訳じゃないんだから。
>>297の言ってる事は間違いじゃないだろうけど俺も間違ってるつもりないし。

299 :Name_Not_Found:2011/08/14(日) 09:49:23.95 ID:???
おいおい
文法も大切だけどここは初心者スレだ
初心者の僕でも楽しめるスレにして下さい

なにか取っ付きやすくて楽しいヤツお願いします

300 :Name_Not_Found:2011/08/14(日) 13:29:33.56 ID:???
てぶるでええよう・・・

301 :Name_Not_Found:2011/08/14(日) 13:37:01.54 ID:???
まぁ、趣味の範囲ならいいんじゃない

302 :Name_Not_Found:2011/08/14(日) 15:17:02.54 ID:???
HTMLとXHTML混同してね
HTML4.01で閉じたら文法違反だし、XHTMLで閉じなかったらパースエラー出てページ表示されないよ

303 :Name_Not_Found:2011/08/14(日) 16:14:03.44 ID:???
XHTML1.0とXHTML1.1を混同してね?
1.0は緩いけど、1.1は厳格だよ

304 :Name_Not_Found:2011/08/14(日) 16:28:07.13 ID:???
緩いのか ?
あれほど足を閉じとけと・・・

305 :Name_Not_Found:2011/08/14(日) 17:46:46.90 ID:???
>>303
お前は何を言っているんだ

306 :Name_Not_Found:2011/08/14(日) 21:29:29.70 ID:???
>>304
お前も何を言っているんだ

307 :Name_Not_Found:2011/08/15(月) 01:39:18.24 ID:???
>>302
html5ならどっちでもいいよ

308 :Name_Not_Found:2011/08/15(月) 01:59:52.53 ID:???
>>297
じゃあ外部ファイル2つ分けたら?
否定するなら代案示せっての

309 :Name_Not_Found:2011/08/15(月) 07:48:08.33 ID:???
「*margin-top:5px;」ていうのは、何のためのハックですか?

310 :Name_Not_Found:2011/08/15(月) 08:41:17.73 ID:???
外部ファイル2つ分けたらってどういうこと?

311 :Name_Not_Found:2011/08/15(月) 10:59:08.97 ID:???
>>309
*{margin-top:5px;}
でなくて
*margin-top:5px;
なの?

312 :Name_Not_Found:2011/08/15(月) 12:52:03.61 ID:???
>>311
そうです。たとえばYahooJapanのトップページなんかでも使ってます。

313 :Name_Not_Found:2011/08/15(月) 13:25:13.24 ID:???
>>312
正解は判らないけど
ブラウザ毎の解釈を回避するワイルドカードなんじゃないかな?
-webkit-とか入れる代わり…なのかなと思ってますが
誰か正解頼みます

314 :Name_Not_Found:2011/08/15(月) 16:37:37.82 ID:0Ppirfxl
>>313
IE7とそれ以下用のCSSハックです。

セレクタレベルでハックをかけない場合に使います。

body{
color:#000; /* 全てのブラウザに適用 */
*color:#ccc; /* IE7以下 */
}

のように使います。

IE6以下の場合は先頭に_を付けます。
IE8以下の場合は最後に\9を付けます。

body{
color:#000; /* 全てのブラウザに適用 */
*color:#ccc; /* IE7以下 */
_color:#FFF; /* IE6以下 */
color:#f30\9; /* IE8以下 */
}

315 :Name_Not_Found:2011/08/15(月) 16:46:14.88 ID:???
>>309 です。
情報を、どうもありがとうございました。

316 :Name_Not_Found:2011/08/15(月) 17:35:07.72 ID:???
>>314
ieのばかぁー

317 :Name_Not_Found:2011/08/15(月) 18:58:02.96 ID:0Ppirfxl
>>316
気持ちは分かるが落ち着けw

318 :Name_Not_Found:2011/08/24(水) 02:11:34.12 ID:???
table[width="123"]
,table[height="123"]
{        border-color: red;        }

このようなスタイルで、
table[width="123"]
table[height="123"]
これらを一括して指定したくて、 table[*="123"] としたのですがエラーとなってしまいました。

値に「123」を持つtableを一括で指定する方法を教えてください。

319 :Name_Not_Found:2011/08/24(水) 03:31:54.47 ID:???
HTML5じゃなければ属性名は限られてるから全部指定しとけばいい

320 :Name_Not_Found:2011/08/24(水) 04:00:58.07 ID:???
>>319
ご回答ありがとうございます
おっしゃる方法なら確実なのですが、シンプルに記述したいのです
全称セレクタみたいに”全称プロパティ”なるものがあればよいのですが、見つからなくて。

321 :Name_Not_Found:2011/08/24(水) 08:26:10.39 ID:???
ecmascriptで

322 :Name_Not_Found:2011/08/24(水) 12:37:26.04 ID:???
>>320
ないものを使おうとするのは矛盾してるような
全称プロパティなるものをサーバサイドで正規のCSSに変換するとか…

323 :Name_Not_Found:2011/08/24(水) 15:47:58.35 ID:???
>>321-322
プロパティについては全称の指定は出来ないのですか、残念です。

正当な方法では指定出来ず、そのような工夫を施さないといけないのですね
ご回答ありがとうございました。

324 :Name_Not_Found:2011/08/25(木) 14:45:50.15 ID:???
link擬似要素でスタイルを指定するときに

<a>リ[画像]ン[画像]ク</a>

のように文字と画像が混在する部分をリンクとするとき
画像部分のみlink擬似要素スタイルが適用されないようにするには
どのように書けばいいのでしょうか

325 :Name_Not_Found:2011/08/25(木) 16:12:30.09 ID:???
継承するスタイルなら、子セレクタで打ち消す

326 :324:2011/08/25(木) 17:03:36.12 ID:???
自己解決しました
画像部分だけスタイルを適用させない、というより
a:link span {〜} などとスタイルを定義して
適用したい部分だけspanで囲えばいいですね
ちょっと面倒な感じですが

あと擬似要素じゃなくて擬似クラスでした
普通のクラスみたいに、入れ子指定が可能ですね

327 :Name_Not_Found:2011/08/25(木) 17:25:19.42 ID:???
>>325で合ってるやん

328 :Name_Not_Found:2011/08/25(木) 18:32:56.47 ID:???
自己解決(笑)

329 :Name_Not_Found:2011/08/25(木) 23:32:12.67 ID:???
これはひどいw

330 :Name_Not_Found:2011/08/26(金) 14:06:38.38 ID:???
2ch復活

331 :Name_Not_Found:2011/08/26(金) 14:43:44.26 ID:???
>>327
全然合ってないよ
「継承するスタイルなら」と勝手な条件付け

まあ初心者(が回答者を気取ってる)スレだから仕方ないが

332 :Name_Not_Found:2011/08/26(金) 17:51:11.60 ID:???
子セレクタで何か間違ってるか?

333 :Name_Not_Found:2011/08/26(金) 18:38:08.06 ID:???
上級者の集まるスレはココですか?

334 :Name_Not_Found:2011/08/27(土) 02:01:46.71 ID:???
違います。

335 :Name_Not_Found:2011/08/27(土) 06:02:26.81 ID:???
へー

336 :Name_Not_Found:2011/08/27(土) 16:43:24.07 ID:???
文字列を<span>で囲んで背景色をつけると、line-heightとは関係なく
文字の上下に余白を含んだ一定の高さになります(行ボックスというんでしょうか)
これを高さ1emのboxと並べると、行ボックスのほうが少し下に大きいのですが
なぜですか?これは正しい挙動なんですか?
行ボックスの高さは、決まっているものなんでしょうか?
フォントやブラウザによって変わってしまうものなんでしょうか
調整に困っています

337 :Name_Not_Found:2011/08/27(土) 17:28:50.07 ID:???
マージンやパディングを設定した上での話なんだろうな?

338 :Name_Not_Found:2011/09/01(木) 00:15:46.35 ID:qYPkGIUN
しつもんです

IMGタグのTITLE属性についてですが
スタイルシートで文字の大きさを変えたり色を変えたり出来ないのでしょうか?

よろしくお願いします

339 :Name_Not_Found:2011/09/01(木) 01:20:57.72 ID:???
出来ません。

340 :Name_Not_Found:2011/09/01(木) 09:41:21.24 ID:???
表示される保証なんてない属性なんだから
CSSでいじれるわけないでしょう
いじりたいならお前のブラウザの設定を変えてください

341 :Name_Not_Found:2011/09/01(木) 11:05:54.71 ID:qYPkGIUN
うるせーカス

342 :Name_Not_Found:2011/09/01(木) 11:36:05.12 ID:???
おやおや、困ったちゃんですね〜

343 :Name_Not_Found:2011/09/01(木) 12:34:03.35 ID:???
>>338
jQueryでツールチップを出してカスタマイズしたらどうかな。参考ページは自分でぐぐってね。

344 :Name_Not_Found:2011/09/03(土) 06:53:23.36 ID:???
display: inline-block; ってCSS2.1なんですよね?
でもググって1ページ目に来るようなリファレンスサイトなんかに載っていないのは、なんでですか?
あんまり正しくない?(使わないほうがいい?)ものなんでしょうか

345 :Name_Not_Found:2011/09/03(土) 10:30:49.05 ID:???
バリバリ出てくるバリバリ伝説

346 :Name_Not_Found:2011/09/03(土) 18:13:50.44 ID:???
すいません教えてください。
背景色の幅って文字数によって可変になりませんか?

html
<p class="a">あいうえお</p> <!--コレをAとする-->
<p class="a">あい</p> <!--コレをBとする-->

css
p.a{
background-color:#aaa;
}
A、Bどちらも一行まるまる色が敷かれると思いますが、
5字分の幅、2文字分の幅に出来る方法ってありますか?
あるのでしたら、そのやり方をお教えください。

5文字に合わせると(widthで決め打ち)、2文字の時スカスカに
なってしまい困っています。

幅が狭い用と広い用のCSSを作るべきですか?
宜しくお願いします。

347 :Name_Not_Found:2011/09/03(土) 18:45:51.87 ID:zuIuaqCy
pをspanにして適宜改行


348 :Name_Not_Found:2011/09/03(土) 19:00:06.02 ID:???
>>346
ブロックレベル要素ですからね
float: left; をかけるとか

349 :Name_Not_Found:2011/09/03(土) 19:10:54.35 ID:???
>>347-348
即レスありがとうございます。

できるんですね。お二人の指摘の所、
勉強してみます。

ありがとうございました。

350 :Name_Not_Found:2011/09/05(月) 17:37:44.81 ID:???
テーブルのセルにbackground-imageで表示させた
繰り返しなしの画像を、セルの中心(上下の偏りなく)に
表示させるにはどうすればいいのでしょうか。

こういうイメージです
セル → 口
画像 → ちいさい口

こうなって欲しいイメージ



よろしくお願いします。

351 :Name_Not_Found:2011/09/05(月) 18:09:05.75 ID:???
>>350
座標指定

352 :Name_Not_Found:2011/09/05(月) 18:10:59.37 ID:???
background-position: 左px 上px;

353 :Name_Not_Found:2011/09/05(月) 18:19:06.74 ID:???
>>351-352
のレスを参考に色々ググッた結果
background-position:center;
で所望の結果が得られました。

ありがとうございました。

354 :Name_Not_Found:2011/09/05(月) 18:25:11.26 ID:???
mac safari chrome firefox
background-position:50% 50%;
でど真ん中いけた他は知らん

355 :Name_Not_Found:2011/09/05(月) 18:26:01.83 ID:???
>>353
そんな指定方法が有ったのか
不勉強でした

356 :Name_Not_Found:2011/09/05(月) 18:38:48.38 ID:???
>>354
そういうやり方もあるんですね。検証結果もすごく助かります。
ありがとうございます。

>>355
他のオプションが付いているとうまくいかず、centerだけにしたら
中央に来ました。

357 :Name_Not_Found:2011/09/05(月) 19:39:24.14 ID:???
上pxの方を省略したら50%になる

358 :Name_Not_Found:2011/09/05(月) 19:42:52.44 ID:???
>>354
そりゃ、中央から「background-imageを開始する」ということだぞ

359 :Name_Not_Found:2011/09/05(月) 19:44:48.59 ID:???
>>358
と思ったら、オレが違ってた

360 :Name_Not_Found:2011/09/06(火) 02:40:57.58 ID:???
>>359
そう思って確認とってみたんだ
画像の左上が50%のポイントに当たると思ってブラウザに読み込ませたら
ど真ん中だったのでびっくりした

361 :Name_Not_Found:2011/09/11(日) 08:22:52.75 ID:???
超初心者の質問ですみません。
よくHTMLに、<!-- header end --> などとオレンジの文字でありますが(HPビルダー13)、
これは、どのような意味を持つのでしょうか。
プレビュー画面では、!マークがついています。
ただの、目印なのでしょうか。

362 :Name_Not_Found:2011/09/11(日) 08:27:22.89 ID:???
ブラウザのレンダリングには現れない部分
秘密のコメントだよ

まぁ作った人が判る様に目印として残しているんだな
ファイルサイズには影響しますがブラウザの表向き部分には影響しません

363 :Name_Not_Found:2011/09/11(日) 09:30:38.43 ID:???
>>362 ありがとうございます。

364 :Name_Not_Found:2011/09/11(日) 09:50:27.67 ID:???
CSS関係ねええええ

365 :Name_Not_Found:2011/09/11(日) 13:02:07.19 ID:???
CSSの指定に関して教えてください。
テーブルの横幅を一定(80%とか1000pxとか)に出来ますか?

口口←こういう感じのテーブルで、左が図、右が解説が入ります。
図の横幅がまちまちで、右のセルは相当細く(7文字程度)なっても構いません。
この2つのセルを足した幅が一定になるようにしたいのです。
例えば合計1000pxなら
 左セル_____右セル
 600__________400
 900__________100
 300__________700
といった感じです。

●html
<table><tr>
<td><img src="図.gif"></td>
<td>解説テキスト</td>
</tr></table>
●css
table{
 width: 1000px;
}
tdの幅は指定していません。
↑としましたが、右セルが、文字数に応じて伸び縮みしているだけで、合計1000px
になるような伸び縮みはしていません。trにwidth: 1000pxしても同様でした。

困り果てています、よろしくお願いします。

366 :Name_Not_Found:2011/09/11(日) 13:18:44.01 ID:???
>>365
table-layout

367 :Name_Not_Found:2011/09/11(日) 13:35:30.84 ID:???
>>366
早速のレスありがとうございます。
しかし
table{
width: 1000px;
table-layout:auto;
}

table{
 width: 80%;
 table-layout:auto;
}

table{
table-layout:auto;
}
いずれも変化なく、文字数に応じて伸び縮みして(例えば)1000px
には足りませんでした。

他の記述が影響してるのか、しかしテーブルに関しては記述してないのですが。
ただいいプロパティ教えて頂きました。

ちょっと試行錯誤してみます。
ありがとうございました。

368 :367:2011/09/11(日) 15:03:55.81 ID:???
>>366-367
完全に希望通りになりました。
本当にありがとうございました。

369 :Name_Not_Found:2011/09/12(月) 13:19:59.34 ID:???
すいません、JavaScriptの質問スレと悩んだのですが、こちらでお願いします。
どなたかご存知でしたら教えて下さい。

背景画像固定をiPhone対応させたくてiScroll4というスクリプトを読み込ませたのですが上手く動作しません。
http://cubiq.org/iscroll-4

具体的に説明すると、cssのbody{}要素に定義してある
"background-attachment: fixed"と同様の事をiPhoneのSafariでやりたいです。

ただ、設置したいページのhtml構成が、大きいtableが一つあるだけという構造で、
divでheaderやfooter、メインコンテナ等を定義してあるわけではありません。
単純に背景画像を固定させたい使い方の場合はどのように記述すればいいのでしょうか。
(単純にtableをwrapperで囲うとスクロール自体が出来なくなる)

370 :Name_Not_Found:2011/09/12(月) 13:50:01.23 ID:???
質問です。
以下のhtmlのalt属性の値が"target_name"の親の親のli要素を選択するにはどうすれば良いでしょうか?
あるコミュニティサイトで特定の人物の書き込みだけを非表示にしたいのです。

> <html>
>   <body>
>     <ul>
>       <li>
>         <div class="profile_image">
>           <img class="profile" src="html://xxx/xxx.jpg" alt="target_name" />
>         </div>
>       </li>
>     </ul>
>   </body>
> </html>

371 :Name_Not_Found:2011/09/12(月) 20:08:49.91 ID:???
>>370
親セレクタないので無理

372 :Name_Not_Found:2011/09/14(水) 11:54:07.06 ID:???
>>371
CSSで無理だとのことなのでjavascriptでやってみましたが、また新たな壁にぶちあたりまして・・・
それは別のスレで聞いてみます。
ありがとうございました。

373 :Name_Not_Found:2011/09/15(木) 08:04:22.41 ID:???
style sheet ですが、1HPあたり何枚くらい設定してますか。
また、すべて外部style sheetで設定して、インラインスタイルに記述しないほうが良いのでしょうか。
TOPページ以下がかなりの枚数があり、
また、写真、グラフ、動画など、文章など、サイズもまちまちで、レイアウトが煩雑で
box?ごと、いろいろ指定しなければなりません。
そうしますと、idを個々に割り振る数がかなり増えると予想されます。
上記の場合は、tableとの併用や、直接記述を増やしたほうが良いのでしょうか。


374 :Name_Not_Found:2011/09/15(木) 08:21:22.24 ID:???
統一したけりゃ外部が楽
各頁独自にしたけりゃインラインスタイルじゃねーの

レイアウトが煩雑に感じるのはセンスが無いのもあるだろうけど
統一感がないから余計にそう感じるのでは?
全体を見なおしてみたら?

375 :Name_Not_Found:2011/09/15(木) 12:13:36.28 ID:???
>>374
ありがとうございます。
style sheet ですが、topとtopページ以下は、別に作成してもよいのでしょうか。
完全にレイアウト(ヘッダー部分)が違います。
全体を見直してみます。

376 :Name_Not_Found:2011/09/16(金) 00:20:20.59 ID:???
好きにしなよ
管理しやすくするための外部ファイルなんだからさ

377 :Name_Not_Found:2011/09/16(金) 01:46:38.34 ID:???
>>373
個人的に同じジャンルのページは同じレイアウト・デザインの方が観る方も管理する方も楽と言うか良いと思うよ
あなたの場合なら写真、グラフ、動画、文章でそれぞれのページ毎の外部ファイル作るとか

378 :Name_Not_Found:2011/09/17(土) 10:08:21.86 ID:???
>>376
>>377
ありがとうございます。
自由に設定しても問題ないということがわかりました。
同じジャンルは同じレイアウトで、スタイルシートも共有で設定してみます。


379 :Name_Not_Found:2011/09/17(土) 11:31:44.63 ID:???
同一レイアウトの方がドコにいるのかを把握しやすくなるので
安心感が出るんだな

上級者は同一ルールを生かしつつレイアウトを変更してくる…
そうすると格好良くなってくる(場合もある)

380 :Name_Not_Found:2011/09/18(日) 05:28:17.69 ID:???
教えてください。

背景が黒のページで、縦スクロール付きの領域?が必要に
なりました。
調べてそれはできたんですが(overflow:auto;)、その領域?
の背景も黒のままです。
(そこに入れるあるテキストは他のページにリンクさせないと
いけません)
どうすればこの領域を白にできるのでしょうか。

ご教示ください、よろしくお願いします。


検索しているうちにテキストエリアというのを見つけて
やってみました。背景色は白に出来ましたが、リンクが
<a href="a.html">などと普通にテキストとして表示されてし
まいました。

381 :Name_Not_Found:2011/09/18(日) 05:40:14.29 ID:???
>>380
自己解決しました。
cssの記述の最後に ; をつけてませんでした。
スレ汚しすみませんでした。

382 :Name_Not_Found:2011/09/20(火) 07:52:38.14 ID:???
CSSのみでそのページがアクティブかどうかわかりますか?

わかりにくくてすみません。
ホーム、ページA、ページBがあり、ページ上部に
ホーム|ページA|ページB というナビゲーションがあります。
AのときにはナビのAがロールオーバーさせないようにしたいのです。

色々検索とかしたんですが、難しすぎて分かりません。
手ほどきか、やさしい(基礎から)解説ページを教えて下さい。

よろしくお願いします。

383 :Name_Not_Found:2011/09/20(火) 08:25:19.68 ID:???
>>382
スタイルを上書きすべし

384 :Name_Not_Found:2011/09/20(火) 13:24:33.50 ID:???
>>383
スタイルを上書きですか…。
検索途中に出会ったような気がします。
カスケードとか…。

うーん私にはまだ難しいようなので、泥臭く手を動かします。

落ち着いたらもっと洗練されたその技法を習得したいと
思います。

ありがとうございました。

385 :Name_Not_Found:2011/09/22(木) 23:57:25.75 ID:???
content : counter で番号を振ったとき

10
ではなくて
 1
10
のように数字の部分で右端揃えにしたいときはどうすればいいですか?

386 :Name_Not_Found:2011/09/23(金) 01:20:41.57 ID:???
>>385
content:counterを使ったことがないから詳しいことはわからないけど、
list-style:decimal;で番号振ったときも番号部分の位置指定が出来ないように、
content:counterでも同様に位置指定が出来ないとおもう。

無理やりあわせたいなら、桁が少ないところだけclass振ったりしてpositionとかtext-indentで調整するしかないんじゃないかなー。

387 :385:2011/09/23(金) 07:45:52.75 ID:???
>>386
わかりました。ありがとうございます。

388 :Name_Not_Found:2011/09/24(土) 13:40:25.37 ID:???
グローバルナビを下記のとおり作成しました。
設定しているリンクですが、htmlを修正中(HPを作成中)に、消えてしまい、
ナビの画像も消えてしまいます。都度リンクの貼り直しが必要になります。
何が問題なのでしょうか。

<div id="menu">
<ul>
<li id="menu01"></li>
<li id="menu02"></li>
</ul>
</div>

#menu01 a{
background-image: url(images/bg_menu01.gif);
background-position: 0px 0;
}


389 :Name_Not_Found:2011/09/24(土) 14:54:16.52 ID:???
リンク無いじゃん

390 :Name_Not_Found:2011/09/24(土) 16:15:10.86 ID:???
>>388
CSSでaタグセレクタにしてるけどソースにaタグないじゃん

391 :Name_Not_Found:2011/09/24(土) 16:50:10.59 ID:???
>>389
>>390
すみません。リンクが消えてしまうのです。
元は、
<li id="menu01"><a href="inquery.htm"></a></li>

のように入っているのですが、編集中に、リンクの箇所が消えてしまいます。


392 :Name_Not_Found:2011/09/24(土) 19:04:37.49 ID:???
小人さん ?

393 :Name_Not_Found:2011/09/24(土) 19:29:34.50 ID:???
単純に考えて何かのツールの予定外の動作だよね
何を使ってるかぐらい最初から書いたら?

394 :Name_Not_Found:2011/09/24(土) 23:49:44.33 ID:???
最近は投げっぱなしでキャッチボールが無いんだよなあ・・・

395 :Name_Not_Found:2011/09/25(日) 01:57:21.19 ID:???
誰か俺のデザインしたサイト作ってー
お小遣い程度の報酬は払うよー。


とか言ったらどうなるの?

396 :Name_Not_Found:2011/09/25(日) 02:09:29.31 ID:???
お小遣い5万でやってあげるよ。

397 :Name_Not_Found:2011/09/25(日) 04:35:01.96 ID:???
なら僕は10万だよ

398 :Name_Not_Found:2011/09/25(日) 08:50:38.88 ID:???
>>393 ホームページビルダー13を使用しています。
リンクの箇所が消えて、cssで置いている背景も消えてしまうのです。
※リンクには、背景画像だけでは設定できないのでしょうか。
「お問い合わせ」などと、文字も指定する必要があるのでしょうか。(x-9999でインデントを掛けて)


例)<li id="menu01"><a href="inquery.htm">お問い合わせ</a></li>


399 :Name_Not_Found:2011/09/25(日) 10:23:37.83 ID:???
CSS関係ないからビルダースレで聞くべき

400 :Name_Not_Found:2011/09/25(日) 16:23:14.16 ID:2ZSiKw9M
漢字のスペース

401 :Name_Not_Found:2011/09/26(月) 21:21:07.18 ID:???
分かりにくいw

402 :Name_Not_Found:2011/09/27(火) 12:37:14.51 ID:???
画面いっぱいに表示した画像Aの上に、画像Bを重ねて出したくて
その際、画像Bの左右位置をセンタリングしたいのですが
position:absolute とセンタリングを両立させるやり方がわからず、うまくいきません。
margin 0 auto やtext-align:centerではダメでした。どうすれば良いでしょうか

403 :Name_Not_Found:2011/09/27(火) 13:09:13.00 ID:???
背景にimg要素使ってんじゃない

404 :Name_Not_Found:2011/09/27(火) 22:07:48.59 ID:???
ソースを頼む

405 :Name_Not_Found:2011/09/28(水) 07:13:29.70 ID:???
    ,-ー──‐‐-、
   ,! ||      |
   !‐---------‐
  .|:::i ./´ ̄ ̄.ヽ.i
  |::::i | |\∧/.|..||
  |::::i | |__〔@〕__|.||
  |::::i |.(´・ω・`)||
  |::::i |  キング  ||
  |::::i | カワイソース.||
  |::::i L___________」|
  |::::i : : : : : : : : : |
  `'''‐ー------ー゙


406 :Name_Not_Found:2011/09/29(木) 17:49:00.38 ID:???
レイアウトが崩れるのを
ずっとIEのバグだと思ってたら
</a>タグの閉じ忘れだった。
こんな事ってあるのね。

407 :Name_Not_Found:2011/09/29(木) 19:56:54.05 ID:???
何処で改行するかによってもわずかにレイアウトに影響が出た時はビックリしたよ

408 :Name_Not_Found:2011/09/29(木) 23:34:40.74 ID:???
あるあるw
タグの閉じ忘れはページ書き終わった後に一回文法チェッカにかけるようにすれば良いよ

409 :Name_Not_Found:2011/09/29(木) 23:41:29.39 ID:???
え、普通エディタの機能で書きながらわかるだろ…

410 :Name_Not_Found:2011/09/30(金) 00:48:30.71 ID:???
みんなが同じエディタ使ってると思うなよ

411 :Name_Not_Found:2011/09/30(金) 01:05:53.64 ID:???
バカかお前

412 :Name_Not_Found:2011/09/30(金) 13:43:27.43 ID:???
改行位置の問題はブラウザのバグ

413 :Name_Not_Found:2011/09/30(金) 15:28:09.32 ID:???
HTMLでは改行と空白は一緒なんじゃないの

414 :Name_Not_Found:2011/09/30(金) 15:43:00.72 ID:???
カラー画像をモノクロに表示し、マウスが乗るとカラーになる、
別ファイルCSSでの記述方法はありますか?


415 :Name_Not_Found:2011/09/30(金) 17:25:47.65 ID:???
ない

416 :Name_Not_Found:2011/09/30(金) 20:50:25.28 ID:???
IEのJavaScriptでならできるけど、他は知らん。

417 :Name_Not_Found:2011/09/30(金) 22:46:59.77 ID:???
>>414
ちょいとググれば腐るほど出るだろうが

418 :Name_Not_Found:2011/09/30(金) 23:40:58.15 ID:???
IEの独自プロパティじゃなければ無いよ

419 :Name_Not_Found:2011/09/30(金) 23:49:19.19 ID:???
カラー写真とモノクロ写真を用意して、背景画像処理にすればおk。
img:hover{ background.... }てな感じで

420 :Name_Not_Found:2011/10/01(土) 00:00:12.22 ID:???
>>418
background-positionが無いとかお前どこの時空の人間だ

421 :Name_Not_Found:2011/10/01(土) 01:57:20.86 ID:???
はいはい

422 :Name_Not_Found:2011/10/10(月) 15:22:36.09 ID:mg3ahhXk
メニューリンクについて

サイト内ページ数15

各ページリンクの設定をやり直すのだけれど
そのやり方のついて小生は1ページづつこまめに設定させていく方法しか知りません
どなたか一発で15ページに影響させられる設定の仕方を知りませんか?

たとえば1ページだけ編集すれば全部に行き渡るというやり方・・・
教えてください

お願いします

423 :Name_Not_Found:2011/10/10(月) 17:21:06.54 ID:???
>>422
そう言ったものに対応したモノが必要です

424 :Name_Not_Found:2011/10/10(月) 18:28:11.20 ID:cMmCEUi9
エディタでマルチ置換
iframe
インリンク
swap
外部クッション

お好きなのでどうぞ


425 :Name_Not_Found:2011/10/10(月) 22:05:48.51 ID:???
というかCSS関係ねえ

426 :Name_Not_Found:2011/10/11(火) 15:12:28.96 ID:???
サイドバーやフッターのナビゲーションかぁ
そう考えると、フレームセットってある意味すげーよな
UAががしっかりセットとして実装できていれば、フレーム全盛の時代だったのかも・・・
SEO的にもサイドバーやフッターは不要だから効率は良いのにな

427 :Name_Not_Found:2011/10/12(水) 10:53:25.69 ID:???
ハイパーテキストの使い方ってのがまだ未知数だったときに
テーブルレイアウトで出版業界と同じデザイン、て方向に走っちまったからな
HTML5のasideなんてサイドバーに表示すりゃ良かったんだ

428 :Name_Not_Found:2011/10/12(水) 17:18:26.54 ID:???
ふと疑問に思ったことですが、自分ではうまく調べることができず解決できなかったので質問させて頂きます

・style, meta, linkなどのタグに対してidやclassといった属性を設定することはできるんでしょうか?
・また可能であるブラウザがある場合、それは仕様として正しいのでしょうか?
・あともしよろしければ、その設定したidやclassを用いてDOM操作することについてどう思うかも教えてください(例えばそんな使い方は気持ち悪いなど)

429 :Name_Not_Found:2011/10/12(水) 17:57:59.95 ID:???
>>428
表面に出てこないものにcssを設定してどうしたいんだ?

430 :Name_Not_Found:2011/10/12(水) 18:02:06.91 ID:???
style無理, meta無理,
link可能 正しい

431 :Name_Not_Found:2011/10/12(水) 18:16:05.55 ID:???
>>429
なぜ質問を読まない
スレチだとは思うけど

432 :428:2011/10/12(水) 19:50:52.95 ID:???
>>430
早い解答ありがとうございました!
linkタグは正しい仕様として可能なんですね、少し意外でした。

>>431
スレ違いかもしれないと思いましたがセレクタについてはCSSスレが詳しいのではないかと考え質問させて頂きました。
もっと適切なスレを探すべきでした、すいませんm(_ _)m

433 :Name_Not_Found:2011/10/13(木) 00:14:30.61 ID:???
>>428
XHTML以降はどれも可
metaを拾ってメタデータを可視化したりRDFaする
linkを拾ってナビゲーションを動的生成する
何も問題ない

434 :Name_Not_Found:2011/10/13(木) 04:33:03.86 ID:???
>>433
http://www.w3.org/TR/2010/REC-xhtml-modularization-20100729/dtd_module_defs.html#dtdelement_meta.qname
ここ読む限り駄目なように見えるけど、大丈夫なの

435 :Name_Not_Found:2011/10/13(木) 08:00:02.35 ID:???
>>434
詳しくは書かんが、XHTML 1.0でOKなのに1.1でダメって変だと思わなかったか
1.1ではローカル属性@id、@classなどをグローバル属性@xhtml:id、@xhtml:classに切替可能になってんだ
適合性の解釈に異論があるかもしれんが、気になるならどっかのスレにでも投げてみろ
XHTMLのスキーマはグダグダだから、自分で調整した方がはええぞ

436 :Name_Not_Found:2011/10/13(木) 17:14:17.98 ID:???
こっちのスレの方が平和だから向こうのニート君2人が飽きるまでアドバイスはこっちにしようかね

437 :Name_Not_Found:2011/10/13(木) 17:33:49.13 ID:???
帰れ

438 :Name_Not_Found:2011/10/13(木) 20:35:23.43 ID:???
>>437
文字を二行表示ってどうやってかくの?

439 :Name_Not_Found:2011/10/13(木) 20:36:29.41 ID:???
>>438
安価は虫してね間違えた

440 :Name_Not_Found:2011/10/13(木) 20:39:33.77 ID:???
質問省略しすぎだろ
回答者にエスパーさせんな

441 :Name_Not_Found:2011/10/13(木) 20:45:09.24 ID:???
>>440
text か font かなんかでできないかなぁ

442 :Name_Not_Found:2011/10/13(木) 23:18:11.46 ID:???
ここまで>>436の自演

443 :Name_Not_Found:2011/10/14(金) 00:40:06.52 ID:???
二行表示ってなんだ? オレの嫁レベルの質問の仕方だなw 

444 :Name_Not_Found:2011/10/14(金) 09:02:16.62 ID:???
エスパーすると、
通常の1行の中に、小さい字の注釈のようなものを2行で入れたい、
てことじゃないか。

445 :Name_Not_Found:2011/10/14(金) 12:24:58.12 ID:???
割注がしたいのか

446 :Name_Not_Found:2011/10/14(金) 13:16:09.21 ID:???
ルビを振りたいだけかもしれんぞ

447 :Name_Not_Found:2011/10/14(金) 16:20:27.52 ID:???
<span font-size:200%;>あ</span> だけの事じゃないのか?

1行<br>2行
とかだけの事かも?

分数の表示かもな。

448 :Name_Not_Found:2011/10/14(金) 17:43:55.83 ID:???
で、質問者本人はもうどこかへトンズラ、と。

449 :Name_Not_Found:2011/10/14(金) 17:53:36.70 ID:???
いつから質問者がいると錯覚していた

450 :Name_Not_Found:2011/10/14(金) 18:24:28.88 ID:???
暇つぶしの釣り

451 :438 です:2011/10/15(土) 11:37:15.93 ID:???
>>443-450
>>443のエスパーで合ってるっス

452 :Name_Not_Found:2011/10/15(土) 11:45:48.24 ID:???
つまり
俺の嫁
ってこと?

453 :Name_Not_Found:2011/10/15(土) 11:47:54.82 ID:???
>>452
俺はお前の嫁ではない!

454 :Name_Not_Found:2011/10/15(土) 12:48:37.65 ID:???
てへ

455 :Name_Not_Found:2011/10/15(土) 16:07:53.35 ID:???
オレの嫁レベルって事だから、
必要な穴は使えるってレベルじゃまいか

456 :Name_Not_Found:2011/10/15(土) 17:12:08.32 ID:???
*もか ?

457 :Name_Not_Found:2011/10/21(金) 18:53:13.84 ID:B01pCtnC
質問です

cssでmarginの指定で、上だけ0px他を5pxにしたいとき
@margin:0 5 5 5px;
Amargin:0px 5px 5px 5px;
Bmargin-top:0px; margin-right:5px; margin-bottom:5px; margin-left:5px;

いろいろあると思いますが他にも指定方法ありませんでしょうか?
ちなみに1番簡素化された指定方法は@ですよね?

458 :Name_Not_Found:2011/10/21(金) 19:00:09.29 ID:???
>>457
単位省略は値が 0 の時だけだから@はあり得ない
一番省略された形は margin: 0 5px 5px;

459 :Name_Not_Found:2011/10/21(金) 19:19:02.09 ID:B01pCtnC
>>458
なるほど。そういう指定もあったんですね
最初の「0 5px」が上下で後の「5px」が左右のことですよね。勉強になりました。

460 :Name_Not_Found:2011/10/21(金) 20:13:34.63 ID:???
>>459
いやいや、それは違うw
ちゃんとリファレンスを読もうね
http://hp.vector.co.jp/authors/VA022006/css/box.html#margin

461 :Name_Not_Found:2011/10/21(金) 23:24:39.37 ID:???
.aaaaa { background: url(URL1) }
.aaaaa { background: url(URL2) }
.aaaaa { background: url(URL3) }
↑と数種類ある画像をランダムに読み込ませたい場合はどこにどのような文字を記入すればいいでしょうか?

462 :Name_Not_Found:2011/10/21(金) 23:58:42.47 ID:???
スレチ

463 :Name_Not_Found:2011/10/21(金) 23:59:40.91 ID:???
>>462
誘導よろ

464 :Name_Not_Found:2011/10/22(土) 11:55:22.67 ID:4V51Rw3e
2カラムのサイトのレイアウトの方法で
左カラムにfloat:left、右カラムをfloat:rightとするのはわかるのですが
左カラムのwidthを100%とマイナス値の右margin、右カラムに右マージンという設定の仕方を見かけるのですが
この右カラムを左カラムの外からmarginでめり込ませてる?方法には何かメリットはあるのでしょうか?

465 :Name_Not_Found:2011/10/22(土) 12:39:26.77 ID:???
>>464
ネガティブマージンのこと?
http://coliss.com/articles/build-websites/operation/css/css-using-negative-margins.html

466 :Name_Not_Found:2011/10/22(土) 13:07:56.76 ID:???
>>465
これの事だと思います、ありがとうございます
つまりメリットというか左カラムを相対幅・右カラムを固定幅のレイアウトにしたい場合の作法って事ですかね

467 :Name_Not_Found:2011/10/22(土) 13:52:30.94 ID:???
>>466
ちょっと違うと思うけど…
ネガティブマージンは後続の要素を引っ張れるのが特徴
あなたの挙げた例は左カラムを100%にして右カラムを引っ張ってるだけ
しかも、正確には左カラムの横幅にはなってない

468 :Name_Not_Found:2011/10/23(日) 19:22:41.77 ID:72sISXfe
質問です

http://uploader.sakura.ne.jp/src/up63811.gif

↑これをCSS(DIV)で作ったらどうなりますか?
なるべくシンプルに作りたいのですがうまくできず困っています
(右と左の余白が全然合わなかったりとか・・・)
どうぞよろしくお願いします

469 :Name_Not_Found:2011/10/23(日) 19:59:01.53 ID:???
まずおまいのコーディングを見せてもらおうか

470 :Name_Not_Found:2011/10/23(日) 20:01:19.70 ID:72sISXfe
>>469
はい。でも滅茶苦茶ですw

<div style="width:120px; height:50px; padding:5px; background-color:#e69138; border-style:solid; border-color:#ffe599; border-width:4px; font-size:12px;">
<div style="float:left; width:30px; height:50px; background-color:#e69138; color:#ffe599;">url<br />abc</div>
<div style="float:right; width:70px; height:50px; background-color:#ffd966; color:#e69138;">A url<br />abc</div>
</div>

471 :Name_Not_Found:2011/10/23(日) 20:39:46.08 ID:???
この大きさのロゴ(?)をCSSでやるのが間違い。
画像で作るよろし。

472 :461:2011/10/23(日) 22:01:42.32 ID:???
>>461
誘導先でも答え貰えないし、この質問はCSSですので誰か教えてください><

473 :Name_Not_Found:2011/10/23(日) 22:08:34.05 ID:???
>>472
javascript

474 :Name_Not_Found:2011/10/23(日) 22:11:17.97 ID:???
>>473
ランダムに読み込ませることになるとjavascriptになるのか。。。さんくす

475 :468:2011/10/23(日) 22:18:33.81 ID:???
すぐに答えてもらえると思ったのに
答えてもらえないどころかコーディングまで晒せと言われ
挙句CSSでできることを画像でやれってアホみたいなレスしか返ってこないとは・・・

476 :Name_Not_Found:2011/10/23(日) 22:44:09.39 ID:???
>>475
だけどさ、この大きさでこの微妙な配置てさ、
見る人の環境(フォントサイズ、フォント種類、ブラウザ間の違いなど)で、
かなり印象かわるぜ。

pngで作るのが一番だと思うよ。
ちなみに、オレは>>469じゃないぜよ。

477 :Name_Not_Found:2011/10/23(日) 22:47:58.12 ID:???
>>468>>475>>476

478 :Name_Not_Found:2011/10/26(水) 09:11:09.22 ID:???
classみたいなものでbodyの色はあれでaの色はあれでpの色はあれでと
複数の要素を一まとめにする方法はありますか?
それ一つを呼び出したらすべてokという形にしたいのですが…
現在はページ数の多くないサイトに複数のcssファイルがあるので一つに
してしまいたいと思っています

479 :Name_Not_Found:2011/10/26(水) 10:28:43.92 ID:???
@importを使って1つのCSSにまとめればいいよ

480 :Name_Not_Found:2011/10/26(水) 11:00:15.94 ID:???
pxで指定しないでemや%で指定しろと聞いた事があるのですが
例えばフォントの大きさを指定する場合
基準となる大きさをpxで指定してから、部分的にemや%で相対指定して利用する
という認識であってますか?

481 :Name_Not_Found:2011/10/26(水) 11:15:39.68 ID:???
いいえ
「何も指定しない状態」を基準にしてください

482 :Name_Not_Found:2011/10/26(水) 11:32:23.19 ID:???
大きい文字で見たいのにサイズ指定されたら見れないの?

483 :Name_Not_Found:2011/10/26(水) 11:40:26.11 ID:???
最近のブラウザはズーム機能ついてるから見えないときはズームしろと言え。
emや%、リキッドだのでレイアウト崩れる方がかえって読みにくくなる。
画像や枠の大きさ無視して文字サイズだけ変えるなどという悪しき習慣がクソ。

484 :Name_Not_Found:2011/10/26(水) 11:41:09.19 ID:???
>>479
ありがとうございます
試してみます

485 :Name_Not_Found:2011/10/26(水) 12:07:31.65 ID:???
@importは通信回数増えるのが難点
人来ないサイトならいいけど

486 :Name_Not_Found:2011/10/26(水) 12:37:34.50 ID:???
pxって一応相対単位段だけど何で絶対単位だと認識されているのですか?

487 :Name_Not_Found:2011/10/26(水) 15:05:24.47 ID:???
だれが認識しているのですか?
1pxの大きさは環境ごとに固定だから絶対単位みたいな扱いされてもおかしくないとは思うが

488 :Name_Not_Found:2011/10/26(水) 17:12:03.12 ID:???
OKweb webカテの常連回答者(ORUKA....)で毎回仕様書引用するオヤジがいるけど
自分ではフォントにpxは使うなとか回答してるくせに
HTML5や子供セレクタのサンプルを使いまくるのはどういう見解なの?


489 :Name_Not_Found:2011/10/26(水) 17:25:01.18 ID:???
子供セレクタってCSS2の?

490 :Name_Not_Found:2011/10/26(水) 18:52:51.41 ID:???
>>489 子供セレクタにCSSのバージョン関係あんのか?

491 :Name_Not_Found:2011/10/26(水) 19:24:22.71 ID:???
子供セレクタ使うなって言いたいんとちゃうの>>488

492 :Name_Not_Found:2011/10/26(水) 22:25:22.14 ID:???
>>491
今時のブラウザは、fontでpxには左右されないのにpx使うなっていう人がいる
それはIE6以下(IE7の例も)を考慮するからであっての事なので、それはそれで良い。
それなら、HTML5や子供セレクタを出すのはおかしいとの事でしょ

493 :Name_Not_Found:2011/10/26(水) 23:51:50.94 ID:???
float:leftした要素にwidthを指定していないのですが、文字のサイズに合わせて広がりません
解決策はございませんか?

494 :Name_Not_Found:2011/10/27(木) 01:08:21.79 ID:???
widthを文字ベースでemで設定

495 :Name_Not_Found:2011/10/27(木) 03:56:55.08 ID:???
ORUKAはな…初心者初級者レベルにそんなガッチガチの説明してどうするんだっていうww
子孫セレクタはともかく兄弟セレクタなんか混乱させるだけだろ

496 :Name_Not_Found:2011/10/27(木) 10:51:56.54 ID:???
素人は「仕様書に書いてあるから」と言えば正解だと思うらしいぞ

HTML4の質問なのにやたらとHTML5での説明してるけど
あれって知識を覚えたての頃にやりがちな事だよなw

素人相手に‘知ったかオヤジ’はみっともない

497 :Name_Not_Found:2011/10/27(木) 12:45:32.81 ID:???
liにpadding:10 10;をしても効きません
padding:10px 10px;と指定すると効きます
確か単位を省略した場合はpxとして扱われたはずなんですが何故ですか?

498 :Name_Not_Found:2011/10/27(木) 15:08:57.62 ID:???
>>497
(X)HTML の属性値と違って、CSS では「0」を指定する場合を除き、必ず単位を伴って指定する必要があります

499 :Name_Not_Found:2011/10/27(木) 15:09:51.50 ID:???
何故? それは「おれ様ルール」だからだろw

500 :Name_Not_Found:2011/10/27(木) 15:10:27.55 ID:???
cssの良い書き方みたいなのありますか?

501 :Name_Not_Found:2011/10/27(木) 15:32:03.99 ID:???
正座をして書く

502 :Name_Not_Found:2011/10/27(木) 15:35:46.38 ID:???
そして書き終えたらあつい緑茶を飲む

503 :Name_Not_Found:2011/10/27(木) 17:00:49.79 ID:???
緑茶の飲み過ぎは体に悪い

504 :Name_Not_Found:2011/10/27(木) 18:26:39.75 ID:???
そこから蹲踞でゆっくり立ち上がり
に〜〜〜〜〜ん〜〜〜〜〜げ〜〜〜〜〜〜〜〜ん〜〜〜〜〜〜
ご〜〜〜〜じゅ〜〜〜〜〜ね〜〜〜〜〜〜ん〜〜〜〜〜〜〜

505 :Name_Not_Found:2011/10/27(木) 19:27:15.29 ID:???
下記のHTML(標準モード)構造でfloatで2カラムにさせたいのですが
ブラウザを小さくするとdiv#aの部分がしたにいってしまいます
ggって1ページに出てくる崩れない2カラムのHPをみたとおりにしたのですが
崩れなくするにはどこを修正したらよいでしょうか?
ただし、#boxと#aのwidthの値は変えられません


#box{float:left;width:300px;}
#a{width:100%;}
#box2{float:left;margin-left:300px;}

<div id="box">
<div id="a">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div>
</div>
<div id="box2">bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</div>

506 :Name_Not_Found:2011/10/27(木) 19:34:44.37 ID:???
body全体の幅を予め指定してしまえば良いんじゃ?

507 :Name_Not_Found:2011/10/27(木) 19:45:44.97 ID:???
<ul>
<li>そして<a href="http://yahoo.com" target="_blank">ここ</a></li>
</ul>
通常のリンクの色は変えずに、リスト<li>の中にあるa要素の色だけを変更するにはどうすればいいでしょうか?

508 :Name_Not_Found:2011/10/27(木) 19:48:25.86 ID:???
>>507
li a {


509 :Name_Not_Found:2011/10/27(木) 20:15:49.77 ID:???
>>505
position

510 :505:2011/10/27(木) 22:37:44.48 ID:???
ブラウザのサイズによって#box2を自動的に変更したいのでbody全体の幅を指定はしたくないのです
positionだと解決できますか?
ただpostionだとtopとleftを設定するので文字のサイズとか↑で書いた上の部分にヘッダを書きたいのですが
ヘッダの文章とフォントサイズの大きさによって崩れたりしませんかね?

511 :Name_Not_Found:2011/10/27(木) 23:47:25.07 ID:???
セレクタについての質問です.

たとえば,

<div class="AAA">
<div class="BBB">b</div>
</div>
<div class="AAA">
<div class="CCC"></div>
</div>

というような構造のHTMLがあったとして,
class="BBB"を子にもつdiv(class="AAA")に対してのみCSSにてスタイルを割り当てることは可能ですか?

512 :Name_Not_Found:2011/10/27(木) 23:50:31.94 ID:???
>>510
質問が曖昧すぎて答えられない
どういう大きさにしたいの?

513 :Name_Not_Found:2011/10/27(木) 23:57:14.37 ID:???
>>511
AAAのスタイルを空にしてBBBとCCCで区別した方が楽じゃね。
あるいはAAAの親要素からの:first-childか:nth-childで選択するとか。

514 :Name_Not_Found:2011/10/28(金) 00:04:41.82 ID:???
>>513
実際にはもっと入り組んだ構造になってるからクラスで管理したいというのが実情です。。。

515 :Name_Not_Found:2011/10/28(金) 00:20:14.22 ID:???
子孫まで条件に入れてたら面倒でたまんないっての

516 :505:2011/10/28(金) 00:35:20.55 ID:???
[ヘッダー]
[#box(子要素に#a)][#box2]
[フッター]

このようなレイアウトで
ヘッダーとフッターと#aはwidth100%にしてます
#boxのみ300pxにします
右側の#box2の部分はブラウザのサイズによって幅いっぱいまで自動的に調節されるようにしたいのです

517 :Name_Not_Found:2011/10/28(金) 02:25:47.62 ID:???
>>511
CSS4セレクタの 「?」 のことか?
どっちにしろ今は無理だけど

518 :Name_Not_Found:2011/10/28(金) 10:15:39.82 ID:???
>>517
Oh CSS4で使えるようになるのね
他の方法で解決するしかないかー
ありがとう

519 :Name_Not_Found:2011/10/28(金) 16:35:02.88 ID:???
ブログのエントリー内で、画像は左右目一杯に表示(900px)して
文章だけは左右例えば500pxとか写真より左右を狭くすることはできませんか?
現在は下記のようになっています。
.entrytextのマージンをいじると.entrytext imgにもそのマージンが反映されてしまいます。


.entrytext, .formtext {
font-size: 100%;
margin: 0px;
padding: 0;
width: 100%;
}

.entrytext ul li {
margin: 0 0 5px 20px;
padding: 0;
list-style: square;
}

.entrytext img {
margin: 0px;
padding: 0px;
border: 2px black solid;
}

.formtext img {
margin: 0px;
padding: 0px;
border: 2px black solid;
}


520 :Name_Not_Found:2011/10/28(金) 16:38:22.68 ID:???
CSS3がでたとおもったらもうCSS4の話がでてるのか

521 :Name_Not_Found:2011/10/28(金) 17:49:34.55 ID:???
overflow:autoをつけるとmargin-leftがおかしくなるのってバグですよね?

522 :Name_Not_Found:2011/10/28(金) 19:42:18.84 ID:???
なんのバグだよ? ブラウザ(バージョン)、ソースやURLなどを出してくれ

523 :Name_Not_Found:2011/10/28(金) 22:47:37.09 ID:???
>>519
日本語でおk

524 :Name_Not_Found:2011/10/28(金) 23:06:33.60 ID:???
<!DOCTYPE html>
<html>
<head>
<style>
*{margin:0;padding:0;}
html,body,#all,#top,#bottom{width:100%;}
#left,#right{float:left;}
#left{width:900px;background:#f00;}
#right{margin-right:-900px;background:#0f0;}
#bottom{clear:both;}
</style>
</head>
<body>
<div id="all">
<div id="top">ヘッダー</div>
<div id="left">あああああああああああああああああ</div>
<div id="right">えええええええええええええええええ</div>
<div id="bottom">フッター</div>
</div>
</body>
</html>

margin-left:900pxってするとずれます
margin-right:-900pxてやるとずれないのですが、ブラウザのサイズを極限まで小さくすると#leftの下に#rightがもぐってしまいます
#rightは可変にしたいのでwidthで固定しません
どこを修正したらよいでしょうか?

525 :Name_Not_Found:2011/10/29(土) 10:26:34.46 ID:???
iphoneのブラウザでは以下のようにするとspanTagいれた後に空白ができてきます
これを解決する方法はないでしょうか

おいしい<span style="background-color:rgb(0,153,153)">ラーメン</span>です

526 :Name_Not_Found:2011/10/29(土) 16:19:56.36 ID:???
>>524
どうしたいのか伝わってこない
left900pxもどこにやったのか分からない
無駄に伝わりにくい

もう少しがんばりましょう

527 :Name_Not_Found:2011/10/29(土) 16:22:51.33 ID:???
>>525
iphoneもってないから確認できないけど
ブラウザのcssじゃないのか?

空白ってよりマージンとかパディングだと思う。
そのスパンタグにどんなcssがかかっているのか調査されたし
自分で作ったcssじゃなくて、ブラウザ独自のcssも含めてって意味でね

528 :Name_Not_Found:2011/10/29(土) 16:48:05.63 ID:???
>>526
それお前がコードを読めないだけだろうが

529 :Name_Not_Found:2011/10/29(土) 17:04:56.70 ID:???
>>528
本人か?
まじで伝わりにくいんだが
仕方ないからがんばってよんでやるよ・・・

530 :Name_Not_Found:2011/10/29(土) 17:14:26.00 ID:???
悪い悪いてっきり>>519>>524が同じ質問かと思ってた


カラム落ちする原因はallの横幅がウィンドウ枠100%になっているから。
右カラムのサイズも自動になっているのはよくないと思う。

clear;bothはallに使うか
左カラム、右カラムを囲ったdivに使ったほうがいいんじゃね

ネガティブマージンもおすすめできない

マージンレフトとfloatレフトを同時に使うと
IEではサイズが二倍になったりするからハックすればいい

あとcss使うならちゃんと分けろ
ついでにソース読みにくい

531 :Name_Not_Found:2011/10/29(土) 17:20:21.73 ID:???
あと、marginの意味ちゃんと分かってる?
positionと勘違いしてない?
左カラムの右枠と右カラムの左余白900pxとったらそりゃとんでもないことになるよね

margin-right-900pxは右カラムの右枠から左に900pxずらしてるようなものだけど
なんでそんなことしてんの?

右カラムは左カラムにくっつけたいの?
それともall枠の右側にくっつけたいの?

スタイルシートもごっちゃごちゃ書いてあって管理しにくいだろ常考
ボックスごとにわけろ

532 :Name_Not_Found:2011/10/29(土) 17:26:29.19 ID:???
>>524 そういうのはposition使えよ

>>530
>clear;bothはallに使うか左カラム、右カラムを囲ったdivに使ったほうがいいんじゃね
524の方がベター

>マージンレフトとfloatレフトを同時に使うとIEではサイズが二倍になったりする
ウソ教えんなよ。6だけだろ

533 :Name_Not_Found:2011/10/29(土) 17:46:18.40 ID:???
>>532
あぁ、6ぬけてたわ。別にウソではない

clearは確かに左右カラムがid指定だし、
一個しかでてこないならbottomでよさげだな

534 :Name_Not_Found:2011/10/29(土) 22:06:12.72 ID:???
>>519
エントリ枠とエントリ本文とエントリ画像の3つに
それぞれ別々のクラス名をつければいいってことじゃね?
HTMLの<%topentry_body>をDIVで挟んで、新しいCLASS名をつけてみたら?
本文のフォントサイズやなんかは新しいクラス名のほうに移して
エントリ枠の設定は.entrytext, .formtext {
に残しておけばいいんじゃないかな。

へそ曲がりなテンプレートだと
新しいクラス指定を素直に受け入れないこともあるから
こればっかりは様子を見ながら試してみる以外にない。

535 :Name_Not_Found:2011/10/30(日) 13:11:53.38 ID:???
http://code.google.com/intl/ja/apis/maps/documentation/javascript/tutorial.htmlのサンプルを利用してます
マップ画像を角丸にしたいのですがFirefoxとIEとOPERAは適用されるのにchromeだけ反映されません
chromeでも角丸にする方法はございますか?
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style>
#map_canvas {
-webkit-border-radius:100px;
-moz-border-radius:100px;
border-radius:100px;
}
</style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
function initialize() {
var latlng = new google.maps.LatLng(-34.397, 150.644);
var myOptions = {
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}

</script>
</head>
<body onload="initialize()">
<div id="map_canvas" style="width:100%; height:100%"></div>
</body>
</html>

536 :Name_Not_Found:2011/10/30(日) 14:12:59.85 ID:???
ブラウザの横幅が特定のpx以下になったら横スクロールバーを表示させる方法はございますか?

537 :Name_Not_Found:2011/10/30(日) 14:20:12.18 ID:???
>>536
body {min-width: 特定のpx; }
とか?

538 :Name_Not_Found:2011/10/30(日) 14:24:06.70 ID:???
知っているがおまえの態度が気に入らない

539 :Name_Not_Found:2011/10/30(日) 14:25:49.75 ID:???
日本語で

540 :Name_Not_Found:2011/10/30(日) 14:40:56.46 ID:???
>>535
http://www.vickcy.com/web-frontend/webkitde-overflow-hidden-bug
http://www.torounit.com/blog/2011/04/30/698/
http://tech.bluesmoon.info/2011/04/overflowhidden-border-radius-and.html

バグかどうかは知らん
関係ないけど、-webkit-border-radiusと-moz-border-radiusはいらん

541 :Name_Not_Found:2011/10/30(日) 14:49:24.67 ID:???
いやいやsafariとfirefox用にいるでしょ

542 :Name_Not_Found:2011/10/30(日) 14:55:53.92 ID:???
Firefox3.6は対応してないのか
Safariはベンダープレフィックスいらんよ

543 :Name_Not_Found:2011/10/30(日) 18:25:47.53 ID:???
<html>
<head>
<style>
*{margin:0;padding:0;}
html,body{width:100%;height:100%;}
#warp{width:100%;height:100%;}
#header{width:100%;height:50px;background:#0f0;}
#body{width:100%;height:100%;background:#f00;}
</style>
</head>
<body>
<div id="warp">
<div id="header">ヘッダ</div>
<div id="body">ボディー</div>
</div>
</body>
</html>

<div id="body">ボディー</div>の部分の高さをブラウザにフィットしたいのですが<div id="header">ヘッダ</div>の部分の高さ分だけ下にはみ出てしまいスクロールバーが出てしまいます
ブラウザサイズに合わせて<div id="body">ボディー</div>も表示領域にフィットさせたいのですがどのように修正するとよいでしょうか?

544 :543:2011/10/30(日) 18:30:18.29 ID:???
書き直します
フッタを入れました

<html>
<head>
<style>
*{margin:0;padding:0;}
html,body{width:100%;height:100%;}
#warp{width:100%;height:100%;}
#header{width:100%;height:50px;background:#0f0;}
#body{width:100%;height:100%;background:#f00;}
#footer{width: 100%;height:50px;background:#999;}
</style>
</head>
<body>
<div id="warp">
<div id="header">ヘッダ</div>
<div id="body">ボディー</div>
<div id="footer">フッタ</div>
</div>
</body>
</html>

545 :543:2011/10/30(日) 18:31:19.03 ID:???
連投失礼します
ブラウザの大きさを変えたときに#bodyの部分が伸び縮みするようにしたいのです

546 :Name_Not_Found:2011/10/30(日) 19:04:00.59 ID:???
すみません質問させてください。
<div class="xxx">〜</div>で区切った内部にテキストが入るのですが
これが改行のない文章でも指定した横幅で改行されるようにするには
どうしたらいいでしょうか?
今のままでは指定した横幅を超えていくらでもテキストが飛び出てしまいます。
word-break: keep-all;とか試してみましたが改行されないままでした。

どうぞお知恵をお貸しください。おねがいします。

547 :Name_Not_Found:2011/10/30(日) 19:16:13.13 ID:???
>>546
はみ出すのって半角英数とかでしょ
javascript 半角英数 改行させる
でggってみ

548 :Name_Not_Found:2011/10/30(日) 19:30:03.75 ID:???
>>546
word-wrap

549 :Name_Not_Found:2011/10/30(日) 19:55:47.92 ID:???
>>543
display: table 系使うと楽だよ

550 :Name_Not_Found:2011/10/30(日) 20:00:37.06 ID:???
改行と折り返しの区別くらいつけろよ

551 :Name_Not_Found:2011/10/30(日) 20:54:46.31 ID:???
word-wrapはクロスブラウザで統一した結果にならない

552 :Name_Not_Found:2011/10/30(日) 20:57:07.38 ID:???
まあテキストモジュールが勧告候補になるまで待ってなって

553 :Name_Not_Found:2011/10/30(日) 21:00:39.67 ID:???
>>549
どのように使うのですか?

554 :Name_Not_Found:2011/10/30(日) 21:03:59.85 ID:???
> display: table 系
IE8未満は未対応ですね

555 :Name_Not_Found:2011/10/30(日) 21:48:53.78 ID:???
でっていう

556 :Name_Not_Found:2011/10/30(日) 22:07:02.81 ID:???
IE6-7は特殊なレガシーシステムを使うための専ブラみたいなもんだから
一般のサイトが対応する必要はないと思う

557 :Name_Not_Found:2011/10/30(日) 22:21:47.54 ID:???
全ユーザの約1割は未だにIE6使用者だけどね。

558 :Name_Not_Found:2011/10/30(日) 22:29:38.92 ID:???
xpのサポ切れたらIE9以降のみ対応すればよくなるから

559 :Name_Not_Found:2011/10/30(日) 22:36:55.35 ID:???
> xpのサポ切れ
3年後だね

560 :Name_Not_Found:2011/10/31(月) 05:08:22.88 ID:???
XPユーザーは、サポ切れなんて気にしない♪
パソコンが逝くまで使い続ける
気にするなら、とっくにIE7,8にしてる!
お前らが気合入れて作っても、崩れサイトとして認識するよw


561 :Name_Not_Found:2011/10/31(月) 07:55:16.32 ID:???
>>560
2000の時も同じ事を聞いた

562 :Name_Not_Found:2011/10/31(月) 10:42:11.77 ID:???
「このサイトはIE8以上で閲覧してください」ページにリダイレクトしようぜ。

563 :Name_Not_Found:2011/10/31(月) 12:17:25.05 ID:???
>>562
蔵はそれを「機会損失」と考えるから、無理。

564 :Name_Not_Found:2011/10/31(月) 13:15:03.99 ID:???
リダイレクトとか()

565 :Name_Not_Found:2011/10/31(月) 17:15:55.14 ID:TOGkjIGW
拡散希望!http://www.youtube.com/watch?v=H0wElSatScI 【頑張れ日本】11.4 TPP絶対阻止!国会大包囲!国民行動

566 :Name_Not_Found:2011/10/31(月) 18:28:36.74 ID:???
すみませんが、質問させて頂きます。
Tableタグを

<table class="nanasi"><tr><td></td></tr></table>

とかにして

CSSの方で

table.nanasi {
width: 480px;
border: 3px #555555 solid;
border-collapse: collapse;
border-spacing: 0;
}

みたいにしているんですが、ほとんどは480pxで適応してくれるんですが、
たまに横幅が300pxぐらいで狭かったり、480以上ではみ出したりして
指定しているのにその通りにならなかったりするんですが、これって
なにが問題なんでしょうか?教えて頂けると幸いです。

567 :Name_Not_Found:2011/11/01(火) 00:49:57.54 ID:???
>>566
その崩れている時のソースをjsfiddleでよろ
あと、どのブラウザのバージョンな

568 :Name_Not_Found:2011/11/01(火) 01:37:36.29 ID:???
>>567

クローム、サファリ、IEはだめでした。
しかしフォックスでは普通に表示されます。

jsfiddleについては初耳で知りませんでしたが、今ぐぐったら色々と
こちらを使うようになれば知識面での上達が出来そうなこと、
そして身ばれを防ぐ為にソースの一部を隠したいけれど、どこを
隠せば良いかの知識がないので出直してきたいと思います。

jsfiddleを教えて頂きありがとうございました。一歩前進です。


569 :Name_Not_Found:2011/11/01(火) 01:48:32.94 ID:???
>>568
IEはバージョンごとで結構崩れるから
6なのか7なのか8なのか9なのかって事だよ

ソースがつかめてないならまずはそこからだと思う
firefoxならbugs
IEならdeveloper tool
chromeなら要素の検証
Dreamweaverを体験版でもいいから
そこのテーブルタグをクリックすればどのcssが効いてるか
見る事ができるから、それ使ったりもしたほうがいいよ

570 :Name_Not_Found:2011/11/01(火) 03:41:44.02 ID:???
>>566
別にその程度のソースはここでOK
ただ、架空のソースをだすのではなく、
そのダメだった時のソースを出せばいいんだよ。

このソースは何故意図通りにならないの?ってな感じでOK

571 :Name_Not_Found:2011/11/01(火) 05:32:26.02 ID:???
>>566
固定レイアウトアルゴリズムにしてないからだと思うよ

572 :Name_Not_Found:2011/11/01(火) 18:52:57.27 ID:???
>>570
ここに貼ると必要な部分だけ抽出したつもりで実は書いてない部分に原因がありました、って人が必ず出てくる
ちゃんと切り分けて貼れれば問題ないが、そういう人はjsfiddleも使いこなせる

573 :Name_Not_Found:2011/11/01(火) 19:00:30.44 ID:???
>>560==>>570

574 :Name_Not_Found:2011/11/03(木) 01:10:02.47 ID:6YfO7ens
Google Chrome で、<pre>タグの中身が等幅フォントで表示されず、困ってます。
font-family:monospaceを指定してもだめ。
FirefoxやSafariでは問題ないのに、Chromeでのみ発生します(Chrome15で確認)。
どなたかアドバイスお願いします。

575 :Name_Not_Found:2011/11/03(木) 01:41:48.99 ID:???
>>574
プロファイル作り直せば

576 :Name_Not_Found:2011/11/03(木) 01:50:52.62 ID:6YfO7ens
>>575
プロファイルとは?CSSの用語ですか?

577 :Name_Not_Found:2011/11/03(木) 03:48:35.37 ID:???
その前に、自分だけの話なのか検証しないといけないよ

578 :Name_Not_Found:2011/11/03(木) 08:16:31.36 ID:???
>>576
Chrome初期化しろってことだ

579 :Name_Not_Found:2011/11/03(木) 08:25:26.16 ID:???
>>576
クリーンインストールしたChromeと同じ状態にすること

580 :Name_Not_Found:2011/11/03(木) 21:40:11.93 ID:???
ボタンをブラウザいっぱいに広げたいのですがDOCTYPEを書くと広がりません
書かないと広がります
DOCTYPEを買い手もいっぱいに広げる方法をアドバイスおねがいします

<!DOCTYPE html>
<html>
<head>
<style>
*{margin:0;padding:0;border:0;}
html,body{width:100%;height:100%;}
#contents{height:100%;min-height:100%;}
body>#contents{height:auto;}
button{width:100%;height:100%;}
</style>
</head>
<body>
<div id="box">
<button>a</button>
</div>
</body>
</html>

581 :580:2011/11/03(木) 22:05:27.83 ID:???
質問取り下げます
失礼しました

582 :Name_Not_Found:2011/11/04(金) 20:10:12.18 ID:???
特定のタグが含まれるタグをCSSで指定するためにはどうすれば良いでしょうか?

例えば、
<a href="hoge.html"><img src="hoge.jpg" /></a>
<a href="fuga.html">foobar</a>

とある時、

imgタグが含まれているaタグ{
//スタイルの記述
}
としたいです

583 :Name_Not_Found:2011/11/04(金) 20:15:54.91 ID:???
>>582
>>511-518

584 :Name_Not_Found:2011/11/04(金) 20:18:27.77 ID:???
>>583
現状ではできないのですね
ありがとうございました

585 :Name_Not_Found:2011/11/05(土) 09:47:24.55 ID:???
>>584
できるよ

586 :Name_Not_Found:2011/11/05(土) 10:44:39.32 ID:???
できるなら方法も書きましょう
できる・できないだけ書くのはレスの無駄で単なる幼稚な行為か荒らしだと認定されますよ

587 :Name_Not_Found:2011/11/05(土) 11:39:28.39 ID:???
>>582
オライリーのCSS完全ガイドに書いてあったような気がする。

588 :585:2011/11/05(土) 12:05:24.26 ID:???
普通に指定すればいいだけなんだから初歩の問題じゃね?
>>586みたいなのが荒らしだろ
>>587はスルーしていいと思う


>>584の言い方だと
imgタグが含まれているaタグを装飾したいってことでいいのかな
一応imgのほうを装飾したい場合も書いといた

http://jsfiddle.net/NxKnM/

589 :Name_Not_Found:2011/11/05(土) 12:15:28.44 ID:???
>>588
質問をよく読め


590 :Name_Not_Found:2011/11/05(土) 12:27:58.80 ID:???
>>586
素直に「どうぞ教えて下さい」と言えばいいものを…
つまらん自治するから荒らし認定されたな。

591 :Name_Not_Found:2011/11/05(土) 12:39:51.93 ID:???
>>589
お前がry

592 :Name_Not_Found:2011/11/05(土) 12:43:32.38 ID:???
>>582の日本語が変だが
子から親の指定をしたいってなら無理だな

593 :Name_Not_Found:2011/11/05(土) 12:47:34.34 ID:???
>>588
class指定しないでやりたいってことだろう
あなたの解釈がおかしい

594 :Name_Not_Found:2011/11/05(土) 12:52:53.63 ID:???
>>588
素人は無理して回答しなくていいから黙ってろ

595 :Name_Not_Found:2011/11/05(土) 12:58:32.93 ID:???
あんた無粋だねえ

596 :Name_Not_Found:2011/11/05(土) 13:14:06.64 ID:???
これは質問者が悪いな
質問者=>>586=>>589=>>593=>>594
必死すぎだろw

597 :593:2011/11/05(土) 13:31:32.92 ID:???
>>596
593で初めて書き込んだが、質問の意図はわかる
俺からすれば>>588が酷いぞ
「img要素を子要素とするa要素に相当するセレクタはありますか?」に対して「該当要素にclassを付けてください」で質問者は納得すると思うのか?


598 :Name_Not_Found:2011/11/05(土) 13:33:41.46 ID:???
>>597
「img要素を子要素とするa要素に相当するセレクタはありますか?」って最初からかいとけよw

599 :Name_Not_Found:2011/11/05(土) 13:57:52.83 ID:???
バカな回答する奴に限って自分に反論する者は全て1人に認定したくなるものだな

600 :Name_Not_Found:2011/11/05(土) 13:57:59.49 ID:???
>>598
> imgタグが含まれているaタグ{
これでわかるだろ
「imgタグが含まれているaタグ」にクラスセレクタが入ると思ってるのか?

601 :Name_Not_Found:2011/11/05(土) 14:15:43.67 ID:???
知識以前に読解力の問題だな

602 :Name_Not_Found:2011/11/05(土) 14:16:36.11 ID:???
>>586=>>589=>>593=>>594=>>596=>>598

603 :Name_Not_Found:2011/11/05(土) 14:40:36.80 ID:???
この質問は普通にわかるわ

604 :Name_Not_Found:2011/11/05(土) 14:44:10.48 ID:???
うるせえエビフライぶつけるぞ
 ,.、,、,..,、、.,、,、、..,_,,_  /i
;'`;、、:、. .:、:, :,.: ::`゛:.::'':,'.´ -‐i
'、;: ...: ,:. :.、... :.、.:: _;... .;;.‐'゛ ̄  ̄
   ヽ(´・ω・)ノ
     |  /
     UU

605 :Name_Not_Found:2011/11/05(土) 14:45:34.68 ID:???
まともに受け答えしない時点で荒らし

606 :Name_Not_Found:2011/11/05(土) 16:27:16.36 ID:???
>>605
おまえも

607 :Name_Not_Found:2011/11/05(土) 20:04:53.64 ID:???
ん?クラスつければって話で世界平和が訪れたんじゃないの?

608 :Name_Not_Found:2011/11/05(土) 20:13:44.80 ID:???
他人のページのスタイル変更が目的なのでダメです

609 :Name_Not_Found:2011/11/05(土) 20:55:59.17 ID:???
鯖が違うじゃねぇか

610 :Name_Not_Found:2011/11/05(土) 21:02:59.45 ID:???
多分、ユーザCSSを適用しようとしているのだろう
初めから用途まで書いた方が誤解がなくて良かったと思うが

611 :Name_Not_Found:2011/11/05(土) 22:09:58.78 ID:???
国語力がない奴が掘り返して騒いでいるだけです

612 :Name_Not_Found:2011/11/06(日) 11:30:42.88 ID:???
>>584
javascriptで子要素をチェックしてもいいなら出来る
css単品だとできない

613 :Name_Not_Found:2011/11/06(日) 11:35:34.18 ID:???
>>612
スレ間違えてね?

614 :Name_Not_Found:2011/11/06(日) 11:51:15.78 ID:???
CSSで出来ない代わりに別の方法がある事を書いたまでだから間違えてはないけど

615 :Name_Not_Found:2011/11/07(月) 01:55:55.37 ID:???
半角英数だけを自動的に等幅にしたいのですが
どうしたらよいでしょうか

616 :Name_Not_Found:2011/11/07(月) 02:03:57.02 ID:???
>>615 CGIで吸い上げて吐きだすしかないんじゃないか?

617 :Name_Not_Found:2011/11/07(月) 02:15:55.08 ID:???
カーニング?
キャッチコピー的な特定の部分とかならclassつけてletter-spacingとか、画像で済ますとか
それじゃダメなの?


618 :Name_Not_Found:2011/11/07(月) 03:08:21.65 ID:???
それは日本語でいうところの手動という作業ではないのかい?

619 :Name_Not_Found:2011/11/07(月) 03:18:52.69 ID:???
langつけろ

620 :Name_Not_Found:2011/11/07(月) 10:27:43.66 ID:???
font-familyで等幅英字フォント指定すれば

621 :Name_Not_Found:2011/11/07(月) 10:47:00.67 ID:???
>>620
少なくともWindowsでは標準で等幅英字なんて名前のフォントは無いと思うけど
何のことを言っているんだ?

622 :Name_Not_Found:2011/11/07(月) 11:43:34.95 ID:???
WEB Font使えばいいんじゃね。
半角英数が等幅で、それ以外がプロポーショナルなフォントがあればいい。

623 :Name_Not_Found:2011/11/07(月) 11:44:23.63 ID:???
>あればいい
無いんじゃないの

624 :Name_Not_Found:2011/11/07(月) 12:22:06.98 ID:???
日本語フォントを指定しなければいいんじゃないの

625 :Name_Not_Found:2011/11/07(月) 12:38:20.60 ID:???
>>623
無いなら作ればいいよ。
フリーの半角英数とIPAのフォントを合成するとかして。
改変可能なライセンスのものを選ぶ必要があるけど。

>>624
指定しなければブラウザ依存になるよ。

626 :Name_Not_Found:2011/11/07(月) 13:00:28.42 ID:???
cssだけで出来ないことはJavascriptsでやれよ

627 :Name_Not_Found:2011/11/07(月) 14:26:46.94 ID:???
複数形ワロタ



628 :Name_Not_Found:2011/11/07(月) 17:34:45.66 ID:???
>>625
英字フォントの後に日本語フォントを指定すればいいでしょ

629 :Name_Not_Found:2011/11/07(月) 17:42:55.15 ID:???
>>628
それは、英字フォント(日本語は実装依存)だけが適用されるのでは。

630 :Name_Not_Found:2011/11/07(月) 18:14:44.29 ID:???
CSSの仕様上は>>628で良いけど、Windowsだとフォントリンクのせいでまともに機能しないかもね

631 :Name_Not_Found:2011/11/07(月) 18:37:48.80 ID:???
<x class="a"></x>
<x class="b"></x>
<x id="c"></x>
<x></x>
とある時、1行目のxタグ以外のタグにスタイルを適用するためにはどうすれば良いでしょうか?
HTMLの記述自体を変更するのはナシでお願いします

632 :Name_Not_Found:2011/11/07(月) 18:47:41.56 ID:???
x:not(.a)

633 :Name_Not_Found:2011/11/07(月) 19:02:57.74 ID:???
>>632
うまくいきました、ありがとうございます

634 :Name_Not_Found:2011/11/07(月) 19:21:24.23 ID:???
&

635 :Name_Not_Found:2011/11/07(月) 19:35:37.75 ID:???
すいません>>631さんの逆の質問で
一番最後の要素にだけ適用しない方法ってありませんか?

636 :Name_Not_Found:2011/11/07(月) 19:39:47.73 ID:???
>>635
.a, .b, #c { }

637 :Name_Not_Found:2011/11/07(月) 22:10:33.22 ID:???
クロスブラウザ用の場合は、その旨教えてやれよ

638 :Name_Not_Found:2011/11/07(月) 22:17:42.50 ID:???
>>637
質問者と回答者どっちに言ってるんだ?
> クロスブラウザ用の場合は
回答者に言ってるならクロスブラウザ用じゃないから該当しないよね。

639 :Name_Not_Found:2011/11/08(火) 11:53:01.91 ID:???
試してないけど、x:not([class][id]) かね。
>>636がクロスブラウザ用ってことかと。

>>638
文句いってる奴は無視していいと思うよ。
自分から何もせずに人に注文付けるだけの自己中な人だから。
自分で回答すればいいだろって話。

640 :Name_Not_Found:2011/11/08(火) 16:42:36.95 ID:???
>>632のセレクタ = >>636のセレクタ
みたいに>>637が勘違いしてるだけたぶん

641 :639:2011/11/08(火) 20:09:00.60 ID:???
自分も勘違いしてた
x[id], x[class] だな

642 :Name_Not_Found:2011/11/08(火) 21:54:32.56 ID:???
>>639
何かした後に、次回の為に「ついでに●●もしとけよ」とか言うのが自己中なのか?
それを自己中と言う方が自己中だろ


643 :Name_Not_Found:2011/11/08(火) 23:01:01.28 ID:???
チューチュー

644 :Name_Not_Found:2011/11/08(火) 23:13:01.15 ID:???
忠告は、自己中では無く親切心なんだけどね
思春期に親に言われるとムカついたけどね

645 :Name_Not_Found:2011/11/08(火) 23:14:07.11 ID:???
反抗期だった

646 :Name_Not_Found:2011/11/09(水) 03:49:02.81 ID:Z4TjQrd0
>>18
style内にコメント
あまり勧められない

647 :Name_Not_Found:2011/11/09(水) 07:46:27.17 ID:Usuht5KD


648 :Name_Not_Found:2011/11/09(水) 14:00:05.80 ID:???
>>22で指摘済みだし4か月も経って今更何だいって話だし割とどうでもいい
どうせ構文がXHTMLだってHTMLとしてパースしてる(させてる)んだから

649 :Name_Not_Found:2011/11/09(水) 14:10:46.06 ID:???
FC2はアホやなぁ

650 :Name_Not_Found:2011/11/09(水) 15:49:25.98 ID:f+9Yf7Jv
CSSセレクタについて質問させてください

<div class="ArticleSet cFix">
のようにclass属性が2つある場合の指定方法が分かりません
div[class="ArticleSet cFix"]ではDOMでは認識されませんでした
他にも、ダブルクォーテーションを取り除いたりしたのですがダメでした

どのように指定すればいいのか教えていただけませんでしょうか?



651 :650:2011/11/09(水) 15:54:54.07 ID:f+9Yf7Jv
すみません、少しだけ質問を変えます
<div class="ArticleSet cFix"><p>ほうれん草</p></div>
の「ほうれん草」トいう文字を取り出したいと思っています
この場合はどのように指定すればいいのでしょうか?

652 :Name_Not_Found:2011/11/09(水) 16:09:26.11 ID:???
文字列を取り出すとかDOMとか、それCSSは何の関係があるの?

653 :650:2011/11/09(水) 16:13:03.58 ID:f+9Yf7Jv
>>652
スレ違いという意味でしょうか?
もしそうだとすると、CSSセレクタの指定方法は外部CSSの指定と同じですのでCSSという概念の範囲だと思いまして
違ったらごめんなさい

654 :Name_Not_Found:2011/11/09(水) 16:20:09.30 ID:???
CSSそのものだからスレ違いではないよね


655 :652:2011/11/09(水) 16:34:20.47 ID:???
逆に聞くけど、jQueryの要素選択とかそういう話に繋がるんじゃないの?

<!DOCTYPE html>
<title>test</title>
<style> .hoge.fuga { color: #f00; } </style>
<p class="hoge fuga">hoge fuga</p>
<p class="hoge">hoge</p>
<p class="fuga">fuga</p>

セレクタではクラスセレクタを連結して書く 記憶が曖昧だがIEは古いと対応してないかもしれん
ただし上記の場合hogeとfuga以外にさらにclassを持っている場合も引っかかる

それをDOMだの文字列抽出だのに持ち込んで使えるのかは別な話

656 :Name_Not_Found:2011/11/09(水) 16:37:57.96 ID:???
jQueryとはまた程度の低いものを引っ張り出してきたね
CSSセレクタって>>650はちゃんと書いてるじゃん


657 :Name_Not_Found:2011/11/09(水) 16:40:26.66 ID:???
<a title="あああああああ">aaa</a>

リンクの上にカーソルを持ってくるとtitleの文字が出てきますが
このtitleの部分にbackground:#000000;をつけたいのですが
セレクタはどのように書くのでしょうか?

658 :Name_Not_Found:2011/11/09(水) 16:48:48.94 ID:???
>>656
だからそれがDOMで認識されないだの質問が変わって文字列抽出だの、
そういう話になるから違う話なんじゃないのって話でしょ?程度低いのはどっちか考えろ

659 :Name_Not_Found:2011/11/09(水) 16:54:43.19 ID:???
>>658
何言ってんだお前は?
こいつはただcssの指定の仕方を聞いてるだけだろ!
CSSセレクタがCSSと別物なんて言えるのか?
例えそれが抽出の話だろうが、CSSはCSSであり、指定の方法がまた別の人間が
純粋なスタイルシートで使用する場合に指定方法が分からなければ参考になるだろ
これは「完全に」CSSの書き方以外のなにものでもないだろうが

お前こそCSSって何か一から学習してこい
W3Cでも見てCSSの概念を読んでこい


660 :Name_Not_Found:2011/11/09(水) 17:10:27.70 ID:???
じゃぁ何だ、HTMLファイルに
<div class="ArticleSet cFix"><p>ほうれん草</p></div>
というものがあって、
ある人間が上記のほうれん草という文字にだけ何かCSSの属性を適用したいと考えたとき、他に
<div class="ArticleSet"><p>ほうれん草</p></div>
とか似たようなものがあって適用できないときこれがCSSのセレクタの問題ではないというのか?
そりゃclass等の指定の仕方が悪いんだろうが、それでもどうしても規程か何かで変えられない
仕方がないって時と何が違うんだ?
jQueryとはそもそも全く関係がないだろ
「CSSのセレクタ」とjQueryは話が違う
これはCSSのスレで、何も逸脱していないだろ
抽出がどうだろうが、CSSのセレクタの指定には何も変わらない
お前の言ってるjQueryの方がスレ違いだ

くだらんからもう俺はここら辺で止めるけどよ

661 :Name_Not_Found:2011/11/09(水) 17:17:36.85 ID:???
だからセレクタのモジュール名にCSSって名前が含まれなくなったんだけどね

662 :Name_Not_Found:2011/11/09(水) 17:29:48.18 ID:???
おい長文止めろ俺の質問が流れるだろう

663 :Name_Not_Found:2011/11/09(水) 17:38:22.98 ID:???
>>657
title 属性はツールチップを表示するためのものじゃない
ユーザースタイルの話なら、ブラウザによって違うけど例えば Firefox は tooltip#aHTMLTooltip

664 :Name_Not_Found:2011/11/09(水) 19:26:33.82 ID:???
>>651
<div class="ArticleSet cFix"><p>ほうれん草</p></div>
でp見えなくしたいなら
.ArticleSet p{
display:none;
}

.cFix p{
display:none;
}
(消えなきゃ両方一緒に)
ではだめなの?p取る訳じゃないんだけど

665 :Name_Not_Found:2011/11/09(水) 19:35:50.45 ID:???
>>664
>>655

666 :Name_Not_Found:2011/11/15(火) 04:10:05.79 ID:rxjqt9HN
http://www44.atwiki.jp/mhp3ta/pages/16.html

上のサイトの様なテーブルで編集したいのですが、どうしてもうまくいきません
どの様にプラグインを組めばいいですか?編集例を教えてくださるとありがたいです

667 :Name_Not_Found:2011/11/15(火) 10:26:50.81 ID:???
プラグインはいらない。
CSSでできる。

668 :Name_Not_Found:2011/11/17(木) 12:53:59.83 ID:adxkXDsK
FC2の公式テンプレートを色々と弄くりながら勉強してるんですが、
テンプレートの中に次のような記述がありました。

/* side */
.sidehead{
}

省略

.sidehead{
height: 53px;
}

一度、sideheadクラスを空で定義して、
sideの一連の定義が終わったあとに再度、sideheadクラスを
定義し直しています。
このような記述の仕方に何か特別な意味があるのでしょうか?


669 :Name_Not_Found:2011/11/17(木) 13:31:44.93 ID:???
一連の定義はデフォルトで後から
カスタマイズしやすいようにってことでしょ


670 :Name_Not_Found:2011/11/17(木) 14:53:10.34 ID:???
http://www.cssez.com/

ここってサービス終了したんですか?

671 :Name_Not_Found:2011/11/17(木) 15:01:18.06 ID:???
>>670
うわ、ドメイン失効wはずかしw

672 :Name_Not_Found:2011/11/17(木) 20:45:52.52 ID:???
width:600のdivの中にwidth:160の子div3つを横に等間隔中央揃えで配置したいのですが、何か手はないでしょうか



673 :639:2011/11/17(木) 21:10:01.89 ID:???
>>672
計算すれば何px開ければいいか、出てくる

674 :Name_Not_Found:2011/11/17(木) 21:44:30.24 ID:???
>>672
これじゃだめなの?

.box {
margin:10em auto;
width:600px;
padding:5px;
background:black;
color:white;
}

.sub_box {
border:1px black solid;
background:white;
margin:5px;
color:gray;
text-align:center;
}

675 :Name_Not_Found:2011/11/17(木) 21:44:50.35 ID:???
ごめん。わかりやすく。と思ったけどゴッチャになった

676 :Name_Not_Found:2011/11/17(木) 21:57:27.08 ID:???
更にごめん。いろいろ根本的に間違ってた。

・inline-block使うものと
・table-cell使った奴おいとく

.box {
width:600px;
}

#sub_box {
display: inline-block;
width:194px;
}


<style type="text/css">
.box {
width:600px;
}

#sub_box {
display: table-cell;
width:200px;
}

後者だとbox内でどれだけwidth大きくしてもはみ出ないしイイんじゃないかなと思ってる

677 :Name_Not_Found:2011/11/17(木) 22:10:41.78 ID:???
これみながらmarginでやってみ
600-480=120

<--------- width:600px ------------>
<---->■<--><-->■<--><-->■<---->

678 :Name_Not_Found:2011/11/17(木) 22:11:23.56 ID:???
<---->は30px
<-->は15px

679 :Name_Not_Found:2011/11/18(金) 01:38:59.80 ID:???
背景を細めのストライプに設定するため以下の書き方をした場合

1:
 background-size: 50px 50px;
 linear-gradient(top left -45deg, #2b2b2b, #2b2b2b 5%, #333333 6%,
 #333333 10%, (略) #2b2b2b 91%, #2b2b2b 95%, #333333 96%, #333333 100%);
2:
 background-size: 10px 10px;
 linear-gradient(top left -45deg, #2b2b2b, #2b2b2b 25%, #333333 26%,
 #333333 50%, #2b2b2b 51%, #2b2b2b 75%, #333333 76%, #333333 100%);
 
sarari5.1.1とChorome15.0.874.120では体感的に差を感じないのですが、FF8だと
2で固まりかけます。
これはFireFoxになにか固有の問題があるのか、描画の速さで気付かないだけで
前二者も多少は遅くなっている(2の方が明らかに処理が重い)のか、個人的な
環境のせいか……何が問題と考えれば良いのでしょうか。

680 :Name_Not_Found:2011/11/18(金) 05:45:59.45 ID:649w/tNX
<div>
<p>あああ</p>
</div>

divに背景色つけてpにマージンつけた場合、マージン部分は色がつかない
ものですか?

681 :Name_Not_Found:2011/11/18(金) 07:36:48.88 ID:???
>>680
その条件だけならマージンどころか Pは、無色透明無味無臭だ
色が付くのは、divであって、Pは透明だからdivの色が見えているだけ・・・

682 :Name_Not_Found:2011/11/18(金) 08:34:20.84 ID:rOYVSJBz
>>681
説明不足でした。
pにもdivの背景色をつける予定だったのですが、pにmargin-top:10pxを設定すると白い空白ができてしまったもので。
条件はheaderに横並びのメニューバーを設定して次に<div id="main">で
<p>でパンクズリストを上マージン設定したら空白ができてしまうのです。
パディングなら大丈夫なので質問しました。

683 :Name_Not_Found:2011/11/18(金) 13:14:03.46 ID:???
マージンは外側の余白だから背景色とか関係ないよ

684 :Name_Not_Found:2011/11/18(金) 13:56:41.68 ID:???

□□□
□□■
□□□

表の中の一部のセル(■)の左右の線を消したいんですが、
わりと新しいIEですらborder-right-style:hiddenとかが機能しないのはなんででしょうか


685 :Name_Not_Found:2011/11/18(金) 14:11:03.92 ID:???
>>684
border-styleプロパティの値にhiddenなんてないからじゃね
線消したいならnoneにしてみたら

686 :Name_Not_Found:2011/11/18(金) 14:11:15.40 ID:???
IEで結合ボーダーモデルを適用したときの挙動はなんかおかしい

687 :Name_Not_Found:2011/11/18(金) 14:12:49.89 ID:???
>>685
何を言ってるんだ

688 :Name_Not_Found:2011/11/18(金) 14:13:41.60 ID:???
ごめん>>685は間違いhiddenはあったわ


689 :Name_Not_Found:2011/11/18(金) 14:31:01.85 ID:???
なにこれhidden以外も効かない

690 :Name_Not_Found:2011/11/18(金) 15:08:23.59 ID:???
hiddenじゃなくて背景色と同じ色を指定すれば

691 :684:2011/11/18(金) 15:15:07.52 ID:???
それもできませんでしたw

692 :Name_Not_Found:2011/11/18(金) 15:31:49.81 ID:???
>>684
対象のセルの一つ左の枠線が残っているからだろう
http://jsfiddle.net/gQfyJ/

693 :Name_Not_Found:2011/11/18(金) 17:12:37.95 ID:???
>>692
うおー感謝です
各種ブラウザ旧IEまで全部見事に表示されました

694 :Name_Not_Found:2011/11/19(土) 22:55:38.67 ID:???
http://dev.w3.org/html5/spec/Overview.html#phrasing-content
を開いて画面上部の要素がたくさん並んでいるところにカンマで要素が区切られてますが
これマウスで選択してもコピーできません
これはどのようにCSSでつけたのでしょうか?

695 :Name_Not_Found:2011/11/19(土) 23:47:17.19 ID:???
>>694
after疑似要素

696 :Name_Not_Found:2011/11/20(日) 05:21:24.61 ID:???
.

697 :Name_Not_Found:2011/11/21(月) 03:16:03.20 ID:noGqrfaf
固定幅のボックスに対して文字列の幅を合わせて文字間隔を調整するようなのってできますか?
よくワードとかイラレとか印刷のソフトだとあると思うんですが、例えば

th { text-align:center; }

| 登録番号 |
| 形  式 | <= これは間に全角スペースを2つ入れた
| 担当 者 | <= 同じ方法ではこれは合わない

またこの書き方ではそもそも「登録番号」をボックス幅に合わせていません。
文字数に合わせてletter-spacingを設定したクラスなんかを用意するのも考えましたが
何かthへの指定1発で指定できる方法があれば・・・

698 :Name_Not_Found:2011/11/21(月) 09:05:52.13 ID:???
無理
IE独自ならあったんだけどね・・・

699 :Name_Not_Found:2011/11/21(月) 10:16:15.24 ID:???
javascriptで良ければ>>173-229

700 :639:2011/11/21(月) 10:25:00.66 ID:???
>>697
等幅フォントを指定すればよい

701 :Name_Not_Found:2011/11/21(月) 10:27:46.31 ID:???
お前等幅フォントが何かわかってないだろ

702 :639:2011/11/21(月) 11:38:16.48 ID:???
ここ煽りが多いな

703 :Name_Not_Found:2011/11/21(月) 12:24:46.73 ID:???
>>702
分かってないだけ
間違った事覚えて言ってるのが明らかなのに、
それを指摘しないほうがおかしいだろ?

素直に認めて新しく覚えようって気持ちを持とうよ

704 :Name_Not_Found:2011/11/21(月) 16:45:20.98 ID:???
>>700>>702
どんだけ639を馬鹿にしたいんだ? 粘着過ぎるだろ

705 :697:2011/11/21(月) 21:03:37.84 ID:noGqrfaf
>>698-700
ありがとうございます。
無難に見えるようなんとか工夫してみようと思います

706 :Name_Not_Found:2011/11/21(月) 21:06:50.52 ID:???
10秒考えちまった
639語って貶めたい荒らしってことなら
見当違い喋ってるのも納得

707 :Name_Not_Found:2011/11/21(月) 21:33:41.09 ID:???
30秒考えちまった
騙って か

708 :Name_Not_Found:2011/11/22(火) 08:13:39.21 ID:???
>>697は、
>何かthへの指定1発で指定できる方法があれば・・・
一発と言ってるだろがバカかお前ら

709 :Name_Not_Found:2011/11/22(火) 08:20:38.97 ID:???
バカって言う方が(ry

710 :Name_Not_Found:2011/11/22(火) 10:19:59.55 ID:???
>>708
そのくらい文脈から意味読み取れよ

711 :Name_Not_Found:2011/11/22(火) 13:26:26.66 ID:iS0pVPSU
<ヘッダー>
<コンテンツ>(左本文、右サイドバー)
<フッター>
という構成で(本文)に質問集を作りました。
最初に質問を並べてページ内リンクで後半に答えを並べました。
リンクは普通に機能するのですが、ブラウザの(戻る)で戻ると
<コンテンツ>部分の上部20pxくらいが隠れて表示されなくなってしまいます。
(右サイドバーの上の方も削られてしまう。ヘッダは普通に表示される。)
ie8では起こらずie9、firefoxの今のやつで起こります。何が原因でしょう?

712 :Name_Not_Found:2011/11/22(火) 14:24:49.92 ID:???
それは「戻る」とか無関係におかしなCSSなんだろw

713 :Name_Not_Found:2011/11/22(火) 14:58:46.10 ID:???
>>711
原因は分かった!
お前のソース!どや!


真面目な話原因が起きてるソースを見せなさい
見せられない部分は隠してな

714 :Name_Not_Found:2011/11/22(火) 16:39:45.43 ID:???
<div id="txt">サンプル</div>
このタグのテキストを中央垂直に表示させたいのですがなりません

width:500px;
height:500px;
text-align:center;
vertical-align: center;

715 :Name_Not_Found:2011/11/22(火) 17:03:11.41 ID:???
>>713
いろいろ調べましたところ、(戻る)は関係なく、ページ内リンクをクリックした瞬間
20PXくらい下にずれることがわかりました。
<div id="contents">(全体)
<div id="header">

<div id="container">
<div id="main"><div id="menu">(floatで左右に分けてる)
<!--- container終わり--->

<div id="footer">
<!--- contents終わり -->

こんな感じの構成で、さらにいろいろ調べたところ、clearfixが怪しいみたいです。
<div id="container" class="clearfix">
と#containerにclearfixをかけているのですが、これをはずすと問題ないみたいです。
なぜかよくわかりません。

716 :Name_Not_Found:2011/11/22(火) 17:03:59.60 ID:???
clearfixは
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

.clearfix {
display: inline-block;
}

* html .clearfix {
height: 1%;
}

.clearfix {
display: block;
}
です。適当にどこかにあったのをコピペしたものです。

717 :Name_Not_Found:2011/11/22(火) 17:17:16.05 ID:???
>>714
つ line-height:500px;

vertical-alignは<div>とかブロックレベル要素には使えないよ。

718 :Name_Not_Found:2011/11/22(火) 17:21:22.83 ID:???
>>714
http://jsfiddle.net/NUnP7/

おわかり頂けるだろうか。
vertical-align;center;ではなくmiddleだという事に。
そして、この垂直方向の設定は、ボックス全体ではなく
1行の垂直方向の設定であるという事に。
なので、これは1行の高さを100%にしてmiddleにもってきている。

ただ、この方法はあくまで
サンプルというテキストをとりあえず中央に持ってきたいという要望への回答
他の方法での使い方を考慮していない

719 :718:2011/11/22(火) 17:22:12.38 ID:???
おれの回答がスロウリィ!?

720 :718:2011/11/22(火) 17:23:50.35 ID:???
>>716
そのソースだけを見るとdiv閉じてないように見えるんだけど
エスパーしろって事でいいよね?

721 :718:2011/11/22(火) 17:39:39.77 ID:???
>>716
http://jsfiddle.net/64SGS/
ここまで再現したんだけど、これだけで問題が起きるとも思えないんだ
続きを書いてくれない?
おれエスパーじゃなかったみたいだわ
これ以上お前のソースコードがどうなってるのか、予測することができない

722 :Name_Not_Found:2011/11/22(火) 18:21:32.21 ID:???
>>721
なんとなく解決しました。
最初(ページ内リンク ずれ)とかで検索しててもちっともわからなかった
のですが、(ページ内リンク clearfix ずれ)で検索したらそれらしき答え
がわかりました。

最終的な原因としては、「アンカーを配置している要素の親要素に”overflow:hidden”
が指定されているとその親要素が上にずれる」とのことのようです。

自分のclearfixにはoverflow:hiddenはなかったのですが、div id="container"に
overflow:hiddenが別に指定してありました。これはずしたらみごとに直りました。

overflow:hiddenかclearfixをはずさないといけないみたいです。
このページには両方必要ないのではずすことにしました。
お騒がせしました。

丸一日悩みましたがこれでばあちゃんの法事にいけます!


723 :721:2011/11/22(火) 18:27:22.45 ID:???
>>722
だから最初からちゃんとソースかけつってんだろwwwwwwwwwwwwwwww
ふっざけんなよおまえwwwwwwwwwwwwwwwwwwww
ちゃんと法事いってこいよなwwwwwwくそうw

724 :Name_Not_Found:2011/11/22(火) 19:17:12.94 ID:???
ここにソースアップするために余計な部分削ってたらわかりました。
このスレのおかげです。

(-人-)ナムナム

725 : 忍法帖【Lv=35,xxxPT】 :2011/11/25(金) 04:48:40.18 ID:???
ワロチ

726 :Name_Not_Found:2011/11/25(金) 19:34:18.74 ID:???
input type="submit" class="submitbtn"
というボタンに、
.submitbtn {
 min-width: 200px;
}
としたら、Firefox8では効くのに、Chrome15では効きません。
なぜでしょうか。



727 :Name_Not_Found:2011/11/26(土) 00:36:34.16 ID:R5yfQHON
http://jsfiddle.net/FeDNE/

<textarea id="example"></textarea>

body > *:not(#example){
display: none;
}

Google Chrome のみ、テキストボックスで貼り付けが出来なくなります
これは Google Chrome の既知のバグなのでしょうか
回避するにはどうすればいいでしょうか

728 :Name_Not_Found:2011/11/29(火) 06:38:37.09 ID:???
できるよ

729 :Name_Not_Found:2011/11/29(火) 18:27:16.32 ID:???
日本語でおk

730 :Name_Not_Found:2011/11/30(水) 21:35:53.39 ID:???
センタリングしたテーブル内のセルにもセンタリング指定してしてるんだけど
win IE6で見た時だけ若干5px?ほど左に寄ってる。
これを直す方法ないですか?

731 :Name_Not_Found:2011/12/01(木) 02:04:07.88 ID:???
ハックしろ
ソースみせろ

732 :Name_Not_Found:2011/12/02(金) 12:38:31.25 ID:???
オススメの仕様書ありませんか?

733 :Name_Not_Found:2011/12/02(金) 12:53:38.02 ID:???
w3c

734 :Name_Not_Found:2011/12/02(金) 15:15:43.59 ID:???
おれがルール

735 :Name_Not_Found:2011/12/03(土) 00:11:19.17 ID:???
<p id="aaa">AAA</p>
<p id="bbb">BBB</p>
というHTMLがあって、通常ならAAAが先に表示されると思いますが、そうではなく、
BBBのほうをさきに(上に)表示させるようなことはできますか。
できればheightを指定せずに任意の高さでも利用できる方法がいいです。
HTML構造が固定されたブログで、CSSだけで順番を入れ替える必要があります。


736 :Name_Not_Found:2011/12/03(土) 02:38:06.48 ID:???
できます

737 :639:2011/12/03(土) 14:24:05.54 ID:???
>>732
仕様書って一つしかないでしょ
お勧めってどういう事?お勧めの和訳?

738 :Name_Not_Found:2011/12/03(土) 14:25:16.99 ID:???
×仕様書
○リファレンス
こういうことかな?

739 :Name_Not_Found:2011/12/03(土) 17:26:51.20 ID:SCpm5mGJ
>>736
どうやるの?

740 :Name_Not_Found:2011/12/03(土) 18:40:25.74 ID:???
>>739
BBBが上に表示されるようにCSSを書く

741 :Name_Not_Found:2011/12/03(土) 18:59:06.28 ID:???
>>739
うーん、左右の入れ替えならともかく、多分cssでは無理じゃないかなぁ・・・
AAAの高さが任意なので、BBBに対してpositionはまず使えないと思います。
なのでcssでは無理じゃないかな、と。

そうなるとjQueryを使って動的に入れ替えるのがベストかと思います。
テンプレートの<head>部分にjsファイルの呼び出しをいれれば、
全ページ適用されて問題なさそうと思うのですが、いけそうでしょうか?
jsファイルのアップロードができないなら、直接書き込んでしまっても構いません

いけそうなら方法を提示します。

742 :Name_Not_Found:2011/12/03(土) 19:00:08.49 ID:???
ちなみにcss3ならできるんだけど、使われてないブラウザもあるしね・・・

743 :Name_Not_Found:2011/12/03(土) 19:22:15.82 ID:XhN/Y5BY
>>735
面倒だろ。

<p id="aaa">BBB </p>
<p id="bbb">AAA</p>

でいいじゃん。


744 :Name_Not_Found:2011/12/03(土) 19:29:16.17 ID:???
>>736
>>740
こういう馬鹿って、わざわざ自分の馬鹿を他人に知らしめて喜んでるの?

745 :Name_Not_Found:2011/12/03(土) 20:53:27.58 ID:???
>>744
ついでに
>>742もつけ加えておくべきだと思うよw

746 :Name_Not_Found:2011/12/03(土) 20:54:18.09 ID:???
まちがえた.
>>744
>>743
だった
742は自分でした^q^アウアウ

747 :Name_Not_Found:2011/12/04(日) 01:28:56.97 ID:???
┌─┐ ←div1
┌─┐ ←div2
┌─┐ ←div3
│  │
│  │
└─┘

html+css(バージョン問わず)だけでこのようにdivを縦に重ねて配置することは可能でしょうか?
z-indexは別途javascriptで調整するので問題ないです。
position:absoluteで出来るのはわかっているんですが、自動配置で可能なら教えていただきたいです。

748 :747:2011/12/04(日) 02:33:22.95 ID:???
自己解決しました。
:first-child以外のmargin-topをマイナスにすればいけるのね。

749 :Name_Not_Found:2011/12/04(日) 10:09:28.55 ID:???
>>748
マイナスにするのを
ネガティブマージンと呼ぶのですが
他ブラウザで大きく崩れる事があるのでブラウザチェック忘れずに☆(ゝω・)vキャピ

750 :747:2011/12/04(日) 16:44:55.96 ID:???
>>749
わざわざありがとう!
まだ実験的なプロジェクトなので必要になった時は気をつけたいと思います。

751 :Name_Not_Found:2011/12/04(日) 23:04:58.16 ID:???
<a>
 <b/>
 <b/>
 <b/>
 <b/>
</a>
上記の内、上から3番目のbタグのみにCSSを適用するにはどうすればいいでしょうか?

752 :Name_Not_Found:2011/12/05(月) 00:08:36.62 ID:???
セレクタ指定すれば良いんじゃない?

753 :Name_Not_Found:2011/12/05(月) 00:17:16.78 ID:???
b:nth-child(3)

754 :think49 ◆bKk/qcAKuM :2011/12/05(月) 03:30:00.60 ID:???
>>727
今更ですが、再現条件は全称セレクタを使用する場合(全称セレクタを省略するパターンを含む)に限定されるようです。
http://cssdesk.com/DsbeQ
http://cssdesk.com/CRhQ2
タイプセレクタで必要な文だけ指定すれば回避可能と思われます。
(ついでにバグ報告すると、次期バージョンで修正されるかもしれません)

755 :727:2011/12/05(月) 17:58:34.02 ID:CJq/YNuj
>>754
ありがとうございます
ページ全体を書き換えるユーザースクリプトを使っているので
出来れば全称セレクタで済ませたいと考えています

いちおう、今のところ以下のような指定で応急処置しております
あとこの場合の全称セレクタは省略出来るんですね。参考になりました

http://jsfiddle.net/FeDNE/1/
body > *:not(#example){
position: absolute; left: -9999px;
}

756 :Name_Not_Found:2011/12/06(火) 11:10:22.19 ID:???
>>752
ユーザーCSSを適用したいのでそれなしで出来ませんかね?

757 :Name_Not_Found:2011/12/06(火) 11:37:51.07 ID:???
>>756
>>753

758 :Name_Not_Found:2011/12/06(火) 16:16:28.46 ID:???
<table><tr><td>愛</td><td>牛</td></tr><tr><td>絵本</td><td>音</td></tr></table>

上記のように2列のテーブルを作りたいのですが、CSSで作れたりしますか?

かな順で単語を並べたいので上記テーブルに椅子とかを入れたい場合苦労します。



759 :Name_Not_Found:2011/12/06(火) 17:32:54.26 ID:???
それはテーブルじゃなくてリスト
ol要素を使いなさい

760 :Name_Not_Found:2011/12/06(火) 18:29:10.65 ID:???
なんでol限定なんだ

761 :Name_Not_Found:2011/12/06(火) 18:35:01.85 ID:???
何でマークアップにバラエティを求めるん?

762 :Name_Not_Found:2011/12/06(火) 22:20:21.67 ID:???
divの要素の中に別のhtmlを表示する方法って無いですか?
サイトのリンク(共通ファイル)を表示しようと思うのですが、iframeはもう推奨されないと聞いたので

763 :Name_Not_Found:2011/12/06(火) 22:25:20.85 ID:???
JavaScript

764 :Name_Not_Found:2011/12/06(火) 22:31:27.46 ID:???
>>762
iframeは一度非推奨になって廃止されたけど復活したよ
iframe使えないHTMLのバージョンならobject使えばいい

765 :Name_Not_Found:2011/12/07(水) 17:04:30.49 ID:???
tableのtdにボーダーを設定しているのですが、IEだと普通に表示されるのに
Firefoxだと一部のボーダーが表示されません。
ローカルではちゃんと表示されてたのにサーバーにアップしてみて見ると
表示が崩れています。
なんでしょう?

766 :Name_Not_Found:2011/12/07(水) 18:01:53.57 ID:???
>>765
http://jsfiddle.net/
切り貼りしてみるといい

767 :Name_Not_Found:2011/12/08(木) 14:17:48.92 ID:Pf4bvZsJ
<div id="long-content">
  <div id="bg"></div>

</div>

768 :751:2011/12/08(木) 14:33:10.24 ID:???
>>753
>>757
ありがとうございます

769 :Name_Not_Found:2011/12/08(木) 14:33:21.22 ID:Pf4bvZsJ
<div id="long-content">
  <div id="bg"></div>
  <!-- #bgの背景を#long-contentの上に被せ、縦にループさせたい -->
  長いコンテンツ
      :
      :
      :
</div>
上記のように#bgの背景に画像を指定して、縦に(y方向に)ループさせて
コンテンツ(#long-content)の上をかぶせる形にしたいのですが、
どうしたらいいでしょうか。

・コンテンツの長さは不明=heightで指定できない
・生javascriptやjqueryを使用して、#long-contentの
 offsetHeightなどを取得して#bgのheightに指定してみましたが、正確なheightが得られなかったり、
 ブラウザ間でまったく違う長さになってしまいます。

上記のような問題があり、2日ぐらい悩んでいまだ完全に解決できていません。

現在は、
#bg { height:999999px; }
#long-content { overflow:hidden; }
のようにかなり#bgを縦長にして、余った部分はhiddenさせる、
というようにしています。
これで見た目的には問題なくなったのですが、
ページ内リンク(xxx.html#test1)をクリックすると、
その#test1部分に移動するのですが
それより上の要素が完全に消えてしまいます。
ただ、height:999999pxの指定を解除すると、正常に動作するのでこれのせいなのは確かだと思いますが・・・

どう解決すればいいでしょう?

770 :Name_Not_Found:2011/12/10(土) 12:34:10.19 ID:???
>>764
ありがとう。復活したのか。
object使ったけど、よくわからん。
object内で表示しているリンクを踏んだ時、自分の枠以外のページを書き換え(フレームで言う、子のフレームのリンクで親フレームのhtmlを飛ばす感じ)るやり方が分からない

771 :Name_Not_Found:2011/12/10(土) 13:13:47.31 ID:???
>>770
iframeと一緒にtarget属性も復活したよ

HTML5 DOMのWindow.parent.location.assignとか使うって手段もあるだろうけど
そうするくらいなら、移行型なりHTML5なり使った方が

772 :Name_Not_Found:2011/12/10(土) 15:40:56.51 ID:???
<dt><dd>
で、dtを左に、ddを右に配置したいんだけどCSSどうかけばいいかな

<dt><山田太郎</dt>
<dd>こんにちは<br>山田太郎です<br>20才です</dd>

これが

山田太郎 こんにちは
       山田太郎です
       20才です

こんな感じになるようにしたいんです

773 :Name_Not_Found:2011/12/10(土) 15:58:54.96 ID:???
dt, dd{
display: table-cell;
}

774 :Name_Not_Found:2011/12/10(土) 19:12:34.33 ID:???
dl {line-height: 1.6em;}
dt {width: 10em;}
dd {margin-left :10em; margin-top :-1.6em;}

775 :Name_Not_Found:2011/12/10(土) 20:16:48.81 ID:???
<a href="http://d.hatena.ne.jp/xxx/20111125"><span class="date">November 25(Fri),2011</span></a>
に対して、
.date{font-style: italic; color:black;}でfont-styleは変わるのに色が変わらないときってどうすればいいでしょうか?

776 :Name_Not_Found:2011/12/10(土) 21:23:04.75 ID:???
color:black !important;でどう?

777 :Name_Not_Found:2011/12/10(土) 23:12:18.96 ID:???
>>776
ありがとう。解決しました。

778 :Name_Not_Found:2011/12/11(日) 15:56:28.05 ID:???
>>774 それ、フォントサイズに対応しないね

779 :Name_Not_Found:2011/12/12(月) 19:52:24.43 ID:???
教えてください、こういう多段のblockquoteってどうやって定義したらいいんでしょうか?

http://ggsoku.com/2011/10/multitouch-patent/

http://beebee2see.appspot.com/i/azuYybetBQw.jpg


780 :Name_Not_Found:2011/12/12(月) 19:59:53.44 ID:???
子孫結合子
子結合子

180 KB
■ このスレッドは過去ログ倉庫に格納されています

★スマホ版★ 掲示板に戻る 全部 前100 次100 最新50

read.cgi ver 05.04.00 2017/10/04 Walang Kapalit ★
FOX ★ DSO(Dynamic Shared Object)