12/01/27 20:30:47.44
CSS初心者の方のための質問スレッドです。
具体的な記述方法がわからない方、基礎知識がない方はこちらでどうぞ。
※気のいい人だけが答えてくれますので、解答はまったり待ちましょう。
《関連スレ》
Webサイト制作初心者用質問スレ Part 227
ｽﾚﾘﾝｸ(hp板)
《前スレ》
CSS初心者スレッド＝10th＝
ｽﾚﾘﾝｸ(hp板)
《過去スレ》
CSS初心者スレッド＝9th＝
ｽﾚﾘﾝｸ(hp板)
CSS初心者スレッド＝8th＝
ｽﾚﾘﾝｸ(hp板)
CSS初心者スレッド＝7th＝
ｽﾚﾘﾝｸ(hp板)
CSS初心者スレッド＝6th＝
ｽﾚﾘﾝｸ(hp板)
CSS初心者スレッド＝5th＝
ｽﾚﾘﾝｸ(hp板)
CSS初心者スレッド＝４ｔｈ＝
ｽﾚﾘﾝｸ(hp板)
CSS初心者スレッド＝3rd＝
ｽﾚﾘﾝｸ(hp板)
CSS初心者スレッド＝2nd＝
ｽﾚﾘﾝｸ(hp板)
CSS初心者スレッド＝1st＝
ｽﾚﾘﾝｸ(hp板)
2:Name_Not_Found
12/01/27 20:35:08.22
≪各種仕様≫
URLﾘﾝｸ(hp.vector.co.jp)
URLﾘﾝｸ(www.y-adagio.com)
URLﾘﾝｸ(www.d-toybox.com)
URLﾘﾝｸ(www.w3.org)
3:Name_Not_Found
12/01/27 20:43:26.91
乙
4:Name_Not_Found
12/01/27 22:00:07.75
┌───┐
│ いちもつ ♪│
└∩──∩┘
ヽ(`･ω･´)ﾉ
5:Name_Not_Found
12/01/27 22:37:53.76
前スレ ｽﾚﾘﾝｸ(hp板:980番)n は解決した？
6:Name_Not_Found
12/01/28 08:47:43.97
>>1
11th ってなんだよ
中卒未満かよ
7:Name_Not_Found
12/01/28 10:10:55.13
>>6なんで小卒がレスしてるの？
8:Name_Not_Found
12/01/28 11:26:04.75
>>6
9:Name_Not_Found
12/01/28 11:44:47.89
あ？11stだろうが
>>1,7,8てめーら幼稚園からやり直せwwww
10:Name_Not_Found
12/01/28 11:58:08.26
>>9
えっ・・おまえ・・・
11:Name_Not_Found
12/01/28 12:33:25.51
マジレス
何も知らない奴→「とりあえず3rd以上はthじゃないの？」
・今回は運が良かったな。とりあえずセーフ
馬鹿が間違った憶測で勘違いする→「1stなんだから11stだろｗｗ」
・情弱の典型例。CSS以前の問題
このスレの一般住人→「11は『Eleven+th』なので11th、ただし21以上の場合は
『Twenty-first』なので21stになる」
・常識だな
12:Name_Not_Found
12/01/28 12:36:04.58
じゅういっす！
13:Name_Not_Found
12/01/28 15:19:14.40
ちなみに11はティーンズには入らない
14:Name_Not_Found
12/01/28 16:18:34.59
初心者だけどいろんなホームページのソースみて勉強してます！
みんなはどんな風に勉強してる？
15:Name_Not_Found
12/01/28 16:41:13.47
同じだよ。どの本にもまずは他のウェブをみて学べって書いてある
16:Name_Not_Found
12/01/28 16:46:43.57
ほかのWebのソースはPHPとかでぐちゃぐちゃに書き換えられた後のソースだったりテーブルレイアウトだったりで
意外と話にならない
<div>
<div>
<div>
<div>
<h1>なんとか</h1>
</div>
</div>
</div>
</div>
こんな風になってることがザラ
17:Name_Not_Found
12/01/28 16:48:26.78
divばっか使ってるとこは確かにウザイ。
有名サイトのソースみて勉強するといいよ。
素人のサイトソースなんかみてもなんも勉強にならん
18:Name_Not_Found
12/01/28 17:13:14.13
参考書として見るサイトを決める基準が「有名」ってのは大間違いすぎだろ
大前提としてHTMLがそれなりにまともじゃないと「なんも勉強にならん」よ
19:Name_Not_Found
12/01/28 17:14:32.23
ふむ、じゃあまずもっとも有名なgoogleのサイトを見てみるか
html>body>div>form>div>div>table>tr>td>table>tr>td>div>table>tr>td>table>tr>td>div
なるほど
20:Name_Not_Found
12/01/28 17:25:45.03
正直テーブルレイアウトってなんのことかわからない
21:Name_Not_Found
12/01/28 17:29:16.66
HTMLに<table><tr><td>
とか
display:table-cell
とか
つかうのを嫌ってる人のことじゃないの。
22:Name_Not_Found
12/01/28 17:34:52.68
それはdiv厨
23:Name_Not_Found
12/01/28 17:53:01.47
じゃあリファレンスサイトでも見てろよ。
24:Name_Not_Found
12/01/28 18:02:16.37
ぶっちゃけリファレンスサイトのほうがW3Cより役に立つよね
このタグはFirefox、GoocleChromeで機能しますが
IE8未満は動かない
とかそういう重要な情報はW3Cにかいてねーし。
25:Name_Not_Found
12/01/28 18:03:28.10
HTMLっていうか、なんていうか、このスレいらなくね
26:Name_Not_Found
12/01/28 18:13:31.40
そりゃW3Cは各ブラウザの実装まで管理する立場にないし
27:Name_Not_Found
12/01/28 19:20:31.06
スタイルシートって普通は自分で作るんですかね
みんなどうしてる？
28:Name_Not_Found
12/01/28 19:22:11.33
え？じゃあお前どっからかパクってきてんの？
29:Name_Not_Found
12/01/28 19:42:23.24
作り方がわからない；
30:Name_Not_Found
12/01/28 19:49:51.16
えーっと、ここは初心者スレであって未経験者スレではないんだよね。
でも一応君の役に立つであろうリンクを貼っておくよ
URLﾘﾝｸ(lmgtfy.com)
31:Name_Not_Found
12/01/29 09:19:31.19
>>27
俺はおかあさんに作ってもらってる
32:Name_Not_Found
12/01/29 17:59:35.32
何も考えずにやると壁紙の上に文字がうつって見づらいです。
URLﾘﾝｸ(iup.2ch-library.com) こんなふうに
それを
URLﾘﾝｸ(www.coolwebwindow.com)
みたいに見やすくするにはどうすればいいんでしょうか（いろんなサイトがやってるように）
無知ですみません
33:Name_Not_Found
12/01/29 18:29:07.24
>>32
URLﾘﾝｸ(az-store.nrym.org)
34:Name_Not_Found
12/01/29 19:06:10.40
>>33
どの辺みればいいですかね
35:Name_Not_Found
12/01/29 19:09:51.20
全部
36:Name_Not_Found
12/01/29 19:12:12.22
どのへん見ればいいって・・・
>>32みたいな基礎的なこともわかってないのに。
お前むいてないわ。CSSやめろ
37:Name_Not_Found
12/01/29 19:12:12.56
>>32
>何も考えずにやると
少しは考えろよｗ
38:Name_Not_Found
12/01/29 19:13:42.64
ごめんなさい
全部見てから出直す
39:Name_Not_Found
12/01/29 22:16:57.78
Naverの画像検索みたいにサイズが違っても画像と画像の隙間が空かないようにするにはどうすればいいでしょうか？
参考
URLﾘﾝｸ(search.naver.jp)
40:Name_Not_Found
12/01/29 22:33:23.90
Javascriptで位置を調整する
41:Name_Not_Found
12/01/29 23:27:30.75
>>40
んーやっぱりCSSだけではダメなんでしょうか
出来ればjavascriptは使いたくないので、あんまりスマートではないですが画像を縦に並べることで解決したいと思います
ご回答ありがとうございました
42:Name_Not_Found
12/01/29 23:44:23.42
CSSでも別にできるよ
ただ、たとえばあとから
ここは200*250pxのjpg画像をおいてたけど
この300*300の画像に置き換えよう！
とか思ったときに、ほかのすべての画像の位置をすべて手直しする手間がかかる。
43:Name_Not_Found
12/01/30 21:50:14.86
みんなどうやって勉強しましたか？
本買った？それともネットで勉強した？
44:Name_Not_Found
12/01/30 21:51:06.85
後者かな
45:Name_Not_Found
12/01/30 21:51:19.90
とりあえず今は
46:Name_Not_Found
12/01/30 21:53:34.06
途中送信してしまった。
とりあえず今はCSS3なんて新要素覚えずにCSS2とHTML4からゆっくり覚えとけばいいよ
ベンダープレフィックスとかは気にしなくてイイ。
他のブラウザに対応していく技術は基本を覚えてからだ。
47:Name_Not_Found
12/01/30 22:03:32.92
CSS2とHTML4→CSS2.1とHTML4.01
48:Name_Not_Found
12/01/30 23:06:30.55
>>32
これって壁紙設定したら上からborderで枠作ってるの？
49:Name_Not_Found
12/01/30 23:17:58.02
どこをみて壁紙設定してるって思ったの？
50:Name_Not_Found
12/01/30 23:27:05.47
>>49
見出しの事言ってるんじゃないの?
51:Name_Not_Found
12/01/30 23:32:47.05
あぁそういうことね。
h2にmarginやらpaddingやらbackgroundやら付加してるだけだよ
52:Name_Not_Found
12/01/30 23:52:56.76
にしても>>32のテンプレ配布サイト見てみたけど、それなりに綺麗なコードで構成してるのな
見習おうと素直に思った
53:Name_Not_Found
12/01/31 00:06:40.94
32のサイトならこれ以上きれいにかけないね。
54:Name_Not_Found
12/01/31 00:11:42.56
商用サイトテンプレが結構参考になるの沢山あった気がする。
個人的にNo5、7、14、19、20、21、23はいいな って思った。
55:Name_Not_Found
12/01/31 17:50:42.88
body{
margin:0px;
padding:0px;
}
div{
margin:0px;
padding:0px;
display:inline-block;
width:50%;
}
これだけではdivを画面いっぱいに横並びにできないのですが他に何が必要でしょうか。
widthを下げると横並びになるので、何かがはみ出ているのでしょうか。
56:Name_Not_Found
12/01/31 17:56:08.16
>>55
divが2つだけで連続している状態です。
57:Name_Not_Found
12/01/31 18:38:14.90
何かってってなんだよdiv自体だろ
58:Name_Not_Found
12/01/31 18:57:07.84
100<50+50
ってこと
59:Name_Not_Found
12/01/31 21:23:31.58
>>55
inline-blockを使おうとする理由を
inline-blockでググって読んで考えてからまた来てください
60:Name_Not_Found
12/01/31 21:28:10.34
inline-blockの使い所ってぶっちゃけあまりないよね
61:Name_Not_Found
12/02/01 00:48:38.80
inputタグのtype="text"が横並びに2つあるとき
IE8では、文字を日本語で入力した場合は、1,2px下にずれちゃうんだけども
原因なんですかね？
62:Name_Not_Found
12/02/01 09:34:03.73 m2sTH90t
>>55
最初のDIVの終了タグの後に改行があり、
その改行文字が半角空白に置換されているのでは。
100% < 50% + 半角空白の幅 + 50%
63:Name_Not_Found
12/02/01 09:36:29.77
>>62
HTML書いてないけど確かにその可能性はある。
エスパーレベル２級くらいだ。
64:Name_Not_Found
12/02/01 12:03:26.45
<textarea></textarea>
に
textarea{
width:100px;
height:100px;
}
を指定すると、テキストエリアをリサイズできる機能を持ったブラウザ(Chromeなど)で100px以下にリサイズできなくなります
表示したときに100pxのサイズで表示させて、ユーザーがリサイズしたいときは100pxいかにも出来る方法を教えてください
65:Name_Not_Found
12/02/01 13:50:58.60
>>62
あたりっぽい。
～～</div><div>～～
にしたら50%でも並んだ。
66:Name_Not_Found
12/02/01 15:13:43.67
>>64
%指定すれば良い話じゃないのけ？
67:Name_Not_Found
12/02/01 15:27:37.73
>>66
ダメです
Chromeだと指定したサイズ（px,em,%）以下にリサイズできないです
68:Name_Not_Found
12/02/01 15:30:30.26
というかそういう事例を一体どこで使うのさ。
69:Name_Not_Found
12/02/01 16:50:51.62
横だがめちゃくちゃ有用な設定だと思う
70:Name_Not_Found
12/02/01 17:01:00.71
div自体に厚みがあるのか。
71:Name_Not_Found
12/02/02 14:14:41.22
本見ながらTOPページは作ったんだけどCSSってコンテンツの部分どこに作るん？
サンプル見てもTOPだけでコンテンツ部分はリンク切れになってるもんで
72:Name_Not_Found
12/02/02 19:21:44.18
headの中にstyleタグつけてコメントアウト
またはlink張って別ファイル
73:Name_Not_Found
12/02/02 22:17:54.54
<style></style>はコメントアウトしろ
みたいなこと書いてるCSS入門書とかあるけど
あれって別にいみねーよな。
XHTMLならむしろ間違いだし。
74:Name_Not_Found
12/02/03 02:43:52.87
30年前のブラウザ使うときに困るからコメントアウトすべき
75:Name_Not_Found
12/02/03 09:18:43.68
基本linkのほうがかっこいいよね
76:Name_Not_Found
12/02/03 15:52:47.21
そもそもlink使わないとHTMLの中にCSS入れることになるから汚い
77:Name_Not_Found
12/02/03 16:17:16.69
すみません、質問です。
<span class="aaa">AAA</span>
<span class="bbb">BBB</span>
<span class="aaa bbb">AAA BBB</span>
というタグがあったとして、
「aaaとbbbの両方のクラスが定義されている要素」だけにスタイルを適用したいのですが、
CSSのセレクタはどう記述したら良いのでしょうか。
よろしくお願いします。
78:78
12/02/03 19:12:36.39 9HeKXsnK
初心者です。お願いします。
-----------こういった線の処理--------------
をしたいのですが、ボックスを3つ作って右と左端のボーダーは何か
するのでしょうか？
79:Name_Not_Found
12/02/03 19:22:25.38
>>77
.aaa.bbb
でもたぶんそれはHTMLを見直すべきだと思う
>>78
日本語で
80:Name_Not_Found
12/02/03 19:27:08.79
ようわからんが、:before / :after 疑似要素使えばいいんじゃない
81:78
12/02/03 19:42:29.85 9HeKXsnK
>>80
ありがとうございます。
:before / :after 調べて見ましたが自分には難しそうなので
安直に文字の罫線
── センタリングしたら左右ボックスにぴったり合わない ──
でごまかしてみます
82:78
12/02/03 20:09:51.15 9HeKXsnK
>>81の方法はIEで失敗しました。( Ｔ ▽ Ｔ )
83:Name_Not_Found
12/02/03 20:16:09.41
ソース貼れ
84:Name_Not_Found
12/02/03 20:21:56.26
>>82
もしかしてIE6で確認したんじゃないの?
だとしたら疑似クラス（:beforeとか:afterとか:hoverとかのこと）は
a要素以外には効かないよ
若干HTMLが汚れるけど
URLﾘﾝｸ(blog.mukairiku.net)
とかは?
85:Name_Not_Found
12/02/03 20:31:37.32
:beforeは疑似クラスじゃない
そもそもIE6は:before使えない
86:Name_Not_Found
12/02/03 20:52:54.64
横槍だがrelative指定のspanで隠すのか。
なんかモヤモヤすんなぁ
87:77
12/02/03 20:54:13.67
>>79
できました！
ありがとうございます、助かりました！
> でもたぶんそれはHTMLを見直すべきだと思う
予定表の予定とかは、「重要度」と「緊急度」で分けたりするではありませんか。
その際、重要なものにはclass="important"、緊急なものにはclass="urgent"、
重要かつ緊急なものにはclass="important urgent"を付けたりするではありませんか。
その時に、重要かつ緊急なものを、特に強調して表示したかったのです。
とにかく、目的を達成することができました。
ありがとうございました！
88:78
12/02/03 21:14:26.14 9HeKXsnK
>>84
ありがとうございます！！リンク先のでなんとなく出来ました！！
ちなみにIEは5.1 NNは4.7で確認してます。firefoxとsafariで見られたので
okにします！
89:Name_Not_Found
12/02/03 22:37:37.13
なんだよ、こいつ
90:Name_Not_Found
12/02/03 22:45:52.89
なんでそんな6より古いもん使うの。
5とか対応してる個人/業者どこもないぞ
91:Name_Not_Found
12/02/04 00:06:09.85
Web板状中の基地外ですよ。いつも同じ質問してる
92:Name_Not_Found
12/02/04 00:11:34.29
ラインハイトを固定に設定してるやつ死ねよ
フォントサイズを大きくしたらやたら窮屈になる
そのくらい考えろ無能ども
93:Name_Not_Found
12/02/04 00:56:29.22
>>87
>予定表の予定とかは、「重要度」と「緊急度」で分けたりするではありませんか。
>その際、重要なものにはclass="important"、緊急なものにはclass="urgent"、
>重要かつ緊急なものにはclass="important urgent"を付けたりするではありませんか。
>その時に、重要かつ緊急なものを、特に強調して表示したかったのです。
まるっきり>>79の指摘通りじゃねえかｗｗ
なんで「強調」に<span class="">を使う？なんでinportantは太字urgentは赤背景両方なら両方が適用されるというような形にしない？
そうしていれば77の質問にはそもそも至らずに済むというのに
>>79はそういう意味での「HTMLを見直せ」でしょ
>>88
NNってお前何年前の人間だよ
94:84
12/02/04 01:17:46.58
>>85
アウチ…
疑似要素と疑似クラスとごちゃごちゃになってた…
指摘ありがとう
そして吊ってきます
95:77
12/02/04 01:27:38.00
>>93
> なんで「強調」に<span class="">を使う？
<span>は質問のために使っただけで、別に<li>でもいいですよ。
> なんでinportantは太字urgentは赤背景両方なら両方が適用されるというような形にしない？
なんで仕様の方を変えようとするんですか？
・important かつ urgent の場合は赤色
・important のみの場合は青色
・urgent のみの場合は緑色
という仕様だった場合、どうするんですか？
96:Name_Not_Found
12/02/04 01:54:18.06
emとかstrongとかの立場って
97:Name_Not_Found
12/02/04 01:55:08.54
だから基地外っていってるじゃん。相手にすんな
98:77
12/02/04 02:01:31.35
基地外はあなたですよ。
全く説明になってませんから。
<span class="important">重要な予定</span>
<span class="urgent">緊急な予定</span>
<span class="important urgent">重要で緊急な予定</span>
で、これを<em>と<strong>でどうするんですって？
99:77
12/02/04 02:03:34.65
<p>
<em>と<strong>は、
こういう<strong>テキスト内での強調</strong>に使うんですよ。
知りませんでしたか？
<em>インライン要素</em>ですからね。
</p>
100:77
12/02/04 02:04:34.94
＆lt;と＆gt;は、2chでは使えないのか。
>>99は失敗。
まあ、>>98 は説明できないだろうから、
引っ込んでてくださいね。
101:Name_Not_Found
12/02/04 14:19:33.23
>>98
HTMLの仕様を守ってから要件定義するものなんじゃないの。
インライン要素は全てspan要素にするつもり？
URLﾘﾝｸ(html5.jp)
102:Name_Not_Found
12/02/04 14:55:40.13
>>95 に、「別に<li>でもいい」って書かれてるでしょ＾＾
103:Name_Not_Found
12/02/04 14:58:49.99
アホだな。
専門学校かなんかで<em>とか<strong>とか習ったんだろうけど、
ちっとも使い方が分かってない。
104:Name_Not_Found
12/02/04 15:14:51.28
レスが付かないので自演を始めました＾＾
105:Name_Not_Found
12/02/04 17:55:45.26
それは報告しなくてもいいです
106:Name_Not_Found
12/02/04 18:53:32.70
>>77の末路が予想通りで安心した
107:Name_Not_Found
12/02/04 19:21:29.20 Ahus5PRI
横レスだけど、>>87の方が間違ってる
108:Name_Not_Found
12/02/04 19:34:02.81 Ahus5PRI
失礼
>>87じゃなくて>>93
109:Name_Not_Found
12/02/04 19:46:25.43
>>107
110:Name_Not_Found
12/02/04 19:46:58.94
>>107-108
どういう理由で？
111:Name_Not_Found
12/02/04 19:48:47.94 Ahus5PRI
太字と赤背景を合わせておしまいというCSSの書き方はまずない
融通が効かないから
112:Name_Not_Found
12/02/04 20:06:15.13 Ahus5PRI
あとspanかemかというのはどうでもいいこと
emは「意味」を強調する
通常、「意味」を強調する場合は「表示」も強調される
一方、spanは「意味」の強調はしない
id属性やclass属性で「意味」を持たせることはできる
その属性を使用して、CSSでは「表示」を強調することができる
状況に応じて使い分ければいい
113:Name_Not_Found
12/02/04 21:13:15.06
基地外が早くいなくなりますように(-人-)
114:Name_Not_Found
12/02/04 21:53:13.97
>>112
それは人間がHTMLを読むときの考え方。
idやclassは名前を持たせるだけの意味しかない。
論理的な意味を持たせるならidやclassがなくても意味が通るようにしなければならない。
115:Name_Not_Found
12/02/04 22:06:03.27
>>114
> 論理的な意味を持たせるならidやclassがなくても意味が通るようにしなければならない。
それは無理。
それをやろうとすると、無限にタグが必要になる。
例えば詩を表すのに<poem>というタグが必要。
そういうことができないから、idとかclassとかで意味を持たせるんだよ。
そんなことも知らないのか。。。
116:Name_Not_Found
12/02/04 22:19:45.05
>>115
そんな当たり前のことをいわれてもな。
HTMLで定義されている範囲に限定されるのはいわなくても伝わると思ったんだが…。
HTMLで未定義の部分をclassで意味を持たせるのは悪くないが、それは人がHTMLの意味論を拡張してわかりやすくしているだけだ。
明らかに「強調」の意味のあるところにemもstrongも使わないところが問題。
見た目は同じでも意味が異なる。
117:Name_Not_Found
12/02/04 22:21:05.92
タグを自由につけられるXML最強
118:Name_Not_Found
12/02/04 22:26:09.64
>>114
> idやclassは名前を持たせるだけの意味しかない
>>116
> HTMLで未定義の部分をclassで意味を持たせるのは悪くない
言ってること違うしｗｗｗ
もうね、君、自分の頭の悪さ自覚したほうがいいよ。
強調の意味を付けたければ<em>, <strong>を使えばいいし、
付けたくなければ使わなければいい。
上の奴はそう言ってるんだろ。
119:Name_Not_Found
12/02/04 22:27:07.77
タグを少なくすることに拘りだすとclassに偏重して必要なタグまで省略するようになる
120:Name_Not_Found
12/02/04 22:27:10.53
>>116
お前の言葉が足りないだけ。
ちゃんとhtmlで定義されている範囲の意味付けはclassやidを使うなって言えば良かっただけの話。
説明不足を人のせいにしたらいかん
121:Name_Not_Found
12/02/04 22:27:58.34
つーか、<em>とか<strong>とかにこだわってる奴、同じ奴だろ。
普通、こんなところ拘らないし、
>>77 がどんなのを作ってるのか分からないから、断定できない。
122:Name_Not_Found
12/02/04 22:30:28.69
>>118
後半も読んでやれよ
HTMLの意味論と人間がHTMLを読むときの意味論を区別してるんだろ
123:Name_Not_Found
12/02/04 22:30:43.94 Ahus5PRI
おうおう、喧嘩するな
こんなのどうでもいいから
124:Name_Not_Found
12/02/04 23:04:09.73
>>123
お前がいうな
125:Name_Not_Found
12/02/04 23:05:17.74
<em>と<strong>にしたところで、
>>95 はどうやって解決するんだ？
126:Name_Not_Found
12/02/04 23:09:32.76
URLﾘﾝｸ(www.w3.org)
> Identifiers are opaque strings. Particular meanings should not be derived from the value of the id attribute.
URLﾘﾝｸ(www.w3.org)
> authors are encouraged to use values that describe the nature of the content, rather than values that describe the desired presentation of the content.
id属性値は無意味な文字列
class属性値はコンテンツの性質を説明するトークンセット
127:Name_Not_Found
12/02/04 23:10:07.72
<em>と<strong>を使うと、
>>79 が言った .aaa.bbb を回避できるの？
128:Name_Not_Found
12/02/04 23:27:27.96
基地外発狂しちゃいました；；
休日明けまで自演が続きますので静観しましょう
129:Name_Not_Found
12/02/04 23:28:08.06
>>105
130:Name_Not_Found
12/02/04 23:29:56.87
>>128
そうやって誤魔化してないで、答えてみてよ。
自分が答えられないと、そうやって逃げるんだね。
131:Name_Not_Found
12/02/04 23:32:34.52
emとかstrongとか言ってる奴はアホ
132:Name_Not_Found
12/02/04 23:42:39.50 Ahus5PRI
だから、>>93は間違いだよ
HTMLを見直したことになってない
133:Name_Not_Found
12/02/05 00:45:14.79
なんでこんな馬鹿ばっかりなんでしょうか ?
134:Name_Not_Found
12/02/05 00:50:31.09
知るか馬鹿
135:Name_Not_Found
12/02/05 00:50:58.12
同意
136:Name_Not_Found
12/02/05 00:52:17.79
初心者スレなんだからバカばっかなのは仕方ない
お前もむかし
あれー、フロートしたらなんか変になったー！
とか
なんでこのタグがねーんだよクソが！
HTML5でタグ笛まくりすばらしい
とか思ったろ
137:Name_Not_Found
12/02/05 06:33:48.97
論点どこなんだよお前ら
id classに意味をもたせる事の是非か?
id classはサブカテゴリ的な位置づけでいいだろ
138:Name_Not_Found
12/02/05 06:38:18.60
これが正解。
<strong class="important">重要な案件</strong>
<strong class="urgent">緊急の案件</strong>
<strong class="important urgent">重要かつ緊急の案件</strong>
139:Name_Not_Found
12/02/05 06:52:05.17
strongが無意味といってる人へ。
つ Lynx
140:Name_Not_Found
12/02/05 07:49:04.88
無意味って誰か言ってた？
使い分ければいいとは言ってたけど。
141:Name_Not_Found
12/02/05 07:55:03.48
>>138
なにそれキモい。
そんなのはアプリの設計思想でいくらでも変わる。
前2つを<em>にするのが正解かもしれないし、全部<em>が正解かもしれない。
エンドユーザによって変わるかもしれない。
緊急の案件が強調したいものとは限らないだろ。
142:Name_Not_Found
12/02/05 08:01:24.13
最初の質問の>>77と>>79をよーく見てみ。
>>77は「強調したい」とは言ってないんだよ。
>>79はこの段階で「HTMLを見なおせ」と言ったんだ。
そこに>>93が出てきて、<em>とか<strong>とかを持ちだした。
>>79が言ってる「HTMLを見なおせ」は、強調とかそんなことじゃない。
143:Name_Not_Found
12/02/05 08:09:07.72 alj2Ku/S
>>77は口が悪いが、>>93は頭が悪い
ほっとけ
144:Name_Not_Found
12/02/05 08:09:34.67
>>142
つまり「HTMLを見直せ」はどういう意味?
145:Name_Not_Found
12/02/05 08:11:57.21
>>144
それは知りたい。
>>79の考えがどういうものか、>>79が教えてくれるといいんだけど。
146:Name_Not_Found
12/02/05 08:34:36.67
>>144
仕様書もう一度読めって事か?
147:Name_Not_Found
12/02/05 10:29:17.10
>>141
重要な案件で強調しないものなんてありえるの？
あるとしたらそれは本当に重要なの？
148:Name_Not_Found
12/02/05 11:03:22.27
>>147
>>141のどこに「重要な案件」って書かれてるの？
まず文章を読めるようにしような。
149:Name_Not_Found
12/02/05 11:14:24.95
>>148
緊急にしても変わらないでしょ
150:Name_Not_Found
12/02/05 11:21:51.80
「期限は迫っているが重要度は高くない」
つまり、やってもやらなくてもいい。
やってもやらなくてもいいものを強調するの？
強調するとしたら、<strong>使うの？
<strong>で強調するまでもないから<em>を使うの？
こういうのは、要求、仕様、設計などによって変わることすら分からないの？
151:Name_Not_Found
12/02/05 11:22:40.68
Webページにくるひとは
そこに書いてるのが
<em>なのか<div class="important">
なのかなんてどうでもいい話
152:Name_Not_Found
12/02/05 11:26:24.79
システムの詳細が分からないのに、
よく<strong>が正しいとか言えるよな。
あほらし。
>>151
全くだ。
度を越して変なタグが使われてなければいいだけ。
153:Name_Not_Found
12/02/05 13:07:44.13
すみません、こちらでよかったのか分かりませんが教えて下さい
現2カラムの形でコンテナで囲んだ所に
右側サイドバー、左側コンテンツと言うカタチで作っております。
コンテンツ量が少ない場合でも、フッターを下部にへばりつける？風に作ったのですが、
サイドバーもフッターにくっ付くように自動的に伸ばしたいくて、height:100%とかにしたのですが何ら変わりません。
どの様にするのが一番良いでしょうか？
154:Name_Not_Found
12/02/05 14:32:57.54
URLﾘﾝｸ(i2uma.blog.fc2.com)
ちょっと困ってるので教えてください。
上記ページをFirefox、IE9、opera ( 別の異常が ) で見ると一番上の変態さんの横に×マーク ( 画像 ) があるんですが
Chrome Safari ( ＋iPhone ) だと一番上の×マーク (画像) だけ表示されません。
nth-child(1)等の番号指定のミスかな思ったのですが、そのような指定はしてなかった。
こんなの初めてなんで、何か分かりましたらレスお願いします。
スレ違いなら誘導お願いします。
155:Name_Not_Found
12/02/05 15:15:20.72
>>153
「css 2カラム 背景」でぐぐれ
156:Name_Not_Found
12/02/05 16:03:58.22
>>154
とりあえず、div要素をa要素で括るのは文法違反。
なぜ display: inline を使っているのか知らないけど、height は行内非置換要素に適用できない。
URLﾘﾝｸ(www.y-adagio.com)
157:Name_Not_Found
12/02/05 16:37:30.17
>>156
>div要素をa要素で括るのは文法違反。
了解しました。
>display: inline を使っているのか知らないけど
別の場面で深く考えずpを使ったため、使いかってを考えてこちらも同じくpにしたのですが、こちらはインラインにしたかったためです。
>height は行内非置換要素に適用できない。
これは単に削除忘れでした。
わざわざ見て調べてくださってありがとうございます。
158:Name_Not_Found
12/02/07 07:48:06.68
あるブログで、<ul><li>（リスト要素）が全くマーカーが表示されないから、
デザインテーマで提供されているスタイルシートのlist-style-typeがnoneになっていると思い、
cssにul {list-style-type: disc !important;}を加えたのですが、依然としてマーカーが表示されませんでした。
本文が<div class="section">から始まるので、.section ul {list-style-type: disc !important;}と
してみましたが効果がありません。
リスト要素をリスト要素だと分かるようにするために何とかマーカーを表示させたいのですが、方法はあるでしょうか？
（はてなダイアリーなのでテーマのスタイルシートを直接いじることは出来ません。）
159:Name_Not_Found
12/02/07 08:20:47.91
>>158
margin-left とか list-style-position とかは見た？
160:Name_Not_Found
12/02/07 08:22:28.46
>>158
あと overflow とか
161:Name_Not_Found
12/02/07 08:59:53.25
ul li {list-style-type: disc !important;}にすると表示できました。なぜかul liじゃないといけないみたいですね。
ulとliの間にタグが挟まるとアウトですが、これで様子を見てみます。
>>159,160
ありがとうございます。申し訳ありませんが、どこを見ればいいのか分かりませんでした。
162:Name_Not_Found
12/02/07 12:17:17.07
>ulとliの間にタグが挟まるとアウト
ULの子要素はLIだけなので、そういう状況はないはずです。
163:Name_Not_Found
12/02/07 15:06:59.68
初心者質問お願いします。
}
#TopicPath1 h3 {
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
font-size: 24px;
color: #600;
width: 780px;
font-weight: bold;
padding-right: 10px;
padding-bottom: 0px;
background-image: url(images/SubHeadBack.png);
background-repeat: no-repeat;
background-position: 0px top;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 4px;
height: 54px;
line-height: 54px;
vertical-align: middle;
padding-left: 10px;
padding-top: 3px;
ネットで調べたらheightとline-heightを同じにすればvertical-align: middle
で天地センタリングになるということで背景画像の中心にガイドを引いて天地
同pxで画像の幅を設定したのに、ピタっと真ん中に入るのがpadding 3pxです。
こういうのは、そもそもコードとして反則なのか？プレビューでまとまってれば
どうやってもOKなのか？初心者なので、なんでこうなるのか、この処理でいいのか
わかりかねています。どうなんでしょうか？
164:Name_Not_Found
12/02/07 17:20:32.85
CSSリセットしましょう
165:Name_Not_Found
12/02/08 03:28:29.86
いいんじゃね
166:Name_Not_Found
12/02/08 11:31:12.46
>>164-165
ありがとうございます
167:Name_Not_Found
12/02/09 00:23:05.39
下記のブログのCSSを弄り、IE・Chrome・Firefoxにて表示確認をしていますが、
Firefoxだけズレたり、文字が表示されない箇所があります。
自力での解決ができないため、お知恵を貸していただければと思います。
サイト：URLﾘﾝｸ(kabehi.blog.fc2.com)
※アダルトサイトになる為、閲覧注意願います。
問題点
右カラムの逆アクセスランキングが、Firefoxだけ
右はじのアクセス数のところで切れてしまう。
アクセスランキングのサイトにて、表示幅を狭くすると
幅は小さくなりますが、どうしても全体が表示されません。
Firefoxは、最新の10にて確認をしております。
※昨日、優しく答えるスレのほうに質問をしましたが、その後
何度か更新をしているうちに表示が治ったため質問を取り消しました。
しかし、本日確認すると再度同現象が発生した事から
こちらの方へ質問させていただきました。
168:Name_Not_Found
12/02/09 00:25:31.19
なんでマルチするの？
169:Name_Not_Found
12/02/09 01:19:34.93
バカだからでしょ
170:Name_Not_Found
12/02/09 03:25:59.99
>>167
URLﾘﾝｸ(blog.sakurachiro.com)
あたりの問題っぽいね。
#i2i-00207912-viewtable tr td {
word-wrap : break-word ;
white-space : pre-wrap ;
}
とかで回避できるんかなぁ・・・
結果報告よろしく。
171:170
12/02/09 03:28:29.75
ってそれはpreの対策か。失礼。
tableでは無理っぽいので
overflow:auto;
でごまかすしかない？
172:Name_Not_Found
12/02/09 03:34:53.51
テーブル使わないのが一番
173:Name_Not_Found
12/02/09 17:34:32.66
質問です。
ブロック要素のサイズをマウスで広げたいのですが、
「要素のボーダー部分をドラッグして広げる」ということはできるのでしょうか。
できる場合、どのような感じになりますでしょうか。
簡単で結構ですので、何かヒントになるものを教えてください。
174:Name_Not_Found
12/02/09 18:08:55.62
{
width:xxx;
height:yyy;
}
のxxxとyyyをマウスで選択して好きな数字を入力する。
ソフトキーボートがあれば数字もマウスで弄れるよ。
175:Name_Not_Found
12/02/09 18:43:13.63
ボーダ部分をドラッグしたいのですが。
ああ、これはJavaScriptの質問ですね。
176:Name_Not_Found
12/02/09 18:43:46.26
ﾅﾆｲｯﾃﾝﾀﾞｺｲﾂ
>>173
JavaScriptで
177:Name_Not_Found
12/02/09 18:52:43.62
>>176
回答してくださってありがとうございます。
178:Name_Not_Found
12/02/09 20:53:12.14
>>173
ほれ
URLﾘﾝｸ(phpjavascriptroom.com)
179:Name_Not_Found
12/02/09 21:10:16.67
>>178
なるほど、jQueryのResizableプラグインというのがあるんですね。
プラグインの存在が分かり、なんとかなりそうです。
ありがとうございました。
180:Name_Not_Found
12/02/11 18:38:58.39 kyQRwaDT
Firefoxのユーザースタイルシートを使って、
Facebookのメインカラム部分のテキストだけ文字を大きくしたいんですが、
どう記述していいのかわかりません。
URLﾘﾝｸ(www.facebook.com)
@-moz-document domain("facebook.com") {
#contentArea.notesBlogText { font-size: 14px !important; }
}
これでもダメだし、いくつか色々試したんですがどれもダメでした。
どなたかお教え頂けますか。
181:Name_Not_Found
12/02/11 18:54:21.53
Firebugで調べられないの？
182:Name_Not_Found
12/02/11 19:05:50.73
>>181
できました！ありがとうございます
183:Name_Not_Found
12/02/12 13:45:38.24 /DiQ4ZFf
テスト
184:Name_Not_Found
12/02/12 13:52:40.81 /DiQ4ZFf
■iphoneの表示に関する質問です。
inputタグに強制的に角丸が付いてしまうのですが、
これを他のブラウザ同様に無くす方法はありますでしょうか。
※▼左側だけ直角にしたい
（android、chrome、iphoneシュミレーターでは効くが実機だけ無理）
<style>
.search {
/*background-color:#c70000;*/
border: solid 1px #000;
-moz-border-radius-topright:12px;-webkit-border-top-right-radius:12px;
-moz-border-radius-bottomright:12px;-webkit-border-bottom-right-radius:12px;
-webkit-appearance: none;
}
</style>
<input type="submit" class="search" value="検索する" />
よろしくお願いします
185:Name_Not_Found
12/02/12 19:51:50.71
左側を０にすれば？
186:Name_Not_Found
12/02/12 19:58:27.49
すっげー汚い書き方するのな。
187:Name_Not_Found
12/02/12 20:04:53.23
border : 1px solid #000 ;
border-radius : 0 12px 12px 0 ;
188:Name_Not_Found
12/02/13 15:05:13.95
border��styleがdottedなどの時、borderの隙間は、その要素のbackgroundか親要素のbackgroundで処理されるか規定されていますか？
189:Name_Not_Found
12/02/16 14:57:35.10
img { vertical-align: top; } を使って、画像の右側に上の辺から文字を書いているんだけど、
最後1行だけは画像の下の辺につけたいんだ。これってCSSで指定できますか？
■■■■■aaaaa
■■■■■bbbbbbbbbb
■画 像■
■■■■■
■■■■■cccc←これ
190:Name_Not_Found
12/02/16 17:00:15.19
>>189
imgをleftにfloatしてccccの入るBOXをclear:both;でどう？
<img src="hogehoge.jpg" style="float:left;">
<div>aaaaa<br>bbbbbbbbbb</div>
<div style="clear:both;">cccc</div>
191:Name_Not_Found
12/02/16 17:10:47.75
>>190
レスありがとう
ごめん最初に書いておけば良かった
clearしちゃうと画像の下辺の下にきちゃうんだ
■■■■■aaaaa
■■■■■bbbbbbbbbb
■画 像■
■■■■■
■■■■■
cccc←clear: both;
画像の右辺に配置して下辺について欲しいんだけど・・・うまくいかない
CSSで言うと cccc だけ img { vertical-align: bottom; } みたいな
テーブルでなんとかするか・・・？なるか・・・？
192:Name_Not_Found
12/02/16 17:30:20.89
>>189
同一のボックスに入ってる限り無理
193:Name_Not_Found
12/02/16 18:11:51.24
flexboxだ
194:Name_Not_Found
12/02/16 18:12:33.46
>>188はブラウザ依存かな
195:Name_Not_Found
12/02/16 18:23:28.74
>>191
absoluteでいいじゃん。
196:Name_Not_Found
12/02/16 18:30:54.74 imZpQH7R
htmlのソースがこのようになっていて
<li>
<span><a>日付</a></span>
<span><a>テキスト</a></span>
</li>
spanに対してdisplay:blockを指定して、日付とテキストを上下に配置されるようにしたのですが
この状態だと文章が終わった右側にもaの領域が広がってしまって悩んでいます
理想はdisplay:inlineを指定した時のように、文章の横幅ピッタリにaの領域が指定されるようにしたいのですが・・・
アドバイスをお願いします
197:Name_Not_Found
12/02/16 18:55:01.36
<dl>
<dt><a>日付</a><dt>
<dd><a>テキスト</a></dd>
</dl>
198:Name_Not_Found
12/02/16 19:30:51.20
>>197
返信ありがとうございます
ですがこのソースは変えないでcssで設定する方法でどうかお願いします・・・
199:Name_Not_Found
12/02/16 21:24:49.40
li > :nth-of-type(2):before{
content: "\A";
white-space: pre;
}
200:Name_Not_Found
12/02/16 23:26:25.56
>>199
返信ありがとうございます
なんだか本に無い式もありますが調べてやってみたいと思います
201:Name_Not_Found
12/02/17 02:02:21.55
>>191
画像の高さ固定でaaabbbとcccはBOX分けてもいいなら
こんな感じかねぇ。
<img src="hogehoge.jpg" style="float:left;height:100px;">
<div style="height:80px;">aaaaa<br>bbbbbbbbbb</div>
<div style="height:20px;line-height:20px;">cccc</div>
202:Name_Not_Found
12/02/17 02:11:15.88
>>196
試してみたけど、別にaの領域は広がらないけどなぁ。
aもdisplay:block;になってるんじゃまいか？
【CSS】
span {display:block;border:1px solid #000000;}
a {background-color:#DDDDDD;}
【HTML】
<ul>
<li>
<span><a href="#">日付</a></span>
<span><a href="#">テキスト</a></span>
</li>
</ul>
203:Name_Not_Found
12/02/17 06:19:20.42
ある要素に適用されるcssを無効にできないでしょうか
<span style='!important;'>spanに適用されてるcssを無効にしたい</span>
204:Name_Not_Found
12/02/17 06:53:28.06
<span <!-- style='!important;'--> >spanに適用されてるcssを無効にしたい</span>
205:Name_Not_Found
12/02/17 07:13:30.67
>>203
style属性に無効にしたい効果を書けばいいんじゃないの？
あるいはspanにidかclass振ってオーバーライドとか？
206:Name_Not_Found
12/02/17 07:56:10.52
地道に消すしかないんですね
ありがとうこざいましたたm(__)m
207:Name_Not_Found
12/02/17 10:05:56.77
そもそもCSSを無効なんて絶対にありえないし。
208:Name_Not_Found
12/02/17 12:11:30.65
何言ってるかわかんないし。
209:Name_Not_Found
12/02/17 14:51:01.25
javascript使えばできるが
210:Name_Not_Found
12/02/18 13:34:28.65
どうやるの
211:Name_Not_Found
12/02/18 15:29:42.93
無効はなかった。再セットだな。
212:Name_Not_Found
12/02/20 09:02:44.06
ブラウザの拡張機能入れれば出来るよ
213:Name_Not_Found
12/02/21 23:36:27.72
配色で
黒は高級感
赤は情熱
・
・
・
とかいって色を考えようとかいうのたまにあるけど
あれってただの占いみたいなもの？
それともちゃんとした科学的根拠あるの？
214:Name_Not_Found
12/02/22 00:15:24.96
>>213
CSSの質問をしてね
215:Name_Not_Found
12/02/22 00:36:35.37
やっぱりstyle無効あるわ。DHTML出できる
216:Name_Not_Found
12/02/22 07:34:36.32
>>196
display:block なんか使わず、ただ単に改行すればいいんじゃね？趣旨違ったらすまん。
217:Name_Not_Found
12/02/22 07:39:29.28
>>215
それ、予測するに一般的に推奨されないやり方なんじゃない？
218:Name_Not_Found
12/02/22 08:59:54.70
無効化って言ったら、新しい要素生成して、適用されているであろうプロパティのデフォルト値とってきて、styleにセットするしか
219:Name_Not_Found
12/02/22 15:11:46.19
カスケードスタイルシートだからな。
オーバーライトするか、大元の要素をセレクタで限定してスタイリングするしかない。
220:Name_Not_Found
12/02/22 17:03:15.75
カスケード→カスケーディング
オーバーライト→オーバーライド
221:Name_Not_Found
12/02/24 04:30:49.27
カスケード→カスタード
オーバーライト→オーバーヘッド
222:Name_Not_Found
12/02/24 05:07:56.99
>>217
URLﾘﾝｸ(msdn.microsoft.com)(v=vs.85).aspx ←英語
URLﾘﾝｸ(msdn.microsoft.com) ←日本語
これを使えば該当のstyleを削除したりできた。Chromeは使えた
該当のstyleを探すのが大変
223:Name_Not_Found
12/02/24 08:18:23.29
CSSにも三種あってな
制作者スタイルシートは無効化できるが、ユーザスタイルシート、デフォルトスタイルシートはJavaScriptから無効化できない
224:Name_Not_Found
12/02/24 08:23:56.69 bphrcSRC
max-heightについてなんですが、
横幅が50%固定の際、
高さを横幅に対して3/4で表示したいです。
うまい方法ないでしょうか・
225:Name_Not_Found
12/02/24 23:14:45.93
>>223
お前は正しいけど間違ってる
226:Name_Not_Found
12/02/24 23:16:19.29
>>224
37.5%
227:Name_Not_Found
12/02/24 23:48:43.46 bphrcSRC
>>226
横の%指定は効くみたいなんですけど、
縦の%指定は効いてくれません
本当にそれでできるんですか？
228:Name_Not_Found
12/02/25 00:10:23.93
>>226
アホは黙ってなよ
229:Name_Not_Found
12/02/25 01:08:03.87
Javascript使う
CSSはJavascriptを併用しないと縦横の比率を保ったままサイズ変更みたいなほんのちょっとだけでも計算が必要になると
とたんにややこしくなる。あまりにも表現力が貧弱すぎる。
230:Name_Not_Found
12/02/25 01:22:09.04
>>225
おまえが正しいのかわからないな
231:Name_Not_Found
12/02/25 01:47:45.03
>>229
そういうことでしたか。
正直、これぐらいはできてほしいものですが・・・。
納得しました。どうもです。
232:Name_Not_Found
12/02/28 10:49:18.50 1+TMryPg
質問です。
この状態から、内側の青いボックスを外側の赤いボックスのどまん中に
配置したいのですが、どうすればいいでしょうか。
外側のボックスに padding: 50px; と指定すると、なぜか外側のボックスが大きくなってしまいます。
position: absolute; はナシでお願いします。
<style>
#outer {
width: 200px;
height: 200px;
background-color: red;
}
#inner {
margin: 0;
width: 100px;
height: 100px;
background-color: blue;
}
</style>
<div id="outer">
<div id="inner"></div>
</div>
233:232
12/02/28 10:54:21.41 1+TMryPg
margin: 0; はゴミです。
いろいろ試していたときの残骸です。
よろしくお願いします。
234:Name_Not_Found
12/02/28 11:19:09.31
innerにmargin: auto;
235:Name_Not_Found
12/02/28 11:29:57.30
margin: auto; では横位置しかセンタリングできないか
position: absolute; が嫌なら relative; は？
236:232
12/02/28 11:33:16.80 1+TMryPg
>>235
position: relative;
top: 50px;
left: 50px;
ですね！
これは綺麗な書き方ですね。
ありがとうございました！！！
本当に助かりました。
237:Name_Not_Found
12/02/28 13:00:46.45
>>236
marginで設定しても同じなのでは…
238:232
12/02/28 13:35:11.02 1+TMryPg
>>237
#inner で margin: auto; や margin: 50px; とやると、
#inner が #outer の上辺に張り付いてしまうのです。
うまい方法がありましたら是非教えてください。
239:Name_Not_Found
12/02/28 14:18:20.49
>>238
innerに display:inline-block;margin-top:50px;*display:inline;*zoom:1;、outerにtext-align:center; でどうだろうか？
240:232
12/02/28 14:37:29.37 1+TMryPg
うまく動きましたが、高等過ぎて難しいのでだめです^^;
でも勉強になりました。
プロパティに*なんて付けられるんですね。
zoomも知りませんでした。
241:Name_Not_Found
12/02/28 15:14:04.56
プロパティに*はIE対策だったと思うが
242:Name_Not_Found
12/02/28 15:43:35.75
>>239
冗談もほどほどに
243:Name_Not_Found
12/02/28 23:38:11.67
>>232,238
「難しいのでダメです」ってどういう理屈だよ！って感じだけど。
URLﾘﾝｸ(jsfiddle.net)
244:232
12/02/29 01:29:57.59 5fbJwRRa
>>243
あ、なるほど。
これがpositionに頼らない王道のやり方ですね。
marginとpaddingを両方にしっかり指定するんですね。
どうもありがとうございました。
245:Name_Not_Found
12/02/29 10:15:43.46
見た目だけなら青いボックスに赤いボーダーを50pxのwidthでつければいいだけだな。
二つのブロックにすることに何らかの意味があるならこれじゃダメだけど
246:Name_Not_Found
12/02/29 19:40:10.61
横長と縦長が混じった画像群があります
この画像を1列に2枚ずつ、
長方形型の枠に極力空白を作らないよう、横幅いっぱいになるように表示したいと思います
横横だけなら50/50くらいのdivで区切れば問題ないのですが、
困るのが縦長と横長の組み合わせです
min-width:25%
max-width:60%
これで縦は左端に寄り、横は大きく表示され、
そこそこイメージ通りに表示されたものの、
ブラウザの横幅を変えると並ばなくなってしまったり、
今度は横横の組み合わせが横に並ばなくなってしまいます
なんとかこれを実現する方法はないでしょうか？
247:Name_Not_Found
12/02/29 21:16:34.37
その枠をinlineにするんじゃ駄目なのけ
248:Name_Not_Found
12/02/29 22:24:58.73
<ul>
<li></li>
<li></li>
(繰り返し)
<li></li>
</ul>
っていうリストがあった時に、
上から3つずつ順に右寄せ(float:right)するようなCSSって書けますか？
4番目の要素が1番目の要素の真下に来て、その左に5番目がっていうようにしたいです。
リストの内容は変化するので、どの順番で入っても入った順に並べたいです。
宜しくお願い致します。
249:Name_Not_Found
12/02/29 22:34:58.15
classやidつけちゃ駄目なら無理
250:Name_Not_Found
12/02/29 22:52:39.16
jQueryで簡単に実装できる
251:Name_Not_Found
12/02/29 23:03:17.79
>>248
:nth-child
252:Name_Not_Found
12/03/01 00:09:10.04 qA4Xm/gX
>>251の勝ちだな
253:252
12/03/01 00:09:56.08
test
254:Name_Not_Found
12/03/01 01:49:20.06
>>252
自演乙
255:Name_Not_Found
12/03/01 07:33:24.23
>>251
便利だよね。
IE6-8対策はどうしてる？
256:Name_Not_Found
12/03/01 19:18:22.24
レガシーブラウザ用のライブラリでも入れとけば
257:Name_Not_Found
12/03/01 22:43:21.48
>>256
IE9.js も selectivizr も、古いPCで表示してみるともっさり重かったんだよ。おすすめの方法知ってる人いたら教えてください。
258:Name_Not_Found
12/03/02 00:56:47.56
:first-childと+でも使えば
259:Name_Not_Found
12/03/02 08:19:53.48
>>255
JavaScriptでコード書けばいい
260:Name_Not_Found
12/03/02 13:55:42.57
古いIEなんぞ相手にしないが正解
261:248
12/03/03 20:12:40.53
ありがとうございます。
jsは無しでもできるんですね。
まだできてませんが頑張ってみます。
262:Name_Not_Found
12/03/07 16:59:20.49
わざわざ画像つかわなくてもCSSでいいようなものをいちいち画像にするメリットって何？
文字だけ書いた画像とか。
263:262
12/03/07 17:01:46.80
自己解決
264:Name_Not_Found
12/03/07 17:34:01.03 qwDE84iH
以下のように、<p>タグなかで<span>タグをcenterにもっていきたいのですがうまくいきません
<p>タグのなかで要素をcenterに持っていくにはどうすればいいでしょうか
<p><span style="text-align:center"> test <span></p>
265:Name_Not_Found
12/03/07 17:38:41.60
pで
266:Name_Not_Found
12/03/08 09:37:12.87
質問です
operaやsafariでのcssの挙動を確認したいのですがインストールしたくありません
様々なブラウザでのcssの挙動を確認できるシミュレーターとかありませんか?
267:Name_Not_Found
12/03/08 09:47:19.78
答えたくありません
268:Name_Not_Found
12/03/08 13:12:51.80
じゃあ答えんなカス
269:Name_Not_Found
12/03/08 14:31:35.94
あるわけねーじゃん。バカじゃねーの。
270:Name_Not_Found
12/03/08 14:48:23.69
Operaなら俺がSS撮ってやる
999,999,999,999,999\/1ページで
もしくは氏ね
271:Name_Not_Found
12/03/08 14:57:08.91
もしあったとしても、シュミレーターなんぞ入れるよりブラウザ入れるほうが
よっぽど要領も少ないし、日頃セキュリティ対策が必須のソフトなのだから被害も少ないと思うぞ。
272:Name_Not_Found
12/03/08 14:58:14.43
完璧なシミュレータなんぞ無いしね。
273:Name_Not_Found
12/03/08 16:16:15.84
質問です。ホームページを作ってるとかそういうのじゃないんですけど…
ブログのRSSを購読していて、ある文字列を含む記事を{display:none!important}で非表示にする場合はどのように記述すれば良いのでしょうか？
274:Name_Not_Found
12/03/08 16:22:03.72
CSSに文字列検索や条件分岐の仕組みはありません
JavaScriptとかでやってください
275:Name_Not_Found
12/03/08 16:24:03.34
かろうじて出来るといえば出来る。
nth-childとかで。
276:Name_Not_Found
12/03/08 16:26:50.67
>>274 そうなんですか…
>>275 くわしく教えてください
277:Name_Not_Found
12/03/08 16:30:19.84
今言った奴は擬似クラスっていうんだけどね。
偶数にあるものを変化させたりできるんだ。
例えば、とあるページに div.font12 が複数使われていてその内の何番目の記事を消したい。と
した場合。
.font:nth-child(2) { display: none!important; } これで上から二番目の記事を消すことができる。
他にも色々種類があるからココとか見てみてね。
URLﾘﾝｸ(zero.css-happylife.com)
278:Name_Not_Found
12/03/08 16:36:26.31
>>277
.item:nth-child(2) { display: none!important; } でできたのですが…
非表示にしたい記事が載っているサイトのタイトル等で、CSSを適応させるサイトを制限することはできませんか？
279:Name_Not_Found
12/03/08 16:37:43.45
CSS3って勧告まだだろ
280:Name_Not_Found
12/03/08 16:37:51.71
言ってる意味が半分わからないけどとりあえずCSSではこのレベルしかできないよ。とだけ言っておくね。
あとはJavaScriptに頼るしか無い
281:Name_Not_Found
12/03/08 16:38:30.57
>>279だから？
282:Name_Not_Found
12/03/08 16:39:17.24
CSS3セレクタは勧告されてるよ
283:Name_Not_Found
12/03/08 16:40:14.54
>>280
そうですか… ありがとうございましたm(_ _)m
284:Name_Not_Found
12/03/08 17:18:19.88
contentだかcontainみたいな疑似クラス無かったっけ
うろ覚えだが勧告前？に削除されたような記憶も
285:Name_Not_Found
12/03/08 17:20:32.27
それたぶんCSS4のほうじゃないか？
286:Name_Not_Found
12/03/08 17:28:31.59
URLﾘﾝｸ(suika.fam.cx)
:contains()疑似クラスは削除されたらしい
287:Name_Not_Found
12/03/08 17:32:28.19
これもだな。URLﾘﾝｸ(zng.info)
便利そうなのに廃案なったのか。
288:Name_Not_Found
12/03/09 01:43:46.92
>>282
そうだったのかすまん
289:Name_Not_Found
12/03/09 16:03:44.18
まあ理解できるまではHTMLもCSSもプログラミング言語かと勘違いする奴は多いよね
290:Name_Not_Found
12/03/11 08:29:54.96
コリスさんとこで紹介してたけど
URLﾘﾝｸ(cssizer.com)
291:Name_Not_Found
12/03/11 08:49:23.92
スクロールが効かない
292:Name_Not_Found
12/03/11 08:50:44.89
ほんとだ。
スクロール効かねぇ・・。
没
293:Name_Not_Found
12/03/12 00:23:23.13
てす
URLﾘﾝｸ(iup.2ch-library.com)
294:Name_Not_Found
12/03/12 00:25:21.88
失礼しました質問です
URLﾘﾝｸ(iup.2ch-library.com)
URLﾘﾝｸ(iup.2ch-library.com)
この２つをフレームで間なくつなげたいのですがなぜか幅が合いません
自分でみても分からないのですが何が間違ってるのか分かる方いましたらお願いします
295:Name_Not_Found
12/03/12 02:09:49.66
その前にその10年前みたいなHTMLをやめろよ
大文字小文字もダブルクォートもバラバラで気持ち悪いし
それが一番間違ってる
本題だけど、言ってる意味が全然分からないけどとりあえずマージンとパディングについて何も知らないのが原因じゃね
296:Name_Not_Found
12/03/12 02:41:55.75
まったくもって質問の意味がわからん。図での解説がないとエスパー質問だぞこれ
297:Name_Not_Found
12/03/12 02:59:25.55
失礼しました
タグは色んなＨＰからさがしてコピペしてるだけだったので直します
この下の表と上の表を同じ幅にしてフレームで表示したいのですがやり方が良く分かりません
>>295
マージンもパディングも知りませんでした
質問しといて申し訳ないんですが、そもそも最初から勉強しなおしてきた方がよさそうですね…
URLﾘﾝｸ(iup.2ch-library.com)
298:Name_Not_Found
12/03/12 03:02:15.70
はっきり言うけどコピペしてたら自分のためにならんぞ。
299:Name_Not_Found
12/03/12 06:33:03.72
別にいいだろ
300:Name_Not_Found
12/03/12 18:07:54.66
最初のうちは別にいいと思う
コピペしながらでもタグの意味を覚える気さえあれば
301:Name_Not_Found
12/03/12 19:07:25.24
意味も解らずJavaScriptコピったりしてたなー
302:Name_Not_Found
12/03/12 19:14:52.43
文化とは、コピペ＋α
303:Name_Not_Found
12/03/16 15:47:17.86
他板で質問したら、この板に誘導されました：
cssの編集に使うツールはどれが良いのでしょうか？
304:Name_Not_Found
12/03/16 16:30:26.04
オススメはIntypeかEmEditor+ZenCoding
EmEditorは有料だからその期間の間でしか使えない。
Intypeはまだ開発途上だけど結構優秀なエディタ。
いろんなプログラミング書くのにも使えるし予めスニペットが入ってる。（HTML5/CSS3は自分で入れるしかない）
あとはWebMatrixっていうMSが出してるWeb開発ツールかな。他にもまだあるけど今言った奴が自分の中ではダントツで使いやすかった。
305:Name_Not_Found
12/03/17 01:51:56.25
画像の中の特定の色を消すことってCSSで出来ますか。
306:Name_Not_Found
12/03/17 01:52:33.27
できません。
307:Name_Not_Found
12/03/17 01:55:16.86
>>306
はや。有難う、出来る方法は他にありますか。
308:Name_Not_Found
12/03/17 05:40:20.79
>>307
変えたい箇所全てにクラスを設定するしかないわ。
309:Name_Not_Found
12/03/17 06:18:36.55
>>305,307
CSSは魔法じゃないからね、そういうのはPhotoShop等画像加工ソフトの役目だね。
310:Name_Not_Found
12/03/17 08:52:35.69
>>307
>>308にそのクラスを書いて貰えば ?
311:Name_Not_Found
12/03/17 18:45:06.66
そのうちCSSだけでも出来るようになるけどな
312:Name_Not_Found
12/03/17 18:53:30.39
それMozillaの幹部が提案した案じゃなかったっけ？
313:Name_Not_Found
12/03/17 19:29:51.23
どうしてもCSSでやりたいなら、特定の色で塗ったBOXの中に、特定の色部分を透明にした画像を置けば良し
314:Name_Not_Found
12/03/18 16:34:29.66 QR3pKxtP
ブラウザの幅にあわせて
spanタグ単位で改行させたい場合どのようにすればいいでしょうか
<span >word1 word2</span> <span >word3</span> <span >word4 word5</span>
315:Name_Not_Found
12/03/18 16:47:42.69
>>303
F12
316:Name_Not_Found
12/03/18 16:56:45.74
>>314
span {
white-space:nowrap;
}
317:Name_Not_Found
12/03/18 17:01:29.84
ｗｗｗ
318:Name_Not_Found
12/03/18 17:38:58.18 QR3pKxtP
>>316 ありがとうございました
319:Name_Not_Found
12/03/18 21:25:47.81
初歩的な質問ですがお願いします。
ブログにて設定を変えるため、cssをいじっています。
現状は3カラムで、順番がコンテンツ、左メニュー、右メニューとなっています。
中を見ると、float:leftで上記の順番に並べられているようでした。
これを左メニュー、コンテンツ、右メニューに並べ替えたいのですが、
こ入れ替えるための方法は
・htmlでソースの順番を入れ替える
・float:rightを利用
以外に方法がありますでしょうか。
htmlがブログ設定画面内だとコンテンツごとに点在しており見つけづらかったので・・。
320:Name_Not_Found
12/03/18 22:38:42.56
box-ordinal-group
321:Name_Not_Found
12/03/18 22:59:39.03
>>320
実用としてはまだだろ
322:Name_Not_Found
12/03/19 01:08:07.96
あぶそりゅーと☆
323:Name_Not_Found
12/03/19 10:02:22.27
魔法少女 まーじん☆ゼロか
324:Name_Not_Found
12/03/19 18:01:01.30
電子戦隊 クロスブラウザー
325:Name_Not_Found
12/03/19 18:54:53.10
>>319
左メニューにfloat:left; 右メニューにfloat:right; で
なんであかんの？
326:Name_Not_Found
12/03/19 19:01:38.75
あ、ごめん、勘違い。
順番そのままで コンテンツと左メニューをdivで括って、右メニューをfloat:right;、
divの中でコンテンツをfloat:right; かな。
327:Name_Not_Found
12/03/19 20:29:53.66
Font/Zero
328:Name_Not_Found
12/03/19 20:54:36.29
>>327
#DIV/0!
329:Name_Not_Found
12/03/19 21:20:12.21
ボックスについて教えてください。
ボックスの中にボックスを作りたいのですが、やり方が間違っているようでうまくいきません。
CSS
div.out{
border:1px solid #333;
width:300px;
height:300px;
}
div.in{
border:1px solid #333;
width:150px;
height:150px;
position:relative;
right:10px;
}
HTML
<div class="out">
<div class="in">
</div>
</div>
ボックスoutの中の右にinを持ってきたいのですが、ブラウザで表示してみると
ボックスoutから、左に10pxはみ出して表示されます。
どうしたらいいでしょうか？
330:Name_Not_Found
12/03/19 22:49:53.62
position:relativeの使い方についてちゃんと調べて来な
あと、実際のソースは違うのかもしれんが、挙動のテストで中身のないボックスを作るのはやめとけ
331:Name_Not_Found
12/03/20 16:21:03.34
right:10px;
ってなに？
332:Name_Not_Found
12/03/20 16:24:56.23
えっ
333:Name_Not_Found
12/03/20 20:34:06.91
FORMの中に別のFORMが入っちゃうようなデザインのとき
どうしたらいいですかね
FORMの中のFORMはただのボタンなので、BUTTONにして
ACTIONはJavaScriptにやらせた方がいいですかね
334:Name_Not_Found
12/03/20 20:34:39.73
うおおここCSSスレだ間違えた
違うところで聞いてきます
335:Name_Not_Found
12/03/20 21:10:43.62 KJ5Ib4Ny
>>329 簡単な方法は、padding-leftで10px押せw
でもなんか違う！ 要は、div.inの150pxは別に変えなくても
そのまま300pxのままでできる方法があったような・・・
336:Name_Not_Found
12/03/20 21:38:17.06 KJ5Ib4Ny
>>329 div.outの中に margin 0 padding 50px
div.inの中に mardin 0 padding 0
そして、div.inは、width:300px; height:300px;
position:relativeはいらない。
それでやってみろ！ もしダメなら、
border:1px solid #333 もそれぞれ消してやってみた・・・！
337:Name_Not_Found
12/03/20 22:28:18.46
古いIEは確かmarginかpaddingにバグがあったはずだよ。
IEのバージョンは？
338:Name_Not_Found
12/03/20 22:31:10.40
とりあえずこういうのもある。
URLﾘﾝｸ(smkn.xsrv.jp)
339:Name_Not_Found
12/03/21 11:03:22.70
ありがとうございます、解決しました。
340:Name_Not_Found
12/03/23 02:29:14.30
□ -
- □
□ -
うまくかけなくてすみません、
↑のような見た目で実際は-の場所に□が来て、
左と右で丁度画像の縦半分ずつずれるよな配置できればいいと思うのだけど、
なにか良いやり方あるでしょうか？
341:Name_Not_Found
12/03/23 02:31:42.96
□□
□□ これの右側を縦半個分ずらしたようなイメージです。
□
342:Name_Not_Found
12/03/23 04:12:00.23
>>340
□ -
- □
□ -
＞↑のような見た目で実際は-の場所に□が来て、
□□
□□
□□
＞左と右で丁度画像の縦半分ずつずれるよな配置
□ □
□ □
□ □
？？？
>>341
□□
□□
□
＞これの右側を縦半個分ずらしたようなイメージです。
□ □
□ □
□
こう？
343:Name_Not_Found
12/03/23 04:16:02.31
┌┐
└┘
┌┐
└┘
┌┐
└┘
┌┐
└┘
こうか？
344:Name_Not_Found
12/03/23 04:55:36.10
質問者の文がどうみてもエスパーにしか見えん。
日本語で頼むよ。
もしくはそのアイデアが乗ってるサイトかAAじゃなく画像で質問してくれ。
345:Name_Not_Found
12/03/23 05:42:13.30
┏┓
┗┛┏┓
┏┓┗┛
┗┛┏┓
┏┓┗┛
┗┛
おれは普通にこういうことだと理解した。
346:Name_Not_Found
12/03/23 07:59:24.08
┌─┐
│ │┌─┐
└─┘│ │
┌─┐└─┘
│ │┌─┐
└─┘│ │
┌─┐└─┘
│ │
└─┘
こうでしょ
347:Name_Not_Found
12/03/23 08:02:11.91
│ │
│ │┌─┐
└─┘│ │
┌─┐│ │
│ │└─┘
│ │┌─┐
└─┘│ │
┌─┐│ │
│ │└─┘
│ │
└─┘
違った、こうだった
348:Name_Not_Found
12/03/23 08:13:20.44
もしこれだとしたら、たんにズラス分のスペースを空ければいいだけ、absoluteでもOK
349:Name_Not_Found
12/03/23 08:17:00.97
まぁボックスを好きなところに配置したいならabsolute安定だよな
350:Name_Not_Found
12/03/23 08:45:51.97
┌┐
│├┐
├┤│
│├┤
├┤│
│├┘
└┘
本当に正確なのはこうだろ
351:Name_Not_Found
12/03/23 09:45:13.01
質問者しっかりしろ
352:Name_Not_Found
12/03/23 13:39:21.59
ﾜﾛﾀ
353:Name_Not_Found
12/03/23 13:56:20.15
tableかpositionだよなぁ・・・
354:Name_Not_Found
12/03/23 13:57:45.38
>>342>>352
す、すみません
書き方が悪かったせいで混乱させてしまったようです
自分が望んでいたのは>>345-347 >>350のようなのがまさにそうでした
アドバイスしてもらったやり方で今日中に試してみたいと思います
ありがとうございます
355:Name_Not_Found
12/03/23 18:58:41.23
縦割りして一番上だけマージンで調整したほうが楽じゃないか？
356:Name_Not_Found
12/03/23 19:38:47.18
nth-child nth-of-type があるから古いブラウザに対応させる以外の目的ではTableは要らないだろ
>>355
右上にコンテンツの有無、どういうコンテンツかで全然変わるね。
357:Name_Not_Found
12/03/23 19:42:31.32
対応してるブラウザまだないけどboxでも一応
358:Name_Not_Found
12/03/23 19:44:58.49
右だけマージンでいいんじゃないの
359:Name_Not_Found
12/03/23 20:01:53.10
一列になってるのをジグザグにしたいんじゃないの
360:Name_Not_Found
12/03/23 23:40:36.30
ＩＥ８ってhover使えないの？
div:hover {
border:1px solid #e0e;
}
firefoxだとちゃんとなってるけどＩＥだと全く反映されない。
361:341
12/03/23 23:51:13.42 jGmYUoMv
>>355-359
えーと、左右に分割しまして、
左はそのまま、右の頭に空気入れました。
微調整することで希望通りのデザインにはなるのですが、
ウィンドウのサイズを変えると、どんどんずれていってしまいます。
空白の縦幅も相対値にすることってできるんでしょうか？
362:Name_Not_Found
12/03/23 23:51:46.75
>>360
再現するソース
URLﾘﾝｸ(jsfiddle.net)
363:361
12/03/24 00:29:47.13
縦幅半分の透過gif用意して頭に置きました
こんなんでもいいんでしょうか。。
364:Name_Not_Found
12/03/24 00:46:10.35
それは邪道だろ
365:Name_Not_Found
12/03/24 01:31:53.49
<link rel="stylesheet" type="text/css"> <style type="text/css">
<!--
div.auto{border:0px solid #e0e; overflow:visible;width:450;}
div.a {border:1px solid #e0e; width:200px;height:200px;float:left;}
div.b {border:1px solid #e0e; width:200px;height:200px;
float:left;margin-top:100px; /* 縦幅はここを調整*/position:relative;}
div.clear{clear:left; }
-->
</style>
<body>
<div class="auto">
<div class="a">
</div>
<div class="b">
</div>
<div class="clear"></div>
<div class="a">
</div>
<div class="b">
</div>
<div class="clear"></div>
<div class="a">
</div>
<div class="b">
</div>
<div class="clear"></div>
</div>
・・・繰り返し。
</body>
色々やってたら凄く変なソースになった。
やり方とかあってるのかは知るわけない。
366:Name_Not_Found
12/03/24 12:32:42.86
やっぱり「縦幅」って一般的言い回しなのか
老いを感じるわ
>>360
URLﾘﾝｸ(www.google.com)
367:Name_Not_Found
12/03/24 12:35:12.41
いや一般的ではないｗ
368:Name_Not_Found
12/03/24 12:36:21.84
可変する文章の最後にバックグランドイメージで画像を表示させたい場合どうすればいいでしょうか？
369:Name_Not_Found
12/03/24 12:56:59.44
background-position
370:Name_Not_Found
12/03/24 13:02:13.03
backgroud-positionで具体的にどのような値を指定すればいいのでしょうか？
371:Name_Not_Found
12/03/24 13:17:30.58
ぐぐれよ
372:Name_Not_Found
12/03/24 15:37:06.37
>>365
親切にどうもありがたう
373:Name_Not_Found
12/03/24 17:20:29.17
>>368
どうしても「背景画像」じゃなきゃいけない理由がないならafter疑似要素でできるよ
after疑似要素については>>371
374:Name_Not_Found
12/03/24 23:59:50.04
>>371
教えてくれよ
375:Name_Not_Found
12/03/25 10:03:59.09
>>374
知らないからググれって言ってるんだよ
376:Name_Not_Found
12/03/25 15:02:04.00
>>375
もう来ねえよ
377:Name_Not_Found
12/03/25 19:21:13.97
ふんとに ?
378:Name_Not_Found
12/03/25 21:48:05.90
もう来ねえって言ってんだろ
379:Name_Not_Found
12/03/25 22:15:22.96
もう来ねえと言って又来る法則
380:Name_Not_Found
12/03/25 23:13:02.01
知ってるけど教えないんだよ。
擬似要素 afterでぐぐればすぐでてくるのに･･
最近のやつって検索能力すら持ち合わせてないのか
381:Name_Not_Found
12/03/25 23:14:35.98
持ってたらこねーよ
382:Name_Not_Found
12/03/26 05:28:13.47
>>380
教える能力もないくせに偉そうなことをw
383:Name_Not_Found
12/03/26 06:14:55.42
>>382
いい加減寝ろよバカ
384:Name_Not_Found
12/03/26 14:49:38.26
ふんとに ?
385:Name_Not_Found
12/03/26 15:04:05.24
>>382
人から教わらないと学ばないダメ人間か
386:Name_Not_Found
12/03/26 16:59:33.56
おいおい今はafterについてじゃなくて>>369だろ？
自動で文章の最後にだったらbackground-positionじゃ無理
通常ならafterでOKだろけど
バックグラウンドで表示したい理由でもあるんじゃない？
例えば最後ちょっと重ねたいとか。。。
387:Name_Not_Found
12/03/26 17:04:10.06
ブログの文章の最後に絵文字入れられるってのを再現したいだけなのかな
388:Name_Not_Found
12/03/27 19:24:37.49
隣接セレクタ E > F はEの直下であるFについて指定してますけど
『Fであるような要素』を子に持つEを指定したいときはどうすればいいんですか
<div class="E">
<div type="F"></div>
</div>
<div class="E">
<div type="G"></div>
</div>
こんなかんじの
389:Name_Not_Found
12/03/27 19:46:02.46
たぶんないと思う。
子要素を基準に親要素をどうこうしなければいけない時点で文書構造を見直した方がいいのでは。
390:Name_Not_Found
12/03/27 19:58:04.05
ユーザースタイルでいじりたいから文書構造はいじれないんです
大人しくPHP突っ込んでくるか……
391:Name_Not_Found
12/03/27 20:06:01.45
>>388
CSS3までは不可能です。
CSS4で案は出ています。
ユーザJSを使ってみては？
392:Name_Not_Found
12/03/27 20:24:27.81
>>391
ありがとうございます
CSS4を頼りにググッたらでてきました
URLﾘﾝｸ(demo.idered.pl)
393:Name_Not_Found
12/03/27 20:43:16.28
こんなのあるのか、興味深い。CSS3セレクタもまだ覚えきれてないけど。
394:Name_Not_Found
12/03/28 15:42:57.81
これセレクタの語尾に!つけたら否定して次のセレクタを探しに行くってやつなのかな？
395:Name_Not_Found
12/03/28 17:03:10.80
$Element とか ?Element って Element! に修正されたのか
URLﾘﾝｸ(dev.w3.org)
396:Name_Not_Found
12/03/28 18:11:47.98
ん？[class$=Element]のことでなくて？
397:Name_Not_Found
12/03/28 18:13:08.84
あ、ごめん。完全に別物なのね
398:Name_Not_Found
12/03/29 18:04:15.25
PIEで背景画像を2種類配置したいんですけど
どうにもIEに反映されてくれません
CSSに
body{
background-image:url(A), url(B);
background-repeat:repeat-x, repeat;
background-attachment:fixed;
-pie-background:
url("A") repeat-x top left,
url("B") repeat;
behavior: url("/PIE.htc");
}
こんな感じで記述してるんですが間違いですか？
まったくわからなくて頭がスポンジになりそうです…
399:Name_Not_Found
12/03/29 19:17:19.85
PIE.jsは、複数背景は対応してない。以上。
400:Name_Not_Found
12/03/29 19:27:26.71
url("A") repeat
url("B") repeat
url("C") repeat
かわいい
401:398
12/03/29 19:56:57.63
>>399
そうなんですか？
調べて見るとCSS3の話題で各所に出てくるのですが
それとはまた違うのでしょうか？
402:Name_Not_Found
12/03/29 20:05:45.99
>>401
対応してるのが限られてる。ドキュメント読んでみそ
403:398
12/03/29 20:20:03.63
>>402
すみません…
ちょっとドキュメントがよくわからないんですが
URLﾘﾝｸ(www.nandani.sakura.ne.jp)
こういった記事が間違っているということでしょうか…
初心者で申し訳ないです…
404:Name_Not_Found
12/03/30 08:10:31.19
全角スペース混じってるからでないの
405:Name_Not_Found
12/03/30 08:35:43.63
それとドキュメントと言われたら原則として公式
406:398
12/03/30 17:25:03.25
全角スペースを半角にして念のためPIE.jsでも試してみましたが
効果がありませんでした…
ドキュメント＝公式なのですね
ありがとうございます
407:398
12/03/30 17:28:04.33
あ、それとposition:relative;も追加してみましたがやはり変化なしでした
パスは間違っていないと思うのですが…
何かと相殺？していたりするのでしょうか
408:398
12/03/30 18:17:41.85
連投すみません
結局PIEを使わずに背景を複数配置できる方法を見つけたので
そちらを使うことにしました…
早くIEがCSS3に対応してくれることを願います…
ありがとうございました
409:Name_Not_Found
12/03/30 18:20:44.37
それ以前に使う側の問題がな・・・
410:Name_Not_Found
12/03/30 18:26:58.78
ただ単純に画像の階層間違えてるだけじゃないの？
411:Name_Not_Found
12/03/30 18:56:42.32
公式見たけど、PIEで複数背景対してるぞ。
412:Name_Not_Found
12/03/31 15:54:44.93
tableのtd,thのborder部分に画像を使いたいのですが、そういうことは可能でしょうか？
413:Name_Not_Found
12/03/31 16:19:57.41
tableに拘らなければいくらでも可能。
414:Name_Not_Found
12/04/02 07:46:14.92
borderに画像とか鬱陶しいだけなんで
415:Name_Not_Found
12/04/05 06:52:26.37
おまいらがいつも参考にしてるサイトってある？
とりあえずかちびととコリスはいつみてもいい情報があって重宝してる
416:Name_Not_Found
12/04/05 06:59:30.50
じゅ・・・重宝
417:Name_Not_Found
12/04/05 07:19:32.95
えっ ネタだよな
418:Name_Not_Found
12/04/05 09:02:57.72
>>415
宣伝乙
419:Name_Not_Found
12/04/05 09:19:59.38
宣伝乙もなにも。
WEBクリエイターボックス並に有名なサイトなのに何言ってるの
420:Name_Not_Found
12/04/05 09:22:25.18
>>419
自演乙
421:Name_Not_Found
12/04/05 09:27:38.13
まぁいつもの流れ出し構おう。大御所がこんなとこ見るわけないから
422:Name_Not_Found
12/04/05 10:27:13.27
>>421
信者乙
でも見てると思うｗ
423:Name_Not_Found
12/04/05 10:30:30.81
そういう人って大抵海外のクリエイターのブログかなんかみて情報収集してるくらいで初心者が情報求める場にはさすがに来ないんじゃないの。
教えるくらいなら書籍出してるからそれ見ろって言うだろうし。西畑とか。
424:Name_Not_Found
12/04/05 10:31:24.04
そもそも名前も聞いたことないんだが
大御所とか有名とか行ってんのマジ本人か信者じゃねーの
425:Name_Not_Found
12/04/05 10:32:09.01
とりあえず全員スレチ
426:Name_Not_Found
12/04/05 10:34:57.30
>>419>>421>>423
必死すぎﾜﾛﾀ
427:Name_Not_Found
12/04/05 10:38:44.94
>>424
さすがにWEBクリエイターボックスとコリスくらいは知ってるだろ？
日本でHTMLとCSSやってたら普通は目に付くサイトだとは思うが。
428:Name_Not_Found
12/04/05 10:41:19.50
>>427
いいから巣にお帰り
429:Name_Not_Found
12/04/05 10:41:36.65
どこだよ巣って
430:Name_Not_Found
12/04/05 10:45:08.05
おすすめ書籍教えて→◯◯が参考になっていいよ→宣伝乙
おすすめの参考サイトおしえて→◯◯のリファレンスサイトいくと勉強なるよ→TAG index と とほほ 以外は宣伝乙
おまえらの参考にしてるサイトどこ？→同上→宣伝乙
ワンパターンすぎだろ。何年このパターン続けるつもりだ
431:Name_Not_Found
12/04/05 15:49:00.90
わかったわかった
432:Name_Not_Found
12/04/05 16:28:51.89
┐(´д`)┌
433:Name_Not_Found
12/04/05 17:08:50.98
E1~*:not(E2:nth-of-type(n)) とかって、書けない？
E1以降の要素全部だけど、n番目のE2だけは除外、みたいな。
読んでるけどよく分かんない。
URLﾘﾝｸ(www.w3.org)
434:Name_Not_Found
12/04/05 17:10:07.66
オレも知らない
サイトは勿論見てるかもしれないけど、サイトの名称も管理人も知らんし
435:Name_Not_Found
12/04/05 17:11:52.35
いつかはCSS3もCSS5とかになってJavascriptと並走できるくらいまでになっちゃうんだろうか
436:Name_Not_Found
12/04/05 18:16:58.05
ならないでしょ。役割が違う
437:Name_Not_Found
12/04/05 20:13:53.01
>>433
URLﾘﾝｸ(myakura.github.com)
438:Name_Not_Found
12/04/05 20:15:51.53
お、できるっぽいじゃん。
でもCSS4本格対応いつからしてくれるんだろうか。（FF、Chrome）
439:Name_Not_Found
12/04/05 20:18:24.41
つーか対応以前
440:Name_Not_Found
12/04/07 14:39:30.75
zenbackの幅を狭くしたいんだけどうまくいきません
CSSに、
.zenback { width:400px; }
と書いても変わらないんですが
どうしたらいいんでしょう。
Fc2ブログなんですが
441:Name_Not_Found
12/04/07 14:44:13.22
!importantをつけてみなされ
442:Name_Not_Found
12/04/07 19:27:23.09
.zenback { width:400px !important;
}
としてみましたが変わりませんでした。
Fc2ブログだとダメなんですかね…
443:Name_Not_Found
12/04/07 22:31:46.66
それはブログ板のが詳しい
444:Name_Not_Found
12/04/11 01:16:57.79
CSS Variables Module Level 1 Draft Published
とうとうｷﾀｺﾚ
445:Name_Not_Found
12/04/11 01:23:28.00
お？URLｋｗｓｋ
446:Name_Not_Found
12/04/11 01:24:49.41
URLﾘﾝｸ(www.w3.org)
ほれ
447:Name_Not_Found
12/04/11 22:56:56.96
ページ番号使えるようになったん？
448:Name_Not_Found
12/04/12 06:36:18.85
あるcssファイルで
input, textarea, select { width: 210px }
と指定されてあります（このファイルには手を加えられないとします）。
この指定を、別のcssファイルで無効にして、あたかもwidthが指定されてないようにすることはできますか。
input, textarea, select { width: undefined }
とやってみましたがだめなようです。
449:Name_Not_Found
12/04/12 08:17:52.63
>>448
無効には出来ません。上書き出来るだけです。
各要素の初期値で上書きすればデフォルトスタイルシートに戻すことは可能です。
450:Name_Not_Found
12/04/12 08:20:34.61
>>448
widthの初期値はundefinedじゃなくてauto
451:Name_Not_Found
12/04/12 10:46:22.64
!important指定されてたら無理じゃね？
!importantって2重に指定したら後ろのだけ有効になるんだっけ
452:Name_Not_Found
12/04/12 11:00:07.07
サイトのCSSとユーザーCSSの両方でｲﾝﾎﾟ指定すると
ユーザーCSSのほうが優先されるよ
453:Name_Not_Found
12/04/12 12:51:42.87
おまえらのデザインしたサイトとかあったらSSみせてくれ。
ぜひとも参考にしたい
454:Name_Not_Found
12/04/12 14:01:41.08
人にそんな要求するなら、まずは自分が晒すことだJK
455:453
12/04/12 14:19:58.93
>>454
URLﾘﾝｸ(i.imgur.com)
ごめんね。HTML8年くらいやっててこんなデザインしかできないんだ。死にたい。
海外とかのサイトでデザインとか何十種類も見てるはずなのにね。何やってんだろ
456:453
12/04/12 14:24:48.48
一応こっちも晒す
URLﾘﾝｸ(dl.dropbox.com)
地味にMENUのとこにCSS3使ってるだけ。あとは特になし
457:Name_Not_Found
12/04/12 14:29:33.68
リセットCSSのファイル名がbase.cssってのが個人的に気に入らん
458:453
12/04/12 14:32:20.98
base.css→default.cssて名前にしてたのになーって思ったらローカルの話だった。
直しとこう
459:Name_Not_Found
12/04/12 14:37:42.45
>>457
そこはどうでもいいだろｗ
460:Name_Not_Found
12/04/12 14:42:06.46
さて、454のも見てみたいんだけども
461:Name_Not_Found
12/04/12 15:46:45.47
>>451
それ最近まで逆だと思っててはまった
462:Name_Not_Found
12/04/13 18:27:11.29
max-widthで質問です
ウィンドウの幅が狭まったとき
画像を自動的に縮小させたいので
img { max-width: 100%; }
とやってます
問題なく動作してますが
画像を表の中に置いたときは
なぜか縮小されません
(表だけならウィンドウの幅にあわせて
縮小されてます)
何か根本的に勘違いしてますか？
463:Name_Not_Found
12/04/13 18:34:31.62
パーセンテージは親要素からの計算だからねえ
テーブルは中に画像があると最低限画像幅は確保したセルを形成するから
そこから100%じゃ当然縮小されない
464:Name_Not_Found
12/04/13 20:17:28.58
>>463
なるほど確かにそうですね
そうするとtableだけでなく
tdの幅もmax-widthで調整すれば
いいのかと思いきや
ここをどういじっても
中のimgの幅のほうが優先されました
td img { max-width: ボディに対して 100%; }
なんてできればいいんですが・・・
cssは任意の要素に対しての値って
得られないみたいですね
困りました
465:Name_Not_Found
12/04/13 21:18:02.01
あ、すいません
いいアイディア浮かんだので
とりあえず解決にしておきます
thxでした
466:Name_Not_Found
12/04/13 21:20:29.86
そのアイディアはここに書かないのか
467:Name_Not_Found
12/04/14 13:14:58.87
>>466
アイデア乞食？
468:Name_Not_Found
12/04/15 12:04:45.70 KYeQyQmV
←───コンテンツの幅───→
←─ボックスの幅─→
←──ウィンドウ幅──→
ボックスにoverflow-x: scroll してコンテンツがボックスから
はみ出さないようにしても本来のコンテンツ幅がウィンドウ幅より
大きかったらウィンドウにスクロールバーが出るんだが
そういうもん？
469:Name_Not_Found
12/04/15 12:11:14.85
overflow: auto; にすれば
470:Name_Not_Found
12/04/15 14:44:29.91 KYeQyQmV
overflow: auto; にすればスクロールバーが出ないってこと？
471:Name_Not_Found
12/04/15 15:07:13.89
scroll だからスクロールバーが出るのは当たり前
オーバーフローしても何もしたくないなら、hidden
472:Name_Not_Found
12/04/15 15:09:54.03
ごめん勘違い
関係ないけど、overflowにxとかyとかの指定はIEオンリーだから使わないほうが良いのでは？
473:Name_Not_Found
12/04/15 15:13:07.49
CSS3からはoverflowに対してxとyの指定はできるようになったよ と一応
474:Name_Not_Found
12/04/15 15:19:36.61
あそうなの？重ね重ねスマン。
475:Name_Not_Found
12/04/15 20:24:52.40
>>468
>>362
476:Name_Not_Found
12/04/19 07:27:41.33
5分でわかるCSSグラフィック
URLﾘﾝｸ(www.atmarkit.co.jp)
477:Name_Not_Found
12/04/19 20:38:35.92 c8/4+T0O
画面幅に合わせて単語単位で改行させたいのですがどのようにすればいいでしょうか
以下の状態で、word4の途中で画面幅の場合
word1 word2 word3 word4 word5
⬇
word1 word2 word3
word4 word5
478:Name_Not_Found
12/04/19 21:53:47.35
CSS関係なくそれだったらそうなると思うが
日本語の話？
479:Name_Not_Found
12/04/20 02:08:16.69
>>477
画面のサイズ指定してる？
480:初心者です
12/04/20 12:47:56.12 cmpLk9pA
jugemの無料サービスを使ってブログに初挑戦中です。
公式テンプレートをカスタマイズしたいです。
管理者ページに表示されるHTMLとCSSのプログラムをプリントアウトして
（↑こうしておけば自分で散々いじって訳わからなくなったあともそれを見て直していけば
とりあえず初期状態に直せるかなと…）
それを見て font color とか image とかの指示からなんとなく推測して色を変えたり
サイズ変更したりして プレビューで確認しながらやってます。
それでもわからないことだらけなのでCSSを勉強しようと近所の本屋に行ってみたんですが
そういう内容の本はありませんでした。
こちらはCSS初心者のスレッドということですが、このレベルの初心者の相談に乗っていただけるでしょうか？
もしスレッド違いであればその旨ご指摘ください。
481:Name_Not_Found
12/04/20 12:51:13.44
>>480
ここでもいいとは思うが
Webサイト制作初心者用質問スレ part229
ｽﾚﾘﾝｸ(hp板)
↑の>>2の参考サイトで基礎を勉強するのが一番いいよ
本は正直嘘というか間違いが多いというか
あとプリントアウトなんかしなくてもソース保存しとけばいいだけなんで
そういうPCの基礎的なところは・・・板自体違う気がするがどこだかわからん、すまんね
482:初心者です
12/04/20 14:15:23.87 cmpLk9pA
早速の回答ありがとうございます。
教えていただいた板の方覗いてみますね♪
このさいなんで基礎からいろいろ勉強してみようと思います。
483:Name_Not_Found
12/04/20 19:36:09.84
URLﾘﾝｸ(kruz-graphix.com)
CSSでアコーディオンメニューを作りたいのですが、クリックして開閉できるようにしたいと思っています。
このソースのどこをどう直せば良いのか教えて下さい。
484:Name_Not_Found
12/04/20 20:02:02.28
依頼するスレとかに行けば？
485:Name_Not_Found
12/04/20 20:07:20.84
マジレスすると現状のCSSでクリック判定出すのは :target しかない
それ以外はjavascript使う。
てことで誘導
+ JavaScript の質問用スレッド vol.99 +
ｽﾚﾘﾝｸ(hp板)
486:Name_Not_Found
12/04/20 21:50:07.30
>>484-485
ありがとうございます
行ってきます