X
HTML/CSS のどんな質問にも優しく答えるｽﾚ 39 ﾐｯｸﾐｸ
レス数が900を超えています。1000を超えると表示できなくなるよ。
0001Name_Not_Found
垢版 |
2019/06/02(日) 12:27:38.07ID:???
ここは初心者からベテランまで、全ての人を対象に優しく答えるスレです

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

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

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

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

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

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

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

■CSS
Selectors Level 4 日本語訳
https://triple-underscore.github.io/selectors4-ja.html
0807Name_Not_Found
垢版 |
2019/07/20(土) 09:22:59.66ID:???
まあ答えを教えるならF12なんだけどねｗ
0808Name_Not_Found
垢版 |
2019/07/20(土) 10:50:06.30ID:???
・style直書き(!important付き)
・インラインスクリプトで対象要素のstyle書き換えを検出して再度上書き

上記コンボ採用ページの場合はどうにもならない可能性が高い
0809Name_Not_Found
垢版 |
2019/07/20(土) 10:53:37.93ID:???
>>796
> なんかもうええかなって・・・

>>792で「知ってる人いたらcssの詳細度の計算方法教えてくれ〜」といったから教えたのに、それはないんじゃないか
0812Name_Not_Found
垢版 |
2019/07/20(土) 11:33:32.06ID:???
ついにおかんむりになられるんですね
0813Name_Not_Found
垢版 |
2019/07/20(土) 12:42:10.83ID:???
階層が深くなるのがいやで<li href="#" />とかしたくなっちゃうんですけど
<li><a href="#" /></li>とするのと何か変わるんですか？
0814Name_Not_Found
垢版 |
2019/07/20(土) 14:09:57.61ID:???
ステイクールでいこうな？(怒)
0815Name_Not_Found
垢版 |
2019/07/20(土) 15:40:37.31ID:???
その理屈だと
<html><body href="#" /></html>
とかもできちゃうな
0816Name_Not_Found
垢版 |
2019/07/20(土) 16:02:33.63ID:???
後でタグの検索をすることがあれば違いが出るはず
0817Name_Not_Found
垢版 |
2019/07/20(土) 18:26:07.56ID:???
親要素の中にこ要素が3つあって
flexで横並びさせてるんだけど、最後の要素だけ横並び解除させたい？

どうすればいいですか？
0818Name_Not_Found
垢版 |
2019/07/20(土) 18:41:21.25ID:???
米倉放屁テロ
絶対許さない
0819Name_Not_Found
垢版 |
2019/07/20(土) 19:19:59.97ID:???
boubaubau moi
↑フランス語読みでブボボモワ
0820Name_Not_Found
垢版 |
2019/07/20(土) 20:25:39.26ID:???
>>813
何が変わるってliにhref属性は意味がない
まぁ言いたいことは分かるけどね
0822Name_Not_Found
垢版 |
2019/07/20(土) 20:26:46.72ID:???
どういう内容でそんなことを死体のかよく分からんけど
0823Name_Not_Found
垢版 |
2019/07/20(土) 23:38:03.35ID:GQQt48PV
1ページのみで完結する特設サイトを作るんですがcssファイルをhtmlと切り離すメリットってありますか？
0824Name_Not_Found
垢版 |
2019/07/20(土) 23:41:24.97ID:???
その場合は無いと思う
下手に既存のcssに混ぜると見づらくなるだけ
style要素に直接書いても良いんじゃないか
0825Name_Not_Found
垢版 |
2019/07/20(土) 23:48:36.02ID:???
>>820
付けられる要素が決まってるわけですか
失礼しました
0826Name_Not_Found
垢版 |
2019/07/20(土) 23:50:55.92ID:???
>>825
そこ知らなかったのか
hrefはa要素だけだよ
0827Name_Not_Found
垢版 |
2019/07/21(日) 03:10:05.90ID:???
>>824
さすがにそれはないわ
style属性に書いたらレスポンシブ対応できないし、
不具合時の要因も見つかりにくいし修正が面倒になるだけ
0828Name_Not_Found
垢版 |
2019/07/21(日) 03:12:52.11ID:???
>>823
個人的にはcssの行数が多いと、邪魔になる（php、js、html、cssと全部書くとえらいことなる）し
sass使ったり、あとからページ数増やす事なんてザラな印象だわ
0829Name_Not_Found
垢版 |
2019/07/21(日) 04:22:04.35ID:???
特設サイト専用にCSSファイルを1個増やすだけでいいし
むしろ切り離さないデメリットの方が大きいよな
0830Name_Not_Found
垢版 |
2019/07/21(日) 10:06:31.13ID:???
style属性だとhoverとかの疑似クラスもできなくなるのに
0831Name_Not_Found
垢版 |
2019/07/21(日) 10:21:14.30ID:???
>>827>>830
んなわけないじゃん、と思ったらもう少しよく読んで欲しい
style要素だよ
style属性とかめんどくさすぎるわ

>>829
絶対に切り離した方がいいのは間違いないな
どう切り離すかは好みに寄ると思う
0833Name_Not_Found
垢版 |
2019/07/21(日) 12:05:18.45ID:???
タグはタグだけの事
中身も含めるなら要素
0834Name_Not_Found
垢版 |
2019/07/21(日) 14:02:35.33ID:???
>>827が誤読しただけ
この場合は「style要素」でも問題ない
0835Name_Not_Found
垢版 |
2019/07/21(日) 14:38:53.26ID:???
「style要素」って確かに合ってるけど一般的なの？
自分は内部スタイルシートって読んでたわ

・外部スタイルシート、外部css
・内部スタイルシート、内部css
・インラインスタイル、style属性、タグに直書き
0836Name_Not_Found
垢版 |
2019/07/21(日) 14:43:20.56ID:???
>>835
使わないと言えば使わない
ただ、style要素と聞けばあぁhtmlに直接書くのね〜ってのはまぁ分かる
特にランペなら文脈から想像できるだろう。style属性と間違えるのはありえない
0837Name_Not_Found
垢版 |
2019/07/21(日) 15:20:44.71ID:???
分類するとしたら下記3種

・外部(インポート)
・インライン(style要素に直書き)
・style属性(対象要素に直書き)
0838Name_Not_Found
垢版 |
2019/07/21(日) 15:23:29.53ID:???
>>837
インラインがstyle要素か属性か分からない
個人的にインラインでcssって属性の方に感じる
0839Name_Not_Found
垢版 |
2019/07/21(日) 15:34:57.96ID:???
>>838
そんな文脈で「インライン」を使うの??
0840Name_Not_Found
垢版 |
2019/07/21(日) 15:47:52.95ID:???
>>839
プログラマだとそういうのが多いんじゃないか？
できるだけ下位要素（webだとhtmlの中の1要素）に密接した形で記述、それがインラインって感覚だわ

foo属性やfoo要素って単語を適切に扱う、分からなければ聞く、を徹底していれば伝達の齟齬は起きないので
俺の所では問題にはならないけどね
0841Name_Not_Found
垢版 |
2019/07/21(日) 18:45:50.81ID:???
style属性使うのがインラインだと
0842Name_Not_Found
垢版 |
2019/07/21(日) 19:14:11.42ID:???
CSSでいうインラインはブロック要素の対になるインライン要素のことを指す
言葉遣いには気をつけろ
0844Name_Not_Found
垢版 |
2019/07/21(日) 21:47:49.55ID:???
>>838
同意だな。
よく営業の人とかもメールで
インラインでお答えしますって書いてくるけど
それもどちらかというと既存のものをそのまま利用してるから感覚は属性の方だよね
0845Name_Not_Found
垢版 |
2019/07/21(日) 22:56:35.92ID:???
インラインスクリプト「...」
0846Name_Not_Found
垢版 |
2019/07/21(日) 23:08:46.63ID:???
インリンオブジョイトイ
0847Name_Not_Found
垢版 |
2019/07/22(月) 00:24:32.35ID:???
インランｵﾈｴｻﾝ「」
0848Name_Not_Found
垢版 |
2019/07/22(月) 05:51:29.41ID:???
スタイル属性は、ヤバイやつ

JavaScript, jQuery などで、ユーザーのアクションに応じて、変えるデザイン

コーダーには関係ない。
プログラマーがデザインを上書きするもの

入力欄に、間違った形式の文字列が入っていれば、
エラーチェックで、赤く表示するなど
0849Name_Not_Found
垢版 |
2019/07/22(月) 07:02:18.94ID:???
スタイル属性で赤くするとかアホやろｗ
お前プログラマじゃない
0850Name_Not_Found
垢版 |
2019/07/22(月) 08:42:05.65ID:???
>>837
> ・インライン(style要素に直書き)

改行を挟んで書くのが主流だと思うけど、あなたは一行で書いてるの？
0851Name_Not_Found
垢版 |
2019/07/22(月) 09:34:11.15ID:???
>>848
臨時的な告知、短期で急ぎの場合、ヤフショのような独自システムなど、
運用最終の状況に応じて普通に使う事もある。
構築だけが制作ではない。
お前コーダーじゃない
0852Name_Not_Found
垢版 |
2019/07/22(月) 11:21:06.75ID:???
世の中には2種類のコーダーがいる
「俺か、俺以外か」
0855Name_Not_Found
垢版 |
2019/07/22(月) 17:47:14.98ID:VIAeUkG9
ブラウザを縮めた時に、左から画像テキスト、となっているものを、本来であれば画像が上に来てしまうんですが、縮めた時に画像が下に生かせる方法はありますでしょうか？
通常時の画像、テキストの配置は保ちたいです

よろしくお願いします
0856Name_Not_Found
垢版 |
2019/07/22(月) 18:04:49.39ID:k3OaAWCL
>>855
クエリセレクタ
grid
0858Name_Not_Found
垢版 |
2019/07/22(月) 19:34:09.92ID:k3OaAWCL
>>857
ごめん
なんで間違えたか自分でもわからん
雑巾がけしてくる
0859Name_Not_Found
垢版 |
2019/07/22(月) 21:19:46.72ID:???
>>855
方法1
ソースの順番を今と逆にして、PCの見た目だけはフロートで画像が左にくるようにすればいい。

<div class="clearfix">
<p class="right">テキスト</p>
<p class="left">画像</p>
</div>

pc
.right{float:right;}
.left{float:left;}

sp
.right,.left{float:none}

方法2
flexでレイアウトして、order プロパティで順番を指定すればいい。（スマホとpcの時とで順番を逆にする）
0860Name_Not_Found
垢版 |
2019/07/23(火) 01:28:20.66ID:???
わかったかこのやろう！
0862Name_Not_Found
垢版 |
2019/07/23(火) 08:08:36.64ID:n8kM2AZD
要件に無くてもWCAG2.1を意識したデザインやコーディングって必要だと思いますか？
先輩がウザいんです
0863Name_Not_Found
垢版 |
2019/07/23(火) 08:47:00.03ID:???
>>862
先輩もうざいと思ってるんじゃない？
君からは面倒くさい印象を感じる
0864Name_Not_Found
垢版 |
2019/07/23(火) 09:23:12.30ID:n8kM2AZD
>>863
どの辺から臭いますか？
0865Name_Not_Found
垢版 |
2019/07/23(火) 12:17:59.82ID:qVoR7kpI
WCAGというと
10年前の日系企業サイトランキングの惨劇を思い出す…
0866Name_Not_Found
垢版 |
2019/07/23(火) 12:39:02.62ID:???
>>864
自分で考えずにすぐひとを頼ろうとするところ
0867Name_Not_Found
垢版 |
2019/07/23(火) 12:47:15.53ID:???
うざい先輩いたなあ
でもある時点から周囲が彼を自分の上司にはふさわしくなくなってきたと感じ、
最終的にその先輩と同じ役職まで上ったよ。その先輩はその後色々あってやめた。
うざかったけど、色々教わったことは役に立ってるし、本当にあなたの能力が高いなら、周囲が放っておかない。
0868Name_Not_Found
垢版 |
2019/07/23(火) 14:01:45.28ID:n8kM2AZD
すいません、先輩がウザいのは自分の責任だと思いますので訂正します

ところでみなさんはWCAGへの対応ってされてますか？
0869Name_Not_Found
垢版 |
2019/07/23(火) 14:16:16.13ID:???
WCAGへの対応って型にはめてやってるわけではない。

定義されている内容の根本は昔から変わってないので、それはできる範囲で常に意識してるけど
汎用性やメンテナンス性、プログラムとの絡みなど、あくまで一般的に制作負荷になってくる内容ならば重視しない。
もちろん、障害者を意識したサイトであればちゃんろやるけど、常識の範囲でしかやらない。
常識の範囲ってのは慣れないとわからないと思う。
0870Name_Not_Found
垢版 |
2019/07/23(火) 14:28:02.91ID:qVoR7kpI
WCAG対応ってのは
まず、これはこう対応します、ここはここまで対応しますっていうマニフェストを作って
このサイトはちゃんとマニュフェスト通り対応してますね、って確認するもの

なので一概に「してますか？」ってのは答えにくい
極端な話「なにも対応しません」というマニフェストであれば、対応していることになっちゃう
0872Name_Not_Found
垢版 |
2019/07/23(火) 15:12:28.73ID:???
今から質問を全力投球するから覚悟を持って受け止めてほしいんだが
どうかね？
0874Name_Not_Found
垢版 |
2019/07/23(火) 15:58:10.80ID:???
金属バットで力の限り打ち返します。
0879Name_Not_Found
垢版 |
2019/07/23(火) 23:32:19.77ID:???
やっぱ明日からにするわ
命拾いしたな
0880Name_Not_Found
垢版 |
2019/07/24(水) 10:26:24.81ID:???
会社のホムペのフッターに住所表記するレイアウトってなうじゃないよね？

ハガキが主流だった大昔の名残りか何か？
0881Name_Not_Found
垢版 |
2019/07/24(水) 18:51:27.39ID:???
自分ならナウかナウじゃないかは重要視しないけどな
そこに記載する事で利便性が上がるのかデメリットが増えるのか、求められているのかを
考える。ナウかどうかなんんてデザイン力でねじ伏せられるんで。
0882Name_Not_Found
垢版 |
2019/07/24(水) 20:43:31.15ID:???
会社概要がフッターにしか無い場合はそこに住所かいちゃえばいいんじゃね
0883Name_Not_Found
垢版 |
2019/07/24(水) 21:00:15.87ID:ov6SfDL+
sectionの中にsectionやarticleってあり？
0886Name_Not_Found
垢版 |
2019/07/25(木) 01:02:30.84ID:???
横から色のついたレイヤーがしゅばっとでて
しゅばっとした後に画像が表示されるエフェクトで
有名なサンプルってある？
なんてネーミングで探せばいいかわからん
0890Name_Not_Found
垢版 |
2019/07/25(木) 13:16:06.60ID:Y81OC22i
>>886
作るの簡単だけど名前はわからんゴメン
0891Name_Not_Found
垢版 |
2019/07/25(木) 17:26:38.67ID:???
ホームページのpngデータのボタンアイコンがページを拡大すると荒く表示されます。

画像が原因ですか？
0892Name_Not_Found
垢版 |
2019/07/25(木) 17:44:40.84ID:???
>>891
そりゃ拡大したのが原因だよ
引き伸ばしてんだから荒れもするさ
0894Name_Not_Found
垢版 |
2019/07/25(木) 19:38:59.29ID:???
>>892
でも拡大してもアイコンが全然荒れないページとかもあるんですよね…
0896Name_Not_Found
垢版 |
2019/07/25(木) 19:48:08.98ID:???
>>895
ベクターデータってイラレで作った
線がパッキパッキデータですよね？

ワイ、イラレでボタンアイコン作ってpngで書き出したんやけど、ホームページに表示させたらなんか解像度あらいんやよね。
0899Name_Not_Found
垢版 |
2019/07/25(木) 19:57:11.24ID:???
>>896
イラレ　ベクターデータ
png　ラスターデータ

pngにした時点でベクトルの情報は失われている
>>897の通りsvgで書き出すと良い

>>898
普通はwebフォント
font awesome
でぐぐれ
0901Name_Not_Found
垢版 |
2019/07/25(木) 20:31:47.01ID:???
みんな回答ありがとう。

みんなの回答を無視して、イラレの元データのサイズを実際に表示させたい大きさの2倍にして、pngで書き出してホムペに表示させたら及第点くらいの解像度になったよ。
0902Name_Not_Found
垢版 |
2019/07/25(木) 20:49:39.44ID:???
ほんとクソみたいな回答しかないし
俺みたいな素人にもうsvgを押し付けんなよな
0904Name_Not_Found
垢版 |
2019/07/25(木) 20:53:10.50ID:???
>>901
それただのレティーナ対応や
今なら3倍の解像度が必要
0905Name_Not_Found
垢版 |
2019/07/25(木) 20:56:21.08ID:???
>>904
ワイのディスプレイRetinaとかじゃないんやけど…
0906Name_Not_Found
垢版 |
2019/07/25(木) 21:17:56.82ID:???
>>899
えー
font awesomeって普通なん？
colorが使える以外あんまり便利な気がしない印象
レス数が900を超えています。1000を超えると表示できなくなるよ。
ニューススポーツなんでも実況