[過去ﾛｸﾞ] HTML/CSS のどんな質問にも優しく答えるｽﾚ 52 (1002ﾚｽ)
上下前次1-新
このｽﾚｯﾄﾞは過去ﾛｸﾞ倉庫に格納されています｡
次ｽﾚ検索 歴削→次ｽﾚ 栞削→次ｽﾚ 過去ﾛｸﾞﾒﾆｭｰ
126: 2023/09/10(日)05:50 ID:??? AAS
>>124
PC時は
左に画像、右に見出しとリード
SP時は
上から
見出し、画像、リード
これのためだけにgrid使ってる
127(1): 2023/09/12(火)13:16 ID:ZyApT9EM(1) AAS
チェックボックスを用いてフィルタリングが出来るフォームを作ろうとしています。
□全部 □円形 □四角形 □青色 □緑色
とチェックボックスが並んでおり、その下には
丸くて青色・四角くて青色・丸くて緑色・四角くて緑色
・・・のオブジェクトが並んでいて、チェックボックスにチェックを入れる事で該当のオブジェクト以外がhiddenになるようなイメージです。
実装自体は出来そうなのですが、挙動をどうするかで悩んでおりアドバイスを頂きたいです。
例えば「円形」「四角形」
の両方にチェックを入れた時、挙動としては
（１）円形かつ四角形のオブジェクトを可視化
（２）円形のオブジェクトと四角形のオブジェクト、および円形かつ四角形のオブジェクトを可視化
省2
128: 2023/09/12(火)14:47 ID:??? AAS
自分は2
129: 2023/09/12(火)14:52 ID:??? AAS
個人的には2だが逆の人いるんだよな
orかandかのラジオボタンも作っちゃえば
130: 2023/09/12(火)17:22 ID:??? AAS
>>127
俺も 2
131: 2023/09/12(火)19:02 ID:??? AAS
自分は1
hiddenにしていくなら1が自然だと思う
絞り込み検索って書いておいてくれるとなお嬉しい感じ
2の挙動は初期状態が表示件数ゼロで項目を足していく時に使うのが自然に感じる
132(6): 2023/09/14(木)13:06 ID:aPP30ZSe(1) AAS
tableの作り方で質問です。
こんなテーブルを作ろうと思っています。
a: colspan=2
b: colspan=2
c: colspan=4
d: 指定不要
e: colspan=2
f: 指定不要
とすればよいと思うのですが、
テーブル全体の幅やeとfの中身のテキスト量にかかわらず
省8
133: 2023/09/14(木)13:48 ID:??? AAS
dが固定ならefはcalc使えばよさそうだけど
tableだとダメとかあるんかな
134: 2023/09/14(木)14:04 ID:??? AAS
>>132
<col>を用意してそれにwidthを指定したらよいのでは
135(1): 132 2023/09/14(木)15:05 ID:??? AAS
colタグの存在を初めて知りました。
calcを用いた指定と合わせて試してみたのですが、やり方や考え方が間違っているんでしょうか…
外部ﾘﾝｸ:codepen.io
136(2): 2023/09/14(木)16:40 ID:??? AAS
grid使うとか他にもっと良い方法があるのかもしれないけど、とりあえずtable使うということで
・tableの最上段にダミーでtr1行追加
・更にbと同一幅のセルを左から4番目に追加
・最上段だけvisibility: collapse;で不可視化（hiddenだとレイアウトからも除去されるので）
ってのはどうでしょう？
外部ﾘﾝｸ:jsfiddle.net
137(1): 2023/09/15(金)01:14 ID:??? AAS
Bootstrap で出来ないの？
138: 2023/09/15(金)04:02 ID:9yhdlK5+(1) AAS
列数を増やしてしまえ
139: 2023/09/15(金)04:07 ID:??? AAS
あとは行にtable追加するとか
昔はよくやってたけど今はもっと便利な方法があるのかな
140: 2023/09/15(金)04:58 ID:??? AAS
みんな>>132の説明でどんなテーブルかわかるん？
俺全然わかんねえや…
141(1): 2023/09/15(金)08:31 ID:??? AAS
一番下のお絵かきの画像
142(1): 132 2023/09/15(金)16:21 ID:??? AAS
>>136さんと138さんの方法で出来ました！
大変助かりました、ありがとうのざいます。
gridはよくわからなかったので勉強してみます。
>>137
まさにbootstrap使ってるんですが、gridレイアウトを使ったらどうかということでしたかね？
143(1): 2023/09/15(金)16:24 ID:??? AAS
なぜgridはflexに負けたのですか？
144: 2023/09/15(金)17:02 ID:??? AAS
>>141
あー、分かる人にはなんか表示されてるのか
納得
145: 2023/09/15(金)17:06 ID:??? AAS
>>143
別に勝ち負けないじゃん？
flexの出始めと一緒で、使えるようになった人から使っていく流れっしょ
上下前次1-新書関写板覧索設栞歴
あと 857 ﾚｽあります
ｽﾚ情報 赤ﾚｽ抽出 画像ﾚｽ抽出 歴の未読ｽﾚ AAｻﾑﾈｲﾙ
ぬこの手 ぬこTOP 0.010s