HTML/CSS のどんな質問に必ず優しく答えるスレ 31
■ このスレッドは過去ログ倉庫に格納されています
ここは初心者からベテランまで、全ての人を対象に優しく答えるスレです
類似質問、重複質問、丸投げ大いに結構。HTML / CSS 関係の事なら何でもOK
分からない人は何回聞いても結構。質問するときはIDを出すためにメール欄を
age にすることをおすすめします。
回答してくれる方は優しい人のみ! 質問者に対して暴言を吐く人はこのスレを見るな!!
終わった話を蒸し返すやつは このスレにくるな!!!
自分で調べろという回答も禁止!!回答するかさもなくば何も書き込むな!!
質問側も節度あるレスで!質問前にスレ内を検索しましょう
■次スレについて
基本的にレスナンバー>>980を取った人(立てられない場合は次の宣言者)が立てて下さい
重複を避けるため、独断でスレ立てはせず必ず意思表示をしてから立てて下さい(>>980を取った場合も)
立てられない事が予め分かっている場合は、>>980付近の書き込みは自重しましょう
■前スレ
HTML/CSS の質問に優しく答えるスレ 30
http://mevius.2ch.net/test/read.cgi/hp/1508043632/
■関連スレ
Webサイト制作初心者用質問スレ part248
http://mevius.2ch.net/test/read.cgi/hp/1494150188/
■HTML
HTML Living Standard 日本語訳
https://momdo.github.io/html/index.html
■CSS
Selectors Level 4 日本語訳
https://triple-underscore.github.io/selectors4-ja.html こんな感じに書くことができる
.ui-dialog {
.ui-dialog-titlebar {}
.ui-dialog-title {}
.ui-dialog-titlebar-close {}
.ui-dialog-content {}
.ui-dialog-buttonpane {
.ui-dialog-buttonset {}
button {}
}
.ui-resizable {
&-n {}
&-e {}
&-s {}
&-w {}
&-se, &-sw, &-ne, &-nw {}
&-se {}
&-sw {}
&-ne {}
&-nw {}
}
} >>685
本当に応用が効かないやつだなw
divって言ったら本当にdivの場合しか思いつかないのかよ
他に.textや.imageがあるとか考えないのかよ 自分が質問者のレベルに合わせるのではなく、
質問者を自分のレベルに合わせようとするのが間違い カップ麺をよこせと言ってるんだからカップ麺をよこせ。体に悪いですよとか余計なお世話だ。 >>688
質問者を初心者と決めつけて
上から目線で話をしろってこと?w >>689
質問者の態度としてふさわしいね!(皮肉) >>690
> 質問者を初心者と決めつけて
そんなこと言ってないし
> 上から目線で話をしろってこと?w
そんなこと言ってないし
つまりは、自己中心的なだけだね
自分の視点でしか物事を見ない >>692
意味不明。
質問者のレベルが仮に低いとして、俺のレベルに引き上げることは
自己中心でも何でもない >>685
>>682 は子セレクタと勘違いしてると思われ
.labeledImage > img {} >その場所だけの修正で良い
つまり修正がいるんだから解決してないじゃん >>696
お前馬鹿だなw
九州から北海道まで行くのに歩いていけないんだから
どの乗り物を使っても一緒じゃんって言う馬鹿はいねぇよ
修正の量が違う。これが一番重要なこと 修正の量でいったらクラス名こまめにつけておいたら0じゃん
text image って内部クラスもっておけばどこに何が追加されようとcssに一切手を加える必要がない
修正量が1か10かより0か1かのほうがはるかに重要
最初のCSS作成(開発会社)はscss使うのは否定しないけど
運用後(顧客)はそんなもの必要ないようなコードにすべき >>697
<div class="labeledImage">
<div>
<img>
</div>
</div>
この構造の時は
.labeledImage img{}
でも
.labeledImage div img{}
でも、どちらでも適用されるから、CSS/SCSSにまでdivをいれる修正をしなくても適用される
>九州から北海道まで行くのに歩いていけないんだから
違うな
その例え方でいうなら
「東京都のビッグサイト」という言い方から
「東京都の江東区のビッグサイト」という言い方に変える必要はない >>697
css変更不可 html修正はサポートという条件だと
scssにわずかでも修正が必要になるのは当然NGだろ
修正量の問題なんて関係ない
セレクタだけでcssかいていた場合
「html変更したらデザインが乱れたんですけどー」って無駄なサポートが必要になる >>701
> scssにわずかでも修正が必要になるのは当然NGだろ
別の話と混ぜるな。
本当に頭が悪いんだなw 面倒だから>>558がscssにわすかに修正が入ったらダメとな
何も言ってないことを示すためにもう一回引用するからな
> 特殊なレイアウトのスタイルかくとき
> 親に1つだけクラスつけてセレクタでもぐってスタイルかく?
> それとも要素1つ1つにクラスつける?
>
> 前者だとHTMLがきれいだけどCSSが汚いし
> 間に要素追加したりするとセレクタ指定全部かきなおしになる
>
> 後者だと使い回しが聞くけどHTMLが汚くなるし
> サイト全体で移行繰り返したりするとどんどん使いもしないクラスがたまっていくよね
俺が言いたいのはscssを使えば、前者のデメリットと
後者のメリットが帳消しになるってこと ということでscssを使うとcssの使い方の選択幅が
大きく広がるので、scssの話題をこれからもするぞと
宣言しておく
いい加減別の話題をしたら?
その話題に対して俺がscssで回答してあげるからさw >>687
応用もなにも
.hoge .fuga とあってその後
間に.abcが挟まったのであれば
.hoge .abc .fugaは .hoge .fugaと一緒だろ…意味わからんわ >>703
この引用の仕方はdataキチガイと一緒だわー
こいつが来るまで引用なんてめんどくさいことするやつ一人もいなかったよな >>706
どうしてあんたはスレと関係ない話をし続けるの? >>707
スレにあった話なんてここ最近0だろ?
ここはすでに雑談スレになったんだからなんも問題ない >>694
こんだけscss云々言ってるやつが基本中の基本以前の子セレクタと子孫セレクタ間違えるかね? はぁ、ほんと応用力がないというか
もしHTMLに、.hoge .text と .hoge div .text で
別々のものを割り当てたくなったとか考えないんだろうか
なんで、その例しか、世界に存在しないみたいに
考えてるんだろうかね。 >>708
例えばscssの話題はcssの問題点を解決する方法として
このスレに関連する話題だ >>710
質問に関係なくない?それ
あぁ雑談かw問題ないね 質問に関係ない話というか、そもそも質問内容の一部だな
> 前者だとHTMLがきれいだけどCSSが汚いし
> 間に要素追加したりするとセレクタ指定全部かきなおしになる なんだ >>558 が言っていたのは
子セレクタのことかよ どうでもいいけど知り合いに気持ち悪いやつがいてさ、自分のこと天皇だとおもってんの。
ちょっと糖質も入ってるんだろうかね?まととに仕事もしてないみたいだし。
そいつのツイッターとかの文章みると
>>710そっくりなんだよねw
句読点の使い方とか改行とかw つーか別の例を混ぜてくるから、混乱するんだぜ?
>>558をよく読め
> 特殊なレイアウトのスタイルかくとき
> 親に1つだけクラスつけてセレクタでもぐってスタイルかく?
> それとも要素1つ1つにクラスつける?
>
> 前者だとHTMLがきれいだけどCSSが汚いし
> 間に要素追加したりするとセレクタ指定全部かきなおしになる
親に1つだけクラスつけてセレクタでもぐってスタイルかく
場合の話をしている。もぐるやり方は子セレクタ限定とは限らないが
子セレクタだとセレクタ指定全部書き直しになることが多いし
子セレクタじゃなくても、.foo の中に複数の spanがあるなら
間に要素追加したりするとセレクタ指定全部かきなおしになるのもわかるだろう
脊髄反射で回答者に文句をいうんじゃなく、
まず自分で質問内容を確認しろ >>715
おい、しらないのか? そいつ本当に天皇だぜ
俺も同じ書き方をしているやつを知っているが
多分同一人物だろう。調べた所本当に天皇だった 句読点がそっくりなやつはは全部アイツだ!同一人物だ!
俺がどこに言っても出てきやがる。ストーカーだ。 >>716
あー完全に子セレクタと子孫セレクタ勘違いしてるっぽいねw
てか子セレクタなんてそこまで使わないし普通は子孫セレクタを想定するでしょ HTMLを書き換えたときにCSS/SCSSを「書き換える必要があるか」という点においては、どちらも変わらない
書き換える量がどれほど違うかでは、SCSSのほうが少なくなる可能性が高い buttonを普通のインラインブロック要素と同じ見た目にするにはどうすればいいのでしょうか?
http://jsbin.com/rixerukaka/edit?html,css,output
paddingを0にしたりborderを消したりしても、
中に入れたテキストが何故か他のインラインブロック要素よりも少し小さくなってしまい
同じ見た目にはなりません
chromeで確認しています >>719
やっと理解できたか。
別の例を出して話を混ぜっ返すんじゃねーよ ごく普通のサイトを作っています。
Edge,IE,Firefoxではほぼ同じ見栄えになるのですが、
Chromeで表示すると、何故か倍率125%に設定しているくらいに全体が大きめに表示されます。
でも倍率を確認すると100%です。
どういう原因が考えられますか? >>722
は?勘違いしてたのはscssキチプゲラってことだよ?いいのねそれで。 >>724
俺が今説明してやったろーが
それで理解したよな子セレクタだって >>723
このスレは雑談スレなので他で聞いてください。ブラウザーに関しては該当スレがないので立ててはどうでしょう >>725
ちげーだろw
何故かいきなりscssマンが子セレクタ限定で話進めてた、まわりは子孫セレクタを想定してたから全く噛み合わずちんぷんかん。
からの最後にこれは最初から子セレクタの話です!とか言い出した意味不がいまの状況 >>721
興味深かったので調べてみた
デフォルトのfont-familyが<button>はArial、<div>はMeiryoになってる(Windows Chrome) 【悲報】 今まで散々技術知識を口にしてきたscssさんは子セレクターと子孫セレクターの違いを理解してなかった >>727
頭が悪いおまえは子孫セレクタでないと理解できないんだろうが
子セレクタでも同じ状態は作れる で結局、scssを使えばいいってことが
子セレクタを例にすれば理解できるんだろ?
だからこれからもscssの話題は続けるぜ いまここ基地外が居るからまともな回答かえってこないよ
全部scssにこじつけられて論点摩り替えられる
cssスレいったほうがいいよ >>732
子孫セレクタ知らなかったのにscssの話なんてできるのぉ?プププ >>728
buttonだけフォントが違うとは思いもしませんでした
font-family: inherit;
としたら普通のインラインブロック要素と同じになりました
ありがとうございました 要素がgridアイテムになったら、
ブロックレベル要素かインラインレベル要素かという違いは意味を持たなくるのでしょうか? >>739
ありがとうございます
flexboxとcss grid layoutは挙動も似ていて
この二つを組み合わせて使うのが今のやり方なんだなーということが分かってきました CSSの話じゃなくてSCSSの話だからでは?
自分が初心者でCSSについての質問したとして
SCSSがうんたらかんたらって言われても
???ってなっちゃう >>744
初心者でほんとに分からんのかもしれんが全く違う。
見た感じが似てるからそう思ってるのかも知れんがSCSSはブラウザが解釈できない非標準技術いわば勝手拡張。
ブラウザはCSSしか解釈できないからweb標準のCSSに事前に(ブラウザに渡る前に)に変換が必要。
javascriptで言うcoffeescriptとかtypescriptとかと同じ。 margin-top:calc(100vw / 25);
だとスクロールバーの横幅も含むのが難儀よね
margin-top:calc(100% / 25);
で横幅100%取得、計算できるようにならないかしら キチガイは、質問に答えることが目的じゃなくて、
自分の知っていることをひけらかしたいんだろう
自重したらひけらかせないから、絶対に自重なんてしない >>747
windowsも早くスクロールバーを他と同じようにしてくれればいいんだがな… viはビューポートインラインで、vbはビューポートブロックとかかね >>752
もう今さらなんじゃない?
androidもiosもmacosもスクロールバーの幅とらない方になっちゃったし viとかvbとかなんだよw
また知らぬ間に新しいの出てんのかよ〜
他にもいつの間にか出てそうだな
めんどくせえ Bootstrapはもう時代遅れでSASSを勉強したほうがいいんですか? >>755
全然関係ないものだから
ただ両方とも勉強とかするようなもんではない気がする
便利に使って楽するもんだ >>755
SASSなんて勉強するほどのものじゃないだろ。
単なる道具だから使えばいいやん 久々にレスポンシブページを作ろうとしています。
今ってvwとかvminとかあるんですね。
親要素に伴う変化が必要ならば%で良いと思いますが、
基本的にはmarginやpadding、フォントサイズは、
vw(h)/vmin(max)で指定した方が良いのでしょうか? 低レベルな質問ですいません
既存のサイトをベースにモックアップを作りたいのですが
普通はどうやりますか?ツールとか使ってなるべく簡単にできる方法があれば知りたいです。
JSとかCSSの知識はあります >>759
好きにすればいいけど
%は継承する先祖要素に対する割合だから
子要素になるに連れて変動して都度計算が必要になるので
vwのような絶対値に対する割合の方がらくちんちーんな気がするな俺は
sassを使えるならデザインカンプのpxをvwに変換する関数作っておくと
pxで作るとの同じ要領で書くことが出来る
あんまり書くとsass絶対許さないマンに怒られそうだからこの辺にしておくけど >>760
モックてどんなものを指して言っているの? >>762
デザインとか動きとか決めるためのhtmlです
サーバーとつながってないダミー画面みたいなやつ wgetとかでローカル保存すればいい気がしてきた。 >>763
htmlはサーバーに繋がってなくても出来るものだけど?
要はどっかのサイトをマルパクで盗んできて色々混ぜこんで見せたいってことでしょ? ならwgetかcurlでまるっととってきて
apiからajaxするぶんだけ静的ファイルにしてしまえばいいんでない? >>766
そういうことですよね。
さっきwgetでとってきたらデザイン崩れてなかったしなんかこれで進められそうです。
ありがとうございましたー
(ちなみに丸パクではなく既存サイトの改修ですw) jsでdomいじられまくるサイトじゃなくて良かったね 本当に無知な質問すみません
<a href="□□□" onclick="window.open('△△△')"target="_blank">[テキスト]</a>
これを□と△が同時では無く0.1秒等時間をズラして表示させるにはどうしたら良いのでしょうか? >>770
そんな事もわからず質問していましたすみませんm(_ _)m 質問です!
Mixiのようなコミュニティサイトを作るには
HTML CSSはどの程度理解していればよいでしょうか? >>772
スレ違いな者に丁寧な回答ありがとうございましたm(_ _)m感謝です! HTML5で
sectionやarticleごとにH1タグが必須なのでしょうか? CSS Grid Layoutで、セル単位で背景色を設定する方法はありますか?
グリッドコンテナやグリッドアイテムはHTML要素なので背景色を設定することは出来ますが
セルに設定することは出来ない気がします
グリッドアイテムをセル全面にして、グリッドアイテムに背景色を持たせるとかしないと無理でしょうか? >>777
HTML Standardでvalidであるかどうかで考えればいらない
でもGoogle先生のご機嫌とるためには
セクションの頭には見出しがほしい
んで見出しレベルの高さは、セクションの高さと相談して考えるのがよろし IE11でfilter, mask, clip-pathは使えるんですかい? Gecko寄りのスレがあるのかもしれませんが、
input type="number" の上下ボタンは、-moz-appearance:textfield で消せるようですが、
input type="date" の×ボタンは、消せないのでしょうか?
requiredで必須にしても消せちゃう(泣)
海外のサイトでclip-pathで消しているのを見付けましたが、無理矢理感が強い あのさー、
ニュースサイトとかなんだけど、
ページ開いてから、文がちょっとしか書いてなくて、
もう一回「続きを読む」を押すとか、やめてくんねーかな。
1回クリックしたら、一発で記事読めるようにしろや。
記事なんて、ザッとあっという間に読んじゃうんだからさ、2度手間取らせんなよ。
ほんとに腹立つな!!!!!! ■ このスレッドは過去ログ倉庫に格納されています