X

HTML/CSS のどんな質問にも優しく答えるスレ 34

■ このスレッドは過去ログ倉庫に格納されています
0001Name_Not_Found
垢版 |
2018/10/08(月) 11:45:57.53ID:???
ここは初心者からベテランまで、全ての人を対象に優しく答えるスレです

類似質問、重複質問、丸投げ大いに結構。HTML / CSS 関係の事なら何でもOK
分からない人は何回聞いても結構。質問するときはIDを出すためにメール欄を
age にすることをおすすめします。

回答してくれる方は優しい人のみ！　質問者に対して暴言を吐く人はこのスレを見るな！！
終わった話を蒸し返すやつは このスレにくるな！！！
自分で調べろという回答も禁止！！回答するかさもなくば何も書き込むな！！

質問側も節度あるレスで！質問前にスレ内を検索しましょう

■次スレについて
基本的にレスナンバー>>980を取った人（立てられない場合は次の宣言者）が立てて下さい
重複を避けるため、独断でスレ立てはせず必ず意思表示をしてから立てて下さい（>>980を取った場合も）
立てられない事が予め分かっている場合は、>>980付近の書き込みは自重しましょう

■前スレ
HTML/CSS のどんな質問にも優しく答えるスレ 33
http://mevius.5ch.net/test/read.cgi/hp/1531279252/

■関連スレ
Webサイト制作初心者用質問スレ part249
http://mevius.5ch.net/test/read.cgi/hp/1529144063/

■HTML
HTML Living Standard 日本語訳
https://momdo.github.io/html/index.html

■CSS
Selectors Level 4 日本語訳
https://triple-underscore.github.io/selectors4-ja.html
0002Name_Not_Found
垢版 |
2018/10/08(月) 11:52:22.06ID:???
969 名前：Name_Not_Found[sage] 投稿日：2018/10/07(日) 22:23:52.27 ID:???
どうやるの？
flexって好きな位置でのwrapと
複数行にわたる縦幅の一致ができないよね
それさえできれば万能なのに

973 名前：Name_Not_Found[sage] 投稿日：2018/10/07(日) 22:57:41.72 ID:???
>>971
更新してなかった
具体的にどうするんです？

＜div class="container" style="width:1000px"＞
＜div＞＜img src="http://placehold.jp/200x100.png";＞＜/div＞
＜div＞＜img src="http://placehold.jp/200x200.png";＞＜/div＞
＜div＞＜img src="http://placehold.jp/200x100.png";＞＜/div＞
＜div＞＜img src="http://placehold.jp/200x100.png";＞＜/div＞
＜div＞＜img src="http://placehold.jp/200x100.png";＞＜/div＞
＜div＞＜img src="http://placehold.jp/200x100.png";＞＜/div＞
＜div＞＜img src="http://placehold.jp/200x100.png";＞＜/div＞
＜div＞＜img src="http://placehold.jp/200x100.png";＞＜/div＞
＜div＞＜img src="http://placehold.jp/200x100.png";＞＜/div＞
＜/div＞
これを (width height 指定一切なしで) flex 関連のスタイルだけで
3 x 3 の等サイズの四角形に配置できます？
0004Name_Not_Found
垢版 |
2018/10/08(月) 12:46:20.98ID:???
ぐーぐるこわい
あいつらその気になればせかいほろぼせる
0005Name_Not_Found
垢版 |
2018/10/08(月) 13:01:40.67ID:???
画像だけで証拠になってると本気で思ってるならアスペすぎだろ
0006Name_Not_Found
垢版 |
2018/10/08(月) 13:16:39.76ID:???
確かに行にまたがって高さ合わせたい場合あるよなー
リンクボタンで１つだけ長い文章で２行になったりするとみっともない

<style>
a {
display: block;
width: 50%;
border: solid 1px #000;
margin: 1em auto;
padding: 1em;
border-radius: 0.5em;
color: #000;
text-decoration: none;
text-align: center;
}
a:hover{
background-color: #eee;
}
</style>
<a href="#">長ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーい文章</a>
<a href="#">短い文章</a>
0007Name_Not_Found
垢版 |
2018/10/08(月) 13:25:40.73ID:???
めんどくせーからできるかだけでいいって前スレで言われてるからソースは不要ってことだろうな
0008Name_Not_Found
垢版 |
2018/10/08(月) 14:16:04.39ID:???
できないからごめんなさいっていえばいいのに
0009Name_Not_Found
垢版 |
2018/10/08(月) 14:36:40.02ID:???
flexboxで割付した際に余白のpx知りたいんだけど
デベロッパーツールで確認って出来るん？
0010Name_Not_Found
垢版 |
2018/10/08(月) 14:51:55.94ID:???
さすがにこれは恥ずかしい
0011Name_Not_Found
垢版 |
2018/10/08(月) 14:56:56.85ID:???
js使えば何でもできるぞ
0012Name_Not_Found
垢版 |
2018/10/08(月) 15:15:15.50ID:???
let max_width = 0, max_height = 0;
$('.container > div').each((_, e) => {
if($(e).width() > max_width ) max_width = $(e).width();
if($(e).height() > max_height) max_height = $(e).height();
});
$('.container > div').width(max_width).height(max_height);
0013Name_Not_Found
垢版 |
2018/10/08(月) 15:20:05.14ID:???
高さ合わせるのは無理でも折返しぐらいはできないの？
折り返しできないなら flex って inline-block 以下じゃん
0014Name_Not_Found
垢版 |
2018/10/08(月) 16:10:59.09ID:???
折り返しってなに？wrapのことではなく？
0015Name_Not_Found
垢版 |
2018/10/08(月) 16:35:57.38ID:???
たかが１０レスも遡れないアスペだらけ
0016Name_Not_Found
垢版 |
2018/10/08(月) 16:37:53.52ID:???
残りスペースに関係なくすきなところで折り返すって意味だと思うよ
早い話 <br> をやりたいってことかと
0017Name_Not_Found
垢版 |
2018/10/08(月) 17:00:32.77ID:???
好きなところで折り返すなら最初からそう作れよカス
0018Name_Not_Found
垢版 |
2018/10/08(月) 17:17:56.85ID:???
最初からってどいういうこと？
最初からそう作るにはどうするかって話なのに
flexで何でもできるとか言い出したのお前じゃん
0019Name_Not_Found
垢版 |
2018/10/08(月) 17:35:43.66ID:???
バカかこいつ
一生悩んでろよクズwww
0020Name_Not_Found
垢版 |
2018/10/08(月) 18:19:56.27ID:???
ちょいちょい俺の荒らしレス入れてるから話がごっちゃになっとるねぇ〜
0022Name_Not_Found
垢版 |
2018/10/08(月) 19:11:55.65ID:oTgN8l1Y
HTMLの初歩を学んでいるんですが、img要素ってわざわざp要素で囲まなきゃいけないんですか？
囲まなかったらどうなるんですか？
0024Name_Not_Found
垢版 |
2018/10/08(月) 19:20:01.86ID:oTgN8l1Y
>>23
そうなんですか？
だったら自分が今学習しているサイトはちょっと信頼できないかもしれないですね
画像をパラグラフ要素で囲むって意味分からないですもんね
0025Name_Not_Found
垢版 |
2018/10/08(月) 19:26:08.99ID:???
BEM記法とかそこまで厳密じゃなくても
基本的にインライン要素はブロックで囲むってのは推奨されてるね

flexがでてからは１つ外側に指定したいからスタイル当てるのがやりやすい
0026Name_Not_Found
垢版 |
2018/10/08(月) 19:30:33.12ID:???
divでもいいけど p で囲むのはデフォルトで p のほうが下側にマージンが付いてるから
がぞうが連続した場合でもレイアウトがみやすいってことかと

意味論を重視するなら コンテナー div であるべきだけど
p のほうが何もかかずに見栄えよくなるから好みかな

困ったら p つかっとけってコーディングスタイルはウェブコーダーでも普通にいる
0027Name_Not_Found
垢版 |
2018/10/08(月) 19:46:22.04ID:oTgN8l1Y
>>25>>26
ありがとうございます
まだまだ勉強が足りないですね
0028Name_Not_Found
垢版 |
2018/10/08(月) 21:20:31.70ID:???
>>22
俺の中でだが
インライン要素は生もの食品のイメージで裸で置いてはいけない。
魚、肉とかが何も包装されてない状態を連想するようにしてる
0029Name_Not_Found
垢版 |
2018/10/08(月) 21:29:10.21ID:???
もし<p>を書かずに<span>を書きたくなったらこうすればいい

<body>
<div class="main">

自由に配置できる

</div>
<body>



全てがdivブロックの中にあるので、>>28のルールを破ることなく
インライン要素を自由に配置できる
0030Name_Not_Found
垢版 |
2018/10/08(月) 22:15:10.23ID:???
>>29
お前みたいなのがいるからな…divなくなって欲しいわ無能
0031Name_Not_Found
垢版 |
2018/10/08(月) 22:26:38.06ID:8cvJ3V9E
>>29を見て思ったのだけど、

なんとなくbodyにCSSをあまりくっつけたくないから、
ページ全体をdivで囲って、そこにページの基本となるCSS
（background-imageとかfont-familyとか）
をくっつけてるんだけど、
これってマズイんだろうか
0032Name_Not_Found
垢版 |
2018/10/08(月) 22:38:57.40ID:???
bodyの末尾になんか追加するjqueryプラグインとかあるからなあ
<div>いれとくのはちょっと気持ち悪いけど仕方ないかなって思ってる
003331
垢版 |
2018/10/09(火) 00:53:58.27ID:RZPtjwyI
>>32
文法以外の所で、divを入れる必要性があるのか
そういう可能性は頭になかった
ありがとう
0034Name_Not_Found
垢版 |
2018/10/09(火) 02:00:15.10ID:???
>>29
俺の中でだが
1枚の袋に魚、肉とかまとめてブっ込んで
カオスに入り乱れてるイメージ

中のインライン要素をまとめて1つの段落やアウトラインとして認識されていいならいいのかも
0035Name_Not_Found
垢版 |
2018/10/09(火) 05:32:15.12ID:Tanwg30a
ニラ玉食べたい
0036Name_Not_Found
垢版 |
2018/10/09(火) 05:32:27.36ID:Tanwg30a
誤爆すまぬ
0037Name_Not_Found
垢版 |
2018/10/09(火) 07:46:49.24ID:???
>>30
無能はお前。インライン要素はブロックに入れずに置いていい。
それだけの話なのに、ブロックに入れないとダメとかいうから
お前の話は矛盾してるって突っついてやったんだよ
■ このスレッドは過去ログ倉庫に格納されています
ニューススポーツなんでも実況