X



HTML/CSS のどんな質問にも優しく答えるスレ 35
■ このスレッドは過去ログ倉庫に格納されています
0001Name_Not_Found
垢版 |
2018/12/10(月) 23:34:18.61ID:Xy1kPhq4
ここは初心者からベテランまで、全ての人を対象に優しく答えるスレです

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

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

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

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

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

■関連スレ
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
0672Name_Not_Found
垢版 |
2019/01/21(月) 15:55:39.20ID:???
>>671
マネすることしか出来ないんだなーって思う
0673Name_Not_Found
垢版 |
2019/01/21(月) 16:22:26.86ID:???
君のオリジナルの技術見せてよ
0674Name_Not_Found
垢版 |
2019/01/21(月) 17:01:14.89ID:???
>>672
× マネ
○ 一般的

奇抜な物を使うとユーザーが使い方分からないんだよ
個人的には、ハンバーガーメニューですらまだ奇抜な内だと思う
0675Name_Not_Found
垢版 |
2019/01/21(月) 17:06:50.36ID:???
>>670
divはデザイン的に使わざるを得ない時に、最終的に使うってレベル

>dlとかulとかをよく使うというのは、いわゆる下に流れていくようなサイトが多いという事でしょうか?
そう、今はモバイルが7割ぐらいのアクセスなので、モバイル中心に作る
divなんて基本的に使い所が無い
「モバイルファースト」とかで検索すると良い
0676Name_Not_Found
垢版 |
2019/01/21(月) 17:28:18.82ID:???
なんでulとdlはモバイル向けなの??
それこそセマンティックでもなんでもないじゃん
0677Name_Not_Found
垢版 |
2019/01/21(月) 17:31:25.51ID:???
>>676
モバイル向けなんて言ってない
単純に使う機会が多いってだけ
引用が多いサイトならblockquoteを多用することになるんじゃないか
0678Name_Not_Found
垢版 |
2019/01/21(月) 17:54:49.00ID:???
誰かセマンティックなお手本サイト見せてよー
0679Name_Not_Found
垢版 |
2019/01/21(月) 18:00:56.24ID:???
>>675
モバイルと関係なくね?
単に自分は要素少なくても問題のない簡素なデザインばかりしている、っつー話でしょ
別にそれが悪いとは言わんが
0680Name_Not_Found
垢版 |
2019/01/21(月) 18:14:35.26ID:???
divとハンバーガーが悪だと思い始めたら、ひとつ上のコーダーになれるんやでw
0682Name_Not_Found
垢版 |
2019/01/21(月) 18:36:22.82ID:???
>>680
あっはい、茶化すなら君が上に上がるためのコーダーの指標をどうぞ
0683Name_Not_Found
垢版 |
2019/01/21(月) 18:44:09.85ID:???
>>682
強いて言えば、<strong>愛</strong>っすかね
0684Name_Not_Found
垢版 |
2019/01/21(月) 18:47:59.35ID:???
お前ら何でそんなに攻撃的なの?
0685Name_Not_Found
垢版 |
2019/01/21(月) 18:59:25.37ID:???
おまえらがいくらがんばっても
結局はコンテンツの中身と被リンクだから
0686Name_Not_Found
垢版 |
2019/01/21(月) 19:11:54.47ID:???
時々でいいからmarqueeの事も思い出してあげてください
0687Name_Not_Found
垢版 |
2019/01/21(月) 19:13:57.06ID:???
>>685
そうそう
フロントの要素やらなんやらは本当に意味がない
これ否定する奴は一回全部divでサイト作ってみれば良い
0688Name_Not_Found
垢版 |
2019/01/21(月) 19:46:00.78ID:???
誰もspanについては言及してない件
0689Name_Not_Found
垢版 |
2019/01/21(月) 19:51:42.30ID:???
>>668
文字化してインデックスしてくれるやつ、類似画像検索では引っかかるやつ、まったく読んでくれないやつ
それぞれあるみたい
試してみてるページそんなに多くないんで何をどうすればよいのかはわからんすまん
0690Name_Not_Found
垢版 |
2019/01/21(月) 19:54:25.59ID:???
>>688
divとspan、意味のなさならdivが包括しているので

>>689
前例があれば、ちょっと聞いてみたかったってだけだよ
実際にやることはほとんど無いと思うからね
すごく役に立ったので大丈夫、本当にありがとう
0691Name_Not_Found
垢版 |
2019/01/21(月) 20:05:58.42ID:???
divは汎用的なブロック要素って意味がある
存在する意味がないみたいな認識なら、勉強不足じゃないかなぁ
0692Name_Not_Found
垢版 |
2019/01/21(月) 20:15:33.49ID:???
何この糞つまらない流れ……
0693Name_Not_Found
垢版 |
2019/01/21(月) 20:33:54.94ID:???
htmlのサイズは極力小さくするよう努力した方がいいのでしょうか?
0694Name_Not_Found
垢版 |
2019/01/21(月) 20:39:17.73ID:yS824t/A
>>693
とくには

大アクセスされるようになって
伝送料金を節約したい、とかそういう理由があるなら考えてもいいと思うけど
0695Name_Not_Found
垢版 |
2019/01/21(月) 20:59:37.65ID:???
まあでも、サイズが増える→移動中にクソ格安回線で見てる大量のザコ乞食の読み込み時間が延びる→離脱率少し上がる
だから大したことないとは言え確実に離脱率は上がる。
0696Name_Not_Found
垢版 |
2019/01/21(月) 21:29:04.63ID:???
ツールで処理する程度の手間でよいと思う
0697Name_Not_Found
垢版 |
2019/01/21(月) 22:15:28.60ID:???
サーバーサイドで華麗に最適化した努力を
糞みたいなJSを埋め込んで邪魔をするフロント
0698Name_Not_Found
垢版 |
2019/01/21(月) 22:52:07.63ID:???
やっぱこのスレの奴らはダメだな
バカばっかりだ
俺が取り締まってやらないとな
0699Name_Not_Found
垢版 |
2019/01/21(月) 23:14:27.19ID:???
>>693
小さくするというより、見やすくすると良い
変にテクニカルにするのではなく、まとめたほうが見やすいところはまとめておけば良い
0700Name_Not_Found
垢版 |
2019/01/21(月) 23:14:52.27ID:???
全板でワッチョイ強制導入らしい
アホ共が浮き彫りになって面白そうだwww
0701Name_Not_Found
垢版 |
2019/01/22(火) 00:36:01.33ID:???
今までの書き込みにも出るんだったら死ねるな・・・
0702Name_Not_Found
垢版 |
2019/01/22(火) 00:37:30.36ID:???
それでたら面白いだろうな
阿鼻叫喚だろうけど、是非やってほしい
0704Name_Not_Found
垢版 |
2019/01/22(火) 09:56:58.47ID:QYIhIs9P
translateZと言うのはZ方向に移動するそうですが、
Z方向に移動しても変化が確認出来ないのではないですか?
translateXやtranslateYなら動きが分るのですが。
0705Name_Not_Found
垢版 |
2019/01/22(火) 11:13:09.07ID:???
>>704
absoluteで重ね合わせたときなどに、どの要素が一番前に来るかを調整できる
ほとんど使わんけどね
0706Name_Not_Found
垢版 |
2019/01/22(火) 11:17:55.41ID:???
>>704
そうでもない
言葉で説明するのも難しいけど
xyzとrotateの値を合わせて変えてみるとわかりやすいと思う
要はmatrixだ
0707Name_Not_Found
垢版 |
2019/01/22(火) 11:58:44.70ID:???
>>704
まず705は嘘だからスルーしてね
translateZは奥行きを変化させるんだけど視点がデフォルトのままだとそれ単体ではほぼわからない
translateZの違う要素をいくつか並べて、併せて perspective(500px) を入れてみて
0709Name_Not_Found
垢版 |
2019/01/22(火) 12:23:44.78ID:???
お前らろくに言葉で説明もできんのか・・・

>>704
(3次元空間の)Z軸の移動は
遠くのものは小さくなるという効果がある

>>705
CSSの重ね合わせは重なりの順番だけで
2次元空間なのでちょっと違う
0710Name_Not_Found
垢版 |
2019/01/22(火) 13:01:13.75ID:???
>>701
他の板に導入されたときは、導入前に立てられたスレは対象外だった
よって、おまえの醜態は晒されずに済むだろう
0711Name_Not_Found
垢版 |
2019/01/22(火) 13:03:00.21ID:QYIhIs9P
>>708
凄いですね。
translateZの意味が分かりました。
ありがとうございました。
0712Name_Not_Found
垢版 |
2019/01/22(火) 16:48:29.44ID:???
>>649
すみません、これは社内にテンプレートがいくつかあって
それを利用して作成しているという事ですか?
0713Name_Not_Found
垢版 |
2019/01/22(火) 19:02:41.58ID:???
いまだにfloatコーディングなんだけど
flexとgridどっち覚えたらいいですか?
このスレだとflex使ってる人が多いみたいだけど
gridの方が欠点があんまりないってのを他のサイトで見たもので...
0714Name_Not_Found
垢版 |
2019/01/22(火) 19:07:59.30ID:???
>>712
要するに作らないでテンプレ売りしてるだけの似非ってことだよ
0715Name_Not_Found
垢版 |
2019/01/22(火) 19:14:00.51ID:0X4Nr5Q5
>>713
両方
別にfloatがいかんてこともないよ
適材適所だ



とんとfloat書かなくなったけど
0716Name_Not_Found
垢版 |
2019/01/22(火) 19:19:41.91ID:???
>>713
flex
gridは対応ブラウザが絶妙で怖い。会社のページには使わない方が良いと思う
スマホゲーのサイトならgridでもいいかもね
0718Name_Not_Found
垢版 |
2019/01/22(火) 20:16:36.46ID:???
>>717
毎回同じとは限らないんだよなぁ・・・
0719Name_Not_Found
垢版 |
2019/01/22(火) 20:39:00.66ID:???
つーかほんとに導入されるのかな
だとしたら嬉しいかもしれん
0720Name_Not_Found
垢版 |
2019/01/22(火) 20:40:39.96ID:???
>>715
>>716
ありがとう!
floatはまだ使っててもいい感じですね
しかしながら、flex、gridのお勉強も必要みたいなんで
ぼちぼちflexからやりたいと思います。
数年に一度コーディングの流れ変わるのなんとかなんないかしら=3
0721Name_Not_Found
垢版 |
2019/01/22(火) 20:50:02.48ID:0X4Nr5Q5
>>720
それは放置して貯めてるからだw

新しい機能やプロパティを
へ〜こういうのができるのね〜程度に
たまーに追ってれば大丈夫だよ
0722Name_Not_Found
垢版 |
2019/01/22(火) 21:27:05.41ID:???
floatはレスポンシブでめんどくさい
はっきり言って書いててアホらしくなる
0723Name_Not_Found
垢版 |
2019/01/22(火) 21:37:03.09ID:???
絶対にPC使ってる人しか見ないようなサイトでも
レスポンシブデザインにしたほうが無難でしょうか?
0724Name_Not_Found
垢版 |
2019/01/22(火) 21:48:45.19ID:???
上であったhtmlのサイズについて思ったけど
ソースに改行を入れないってのは少しでも効果あるのかな
brとかじゃなくソース自体の改行コード
0726Name_Not_Found
垢版 |
2019/01/22(火) 22:13:55.83ID:???
>>723
もちろんそっちの方が無難
慣れたらそもそもそんなに手間じゃない
横並びの要素をwidth100%にして縦並びに買えるだけ
迷う時間の方がもったいない
0727Name_Not_Found
垢版 |
2019/01/22(火) 22:40:52.11ID:???
>>724
ちゃちゃっと計算してみたらいい
文字コードUTF-8・改行コードLFで10,000行のHTMLを書いたとして
改行文字の量は

10,000B = 0.08Mb

ドコモが測った泥LTEの実行速度の中央値が190Mbpsだそうなので
https://www.nttdocomo.co.jp/support/area/effective_speed/

0.08 ÷ 190 ≒ 0.00042秒

改行コードがCR+LFだったとしても0.00084秒
気にするほどのもんでもなかろう
0729Name_Not_Found
垢版 |
2019/01/22(火) 23:10:36.53ID:???
AAって最近表示崩れまくるしPC以外だとCSSでどうにかしようとしても崩れる気がする
そこで画像化してサイトに並べようと思うんだけど画像だらけのページって
googleさんからどういう評価受けるんだろう?
0730Name_Not_Found
垢版 |
2019/01/22(火) 23:12:23.20ID:0X4Nr5Q5
>>729
べつに
0731Name_Not_Found
垢版 |
2019/01/22(火) 23:13:05.92ID:0X4Nr5Q5
途中で投稿してしまった

>>729
べつにどうってことない
インスタグラムのページとかだって普通にヒットするじゃろ?
0733Name_Not_Found
垢版 |
2019/01/22(火) 23:18:14.93ID:???
>>729
もうAAは限界かな
一行AAはともかく、複数行はもうスマホでガタガタだ
0734Name_Not_Found
垢版 |
2019/01/22(火) 23:22:00.92ID:???
画像で見て初めて「えっAAってこう見えてるのが正常なの?」ってなるよね
0735Name_Not_Found
垢版 |
2019/01/22(火) 23:38:27.75ID:???
AA書体をウェブフォント化して
font-familyに当てても駄目かね?
0736Name_Not_Found
垢版 |
2019/01/22(火) 23:41:24.93ID:???
>>727
>>724がまともなやつならインデントも取ってるだろうしもっと膨らむぞ
0737Name_Not_Found
垢版 |
2019/01/22(火) 23:51:18.40ID:???
>>736
インデントも削ってみよう

10,000行で、平均4段のインデント(スペース4)があったとして
160,000B = 1.28Mb
0.96 ÷ 190 ≒ 0.00674秒

まあこれも誤差ですな
0738Name_Not_Found
垢版 |
2019/01/22(火) 23:51:53.39ID:???
間違えた
1.28 ÷ 190 ≒ 0.00674秒
0739Name_Not_Found
垢版 |
2019/01/23(水) 00:06:22.49ID:???
そんなに減らしたきゃミニファイすりゃいいだけ
0740Name_Not_Found
垢版 |
2019/01/23(水) 00:12:23.90ID:???
urlの記述って一向に進化しないよね
0741Name_Not_Found
垢版 |
2019/01/23(水) 00:14:16.49ID:???
そういやipも
255.255.0.1
なら
ff.ff.0.1
で行けるんじゃねって思ったけどディレクトリあるからあかんな
0742Name_Not_Found
垢版 |
2019/01/23(水) 00:44:28.72ID:???
ルーティングからビューの出力が始まるまでの時間の方が圧倒的に長い訳で
0743Name_Not_Found
垢版 |
2019/01/23(水) 00:47:09.47ID:???
昔は画像がスクロールするごとに読み込まれるjqなんとかを喜んで使ってたけど
今だと余計な機能なんですかね?
0744Name_Not_Found
垢版 |
2019/01/23(水) 00:48:52.14ID:6y7r5Jzd
>>743
そうでもない
特にモバイル利用が増えたんで
見られるかどうかわからん画面のはるか下方の画像をロードするのは
ユーザにとってもサーバ側にとっても、そんなにいいことない
0745Name_Not_Found
垢版 |
2019/01/23(水) 01:16:30.85ID:???
その辺はスマホブラウザが自動的にやってくれるようになったよ
0746Name_Not_Found
垢版 |
2019/01/23(水) 09:10:29.36ID:???
chromeだけだしまだexperimentalだろ
0747Name_Not_Found
垢版 |
2019/01/23(水) 09:30:45.33ID:CetDgheS
質問です
レンタルサーバーで独自SSL化するとアドレスがhttpsになると思うんだけど
独自SSL化した後にも外部からhttpのアドレスでも表示される?

他サイトみるとhttpのリンク踏んでもhttpsのサイトにしっかり表示されてるんだけど。
0748Name_Not_Found
垢版 |
2019/01/23(水) 09:41:03.95ID:???
>>747
どうぞ
.htaccess に追記してください

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
</IfModule>
0749Name_Not_Found
垢版 |
2019/01/23(水) 12:33:00.02ID:???
<div>

</div>

たぶん、DOM に、改行・コメントなどの要素も入るだろ?
要素は「改行・あ・改行」

だから配信前に、ミニファイ必須!
0751Name_Not_Found
垢版 |
2019/01/23(水) 13:09:42.28ID:CetDgheS
>>748
ありがとうございます。

これ追記しないでhttps化するとhttpのリンク踏んだ場合は表示されないのですか?
0752Name_Not_Found
垢版 |
2019/01/23(水) 13:22:41.12ID:???
マークアップ言語なのにソースの改行がレンダリングに影響するとか、そもそもの仕様がクソだろ
0753Name_Not_Found
垢版 |
2019/01/23(水) 13:33:04.82ID:???
>>752
まぁねぇ
htmlを大幅に改良したマークダウンってのがあるけど、もっと流行るかと思ったけどサッパリだ
0754Name_Not_Found
垢版 |
2019/01/23(水) 13:36:25.74ID:6y7r5Jzd
>>752
もともと英語圏のもんだからねえ
連続する改行とスペースは1つのスペースとみなすってのはわりと合理的なのかもしれん
0755Name_Not_Found
垢版 |
2019/01/23(水) 14:02:37.95ID:???
>>751
サーバーの設定による
403になる場合やそのままhttpで表示される場合やhttpsにリダイレクトされる(>>748をサーバー側でしてくれる)場合など
0756Name_Not_Found
垢版 |
2019/01/24(木) 01:46:47.87ID:???
videoタグのjsからの再生がviteo mutedにしないとできないらしんですが無理やり再生する方法ってないですか?
Firefoxでは動いてたのにChromeじゃ動かなくてびっくりしました
0757Name_Not_Found
垢版 |
2019/01/24(木) 02:20:56.43ID:???
それが出来ると
職場で急にエロ動画が!てことができちゃうので
0758Name_Not_Found
垢版 |
2019/01/24(木) 12:39:22.49ID:???
chromeは主にウザイ広告に対してかなり規制をかけるようになった
ってか最初から音出すのはやめてくれ〜
0760Name_Not_Found
垢版 |
2019/01/24(木) 12:57:50.79ID:???
主だった広告CDNのドメインは全部127.0.0.1に振り向けちゃってるから
最近どんなうざい広告があるのかわかんなくなってきた…
0762Name_Not_Found
垢版 |
2019/01/24(木) 13:39:43.42ID:???
リンクの文字列に見せかけたやつとか、Googleのも酷いのあるで
0763Name_Not_Found
垢版 |
2019/01/24(木) 22:36:20.91ID:???
Sassの質問もここでいいですか
0764Name_Not_Found
垢版 |
2019/01/24(木) 22:48:28.23ID:???
いいよ
今はSass使わずcssとかあり得ないし
0765Name_Not_Found
垢版 |
2019/01/24(木) 22:59:08.47ID:???
ありがとうございます!

↓↓のような3つのファイルがあって
1.[ _template.scss ] テンプレート
 %template {
  .main {
   background: $BGColor;…
  }
 }
2.[ _theme-red.scss ] カラーテーマ
 $BGColor: red;…
3.[ _theme-blue.scss ] カラーテーマ
 $BGColor: blue;…

↓↓のようにcssを出力したいのですが
.theme-red {
 .main {
  background: red;…
 }
}
.theme-blue {
 .main {
  background: blue;…
 }
}

Sassの機能を使って実現できますでしょうか
目的は後にJSでclassを切り替えて全体の色を変えることなのですが…
0766Name_Not_Found
垢版 |
2019/01/24(木) 23:52:49.01ID:???
CSSを理解できてないのでは
0767Name_Not_Found
垢版 |
2019/01/25(金) 00:37:12.28ID:???
array
for
でできるんじゃね
知らんけど(鼻ほじ)
0768Name_Not_Found
垢版 |
2019/01/25(金) 00:57:24.77ID:???
>>764
どこの平行世界だよ
あぁお前一人しかいない世界かww
0769Name_Not_Found
垢版 |
2019/01/25(金) 02:26:32.29ID:???
SASS使えるとか使えないとかで喧嘩する流れやん!!
0770Name_Not_Found
垢版 |
2019/01/25(金) 09:22:12.54ID:???
喧嘩じゃなくsass使用不可の案件が存在する時点で>>764は世間知らずなだけって思ったけどみんながみんな仕事でやってるわけではないんだよな趣味の人だっているもんな
■ このスレッドは過去ログ倉庫に格納されています

ニューススポーツなんでも実況