HTML/CSS のどんな質問に必ず優しく答えるスレ 31

**Name_Not_Found** · 2018/01/27(土) 13:50:08.11

ここは初心者からベテランまで、全ての人を対象に優しく答えるスレです

類似質問、重複質問、丸投げ大いに結構。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

**Name_Not_Found** · 2018/02/25(日) 07:42:14.70

>>668
なぜか頑なにでていこうとしないんだよね何回もいってんのに

>>669
その度に誘導すればよい
jsとjqだって別れてる

>>665
そうだね
すごいね

>>666
どのへんがめんどくさいと思うの？

**Name_Not_Found** · 2018/02/25(日) 08:29:05.11

>>672
ブラウザーには種類とバージョンがあるから

**Name_Not_Found** · 2018/02/25(日) 08:34:51.27

頭沸いてんのかな？

**Name_Not_Found** · 2018/02/25(日) 10:23:56.64

>>669
無駄じゃないでしょ
cssのコードだせば十分な質問しかこないのに
scssって言葉が含まれてる回答が的を得ていたことなんて１度もない

**Name_Not_Found** · 2018/02/25(日) 11:46:23.75

> scssって言葉が含まれてる回答が的を得ていたことなんて１度もない

それがまさに>>558なんじゃないのか？

> 特殊なレイアウトのスタイルかくとき
> 親に１つだけクラスつけてセレクタでもぐってスタイルかく？
> それとも要素１つ１つにクラスつける？
>
> 前者だとHTMLがきれいだけどＣＳＳが汚いし
> 間に要素追加したりするとセレクタ指定全部かきなおしになる
>
> 後者だと使い回しが聞くけどＨＴＭＬが汚くなるし
> サイト全体で移行繰り返したりするとどんどん使いもしないクラスがたまっていくよね

整理すると以下の２つどちらが良いか？

1. 親に１つだけクラスつける
2. 要素１つ１つにクラスつける

前者
　メリット　・・・　HTMLがきれい
　デメリット　・・・　CSSが汚い、間に要素追加したりすると書き直しが必要
　（ただしこの２つのデメリットはSCSSを使えば解決する）

後者
　メリット　・・・　使い回しが聞く（SCSSでもそれは可能）
　デメリット　・・・　ＨＴＭＬが汚くなる。使わないクラスがたまっていく

まとめると、SCSSを使うと前者の方法はメリットしか無く、
後者はデメリットしかなくなるということになる

**Name_Not_Found** · 2018/02/25(日) 12:29:44.14

最後の２行いらないじゃん
質問者が聞きたいのはどっちがいいかであって何を使うかなんて聞いていない上に
どっちもＳＣＳＳを使えばできるんだから書く必要もない

**Name_Not_Found** · 2018/02/25(日) 12:41:56.33

＞間に要素追加したりすると書き直しが必要
＞　（ただしこの２つのデメリットはSCSSを使えば解決する）
解決しないじゃん
結局修正は必要だろ

クラス直接つけてればどこに要素追加があってもcssの修正は一切必要なくhtml側だけですむ

>>553の例だと
<div class="labeledImage">
<div class="text">
<div class="image">

ってつけてあれば

<div class="labeledImage">
<h3>
<div class="text">
<a><div class="image">

みたいなことになってもcssは一切修正の必要がないって意味じゃないの

**Name_Not_Found** · 2018/02/25(日) 13:31:29.49

>>678
> 解決しないじゃん
> 結局修正は必要だろ
？

> 前者だとHTMLがきれいだけどＣＳＳが汚いし
> 間に要素追加したりするとセレクタ指定全部かきなおしになる

セレクタ指定全部かきなおしは不要になるって言ってるんだけど？

**Name_Not_Found** · 2018/02/25(日) 13:34:49.23

>>678
中途半端に引用するな
> 間に要素追加したりするとセレクタ指定全部かきなおしになる
って話だろ

>>553 を元に例を書くと

.labeledImage { ・・・ }
.labeledImage .text { ・・・ }
.labeledImage .image { ・・・ }

間に要素追加っていうのは途中にdivが入ったら

.labeledImage div { ・・・ }
.labeledImage div .text { ・・・ }
.labeledImage div .image { ・・・ }

みたいにセレクタ指定全部書き直しになるってことだ

SCSSだとネストできるから、間にdivが入ったら、
その場所だけの修正で良い

.labeledImage div {
　.text { ・・・ }
　.image { ・・・ }
}

**Name_Not_Found** · 2018/02/25(日) 13:39:16.82

スレ違いが糞

**Name_Not_Found** · 2018/02/25(日) 13:42:55.98

すれ違いでもなんでもないんだよな。

結局のところ、こっちのやり方のほうがHTMLがシンプルになりますが、
CSSが複雑になりますどうしましょう

って悩みなのでSCSSを使えば解決する。が答えとなる

**Name_Not_Found** · 2018/02/25(日) 13:46:52.37

例えばこれ、jQuery UIのダイアログのCSS

.ui-dialog {}
.ui-dialog .ui-dialog-titlebar {}
.ui-dialog .ui-dialog-title {}
.ui-dialog .ui-dialog-titlebar-close {}
.ui-dialog .ui-dialog-content {}
.ui-dialog .ui-dialog-buttonpane {}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {}
.ui-dialog .ui-dialog-buttonpane button {}
.ui-dialog .ui-resizable-n {}
.ui-dialog .ui-resizable-e {}
.ui-dialog .ui-resizable-s {}
.ui-dialog .ui-resizable-w {}
.ui-dialog .ui-resizable-se, .ui-dialog .ui-resizable-sw, .ui-dialog .ui-resizable-ne, .ui-dialog .ui-resizable-nw {}
.ui-dialog .ui-resizable-se {}
.ui-dialog .ui-resizable-sw {}
.ui-dialog .ui-resizable-ne {}
.ui-dialog .ui-resizable-nw {}

**Name_Not_Found** · 2018/02/25(日) 13:48:43.11

>>682
どうしましょうなんて言ってないだろ笑
うどんとソバの喩えは頭悪すぎだろって思ってたけどいよいよ正解に思えてくるぞ笑

**Name_Not_Found** · 2018/02/25(日) 13:51:47.54

>>680
ちょっとまて…なんでその書き方で途中にdivが挟まったらセレクターまで全部div追加になるの？？？

**Name_Not_Found** · 2018/02/25(日) 13:57:03.82

こんな感じに書くことができる

.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 {}
　}
}

**Name_Not_Found** · 2018/02/25(日) 13:59:28.27

>>685
本当に応用が効かないやつだなｗ
divって言ったら本当にdivの場合しか思いつかないのかよ
他に.textや.imageがあるとか考えないのかよ

**Name_Not_Found** · 2018/02/25(日) 14:15:30.95

自分が質問者のレベルに合わせるのではなく、
質問者を自分のレベルに合わせようとするのが間違い

**Name_Not_Found** · 2018/02/25(日) 14:24:03.17

カップ麺をよこせと言ってるんだからカップ麺をよこせ。体に悪いですよとか余計なお世話だ。

**Name_Not_Found** · 2018/02/25(日) 14:29:39.88

>>688
質問者を初心者と決めつけて
上から目線で話をしろってこと？ｗ

**Name_Not_Found** · 2018/02/25(日) 14:30:47.47

>>689
質問者の態度としてふさわしいね！（皮肉）

**Name_Not_Found** · 2018/02/25(日) 14:32:59.62

>>690
> 質問者を初心者と決めつけて
そんなこと言ってないし

> 上から目線で話をしろってこと？ｗ
そんなこと言ってないし

つまりは、自己中心的なだけだね
自分の視点でしか物事を見ない

**Name_Not_Found** · 2018/02/25(日) 14:35:37.66

>>692
意味不明。

質問者のレベルが仮に低いとして、俺のレベルに引き上げることは
自己中心でも何でもない

**Name_Not_Found** · 2018/02/25(日) 14:43:04.08

>>685
>>682 は子セレクタと勘違いしてると思われ

.labeledImage > img {}

**694** · 2018/02/25(日) 14:44:10.74

失礼、安価ミス
× 682
〇 >>680

**Name_Not_Found** · 2018/02/25(日) 14:53:39.50

>その場所だけの修正で良い
つまり修正がいるんだから解決してないじゃん

**Name_Not_Found** · 2018/02/25(日) 15:00:58.73

>>696
お前馬鹿だなｗ
九州から北海道まで行くのに歩いていけないんだから
どの乗り物を使っても一緒じゃんって言う馬鹿はいねぇよ

修正の量が違う。これが一番重要なこと

**Name_Not_Found** · 2018/02/25(日) 15:03:53.07

>>697
辛辣で草

**Name_Not_Found** · 2018/02/25(日) 15:10:28.29

修正の量でいったらクラス名こまめにつけておいたら０じゃん
text image って内部クラスもっておけばどこに何が追加されようとcssに一切手を加える必要がない
修正量が１か１０かより０か１かのほうがはるかに重要

最初のCSS作成(開発会社)はscss使うのは否定しないけど
運用後(顧客)はそんなもの必要ないようなコードにすべき

**Name_Not_Found** · 2018/02/25(日) 15:12:18.93

>>697
<div class="labeledImage">
<div>
<img>
</div>
</div>
この構造の時は

.labeledImage img{}
でも
.labeledImage div img{}
でも、どちらでも適用されるから、CSS/SCSSにまでdivをいれる修正をしなくても適用される

>九州から北海道まで行くのに歩いていけないんだから
違うな
その例え方でいうなら
「東京都のビッグサイト」という言い方から
「東京都の江東区のビッグサイト」という言い方に変える必要はない

**Name_Not_Found** · 2018/02/25(日) 15:18:45.73

>>697
css変更不可　html修正はサポートという条件だと
scssにわずかでも修正が必要になるのは当然ＮＧだろ
修正量の問題なんて関係ない

セレクタだけでcssかいていた場合
「html変更したらデザインが乱れたんですけどー」って無駄なサポートが必要になる

**Name_Not_Found** · 2018/02/25(日) 15:20:37.78

>>701
> scssにわずかでも修正が必要になるのは当然ＮＧだろ
別の話と混ぜるな。

本当に頭が悪いんだなｗ

**Name_Not_Found** · 2018/02/25(日) 15:22:18.49

面倒だから>>558がscssにわすかに修正が入ったらダメとな
何も言ってないことを示すためにもう一回引用するからな

> 特殊なレイアウトのスタイルかくとき
> 親に１つだけクラスつけてセレクタでもぐってスタイルかく？
> それとも要素１つ１つにクラスつける？
>
> 前者だとHTMLがきれいだけどＣＳＳが汚いし
> 間に要素追加したりするとセレクタ指定全部かきなおしになる
>
> 後者だと使い回しが聞くけどＨＴＭＬが汚くなるし
> サイト全体で移行繰り返したりするとどんどん使いもしないクラスがたまっていくよね

俺が言いたいのはscssを使えば、前者のデメリットと
後者のメリットが帳消しになるってこと

**Name_Not_Found** · 2018/02/25(日) 15:23:31.32

ということでscssを使うとcssの使い方の選択幅が
大きく広がるので、scssの話題をこれからもするぞと
宣言しておく

いい加減別の話題をしたら？
その話題に対して俺がscssで回答してあげるからさｗ

**Name_Not_Found** · 2018/02/25(日) 15:46:44.96

>>687
応用もなにも
.hoge .fuga とあってその後
間に.abcが挟まったのであれば
.hoge .abc .fugaは .hoge .fugaと一緒だろ…意味わからんわ

**Name_Not_Found** · 2018/02/25(日) 15:49:05.42

>>703
この引用の仕方はdataキチガイと一緒だわー
こいつが来るまで引用なんてめんどくさいことするやつ一人もいなかったよな

**Name_Not_Found** · 2018/02/25(日) 15:52:04.16

>>706
どうしてあんたはスレと関係ない話をし続けるの？

**Name_Not_Found** · 2018/02/25(日) 15:54:49.58

>>707
スレにあった話なんてここ最近0だろ？
ここはすでに雑談スレになったんだからなんも問題ない

**Name_Not_Found** · 2018/02/25(日) 15:58:02.47

>>694
こんだけscss云々言ってるやつが基本中の基本以前の子セレクタと子孫セレクタ間違えるかね？

**Name_Not_Found** · 2018/02/25(日) 16:03:30.41

はぁ、ほんと応用力がないというか

もしHTMLに、.hoge .text と .hoge div .text で
別々のものを割り当てたくなったとか考えないんだろうか

なんで、その例しか、世界に存在しないみたいに
考えてるんだろうかね。

**Name_Not_Found** · 2018/02/25(日) 16:04:08.82

>>708
例えばscssの話題はcssの問題点を解決する方法として
このスレに関連する話題だ

**Name_Not_Found** · 2018/02/25(日) 16:11:52.45

>>710
質問に関係なくない？それ
あぁ雑談かw問題ないね

**Name_Not_Found** · 2018/02/25(日) 16:13:22.71

質問に関係ない話というか、そもそも質問内容の一部だな

> 前者だとHTMLがきれいだけどＣＳＳが汚いし
> 間に要素追加したりするとセレクタ指定全部かきなおしになる

**Name_Not_Found** · 2018/02/25(日) 16:14:10.44

なんだ >>558 が言っていたのは
子セレクタのことかよ

**Name_Not_Found** · 2018/02/25(日) 16:15:00.86

どうでもいいけど知り合いに気持ち悪いやつがいてさ、自分のこと天皇だとおもってんの。
ちょっと糖質も入ってるんだろうかね？まととに仕事もしてないみたいだし。
そいつのツイッターとかの文章みると
>>710そっくりなんだよねw
句読点の使い方とか改行とかw

**Name_Not_Found** · 2018/02/25(日) 16:17:42.33

つーか別の例を混ぜてくるから、混乱するんだぜ？

>>558をよく読め

> 特殊なレイアウトのスタイルかくとき
> 親に１つだけクラスつけてセレクタでもぐってスタイルかく？
> それとも要素１つ１つにクラスつける？
>
> 前者だとHTMLがきれいだけどＣＳＳが汚いし
> 間に要素追加したりするとセレクタ指定全部かきなおしになる

親に１つだけクラスつけてセレクタでもぐってスタイルかく
場合の話をしている。もぐるやり方は子セレクタ限定とは限らないが
子セレクタだとセレクタ指定全部書き直しになることが多いし

子セレクタじゃなくても、.foo の中に複数の spanがあるなら
間に要素追加したりするとセレクタ指定全部かきなおしになるのもわかるだろう

脊髄反射で回答者に文句をいうんじゃなく、
まず自分で質問内容を確認しろ

**Name_Not_Found** · 2018/02/25(日) 16:18:34.36

>>715
おい、しらないのか？そいつ本当に天皇だぜ
俺も同じ書き方をしているやつを知っているが
多分同一人物だろう。調べた所本当に天皇だった

**Name_Not_Found** · 2018/02/25(日) 16:24:57.10

句読点がそっくりなやつはは全部アイツだ！同一人物だ！
俺がどこに言っても出てきやがる。ストーカーだ。

**Name_Not_Found** · 2018/02/25(日) 16:30:14.16

>>716
あー完全に子セレクタと子孫セレクタ勘違いしてるっぽいねw
てか子セレクタなんてそこまで使わないし普通は子孫セレクタを想定するでしょ

**Name_Not_Found** · 2018/02/25(日) 16:30:22.78

HTMLを書き換えたときにCSS/SCSSを「書き換える必要があるか」という点においては、どちらも変わらない
書き換える量がどれほど違うかでは、SCSSのほうが少なくなる可能性が高い

**Name_Not_Found** · 2018/02/25(日) 16:42:50.15

buttonを普通のインラインブロック要素と同じ見た目にするにはどうすればいいのでしょうか？

http://jsbin.com/rixerukaka/edit?html,css,output

paddingを0にしたりborderを消したりしても、
中に入れたテキストが何故か他のインラインブロック要素よりも少し小さくなってしまい
同じ見た目にはなりません
chromeで確認しています

**Name_Not_Found** · 2018/02/25(日) 16:43:05.38

>>719
やっと理解できたか。
別の例を出して話を混ぜっ返すんじゃねーよ

**Name_Not_Found** · 2018/02/25(日) 16:50:51.57

ごく普通のサイトを作っています。
Edge,IE,Firefoxではほぼ同じ見栄えになるのですが、
Chromeで表示すると、何故か倍率125%に設定しているくらいに全体が大きめに表示されます。
でも倍率を確認すると100%です。
どういう原因が考えられますか？

**Name_Not_Found** · 2018/02/25(日) 16:52:27.01

>>722
は？勘違いしてたのはscssキチﾌﾟｹﾞﾗってことだよ？いいのねそれで。

**Name_Not_Found** · 2018/02/25(日) 16:53:54.53

>>724
俺が今説明してやったろーが
それで理解したよな子セレクタだって

**Name_Not_Found** · 2018/02/25(日) 16:54:57.88

>>723
このスレは雑談スレなので他で聞いてください。ブラウザーに関しては該当スレがないので立ててはどうでしょう

**Name_Not_Found** · 2018/02/25(日) 16:57:40.55

>>725
ちげーだろw
何故かいきなりscssマンが子セレクタ限定で話進めてた、まわりは子孫セレクタを想定してたから全く噛み合わずちんぷんかん。
からの最後にこれは最初から子セレクタの話です！とか言い出した意味不がいまの状況

**Name_Not_Found** · 2018/02/25(日) 17:02:04.52

>>721
興味深かったので調べてみた
デフォルトのfont-familyが<button>はArial、<div>はMeiryoになってる（Windows Chrome）

**Name_Not_Found** · 2018/02/25(日) 17:06:08.86

【悲報】今まで散々技術知識を口にしてきたscssさんは子セレクターと子孫セレクターの違いを理解してなかった

**Name_Not_Found** · 2018/02/25(日) 17:20:32.59

>>727
頭が悪いおまえは子孫セレクタでないと理解できないんだろうが
子セレクタでも同じ状態は作れる

**Name_Not_Found** · 2018/02/25(日) 17:20:48.74

あ、逆だなｗ

**Name_Not_Found** · 2018/02/25(日) 17:21:36.32

で結局、scssを使えばいいってことが
子セレクタを例にすれば理解できるんだろ？
だからこれからもscssの話題は続けるぜ

**Name_Not_Found** · 2018/02/25(日) 17:28:11.22

いまここ基地外が居るからまともな回答かえってこないよ
全部scssにこじつけられて論点摩り替えられる
cssスレいったほうがいいよ

**Name_Not_Found** · 2018/02/25(日) 17:29:10.64

制作初心者スレいくほうがいいんじゃね

**Name_Not_Found** · 2018/02/25(日) 17:33:06.49

制作初心者スレってどれ？

**Name_Not_Found** · 2018/02/25(日) 18:16:34.87

>>732
子孫セレクタ知らなかったのにscssの話なんてできるのぉ？ﾌﾟﾌﾟﾌﾟ

**Name_Not_Found** · 2018/02/25(日) 18:22:53.68

>>728
buttonだけフォントが違うとは思いもしませんでした
font-family: inherit;
としたら普通のインラインブロック要素と同じになりました
ありがとうございました

**Name_Not_Found** · 2018/02/26(月) 01:44:44.63

要素がgridアイテムになったら、
ブロックレベル要素かインラインレベル要素かという違いは意味を持たなくるのでしょうか？

**Name_Not_Found** · 2018/02/26(月) 02:46:21.96

>>738
そのとおり。
その「レベル」は普通のフローレイアウト用の用語
（ normal flow / block formatting context ）

CSS display module 仕様に記述がある
https://drafts.csswg.org/css-display-3/#display-type
https://triple-underscore.github.io/css-display-ja.html#display-type

gridアイテムの display プロパティは、一律に block 化される
https://triple-underscore.github.io/css-display-ja.html#transformations
flexアイテムも同様。

**Name_Not_Found** · 2018/02/26(月) 03:39:44.73

>>739
ありがとうございます
flexboxとcss grid layoutは挙動も似ていて
この二つを組み合わせて使うのが今のやり方なんだなーということが分かってきました

**Name_Not_Found** · 2018/02/26(月) 09:55:16.96

この板、VIPQ2入ってないのか

**Name_Not_Found** · 2018/02/26(月) 12:39:56.94

>>733
SCSSはなにかいかんの？

**Name_Not_Found** · 2018/02/26(月) 13:07:20.27

スレ違いなのがいかん

**Name_Not_Found** · 2018/02/26(月) 13:48:52.62

なんで？CSSの話じゃん

**Name_Not_Found** · 2018/02/26(月) 13:51:36.29

CSSの話じゃなくてSCSSの話だからでは？
自分が初心者でCSSについての質問したとして
SCSSがうんたらかんたらって言われても
？？？ってなっちゃう

**Name_Not_Found** · 2018/02/26(月) 14:13:02.25

>>744
初心者でほんとに分からんのかもしれんが全く違う。
見た感じが似てるからそう思ってるのかも知れんがSCSSはブラウザが解釈できない非標準技術いわば勝手拡張。
ブラウザはCSSしか解釈できないからweb標準のCSSに事前に(ブラウザに渡る前に)に変換が必要。
javascriptで言うcoffeescriptとかtypescriptとかと同じ。

**Name_Not_Found** · 2018/02/26(月) 14:18:41.53

margin-top:calc(100vw / 25);
だとスクロールバーの横幅も含むのが難儀よね

margin-top:calc(100% / 25);
で横幅100%取得、計算できるようにならないかしら

**Name_Not_Found** · 2018/02/26(月) 14:20:07.60

ｷﾁｶﾞｲは、質問に答えることが目的じゃなくて、
自分の知っていることをひけらかしたいんだろう
自重したらひけらかせないから、絶対に自重なんてしない

**Name_Not_Found** · 2018/02/26(月) 14:23:28.52

>>747
https://developer.mozilla.org/ja/docs/Web/CSS/Length

新length？か知らんけどviってのがそれじゃね？

**Name_Not_Found** · 2018/02/26(月) 14:45:08.56

>>747
windowsも早くスクロールバーを他と同じようにしてくれればいいんだがな…

**Name_Not_Found** · 2018/02/26(月) 14:56:48.63

viはビューポートインラインで、vbはビューポートブロックとかかね

**Name_Not_Found** · 2018/02/26(月) 15:36:49.12

>>750
windowsにあわせた方が楽だろ

**Name_Not_Found** · 2018/02/26(月) 15:42:03.29

>>752
もう今さらなんじゃない？
androidもiosもmacosもスクロールバーの幅とらない方になっちゃったし

**Name_Not_Found** · 2018/02/26(月) 22:17:59.01

viとかvbとかなんだよｗ
また知らぬ間に新しいの出てんのかよ～
他にもいつの間にか出てそうだな
めんどくせえ

**Name_Not_Found** · 2018/02/27(火) 01:35:10.85

Bootstrapはもう時代遅れでSASSを勉強したほうがいいんですか？

**Name_Not_Found** · 2018/02/27(火) 02:09:44.14

技術レイヤーが違う。

**Name_Not_Found** · 2018/02/27(火) 03:31:48.26

>>755
全然関係ないものだから
ただ両方とも勉強とかするようなもんではない気がする
便利に使って楽するもんだ

**Name_Not_Found** · 2018/02/27(火) 11:44:46.17

>>755
SASSなんて勉強するほどのものじゃないだろ。
単なる道具だから使えばいいやん

**Name_Not_Found** · 2018/02/27(火) 11:51:36.45

久々にレスポンシブページを作ろうとしています。
今ってvwとかvminとかあるんですね。
親要素に伴う変化が必要ならば%で良いと思いますが、
基本的にはmarginやpadding、フォントサイズは、
vw(h)/vmin(max)で指定した方が良いのでしょうか？

**Name_Not_Found** · 2018/02/27(火) 12:58:02.97

低レベルな質問ですいません
既存のサイトをベースにモックアップを作りたいのですが
普通はどうやりますか？ツールとか使ってなるべく簡単にできる方法があれば知りたいです。
JSとかCSSの知識はあります

**Name_Not_Found** · 2018/02/27(火) 15:17:24.33

>>759
好きにすればいいけど
%は継承する先祖要素に対する割合だから
子要素になるに連れて変動して都度計算が必要になるので
vwのような絶対値に対する割合の方がらくちんちーんな気がするな俺は

sassを使えるならデザインカンプのpxをvwに変換する関数作っておくと
pxで作るとの同じ要領で書くことが出来る
あんまり書くとsass絶対許さないマンに怒られそうだからこの辺にしておくけど

**Name_Not_Found** · 2018/02/27(火) 15:27:08.57

>>760
モックてどんなものを指して言っているの？

**Name_Not_Found** · 2018/02/27(火) 15:45:29.73

>>762
デザインとか動きとか決めるためのhtmlです
サーバーとつながってないダミー画面みたいなやつ

**Name_Not_Found** · 2018/02/27(火) 15:46:59.67

wgetとかでローカル保存すればいい気がしてきた。

**Name_Not_Found** · 2018/02/27(火) 16:25:55.83

>>763
htmlはサーバーに繋がってなくても出来るものだけど？
要はどっかのサイトをマルパクで盗んできて色々混ぜこんで見せたいってことでしょ？

**Name_Not_Found** · 2018/02/27(火) 18:10:34.91

ならwgetかcurlでまるっととってきて
apiからajaxするぶんだけ静的ファイルにしてしまえばいいんでない？

**Name_Not_Found** · 2018/02/27(火) 19:04:46.13

>>766
そういうことですよね。
さっきwgetでとってきたらデザイン崩れてなかったしなんかこれで進められそうです。
ありがとうございましたー
(ちなみに丸パクではなく既存サイトの改修ですw)

**Name_Not_Found** · 2018/02/27(火) 19:07:32.07

jsでdomいじられまくるサイトじゃなくて良かったね

**Name_Not_Found** · 2018/02/27(火) 23:50:50.93

本当に無知な質問すみません

<a href="□□□" onclick="window.open('△△△')"target="_blank">[テキスト]</a>

これを□と△が同時では無く0.1秒等時間をズラして表示させるにはどうしたら良いのでしょうか？

**Name_Not_Found** · 2018/02/28(水) 00:08:23.89

>>769
javascriptはスレ違いかと

**Name_Not_Found** · 2018/02/28(水) 00:19:43.64

>>770
そんな事もわからず質問していましたすみませんm(_ _)m

**Name_Not_Found** · 2018/02/28(水) 01:36:17.24

>>771
javascriptスレに回答しといたよ！
http://mevius.5ch.net/test/read.cgi/hp/1511269113/870