HTML/CSS の質問に優しく答えるスレ 28 [無断転載禁止]©2ch.net
レス数が1000を超えています。これ以上書き込みはできません。
ここは初心者からベテランまで、全ての人を対象に優しく答えるスレです
類似質問大いに結構。分からない人は何回聞いても結構
HTML / CSS 関係の事なら何でもOK
質問するときはIDを出すためにメール欄を age にすることをおすすめします
回答してくれる方は優しい人のみ！
質問者に対して暴言を吐く人は このスレを見るな！！
終わった話を蒸し返すやつは このスレにくるな！！！
質問側も節度あるレスで！
質問前にスレ内を検索しましょう
■次スレについて
基本的にレスナンバー>>980を取った人（立てられない場合は次の宣言者）が立てて下さい
重複を避けるため、独断でスレ立てはせず必ず意思表示をしてから立てて下さい（>>980を取った場合も）
立てられない事が予め分かっている場合は、>>980付近の書き込みは自重しましょう
■前スレ
HTML/CSS の質問に優しく答えるスレ 27
http://echo.2ch.net/test/read.cgi/hp/1489201345/ 一応前スレの話題ネタも貼っておきます。
634 Name_Not_Found sage 2017/05/27(土) 15:07:18.61 ID:???
http://echo.2ch.net/test/read.cgi/hp/1478055094/604
>>ちなみにCDNは接続できない地区またはブロックされることもあります。日本でも繋がりにくいときもありますので業務用としてはお薦めできません。
>>606
>> ひでーなこれｗ
ここまでの間違い。バカなのかわざとなのか
晒し上げのネタにちょうどいいやｗ
>>612
>> CDNが接続できないとか何いってんだって感じだなｗ
探せばそういうのあるかもしれんけど、
繋がりにくいとかありえんわ。
そんなに不安ならGoogleのCDNでも使ってりゃいいだろ
>>613
>>そんなことしたら中国からの注文なくなるだろ・・・
やり取り見てわかったことは↓
別スレの604は「 CDNは接続できない地区またはブロックされることもあります。 」と可能性を主張したのに対して
>>606 は間違いと主張。
>>612 ありえんわと否定。
決定的と思われる発言がこれ「そんなに不安ならGoogleのCDNでも使ってりゃいいだろ」
やり取りを見ていて、おそらくCDNのデメリットを理解されていない。大規模商用サイトの構築経験がない方だとわかります。
デメリットを熟知されているのであればGoogleのCDNと言う説明レスではなく回避策やフォールバック等の説明をするべき。
以降は調べたのか理解されたようですね。 >>3
ローカルール違反ですよ？
> 終わった話を蒸し返すやつは このスレにくるな！！！ CDNの話自体は問題ない。
>>3が消えればいいだけ 996 Name_Not_Found sage 2017/07/17(月) 01:12:38.59 ID:???
次スレはテンプレにCDNの話題禁止って書いて欲しい。いい加減にしてくれ。 全世界のインターネット人口の数割はGoogleのCDNが使えないことを理解できましたか？ GoogleのCDNだけじゃありませんよ。
全世界のインターネット人口の数割はGoogleを使えないのです。
それに対して何か思うことはないのですか？ 何か思うところと言われても、そんなのその国の問題だろ？
知ったこっちゃねーよ。
はなっから相手にしてない。見れるなら見れれば良いし
見れないなら見れないで何もかまわない
その国の言語でサイト作ってるわけじゃないんだから
どっちみち読めないはずだ。 >>19
ローカルルールを守らないやつに対してのレスは問題ない 10pxの正方形のマス目を画面上全体に表示させるときに画像や動画以外の方法で書く場合どんな方法がありますか？
できるだけ負荷のかからないやり方を教えてほしいです。 >>22
すげー気持ち悪いことしようとしてるな
┛のbackgroundを並べれば済むと思うし、それが一番負荷が少ない
それが嫌ならcanvas＋jsとか >>22
15年前くらいにyoutubeでhtmlでモナリザの絵（かなりリアル）を描く動画があったけど
そういうやつかな？
テーブルタグのセルに色を付けて描くようだったけど描画はたぶんプログラム組んでたんじゃないかな。
今やるなら<p>タグかなんかをcssでやればいいんじゃね 前スレ
943 名前：Name_Not_Found[sage] 投稿日：2017/07/16(日) 22:48:18.02 ID:???
pいらなくね
俺ならulにclass(.foo)付けて
.foo li、
.foo a
にcssを割り当てるかな
li内で改行するときpいるだろ >>22
画像系なしならテーブルやボックスを並べてボーダーで表示となります。
HTMLとcss以外の方法だとJavaScriptを使い目的を実現する方法もあります。
その場合は専用スレから再度質問してみて下さい。 前スレ終わってしまったので再度
ul > li > p {…}
div > div > p {…}
など、idやclassつけるは別にして相関関係の>や+は速度面などの点であったほうがいいのでしょうか？
DOM構造の変更はありません インデントをスペース4つでやったら問題起きますか？他の言語と共用のIDE使ってるんで自動的に4つでインデントされるんです >>27
セレクタは子孫から調べる
ul > li > p {…}
の場合、まず
ｐ
を全部探す
その次に
li
を探し、
li>p
とする
メモリはほんの少し抑えられるけど、ほとんど変わらないはず。一度テストしてみて
>>28
問題は起きない。スペース4つが送信され、表示上は半角スペース一個になるだけ
速度や通信量面では圧縮もあるし、差は無いと考えていい
つまり考えなくていい
個人的にはスペース二個の方が見やすいと思うけど、そこは好みかね 22の者です。
>>26
少し重くなるみたいですがdiv使ってできました。
ありがとうございました。 >>28
今どき言語ごとにインデント設定できないIDEとかゴミだから捨てた方がいい
ただのエディタのsublimeですら設定できるのに >>29
>セレクタは子孫から調べる
でだいぶ違うのか疑問でした。ありがとうございます。 なんでdiv使うかｗ
ソースが膨らむ飾りだからこそ、文字数の少ない<p>を勧めたのに・・ >>33
文字数が少ないという理由で使うタグを決めるな
divもしくはspanがこの場合は適切だ JavaScriptの提案したりpタグだったり珍獣脳過ぎだろ >>33
なんでもいい、と思って進めると大抵よくないことが起きる
そんなしょーもないところこそ謎の手抜きじゃなく、キッチリしておいたほうがいい
強いて言えば、ファイルが数GBになるような場合に「手抜き」として採用していい手段 >>34,>>36
海外のサイト見てみい
アイコンには<i>タグ使用したりもしてるで >>37
i要素はhtml5にある
http://www.html5.jp/tag/elements/i.html
＞i 要素は、代替音声や気分など、質が異なるテキストだと示す形
まさにアイコンの事で何も間違っていない 屁理屈ばかり言う人や間違いを認められない人って使えないよな >>33
レイアウト、動的理由、いくらでも使う理由はあるが.。。。 >>33=>>37？
俺の勘違いならいいがHTMLのファイルサイズを少なくする目的でpやiタグ使えということ？
まさかそんなことないよな
たかが知れてるそんなことでメンテ性やSEOを捨てるなんてありえないからな
各タグは各用途に応じて使う、までは前提としていいかな？ >>43
アホ相手にするのは時間とスレの無駄だからやめてちょんまげ >>26は別人だが、不自然にHTMLを書き換えてdiv並べるよりjsの選択肢の提案は十分あり
画面上とはおそらくwindow内を指しているのだろうが、divだとスクロールした下をどこまで並べればいいかということもある
その点、また負荷や好みはあとは本人次第
・・・という文を書いたが>>44さんの意向でもういいや >>42
ここはHTMLとCSSのスレであってJavaScriptの質問スレではない。
それを考えれば容易に特定できる。 >>43
適切な日本語を使いましょう。
言い訳してることは理解できるけど文章がおかしいです。 >>47
全然おかしくない
多少濁点省略してるのが君の脳内で処理できてないだけ
というか2chでいちいち細かい >>46
誰？に対してその回答は変だな
22→26のことならCSSよりJavaScriptの方が無難だから１つの提案として添えただけだろう
スレを回答者もわかってるからこそ誘導しているしCSSでも答えている >>47
はっきりしてるのは、今回の例で<p>を
使うのは明らかに間違いだってこと
その前提はOK？ >>49
JavaScriptの話題をするやつは全員敵だ >>50
今回の例てどれだよ
あおそらくわかるがその前提がずれてると今後かみあわなくなるからアンカで示してくれ
>>51
ようは知らないからと jsでやるべきことを無理やりDOM変えたり無理やりCSSだけでやろうとするほうがおかしい
提案くらいは別にいいだろよ >>52
↓こいつが間違いってこと
33 名前：Name_Not_Found[sage] 投稿日：2017/07/18(火) 01:41:59.34 ID:???
なんでdiv使うかｗ
ソースが膨らむ飾りだからこそ、文字数の少ない<p>を勧めたのに・・ >>57
だからなんでおかしいのかを聞いてるのだよ
その中に文を入れてるのだからむしろ段落として正しいだろに
それともliの中に入れてることがおかしいと？ >>60
pの中に文を入れるってどこの話？
今回は全くわからんからアンカで示してくれ >>61
>>27
しかないがな
他にどれがある？ ＞今回の例で<p>を使うのは明らかに間違い
どれ？なぜ？
はっきりせいやｗ >>22 この人が主。
10pxの正方形のます目。
指定は画像や動画以外の方法。
出来る限り負荷を減らしたい。
>>23 htmlやCSSを使った方法を一つも提案していない。
>>24 htmlやCSSを使った方法を提案している。
>>26 htmlやCSSを使った方法で提案している。
>>30 主から26の方法で解決したとレス。 >>63
え？ 書いてあるじゃん
もしかして自分の都合の悪い例は見えない人？
話しにならんな。 >>62
> しかないがな
それじゃないだろ？
なんで>>33が見えないの？
都合が悪いから？ はぁぁぁぁぁぁぁぁぁぁぁ
>>27の話に決まってるだろ！！！！！！
お前らみんなばぁーーーかかか！ >>27の話なんか誰もしてない
バカはお前。恥ずかしいからってごまかすな また日本語に不自由してる基地外がわいてるのかよ・・
ホントわかりやすいな 一人のマヌケが>>27の話だと勘違いしていたってこと？
はい、みなさん、かいさんｗｗｗ >>64
23は0点
24と25は100点
結果的にこれなんだよね。 いや流れは>>27からだろ
というか一部のやつ”今回”とか曖昧にしないでアンカつけろよ >>74
ついてるじゃん？
本当にお前、都合の悪いレスは見えないんだね？ >>75
別人なら別人でいいが、お前が>>27の話だと
勘違いしているマヌケであることに違いはないよ？ どうみても>>22の話です。
22 名前：Name_Not_Found[sage] 投稿日：2017/07/17(月) 06:12:54.95 ID:???
> 10pxの正方形のマス目を画面上全体に表示させるときに画像や動画以外の方法で書く場合どんな方法がありますか？
> できるだけ負荷のかからないやり方を教えてほしいです。
30 名前：Name_Not_Found[sage] 投稿日：2017/07/17(月) 21:09:36.15 ID:???
> 22の者です。
>
> >>26
> 少し重くなるみたいですがdiv使ってできました。
> ありがとうございました。
33 名前：Name_Not_Found[sage] 投稿日：2017/07/18(火) 01:41:59.34 ID:???
> なんでdiv使うかｗ
> ソースが膨らむ飾りだからこそ、文字数の少ない<p>を勧めたのに・・ >>78
揚げ足とり
間違いを認めない人
日本語に不自由してる人
またいつものはじまったか・・ 間違いを素直に認められないやつは
煽るしかないわなｗ >>74
どうみても>>22の話
>>27が>>29で終わってるのは最低限のスキルがあれば誰でも分かる
これで>>27の話と思ってるなら単純に無知としか言いようがない うるせぇぇぇぇぇｌ
>>27の話に決まってるだろ！！！！！！
お前らみんなばぁーーーかかか！ ここまであほうな奴はいないと思う。
またjQueryスゲーの自作自演がはじまったんじゃね？ >>84
話は終わってるのに、divじゃなくてp使えとか
明らかな間違いを言い出した>>33がいるって流れ >>85
図星ならいつも通りの骨髄反射レスがあるはず >>86
うむ、ともあれ>>33が間違いってのは全員一致だろう >>85
jQueryの流れにしてもいいけど
今は>>74をおちょくる流れだろ
遊ばせろやｗ >>88
つまり今日の流れは脊髄反射レスには見えないってことだなｗ
俺もうまくレスできるようになったもんだｗ >>87
だからあんたの目には、ついてないレスしか見えないんでしょう？ >>89
全員一致だけど、本人は自演でも疑ってるんじゃないかねぇ 一人が複数の人を演じるのは自演って言うと思うけど
複数の人が一人（マヌケ）を演じるのは何ていうんだろう？ いや、複数の人が一人（マヌケ）を演じている場合、
その演じている人がマヌケ以外の書き込みをしている場合は、
一人が複数の人（自分とマヌケ）を演じてることになるから
これも自演か。なるほどなるほど >>96
それは２ちゃんねるの機能じゃなくて
その人が使ってるビューワーのせいなので
しったこっちゃない。 見たら>>25もあるな
これ前スレからの流れでその変形再質問が>>27 >>97
いやアンカはある意味マナーでもあるぞ
雑談スレはいいが特にこういうスレは すいません、前スレから解決していないのでお願いします…
ヘッダをposition:fixedにし、他複数のcssを設定しています
https://jsfiddle.net/zxe88253/8j3q0u31/1/
しかし、ページ内アンカと組み合わせると、main要素のmarginが消えてしまいました
http://www.gazo.cc/up/248801.png
何が悪いのか調べてみると、
document.getElementsByTagName('html')[0].offsetTop
document.getElementsByTagName('body')[0].offsetTop
が0、
document.getElementsByTagName('main')[0].offsetTop
は100になっています
（しかし、main要素は一番上に張り付いているように見えます）
色々試した結果、
・bodyのheightの100%を付け外しすると、marginがもとに戻る
ということが分かりました
marginが消える理由がどうしてもわかりません
これはどういう状況なのでしょうか
CSSはこのプラグインの一部です
slidebars
https://www.adchsm.com/slidebars/
jsでmarginを付けなおしたりしましたが、うまく行きません
何か良い解決方法があれば、お願いします
念のためトリップを付けておきます
htmlファイルもアップロードしておきました。ご利用下さい。
http://www.dotup.org/uploda/www.dotup.org1306674.zip.html >>103
mainのmargin消えてね〜じゃん。
mainのmargin増やしたり減らしたりしてみろ。 idなしなので揉めてる内容が良くわからないですな。
今来た物事からしたら揚げ足とりと間違いを認めない屑が顔真っ赤にしていると言う認識でok？ ブラウザが認識しているのは確かにmargin:100pxですが、どう見てもついているように見えません
なぜでしょうか… >>105
重要な間違いを指摘するのは
揚げ足取りとは言わんで？ >>103
html,body の overflow:hiddenをコメントアウトしてみ
そしたらスクロールバーが２つ表示されるはず。
一つは、htmlだかbodyだかのスクロールバー
もう一つは、mainのスクロールバー
その２つのスクロールバーを見ながら、
mainをスクロールしたときとhtml,bodyをスクロールした時何がどう動くか？
そしてリンクをクリックした時、何がスクロールしているか？に
注目すればわかると思う。
まあ答を書くと、
1. overflow:hiddenにしたときhtml,bodyをスクロールすることはできない。
2. リンクをクリックすると、html,bodyがスクロールしている（が、1.により動かすことはできない）
ということだな。
この話は良いとしてjQueryの話しようZE！ 何このスレ・・・・
やっぱりみんなストレスたまってんのかな
ただでさえこだわりの強そうな集団だし >>113
うおおおおおおおおお神！神！神！
ありがとうございました、やっと理解できました
marginがなくなってるとばかり思い込んでいて、ドツボにはまっていました
本当にありがとうございました、 質問スレでIDなしやアンカなしが混乱の元
誰もがいちいち最初から読むわけではないからな
アンカなしは直前（か近く）に対してとしてしまうことがある >>117
紛らわしいのは、アンカーでhtmlかbodyがスクロールして
その後にcssのheight:100%、overflow:hiddenが発動して
scrollTopやoffsetTopが0に変わってしまうところやね。
見かけ上スクロールしてないように見えてしまう <li>が数不確定で幾つかあり、高さ設定はせずブラウザまかせです。
例えば<li>の２番目と３番目を入れ替えるにはどうしたらいいでしょうか？ 2番目の<li>を選んで、CTRL+X
3番目に移動して、CTRL+V >>120
冗談抜きで>>121、もしくはjs
何がしたいのかさっぱり分からん HTMLはいじれないのです。CSSでお願いします。 >>24と>>33は俺なんだが、自分のカキコが火種で荒れててワロタｗ
格子模様にマークアップもクソもあるか。
そんな所divにしようがpにしようがSEOの影響なんて皆無だぞ。
まあ文字数制限なんて考える必要もない環境かもしれないがな。
また荒れそうだw
>>120
DOMレベルから順番変更するならinsertAfter();だな >>125
そもそもSEOが眉唾ものだから
正しい要素を使えってだけの話。 ちなみに、文字数制限が厳しいところなら圧縮かけるので
divをpに置き換えた所でどんなに文書が大きくても
10バイト程度の差しか生まれない PHPでDBから抽出したデータをリスト表示したいんだけど
こういう書き方って一般的？お前らが現場で見ても怒らない？
<table border='1'>
<tr><th>id</th><th>name</th></tr>
<?php
foreach($rows as $row){
?>
<tr>
<td><?php echo $row['id']; ?></td>
<td><?php echo htmlspecialchars($row['name'],ENT_QUOTES,'UTF-8'); ?></td>
</tr>
<?php
}
?>
</table> >>127
昔div厨っていう言葉があってだなｗ
装飾、入れ子、構造と意味を持たない要素とブロックレベル要素になんでもかんでも
divの入れ子だらけのサイトを作るやつはソースが見にくすぎるから敬遠されたもんだ。
まあいまはsectionとか色々できたから良いが・・ >>129
だから今は意味がない（デザイン目的の）
要素だからdiv使うって言ってんの
sectionでも代わりにはならん div厨の何が駄目かって、divを使うべきじゃない所に
divを使うのがダメなわけで、
正確には、正しくない要素の使い方をしているのが
ダメだって言われてるわけ。
だから段落でもないものにpを使うのは、
div厨と何も変わらんのだよ >>131
例えば小さなブロック内で背景を3段階のレイヤーで装飾する際に
<li><div><div><div>要素1</div></div></div></li>
<li><div><div><div>要素2</div></div></div></li>
<li><div><div><div>要素3</div></div></div></li>
こんな風にかいちゃうわけ？
自分ならこうするが。
<li><div><p><span>要素1</span></p></div></li>
.
. >>139
おまえ馬鹿なのか？
中に書くテキストが何かによって使う要素は変わるって
話をしているのに「要素1」とかいう何の手がかりもない
テキストを書いたって判断できるわけ無いだろ。
段落テキストなのかタイトルテキストなのか、
それによって使う要素は変わる >>133
あのな、最初はデザインのことなんか、
考えないで作れ
<li><p>段落テキスト</p></li>
これ以外でデザインのためだけに
何かを入れるならdivかspanしかない。
divかspanの使い分けかたは
https://developer.mozilla.org/ja/docs/Web/HTML/Element/span
> <div> 要素がブロックレベル要素の汎用コンテナであるのに対し、
> <span> はインラインレベル要素の為の汎用コンテナの役割を果たします。 リストは普通箇条書きに使うものだから
段落ってあまりないよね？ >>125
SEOはliのことだろう
あと蒸し返さなくていいから >>136
それはその通り。
でもまあ無くはない。
どちらにしろ言いたいことは、
デザインを抜かした状態で、文章の意味から適切な要素を決めるのだから
デザインの有無でdivやspan以外を変えることはありえないんだよ。 >>137
SEOは詐欺だからそんなもので使う要素を決めてはいけない >>134
liで括っているだろ？リストだよ。
みかん、りんご、バナナ
>>135
デザイン見て構造考えるのは普通だろ。
複雑なデザインカンプをコーディングしたことないってのがよくわかる。
そういう状況に陥った事ないからイメージできないだけだと思うぞ。
>>133はどうすんだ？
背景の3重装飾構造。つまり背景なんだからブロックレベルにするか？
それが4重5重だたらどうする？ >>140
> デザイン見て構造考えるのは普通だろ。
普通じゃねぇよｗ
あー、反論は良いや、
どこのサイト見て勉強した？
それ書いてみ。どこでデザイン（見た目）見て
構造考えるべきって書いてあるサイト 先ず最初に
<li>テキスト</li>
か
<li>
<p>テキスト</p>
<p>テキスト</p>
</li>
でもってデザイン上必要なら<div>や<span> >>140
> 背景の3重装飾構造。つまり背景なんだからブロックレベルにするか？
ブロックに対して背景を割り当てたいならdivだろうし
インラインテキストに対して背景を割り当てたいならspanだろ 議論しても無駄な気がしてきた。
恐らくHTMLからいきなりコーディングして後から簡易デザインするような
ブログみたいなサイトしかやったことないような人に感じてきた。 >>134
だよな
自分ならこうするが言われてもはあ、そうですかとしか言いようがない >>145
自爆してるぞお前ｗ
デザインからいきなりHTML作ってるだろ？ いまどきまだいるんだな？
見た目からHTMLを書き出すやつって。
見た目はCSSって習わなかったのか？
どうしても不可能なときだけdivやspanを使うんだよ
デザインはCSSを使うのだから、デザインからHTMLを作ることはない
文章が最初にあってそれを構造化する形でHTMLは書くんだよ >>142
残念ながらこっちは全て実務からの経験だ。本職ね。 クソ会社が多い中、本職と言われても
それで何を証明しようとしているのかわからん おまえらのレベルが良く分かった。
まあ専業プログラマーやコーダーなんてそんなもんだ。
何を言ってもわからないと思う。イメージができないだろうから。 いや、本職だぞ！やっと手に入れた正社員なんだぞ！
仕事でやってる俺のほうが実力上に決まってるだろ！
みたいな感じか？
井の中の蛙っていうか、相手も本職だと思わんのかね？
ずっと無職だったのか知らんが、本職は希少な立場じゃないぞ？ まあ予想通りの展開だなｗ
だからどこで（サイト or 本）で勉強したのか聞いたのにｗ
まあ独学かくそサイトだろうな。 >>152
文脈から判断できないところもコーダーあるあるだな。
言いたかったのは教科書や机上理論ではなく全て仕事の実務で経験してきた手法という事。 >>154
仕事の実務っていうのは仕事してりゃ誰でも経験詰めるんだよ
自分から行動を起こさないと手に入れられない
教科書や机上理論をお前は知らんのだろ？
片手落ちじゃん。
こっちは机上も実務も両方とも知ってると言うのに >>155
どのサイト見た？何の本読んだ？なんて普通聞かない。
受験生かよｗ
常に色々見てるから。 >>156
なんで普通聞かないと思ってるんだ？
色々見てるとか、みてね〜から言えないんだろｗ まああれだな。
勉強しないで独学でやってきたやつは
このようにだめことをいうんだぞっていう
いい例になったよ 俺的にはこれがカルチャー的な意味で
ショックだったわｗ
> 残念ながらこっちは全て実務からの経験だ。本職ね。
こんなこと堂々といえるやつがいるんだな。
4月に入社したばかりの新人かね？ 俺含む一部の第三者もちょこっと割り込む上に、IDないからわかりづらい
やり合ってる本人らはいいかもしれんがｗ >>162
結果だけ受け取れば良いよ。
つまりそいつは誰も擁護しなかっただろ？ってこと >>133の最後の行はおかしいな
背景を3段階のレイヤーでということは３つ同じ目的だろ？
同じ目的なのに違うタグ使うとは普通有り得ない
指摘してる人がいるように４重ならどうするのか
<p>はあくまで段落、<div><span>で３重囲いしたほうが自然 >>165
本職にもピンきりありますから…
匿名掲示板で権威を主張したいなら
自分がどれほど偉いのかって証明できるソースがないと無理ポン HTML5 Doctor Resources
http://html5doctor.com/resources/
div, span については、
これの日本語のフローチャートを参照 ■■■
■■■
■■
と980のエリアに横320のBOXがあって左右のBOXは各左と右のマージンを0に(親要素の左右幅にフィット)、その他のマージンは10pxにしたい場合どんなテクニックがありますか？
今はflexで簡単にとおもいきや結局フロートと変わらず親要素にマイナスマージンを指定しています ドリームウィーバーでホームページカタログのサイズをまとめて変更したいのですが、置換で画像のサイズ値を置き換えると画像が表示されなくなります
問題として何が考えられるでしょうか 融通の利かなそうなマニュアル頭ばっかりだな
柔軟な発想持てよ
web制作会社に就職できないぞ >>172
dwの使い方なら専用スレあるんじゃないのか？ >>174
融通が利くとはこのことですか？
<li><div><p><span>要素1</span></p></div></li> >>148
机上の空論だな
つまりお前の言う手法はデザインカンプを見ないで
原稿の状態だけでHTMLの構造化、コーディングはできる言っているんだぞ？
普通はな、デザインが出来上ってからコーディングや文書構造を考えるんだよ
デザインカンプ見てから、リスト部分であればliタグで括るかとか
表組みであればtableを使用するかなどレスポンシブも考慮した上でな
まあ理解できないだろうけど >>176
appleの公式サイトのグローバルナビがliの中にどうしてspanを使うか考えてみろ 教科書がとか教わるとか学ぶとか言っているヒヨッコ共は
世の中のサイトのソースを見る習慣を付ける事を勧めるよ
技術は人に教えてもらうものではない >>177
いや、普通にできるだろ？
誰もdivやspanを使うことを否定なんかしてないんだから
お前はできないんだろ？
そこから技術力に大きな差があるって気づけよ それにデザインカンプ見てから作るってのもおかしい話だよな？
デザインカンプは作るものだろ？
まるで他人からこれ作って言われて
ただ単にそのHTMLを書いているだけの人みたいだ。 >>179
世の中のサイトのソースなんて普通に見てるよｗ
お前がやってること全てやってる + 教科書などで勉強してる。 教科書とか言ってる時点でたかが知れてるなｗ
DWかSublimeあたり使って、不要になった大量のベンダープレフィックス付けながらドヤ顔で生のcss書いてfloatレイアウトしてそう。
>>171
それは俺も散々探したけど無理
https://stackoverflow.com/questions/18744164/flex-box-align-last-row-to-grid
jsで制御するしか方法はないけどjsで制御するのはスマートじゃないので結局親にマイナスマージン付けるしか無いね。 >>171
一応補足、要素数が固定の場合なら疑似要素や空要素作って要素数を調整する方法がある。
無理なのは要素数が不特定の場合ね。 >>178
話の流れが読めてないようだな
つか133擁護はもう諦めろ
決着はついてる >>183
> DWかSublimeあたり使って、不要になった大量のベンダープレフィックス付けながらドヤ顔で生のcss書いてfloatレイアウトしてそう。
例が具体的だなｗ
まるでお前がよく知る環境は
そうなんですって言ってるようだｗ >>171
全てにmargin-bottom: 10px
それをfloatで並べた後
○○:nth-of-type(3n+2) {
margin-left: 10px;
margin-right: 10px;
} >>183
そしてバージョン管理はファイル名の末尾に_20170723までがセット >>171です
結局昔と変わらずなんですね
左右フィットしたカードレイアウトなんて一番出てくるケースなのでそろそろなにか対応プロパティ作ってくれてもよさそうなのに >>173>>175
遅くなりましたがありがとうございます
ソフトのことならソフトのスレで質問するのがベターですね、失礼しました >>191
その手の要望はnthとcalcでだいたい解決してるじゃん？
それに対するショートカットが欲しいなら
自分でmixin作るなりすればいいのよ クソワロタ
浅いって言われたこと根に持つなよｗｗｗ 実際お前らって今どきのタスクランナーやメタ言語、ちゃんとしたIDEバリバリ使ってるの？ ああ、使うけど場合による
外注先がそういうの出来ませんて時や
こっちで作って納品後、客もいじるような案件では使わないこともある >>191
flexとか使えば別の方法があるかもな
ただ俺はブラウザ対応を広く取るたちで事足りてることをわざわざ狭めるのは好まないのだよ
nth使ったその手のことはCSSの基本の解説サイトや書籍にたいてい出てる
少なくとも他にも影響が出かねないネガマージンよりましだと思うがな
答えて損したわ >>181
ふむ。やはりそうだな
小さい規模のサイトや好き勝手にコーディングしながらデザインを考えて
都合に合わせてデザイン変更できるような自分用のサイトみたいなのしかやったことないんだろ？
経験が浅いから分業や制約のイメージが付かないんだよ >>181
試しにさ、大手企業へ原稿もらってから納品するまでのフローを言ってみて
クライアント・代理店・ディレクター・制作というメンバーを意識して
それとどこの間で戻しが発生するかなども それと制作内でのフローも
デザイナー、フロントエンド、バックエンドのフロー
どのタイミングでクラに報告するかなど 「き・・教科書にか・・書いてない・・」
必死でネットで調べそうｗ >>200
損も特もないだろ…
そもそも最初からflexでやってるってかいてあるしべつにネガティブマージンで影響なんてでないだろ？
むしろバグるブラウザがあるならそれこそnthに対応してるかすら怪しいけど >影響なんてでないだろ？
え！
>バグるブラウザ
対応と・・・ 見た感じ
わかってるから>>207の書き込み。
わかってないは>>206。
だいたいネガティブマージンなんて普通よほどでないとやらんぞ。 わかってるなら例を挙げられるわな
どうぞこちらで
https://jsfiddle.net/ 俺も最初はネガティブマージンきめえって思ってたけどnthでやるよりスピード速いからネガティブマージンで揃えるようにしたわ ネガティブマージンはキモいんじゃなくて
バッドノウハウなんだよ
CSSの機能不足でやりたいことが素直に
できない場合の逃げ道。
だから、ちっネガティブマージン使わないと
できないのかよCSS糞だな。という意識は持ってないといけない https://www.w3.org/TR/CSS2/box.html#margin-properties
Negative values for margin properties are allowed, but there may be implementation-specific limits. >>213には同意
CSS3の草案段階までは実際にネガティブマージンで対応しているサイトも多かった。
ハックみたいな後ろめたさは常にあったな。 ネガマージンは確かIE6では効かなくて
IE7ではzoom:1を入れることによって効いたり効かなかったりの記憶がある。
IEが正式に認めていないから正攻法ではないというイメージだった >>206
なぜ出ないと言い切れるかな
省略して書いてるかもしれないし、今後変更あるかもしれないし
中規模以上複数になると見通しが悪くなりがち
上で書いてる人がいる通りネガティブマージンはいわば苦肉の策だよ
使わないで済むなら使わないにこしたことない まあ何事も正しい理解が一番の近道だよね
例えばマージンひとつとっても、どのような仕様のもので
各ブラウザがどのように実装しているのかって正しく理解していれば
マイナス値を与えることで何が起こるのか、起こらないのかも判断できる
「そう言われてるから」「なんとなく悪そうだから」って理由で
一概に使う使わないを決めるのが一番クソダサイよね >>218
同じく同意
ともあれ質問のタイル割り程度で使うには残念
ああこの人こうやるんだ、と思ってしまう >>221
良さそうだからとか悪そうだからではなくて、
一般論として「新しい技術ができると今までよりも簡単に実装できるようになる」
という前提がある。
ネガティブマージンというだけなら単にマージンがマイナスってだけだが、
何かを実装しようとする時、例えば上下の中央の位置にブロックを寄せるなど
要望としては簡単のように見えるものを、ネガティブマージンを使って複雑に実装して
どうにか実現できる。という状況が悪い。
本来は、よくある要望であれば、それを一発で実装するための機能がCSSで標準化されないといけない
それをネガティブマージンつかえばできるんだぜー（どや）という考え方がダメということ
本来は簡単に作れるようにするべきことを、ネガティブマージンを使って逃げるから
バッドノウハウと言われる。CSSにこんな機能が足りないと声を大にして言わなければいけない。 >>223
自分が腑に落ちないことを「複雑だ」って一括りにしちゃうのもクソダサイよね
例えばある要素のマージンに負の値を設定したときに何が起こるのかって正しく理解できてれば
問題が起こるなら使わない、問題ないなら使うって判断が出来るもの
自分はそうならないように頑張ろうと思います >>224
人の話聞けよｗ
> ネガティブマージンというだけなら単にマージンがマイナスってだけだが、
マージンに負の値を入れた時の動作なんて分かってんの。
そんなの簡単すぎるだろｗ
もっと上のレイヤーの話だ。あるデザインを作ろうとした時、
それをシンプルに実装できるようにCSSはあるべきだって話をしてる。
頑張って実装するもんじゃないんだよ。
それはCSSに機能が足りないとはっきり言わないといけない。 >>225
なんでシンプルじゃないの？
負の値を受け付けるプロパティに負の値を与えることが borderの角丸で例えれば理解できるかな？
昔CSS2の頃はborder-radiusがなかった。
もちろんなくても頑張れば実装できるが、
それはCSSの機能不足だと言わなければいけない点だった
それと同じこと >>227
未定義と不足は関係ないじゃん
left: -10px;
transform: translateX(-10px);
margin-left: -10px;
この中でなんでマージンだけがシンプルじゃないの？
仕様に外れるようなこと無くない？ >>226
あるデザインを作るのが難しい！必殺技ネガティブマージンだ！
これを利用すれば難しいデザインでも実装できるんやで（どや！）
という時の話
そもそもの命題として「実装が難しいデザイン」の話なので
複雑であるという前提。そこに議論の余地はないよｗ
複雑なデザインが合った時、ネガティブマージンを使って実装るんじゃなくて
そのデザインを実装しやすい機能がCSSには必要 >>228
うん。
だからお前はネガティブマージンを理解する段階の話しかしてない。
俺はネガティブマージンを利用して実装する複雑なデザインの話をしてる。
（当然ネガティブマージンは理解してる）
噛み合わないはずだよねｗ >>223
横だが、話している事はごもっとも
しかし実際問題としてCSSの仕様がクソだろうがなんだろうが
目の前のデザインを一刻も早くクソCSSで対応しなくてはならないのが現実だった
デザイナーや営業にそんな事を言っても理解されるわけもなく
裏技でも何でもいいから駆使してシレっと対応できるやつが早く家に帰れる世界
どれだけ手法を知っているか、どれだけ情報持っているかという部分ではドヤっていいんじゃない？
まあ今の時代にネガティブマージンでドヤってたら完全にアホだｗ CSSが使えない環境（楽天のメルマガとか）で
コンテンツ毎に角丸の枠線付けるとか最悪だったわ
こういうのとか、IEが絶対的な基準であった事とかを知らない世代が
そろそろ増えてくる頃だ
今はクローム基準でIEのバージョンすら確認しないだろうな >>230
違う違う
なんで負のマージンだけ複雑なのかな？って聞いています
マージンだけでないのなら他に何があるのかも知りたいです
A. 複雑であるかないかの閾値は何で
B. その理由はどこにあって
C. 誰が決めているのかも知りたいです
もし個人の感想であるなら、なぜそれを質問スレで書くのかも知りたい
というHTML/CSSの質問です
優しく教えてください >>233
> なんで負のマージンだけ複雑なのかな？って聞いています
だからその答はすでに答えてる。
負のマージン自体は簡単。
複雑なデザインをネガティブマージンを使って実装するのが
バッドノウハウだと言ってる >>234
デザインが複雑であるかどうかの閾値は？
と意地悪な横槍を入れて見るw >>235
複数のプロパティを組み合わせて
一つのものを作る的なのは全部複雑かな
例えば複数行に対応したellipsisとかね
http://klutche.org/archives/1725/
それに対するCSSのあるべき姿は
（ -webkit-）line-clamp を標準化しろということ
標準化してるけどブラウザ対応がまだなだけだっけ？ >>237
個人の考えの話で個人の考えを言うなって
いうのは意味が無いと思うが？
お前は自分の考えを持ってないの？
世の中誰かが問題だって考えて（＝個人の考え）
それを直していくというのに？
それって単に言われたことだけしかできない人間だよね。 横レスだけどそういう主張の場ではないっつー話なんじゃね？
もうやめなよ >>239
> 横レスだけどそういう主張の場ではないっつー話なんじゃね？
それは本人に聞かないとわからないね。
でも言えないんじゃないかな？
だってここ個人の意見をいうことは禁止されてないしね >>238
よく言った！その通り！
俺はお前を支持するぞ！
お前の書き込みは見逃したくないから
コテハンつけるかID出してくれ頼む ↓こういう条件のデザインを再現しようとしたとき
・コンテナ幅600px
・カードは1行あたり3個並べる
・カード間のマージンは20px
・コンテナ端とカード間に余白はない
お前ら的にはこれが最強でOKか？
.container {
width: 600px;
margin: auto;
.list {
display: flex;
flex-wrap: wrap;
width: calc(100% + 20px);
transform: translateX(-10px);
.item {
width: calc((100% - 60px) / 3);
margin: 10px;
background-color: #ccc;
}
}
} >>241
俺コテハン無視する派なんで
付けないし相手のコテハンも気にしない >>242
そういや昔はそれネガティブマージン使ってやっていたなぁ。
カード間のマージンを入れつつ、コンテナ端とカードの間の余白をなくすために。
今はcalcが使えるなら、ネガティブマージン必要なくなったのか なんでそんな想像力豊かにバグがー他に影響がーって言えるのに似たようなスタイルで1列が3つの時4つの時〜が想像できないの？
nthじゃ列数かわったら対応できないだろ
あとcalcはサファリのちょっと古いの対応してないから仕事じゃ使えないだろ
その点ネガティブマージンなら手を加えずに列数を変えられるよ？
中規模以上のサイト〜っていうならそれこそ流用範囲が広いほうが楽でしょ >>249
calc使えないほど古いSafariまで気にするなんて優しい
俺いつもアクセスログ見せて
Chrome、Firefox、Safariはみんな勝手に最新になるから古いのはもういいよね！
カバーするならお金頂戴！って言っちゃうわ 本来スクリプト系かもしれませんが、
切り分けの判断に迷ったのでここで質問させてください。
ページをスクロールさせるとメニュー（コマンド）UIが追随してくるデザインのページがあるのですが、
ブラウザ設定およびアドオンWebDeveloperのスクリプトoffにしても表示が消えません。
スクリーンショットの邪魔になっているので表示させない方法ありますでしょうか。 >>251
それはほぼJS関係ないから
デベロッパーツールでDOMから消しちゃうもよし
CSSからposition: fixedを消すもよし
デベロッパーツールの出し方はchromeなら右クリ→検証
他のブラウザも似たようなもん いやー仕事してると先方の担当がMac使っててosがちょっと古いなんてこと多々あるよ。
そうすると最新版のサファリは入らない。
ブラウザシェアなんて関係なく先方が確認できるかどうかだよ
いちいちブラウザシェアはこうなんで〜って伝えてたら話こじれるわ >>253
-webkitつけても？
そこまで古いとcalcどころかflexやtransformまで動かないでしょ、やばない？ >>253
言いたいことはわかる
けどSafariでcalcが使えないっつーことはSafari5、OSX10.5
当時の他ブラウザはIE7、Firefox1.5、Chromeはリリース前
OSバージョンで7つ、10年前のOS使ってる人がいないとは思わんけど希少だろう
そこまでサポートするのはやっぱり優しい >>249
>nthじゃ列数かわったら対応できないだろ
対応はできるが書き換えが必要と言いたいのかな
少なくとも質問の件は固定だからな 話がズレてるがSafariとか古いブラウザ対応とか
必要ならやるしかないのよ
そうじゃなくて古いSafariがcalcに対応していないのはなぜか？
それは標準化対応できていなかったってことじゃないんだよ。
当時はまだCSSのcalcが存在しなかった。
話が戻ってきたね？ そう昔のCSSは機能不足だってこと。
機能不足だからネガティブマージンとかハックまがいのテクニックを
使うしかなかったが、calcできて楽になったろ？
使いにくいものは使いにくいとはっきり言って
CSSの進化を促さないといけない >>259
もういい、もう休め…
そういうのはこんな質問スレじゃなくて
WGに参加してやればいいんだよ calc便利だがそれは制作側の都合でたいていのクライアントましてユーザーからは見えない話
デメリットの説明は必須だから対応ブラウザを取るケースが多い
案件ごとに好きに選べばよろし googleの検索結果の説明が変になってしまったので、何とかしたいと思います
タイトル、URLは問題ありません
しかし説明文が
「おかけ間違いの無いようにお願いします／住所／営業時間…」
と電話番号の注意書きが最初に来るようになってしまいました（電話番号はその注意書きの前に記載しています）
”おかけ間違いの無いようにお願いします”の部分をどのようにすれば、検索結果に表示されにくくなるでしょうか？
strongなどで強調ができるのは分かったのですが、逆が分かりませんでした >>266
ありがとうございます、そちらは既に実行しております… calc実務で使ってる奴はios6以下とAndroid4系は切り捨ててんの？
それでクラの検証通るのは羨ましいわ
楽な仕事ばっかやってんだなぁ >>268
何言ってんだよ、営業に頑張らせてんだよ
営業に対してはこっちからも数字示して突き上げて、それを切り捨てれば利益倍になるって言ってある
んなアホらしいことやっとれんわ >>268
正しくはandroid4.3以下とiOS5以下な
calc使えないブラウザってflexまで使えないし、うちでは別予算貰えない場合は完全に切り捨ててるよ、非効率的だし。 うちもiOS5は別料金だなー
iOS大国の日本でもシェア0.05%切ってるしね
代わりといっちゃなんだけど
404とかと一緒に「あんたのUA古すぎんよ」的な表示出すページサービスしてる 大手企業や公共機関、お国関係がクラだと爺さん婆さんまで想定しているから
古いIEやandroidまで完全対応させられるんだよな
最初からフォーマットが用意されていて逃げられないんだよ コーディングしながら、なんちゃってデザインをその場で作っているような人には
大手蔵の仕事なんてわかるまい
色覚バリアフリーなど障害者を想定したユニバーサルデザイン、
コーディングやブラウザ対応も当然ガイドラインでガチガチなルールで固められている >>273
某鉄道が古いブラウザ切りつつあるから
インフラ系も時間の問題のような気もする >>269
calcにしただけで倍になるのか、すげーな タイル割り程度でネガティブマージンは使わないが
段組みの左（メイン）可変幅＋右（サイド）固定幅で使ってる
当時IE9対応必須だったし今更直す必要ないし
ちなみにこの方法で２段３段可変固定全ての組み合わせができる CSS3が標準化されても
まだまだごにょごにょしなきゃ対応できないケースあるよな
状況に応じて何でも使える頭の柔らかさと引き出しの多さが重要よ
可読性、拡張性、汎用性、修正、更新のしやすさなど
重要になる要素は案件ごとに大きく変わるはずだから
SEOがとか構造化がとか教科書どおりとかさ
所詮それらも1つの要素でしかないのよ >>274
そういうサイトに興味あるから見てみたいな
ちなみにどこ？ >>274
サイトのガイドラインとかコーディングルールとか
そんなの絶対守れないじゃん！みたいなことまでみっしり細かく書きまくってるの、よくあるよね
初めてサイトとそれを見たときに、既に形骸化しちゃってるのとか
>>279
某衣料系メーカーのサイトガイドラインなんか
印刷したらこのタイプのファイル2冊ぶん超えて驚愕した
https://i.imgur.com/Y6cHhcN.jpg 他人の土俵で相撲取るようなもんだよな
昔からあるような国民が使う重要なサイトは規制も多くて下手にリニューアルできないからか
古臭いデザインのまま放置されてたりする
過去たくさんの営業マンがアタックしてことごとく沈没したのだろうか >>281
官公庁系は純粋に予算の問題だと思うけどなー
広報予算潤沢なところは広告代理店がっつり入っててバンバンリニューアルするし >>281
そりゃそうだ
何か問題あったらどう責任取るの？に対抗できない >>272
そのページうちも作ってるわー
レガシーブラウザにも対応するならプラス工数20〜40%なんだけど
最初は対応しないで、しばらく運用して
レガシーブラウザでのアクセスが無視できないほど多かったら
そのとき改めてお代頂いて改修するってパターンをよく提案する
営業も割引してる感があって話しやすいと言ってた
実際に改修に至る割合は少ない >>284
昔だとIEにのみ対応して、その他のブラウザは
対応しないのパターンだね >>284
そういう情報って計測タグ入れれば取得できるものなのかな？
プロジェクトの進め方としてはとても良いね やっと本職っぽいレスが増えてきな
実務といいつつ煽ってるだけの奴は所詮趣味サイトが実務だったってことかなw 本職だがIEは11以外を対応するときは割り増し料金だわ クロスプラットフォームの検証ツールにまだ残ってるだろ ついさいきんイントラ用だけどie6やったよ
win7にXPmodeいれて検証したわ >>289
>>290
やっぱ実機ほしいよね
うちは幾つかはVMだけど一通り用意して
リモートデスクトップで譲り合いながら使ってる 楽天でスマホページにiframeを埋めると
勝手に150ｐｘ高さがついてしまいます。
iframeの内容は、ドロップダウンメニューのhtmlなので高さを指定したくありません。
高さが勝手につくと言いましたが、150pxがどこに記述してあるかもわからず
heightをautoに指定しても、やはり150pxのままです。
どうにかして高さを無効化する方法ないでしょうか？ iframeを止める
インラインでcssを記述
cssで!importantでも付けて記述
なんとでもなる気がするが >>293
どうなってるのか知りたい要素の上で右クリ→「検証」を選ぶと開発ツールが開く
左側がHTML、右側がスタイルで、右クリした要素が選択されてる状態になってる
たいてい知りたい要素の子孫要素が選ばれちゃってるから
適当に辿ってその<iframe>を探して選べば
その150pxがどのスタイルシートの何行目に書いてあるか、とか
自分で書いたスタイルはなぜ有効になっていないのか、とかわかる >>293
楽天のスマホってiframe使えたっけ？
もしかしてタグ壊して書くやつ？
だとしたらここで質問してもわかるやついないぞ 埋め込みタイムラインとかようつべとかごぐるまっぷとかあんじゃん… >>298
楽天やヤフーショッピングをやった事ない人はそう思うだろうな
スマホページは、外部ドメイン読込み一切禁止
但し専用のサーバー（クロスドメイン）からは可、そこではjs可php不可、外部ドメイン可
スマホ側ではjsとphp不可、iframe原則不可（裏技で可）
こんな複雑なんだぜ もうさ特定ブラウザ向けに書くのやめようよ
スマホページなんていらない。
スマホでみれないのはスマホが悪い
iPhoneのSafariでiframeの挙動がおかしいのは
Safariのバグ コンテンツの幅を固定して、paddingの幅をレスポンシブにする方法が分かりません。
画面が大きいPCと画面が小さいPCでの見栄えが変わってしまい困っております。どなたかご教示お願いします。 例えばこのサイト
ttps://item.rakuten.co.jp/marukinkagu/new-michel4-bolster-322/?force-site=ipn
<iframe id="smf-header-nav" scrolling="no" src="https://www.rakuten.ne.jp/gold/marukinkagu/sp-header.html"; =""="" frameborder="0" width="100%"></iframe>
これが親要素の<div id="shopCommonText"><div>のボックス内に記述されてますよね。
<div id="shopCommonText"><div>は楽天の固定タグで、店舗がわが自由にデザインを行うにはこの部分に書くしか方法はありません。
で、見ていただけるとわかりますがこの<irame>にはheight:50px;が指定されてますが、外すと150pxの高さになります。
この150px指定されてしまうのをどうにかしたいのです。
ちなみに<iframe>意外の<p>タグやなどを書いても、高さ150ｐｘがつくことはありません。 >>303
古くさいやり方なら%やbox-sizingを使う方法もある >>304
そのタグ見て何も感じないの？
さっきから書いている通り、楽天の裏技使っている時点でここで回答できる人はいないよ
上の二人も一般論でしか回答できてない
タグを破壊して記述しするのだから正しい挙動にはなるはずがない 教科書どおりしかやってきていない人がほとんどで
それが正しい知識だし当たり前なんだが
時としてそれが邪魔になり>>304の回答を導き出す事はできないだろう ハッキリ言ってバグを突いた不正な書き方なんて嫌悪感すら抱くが
それを考えた人の頭の柔らかさ、不可能を可能に（無理やりでも）実現させて
結果、EC店舗の売り上げが上る現実がある
有名店もやっているからリスクは承知なんだろよ >>304
管理画面見せてくれ。イマイチ何ができるのかわからん
インラインでcss書けば良いんじゃないかって思ってしまうんだけどダメなの >>309
嫌悪感すら抱くでワロタ
ネトゲでチーターに激怒するタイプか？ｗ >>310
インラインCSSは不可だよ
>>311
甘ちゃんだな
このコードはかなりマシだぞ
タグによっては7行以上の空白改行を入れるとか、タグを閉じずに開始タグを再度書くとか
実際にやらなきゃいけない状況になってみないとわからんないだけだよ あぁDOM見てた
ソース見たらすごいことやってんなｗ
<div id="shopCommonText">
<div><iframe frameborder="0" scrolling="no" src="https://www.rakuten.ne.jp/gold/marukinkagu/sp-cat.html"; height="300px" width="100%" =""="">
</iframe =""="">
こんなことやってて、いつ表示が崩れても知らんぞ〜 あとは例えばこれな
画像の使用数制限を突破する記述方法でこんなのもある
<img src="http://image.rakuten.co.jp/〜〜" alt=" width="300" width="100%">
・altの「"」を閉じない
・width属性を2回入れる
教科書が〜とか言ってたやつ泣いて謝れｗ しょーもない利便性だすためにSEOかなり犠牲にしてないか？
何かすごく本末転倒なことをしている気がする また変なこと言い出したぞｗ
画像の使用数制限を突破するために、
え？なんだって？
・altの「"」を閉じない
・width属性を2回入れる
それどのブラウザで使えるんだよｗ
HTML5準拠してない不正なブラウザだな >>314
おまえ、なおさら教科書読んだほうが良いぞ
ブラウザのバグに依存したコードを書くとかアホだし
そのバグが本当に有ったとしても修正されるかもしれないだろ >>315
何もわかってない
楽天は利便性と更新のしやすさと拡張性が全てといってもいい
iframeを使う理由は共通で使う要素なら1000ページを超えるからだ
下層はajaxもincludeもcurlも使えない
そしてECの更新頻度は”毎日”だ
SEOはGoogleではないモール内SEOが最優先.。当然アルゴロジックが違う >>316
>>317
だから未経験者が何言っても机上理論なんだよ
さっきから書いてるだろ
大手もつかっているのはリスク承知だって
いいか？実際に使われてるんだよこれが。俺が考えたんじゃねーからｗ
てか今更嫌悪感だすなよ。さっき俺が書いただろ >>319
そんな書き方で画像数制限解除なんて効果ないですよｗ
単に間違った書き方ってだけです。 >>317
狙っているのはブラウザのバグじゃないっつーの
てか未経験者が経験者に勝てると思うその根拠はなんなんだよｗ ガラケーの時代ならともかく、
今の時代に画像数制限なんて聞いたことないな
たぶん間違った書き方をして表示されなくなったのが
間違った書き方で打ち消されたとかそういう話だろう >>321
> てか未経験者が経験者に勝てると思うその根拠はなんなんだよｗ
なんで俺が未経験者だって思ってるの？
その根拠は何なんだよｗ
お前よりも経験長いわｗ >>320
あのなあ
ECやったことある？
効果ないっていくつのサイトで検証したの？
3枚しか画像掲載ないページで10万の洋服買えるか？ >>318
楽天SEO＞＞＞googleのSEO
昔聞いておもしれーなーって思ってたけど、本当だったのか…
確か画像もでかいほうがいいんだよな
楽天のコーディングしたことないやつは多分黙ってたほうが良いわ
基準があまりにも違いすぎる >>323
じゃあ聞くわ、goldでhtaccess使用する方法は？ > 3枚しか画像掲載ないページで10万の洋服買えるか？
ってことはまっとうな方法じゃ、4枚の画像すら
表示できないって言いたいの？
それはないよｗ >>325
お、やっと経験者がいたか。
その通りなんだが、みな自分が正しいと思って引かないだろうな
最優先の目的は売る事っていうのをクライアントが求めるこれは事実 >>327
スマホの商品ページの画像はそうだったんだよ
今でもtableすら使えないぞ
>>328
ヤフーショッピングもな やっと>>308の言ってることがわかった
なんかすまんかった
とりあえず三木谷はくたばれ >>326
ぐぐったら楽天GOLDでは.htaccessは使用できないって
すぐに出てきたけど？罠か何か？ｗ
http://b.hatena.ne.jp/entry/53726390/comment/harutamane
使えるならば使いたいディレクトリに.htaccessという
名前のファイルを置くだけでしょう？
代替方法.htaccessを使用する方法ではないから答えにならないね。
なぜなら.htaccessというのはリダイレクトやアクセス制限だけに
使うものではなくてApacheの設定をディレクトリ単位に変更するもので
できることはMIMEの設定や環境変数の変更や
使用しているモジュールの設定など多くの機能がある
それらができて初めて.htaccessが使えるといえるわけだから
一部の機能だけ代替してもしょうがないよ？
ってここまで言ってあげればよかった？ｗ >>330
え？ なに？ 特定のECサイトの仕様の話してるのか？ｗ
楽天に通報しておくわｗｗｗｗｗ 自称経験者 = ただの楽天ユーザー
だってってことか・・・
なんていうか、世界が狭いな
楽天でしか使えない知識じゃんｗ >>331
質問者の最初の投稿の時点で
こうなる今の流れも読めてたんだけど
早いうちに書き過ぎてたぶんあなたしか読んでないｗ
>>332
ググっている時点で知らないって事だよな？
自分より楽天の経験長いって言ってたけど何年？
>>333
早く通報して
むしろ通報して
こんなバッドノウハウがはびこっているのはだめですよーって >>334
楽天に出店している企業の一覧を見てみるといい
楽天でしか使えない知識をもっていたらいけないのか？
ヤフーショッピングの依頼が来ても同じように答えて逃げ回るか？
素直に認めている人もいるのに
自分に無いものをバカにするのって恥ずかしいぞ > 楽天でしか使えない知識をもっていたらいけないのか？
いけなくはないよｗ
だけどちゃんと言わないといけない
楽天ショップ経験者だ！って
そうすれば、なんだHTMLに詳しいわけじゃないのかって
他に人にもわかるだろ 前からなんで楽天が売れてるのかわからなかったけど、今日の一連の流れでますますわからなくなったわｗ
とりあえず楽天案件を気楽に受けると恐ろしいことになるのはよく分かった
今日は非常に有意義だった、みんなありがとう >>337
楽天モールの経験者（制作のみ）でもあるけど
その他amazonとかyahooとかメイクショップとかカラミーとかあるな
多いのは楽天だが
HTMLに詳しいのかはわからないがお前詳しい？ >>337
HTML/CSSで聞きたい事があったんだけど
お前詳しい？ >>338
> 前からなんで楽天が売れてるのかわからなかったけど
楽天は商品を売ってるわけじゃないからだよ。
アマゾンは商品を売ってる。それとは違って楽天は商品を売ってない
商品を売りたい人向けにショップシステムを貸し出しているだけ
そして楽天は商品が売れなくても儲かる仕組みがある。
それはショップに対して営業の電話をかけて
広告出しませんかー（楽天に金払え）という仕組み
ECコンサルという名の商品を売ったこともなければ
ネットショップを運営したこともないただの営業が
広告その他を売りつけるっていうのが楽天のビジネスモデル >>340
楽天のバグの利用方法は知らない。
これはHTML/CSSの知識ではないからねｗ
HTML/CSSはお前よりもずっと詳しいが
答えるかどうかは俺の気分次第だ >>342
最初に言っておく
お前では答えられない。
楽天ではない一般的なCSSの話だ
その後の展開も読めている
時間の無駄になることも >>342
答えられる とまず宣言してみようか？
ググってもいいんだぜ？ >>343
じゃあ聞かなければ良いんじゃね？
誰も困らないでしょ？ >>344
答えられないそうだから、
やる意味ないってさｗ
俺は別にそれで構わんしｗｗｗ まあどちらにしろ誰が質問しようが
答えるかどうかは俺の気分次第だ
今すぐ質問に答えるとすると俺だってばれるから
誰からの質問であっても、答えるまで時間あける
ことにするとあらかじめ宣言しておくよｗ
（ただし答えるとも答えないとも言わない） 天狗になっているようだから
鼻をへし折っておこうかと思った
まあそんな事しても、最後まで絶対認めないだろうから
結局時間の無駄になるんだが
他の回答者もたぶん回答できないだろう。
なぜなら一度ここで既に質問済みで回答できた人がいないから。
他スレでは一人だけ回答してくれた人がいた >>341
7-11に近いよね
本社の利益はフランチャイズから巻き上げた収益 ちなみに>>348は俺ね
ちなみに疑似要素の可変についての質問な >>348
質問あるんでしょ？
なら質問すれば良いのでは？
他の人が答えるかもしれないね。
そうやってグダグダ質問しないほうが
周りから見ると情けないよｗ とりあえずわかったことは>>304は超難問な上に全く回答する意欲がわかない、回答できる気がしないということだな
もはやhtmlの裏技を越えて別言語と言っていい領域に達しつつある
Rakuten htmlとか名付けてスレ立てていいんじゃない >>350
https://www.google.co.jp/search?q=疑似要素+可変
の検索結果
【CSS】疑似要素の画像サイズを変更する方法 - サルワカ
擬似要素で指定した画像の大きさを変更する - inoma-NOTE
:before content image のサイズを指定する - CSS note - tenman.info
コンテンツ更新に強い！CSS擬似要素:beforeと:afterの使い方｜テクニカ
::before,::after擬似要素を使って、よくあるパターンをつくってみよう。 | 投
(K)CSSの擬似要素で背景画像のリピートを使った伸縮可能なコンテンツ枠
CSS のみで高さを可変にして要素の比率を維持するテクニック - Webrawl
擬似要素での画像挿入するときのスタイル - Qiita
JS/jQueryでCSS疑似要素である:before:afterのプロパティを取得し変更 ...
backgroundの代わりにcontentを使用して画像を表示する際の注意点 | iwb . >>351
最初に回答できるって宣言させてから
いざ出されたら回答できないとう状況を作りたかった
バカにされたからおまえはどの程度なんだよって意味で。
だから答えをしりたいわけではない >>354
> 最初に回答できるって宣言させてから
> いざ出されたら回答できないとう状況を作りたかった
そんなのお見通しだから、最初に答えるかどうかは俺の気分次第だとかいた
そもそも回答が欲しいお前に回答してあげたらお前が特をするだけだろ
答えなくても馬鹿にする。答えたらお前が得をするだけ
明らかに人をバカにするのが目的なのがバレバレなのに
どちらに転んでもお前が特になるようなことをしてやるわけがないだろ
お前のやりくちなんかバレバレなんだよｗ
俺の手のひらで踊ってろ >>355
文句ならGoogleに言え。
お前が言った言葉で検索しただけだ >>356
お前さあ
ここに至るまでに
自分で何してきたか理解できている？
お前に同じ事してやらないと理解できない？ >>358
> 自分で何してきたか理解できている？
ん？ ID出てないスレで何いってんの？ｗｗｗ >>357
検索して検索結果貼るだけって意味あるの？
せめてその中から回答に該当する部分を抜き出そうよ >>359
ごまかせていると思っているのはお前だけ
そういうのいいから
本質で話せ。
もうまともに会話できない状態になったのか？
まだ早いだろ？ >>360
> ちなみに疑似要素の可変についての質問な
これだけしか書いてないのに、何を書けと？
答えを書いてほしいなら、まず質問が先でしょう >>361
で、お前は何が言いたいのよ？ｗ
まずお前が言いたいことを書けってｗ ほらほら、質問しちゃいなYO！
答えるのは時間おいてからで
答える保証もしないと宣言済みだからYO！ 発言に草付けて浮ついている自信のなさ
最初の威勢はもうなくなったのが確認できた
恐らく自分でもできない事があるのは自覚してきたようだな
小心者で卑怯な奴なのはよくわかった
もう用は無い わかったわかった。
さくっと答えられてしまうのが怖いから質問できないんだろ？
あとで時間をおいて別人のふりして書き込むと良いよ。
さくっと答えられても、スルーしてしまえば
恥ずかしくないだろ？
忘れた頃に質問するように >>366
だからさあ
他スレで回答もらったって書いたでしょうに
答えをしりたいわけではないって事も書いたでしょうに
話しかける前にさあ
起点から一回読み返しておいてくれよ
めんどくせえよ >>368
じゃあその回答を見れば誰でも簡単に答えられただろうな
答えがでるようなものなら、答えられるだろうし
何がしたかったんだろうか？
君の目的は達成できたかい？ｗ >>369
天狗になっているような奴にバカにされたから
こいつはどんなもん？って思ったわけ
で、どんなもんか、少なくとも人間性はわかった
ここまでの流れ遡って読むの面倒なら
すまないが絡まないでくれｗ たまにいるよな。
人の揚げ足を取りたい為だけに質問するやつって。
今回は相手が一枚上手だったから
質問が投稿される前に対処されてしまったようだが
本来なら質問した後答えられないのを見て
馬鹿にする予定だったのだろう。
こいつはこういうことをやるために
この質問スレを利用したってことだよ >>370
あの、ここは質問スレであって
お前のプライドを守るためのスレじゃないんですが？
相手の力量を測るためにこのスレを利用すんなよ
一連の流れでわかったのはお前の人間性だ。 >>371
そんな奴いねーよ
最初からそんな目的ではなかった事すら理解してないのか？
一回いいから読み返せ
それが面倒なら絡むな >>373
最初はそうでなかったということは、
あとから相手をばかにするために
このスレを利用したってことですよね？
あなたの人間性 >>372
読み返してないだろ？
質問者に最初の正解出してたのは誰か見た？ >>374
そうだよ
利用の意味がわからない
回答なんてもらってないし >>376
だからさあ
よ み か え せ よ
質問者は俺じゃないだろ？バカなの？ >>378
何いってんだ？
他スレで回答もらったんだろ？
その質問をここに書けって言ってるんだが >>379
その話はもういいんだよ。
起点は>>293で（質問者は俺じゃない）
>>296が俺
それ以降は関係ない奴に絡まれて
そいつとのやりとりだ
技術に熱心なのは関心するが
うっとおしい奴がいるから諦めてくれ >>380
> その話はもういいんだよ。
逃げるなよｗ
お前がここで質問に答えてほしいわけじゃなくて
相手の力量を測るために、偽の質問をしようとして
その質問をする前に、相手にやろうとしていることを
見ぬかれたってことは分かってんだぞｗ >>381
偽の質問ではないけどな
過去読まないようなやつばっかりだからもうめんどくせーんだ
察してくれ
てかお前誰？ >>382
質問した段階では本当であっても
あとからこのスレを相手をばかにするために
利用したんだろ？なら同じことだ
それがお前の人間性ｗ >>383
相手をバカにする為というよりは
先にバカにされたからお前はどんなもんなんだ？って
皆の前で証明しようとした
これが俺の人間性。それがどうした？
で、お前の最初のレスどれ？ > 先にバカにされたからお前はどんなもんなんだ？って
> 皆の前で証明しようとした
そしたら先手を打たれて質問をする前に
打ち負かされたと？ｗ >>385
残念だがこちら側からすると1mmも
打ち負かされたとは思えない
そういうもんだ。
おまえみたいな奴は話しても無駄 >>386
だってお前、質問すると言っておきながら
質問しなかったじゃんｗ
その前に軽くあしらわれたの知ってるよ？ 状況をすぐに察し、現実として受け入れる事ができた>>325と>>331は
恐らく俺より優秀だろうな
俺が初めてこんなのがはびこっている事を受け入れるのにはもっと時間がかかったと思う
どんなにクソでもそれしか方法がないし、求められているからから受け入れて対応するしかない
最後まで現実を受け入れられず自分の都合の良い方向に持っていこうとした>>387よｗ
生き残れるのは頭の良さでも強さでもなく変化に対応できるやつだろ？
企業もな > 状況をすぐに察し、現実として受け入れる事ができた>>325と>>331は
> 恐らく俺より優秀だろうな
まあなｗ よくわかってるじゃねーかｗｗｗ >>318
今更もう見てないかもしれないけど
考え方を変えよう
ローカルでCMS作って→ダンプしたHTMLをアップするのが基本
これならインクルードも好きにできる
画像の数はCSSスプライトで可能な限り減らした上で
単品はテキスト化してHTMLに直埋め込み
楽天はもう10年くらい前から
フロントエンドの技術だけじゃ運用できなくなってるんだよ >>390
そうだな。そういう方法で対応しているところも多い
しかし現実でよくあるのはこういうやつだな↓
「この有名店と同じようにしたい」同じように→スマホ全ページにjsのカルーセル
スマホの全ページにjsを使うにはどうしたらいいか？
方法は1つしかないと思う
画像の数は今はもう緩和されたようだが、スマホ下層にcssは原則使えないからスプライトは無理だな
テキスト化というのはBase64化の事？だとしたら文字列エラーに引っ掛かるのは知っている？ CSSについて質問です
チェックボックスと隣接していなくとも同階層への指定なら
(例) input[type="checkbox"]:checked ~ p.hogehoge{display:none;}
で指定できるかと思いますが、
p.hogehogeが上の階層や下の階層にある場合はどう指定したら良いでしょうか？ 普通に疑問なんだけど
多分ここにいる人は雇われでweb制作会社にいる人が多いと思うんだが
楽天やヤフーショップのページ作ってくれって依頼こないの？ こねぇな。顧客に楽天やヤフーで
店出してる程度のやつなんていないし。
楽天やヤフーショップで独自ドメインとかできるのか？
普通は自由の効く自社のドメインでサイト運営だろ >>394
来ないな
ネットショップがしたいと言われた場合はamazonに出品させて、後はリンク貼るだけにしている
ユーザーもクライアントも俺も一番手間がかからないからな
儲かってから自社サイトを検討しましょうって言うけど、自社サイトで通販を設置したところはないな
>>395
程度てｗ
楽天はあれでも国内最大のECモールだよ >>396
> 楽天はあれでも国内最大のECモールだよ
楽天という会社と楽天に出店しているショップは違う
それはわかってる？
楽天という会社は国内最大のECモールだが
楽天に出店するだけなら、個人事業主程度で十分 >>397
「程度」ってそっちに掛かってたのね、読み間違えてすいません >>394
ないなあ
以前、親父が怪しげな商売始めた時に一度だけやったきりだな 楽天やヤフーに出店したとしても、
大抵はそんなこったことはしない。
楽天やヤフーのページ作成で本気だすやつなんていないでしょｗ
出店したんだから商品を売ることに本気だせよって話だ >>400
君はもうwebページを作らない方が良い ははｗ モール系でページ頑張ったって意味ねぇよ
他のショップと値段比較できる機能があるせいで
良さげなページ見て買おうと思っても
その後値段調べられて安い方にいくだけ
それがわからんから楽天やヤフーでページづくり
頑張っちゃうんだろうな >>403
楽天使ったこと無いの？価格比較をしようにも、検索がクソすぎて価格比較不能
例えば「ポッキー」
amazonで検索すると普通の検索結果だけど、
楽天の場合は二番目にポッキー柄のスマホケースが出て来る
このSEOは「画像が大きい」など素晴らしいアルゴリズムで構築されているため、常人には理解不可能
楽天SEOをマスターしたもののみ、利益を上げることができる
楽天云々は経験者以外語るべきではない >>404
お菓子のカテゴリで検索すればいいんじゃないですかねぇ（苦笑） >>405
ユーザーは想定をはるかに越えてアホ
そんなことは常識だろう >>403
じゃあなんで楽天でページづくりなんてやってんの？ >>407
え？ 凝ったページは作らないって話でしょｗ
必要最小限のことしかしないよ
あんなのに手間ひまかけても売上にはつながらない >>408
なんだあエアプかよ
そんなの今時小学生だって情弱のやることだって言われる世の中なのに… エアプってなにかと思ったら・・・
そんな用語使うとかガキかよｗ エアーxxは普通に使われてるだろｗｗｗ
エアーズロックとかエアープランツとか >>251
どうしてこういうウザイUI作るのだろうな
メニューならまだいいがコンテンツ隠してまででかいSNSボタン固定とか信じられんわ
どんだけ自己主張強いんだよと 本質的な反論ができないからって
言葉尻を捉えて揚げ足取りするのも
なんか団塊老人みたいでかっこよくないなあ
と、思いました あ、団塊老人の方でしたらすみません
そのままお続けください そうやって経験者を馬鹿にする方向で行くのねｗ
やっぱりガキだなぁ 楽天の自称コンサルの営業もそうなんだけど
ネットに詳しい＝商売に詳しい
わけじゃないんだよね。当たり前だけど。
商売に詳しくないから、売る方法じゃなくて
SEOとか自分が詳しいネット関連のことしかできない。
そういうのに騙されるとページの作り方がどうとか
間違った方向に進む >>417
どう見てもゆとりよりも若い世代だろｗ
ガキとしかいいようがないよ。 団塊は別に世代を表す言葉だけど、ゆとりはアホの烙印だから生涯消えないのよね
本人に非は無い、障がいみたいなものでちょっとかわいそうだけど、そこを攻めれば効果的だよ >>418
どこまで是とするかは難しいね
画像だけ貼ったHPを見たことあるけど、無料でいいから手直ししたくなった事はあったよ
（headerに会社ロゴ、mainに会社概要・地図も画像。footerもロゴ入り画像）
何が正で何が間違いかは誰にも分からない >>416
やはりそうなのですね
本質的なことには反論ができないのなら
素直に謝ればいいのに
年長者、経験者が敬われるのは、それに基づく結果が伴うからです
それができないのなら、ただ無為に年齢を重ねただけですよ
>>409さんの、大した経験がないなら口を出すなって主張に
本質的な反論はできないのですか？
経験に基づいた、個人の感想ではない反論を期待します 本質的なことってなんだ？
HTML/CSSのことについては
しっかりレスしてるだろ。
本質的じゃない話題をしてるのは
むしろお前では？ >>423
それは論点ずらしです
もう癖になっているのですね
>>409の主張の本質は、よく知らんことに口を出すな、です
それに対する>>410の「ガキか」と言う反論は
明らかに「よく知らない」に反論できないための揚げ足取りです
こんな高校生のわたしにもわかることを
自ら経験者と言うほどの年齢の大人が書き込むなんて
恥を知るべきです > よく知らんことに口を出すな、です
その理屈だとHTML/CSSに詳しくないなら
口出すなってことになる。 >>425
それもまた論点ずらしです
一度指摘されたことをすぐ繰り返すのはよくないことだと
家庭や学校で教わりませんでしたか？
>>409で話題にしていることは
楽天では一般的なHTMLやCSSの知識があてにならないと言うことです
つまり、楽天に精通していないのなら口を出すな、と言うことです
これくらいのことは、中学生程度の読解力があればわかることなのに
あえてわからないふりをするということ自体が
論点ずらしだと指摘されていることを理解してください まともな夏休み高校生きたー
こりゃ生半可な回答は出来ませんな
気を引き締めないと > 楽天では一般的なHTMLやCSSの知識があてにならないと言うことです
あてになるだろ。特殊なHTMLやCSSじゃないんだから
お前が本当に知りたいことは楽天の制限を回避する裏技だろう？ >>428
特殊なHTMLやCSSなのです
特殊な制限を回避するために、特殊なコードを書く
という事実に対し、それではまともな動作は期待出来ないという流れでした
あと、匿名なのであまり意味はありませんが
私は>>414,422,424,426で、楽天はどうでもいいです
ただ、まともな反論もできない癖に経験者ぶる輩が目につき
調子に乗ってしまいました
その点は申し訳ありませんでした あれ？ HTML/CSSの質問スレで俺は経験者経験者ってうるさいから
何事かと思えば、楽天の経験者だったって落ちじゃないの？ｗ
それで誰からも求められてないのに、楽天の制限を回避する書き方を書いて、
お前らこういう書き方知らないだろーって言ってるだけだと思ったが？
HTML/CSSの仕様の範囲で仕事してきてる人たちの中で
楽天の世界しか知らない人が、お前ら楽天のHTML知ってるか？って
ドヤ顔してるようにしか見えなかったけど radioボタンとこれに関連付けられるlabel・テキスト・imgなどいくつかの要素を1セットとして、
複数セットをひとかたまりにして、
かたまりごとにタイトルをつけようと思っています
目的はjavascriptからの操作だけ。submitするためのものではないのでformは不要です
こういうとき、HTML的にはどう書くのが良いんでしょうか、今思いついてるのは以下です
教えてください先生
・塊をdivとして、divの中にタイトル用のdivと複数のradioのセットを放り込む
・文章だけじゃないけどdl/dt/ddで分別する
・formじゃないけどfieldset/legendを使う
・その他 >>431
JSから見て塊になっててほしいだけなら別にどうでも良いんじゃね？
なんなら、同じグループになる要素に同じクラス名付けるだけでも
本当はHTML的にもグループ化されててほしい、っていうなら
なにか一つの要素でくくるのが鉄板で、
・たいていdivになるんじゃね？
・dlはそういうことする要素じゃない、と思う
・fieldset/legentd懐かしすぎワロタ >>430
＞誰からも求められてない
質問がこれだっただろｗｗｗ HTML仕様的にform/fieldset/legendは現役なんだが… cssの読み込みをhtmlのヘッダに記入するときって
css3とcss2.1とかとのバージョンの違いって特に区別はないですよね？
例えばcss2.1で作られてる古いサイトにcss3から採用されたプロパティを使って装飾したとして
適用されないとかってありますか？ ない
何らかの方法でcssのバージョンを把握してバージョンごとに表示や機能を切り替える
みたいなことを、そもそもブラウザがやってない >>437
ありがとうございます
作ったサイトの説明をするときに相手から使用したhtmlやcssのバージョンを聞かれたもので
単にどのバージョンを基にした知識で製作したかって意味だったんですね HTMLのバージョン聞くってなんだろうなあ
特に意味なくて中途半端知識で聞いてみただけ、な気がしないでもない だからcssにバージョンの概念は無くなったと何度言えば…
便宜上2.1とか3とか呼び分けられることはあるけど仕様上はすでに区別されていない それは比較的最近の話なんだから
知らなくても不思議じゃない >>439
まぁそうだろうな
で、html4.1で組むと「今時4.1てｗｗｗ」と笑う
いや、別になんでもいいんだって ウェブのソースで見かけるんですが、
画像のURLとか以下のようなパラメータ設定する意味（メリット）ってなんですかね？
毎回URLが変わりますが、元のリンク先をたどる（知る）方法はありますか？
教えてくださいませ。
<img src="./images/parts/hoge.png?1501555242" alt=“fuga” /> >>447
ぱっと見はキャッシュ避けに見える
けどもしかしたらその数字が何かのパラメータで
それに対応した画像を返すAPIなのかもしれない >>445
規格とバージョンは別物だから
常に最新バージョンを利用しなければならないという訳でもないので
自分のプロジェクトに必要な機能をじゅうぶんに満たすバージョンを選べばいいのよ >>447
動的に処理されているので同じURLでしか方法はない >>447
>>448でなければ元画像は
./images/parts/hoge.png
だよ >>171
display:grid;
ってやつを使えば出来そうな出来なさそうな予感 >>448
>>451
ありがとうございます。
ほんとだ、
./images/parts/hoge.png
で表示されますわ。
てことはただのキャッシュ避けなんですかね？
UI用のパーツ画像がこれでいくつか書かれていたもので。
なにかお作法的な理由なのか…よくわからん。 >>191
display:flex;
justify-content:space-between;
でどうだろ？ >>453
数字部分がアクセスごとに変わるのでなければバージョン管理
cssやjsの読み込み時でもよくやる
基本的にキャッシュして欲しいけど、元ファイルを変更したときに確実に全員が変更を反映して欲しくもある、って時にやる
cookie有javascript有でのみ数字部分が変わらなくなるなら、たぶん刻印付け
super-cookieと似たようなもん、それを画像（を保存してる鯖）と共有する感じか
cookie無やjavascript無でも数字部分が変わりまくるなら・・・
キャッシュ避けなんだろうけど、問答無用でキャッシュする環境はそう多くないはずなんだが
キャッシュするproxyとかその程度な気が あと数字部分が、実物も本当に数字だけならunix timeなことが結構ある
そこから用途や意味を推測できることもあったりなかったりする クライアントのchromeがcssファイルをキャッシュしてしまうのを防ぐにはどうしたらいいかな
常にスーパーリロードしてくれってのもなんか嫌なんだ
もちろんurlパラメータで.css?**付けても効かないよ >>418
概ねその通りだと思う
重要なのは商品力、品揃え、リピーター作り、レビューとか
月商数千万円いく店舗もあるしその辺の事はクライアントの方が良くわかっているんじゃないか
逆に実店舗で商売ド下手な店舗はネットでもダメ
特にどこでも扱っているメーカー商品を普通の価格で販売してる店は存在意義を疑うわ >>458
cssファイルの名前を常に動的に変える main.css
main2.css
一時文句を言わさないために、これを交互に繰り返してたな
アホらしくなってやめたけどね。
仕様です、の一言で済む sakuraサーバーのapacheが2.2でした
これって遅くなったりするんでしょうか >>458
?v=1501632223 みたいに適切なGET引数として書いてもダメか？ 適切なGET引数ってどういう事？
数字部分をアクセス毎に動的変化させるって事？ >>458
>もちろんurlパラメータで.css?**付けても効かないよ
嘘つくなカス >>465
例示されててもわからないのならHTTP仕様を読むしかないんじゃない >>465
動的じゃなくてもいいんだけどね
動的なのは、例えばAjaxするときにリクエストの最後につける「?1501650149602」みたいな数字
(new Date()).getTime()をよく使う
静的なのは、例えばさっき俺が更新したHTMLに書いた
hoge.js?v=170802
fuga.css?v=170802
みたいな数字、これは手で書いてる（正確にはテンプレエンジンが書いてる） >>466
おれもキャッシュ回避でクエリー文字列つけてるが、chromeだと回避できない事があるぞ
cssもjsもな
無知乙 >>469
サーバ側のネットワークでキャッシュかましてたり
サーバ側のmod_cacheでキャッシュさせてたり
cssやjsの記述自体をphpコードとして書いててOPcacheにキャッシュされてたり
ってとこじゃないのか あともしかしたらなんかのゲートウェイが、464のように
名前=値ペアになっていないクエリを無視したりとかな
RFC的には名前だけで値がなくペアになっていない、=も付加されていないクエリの扱いは未定義だったような >>471
俺は>>469ではないが、サーバー側が原因ではない。
サーバー側が原因ならスーパーリロードではなおらない。
しかしスーパーリロードすれば確実になおるって事はクロームのキャッシュって証拠。
静的ページでも起こる。 >>473
> サーバー側が原因ならスーパーリロードではなおらない。
Ctrl+F5は、通常は送らない以下のようなリクエストヘッダを送っている
Cache-Control: no-cache
Pragma: no-cache
よって、通常の表示や通常のF5更新と挙動が違っている以上、サーバ側が原因でない、と断定することは不可能では？ 厳密には「サーバ側が原因でない」ではなく「UAが唯一の原因である」という断定だが ついでに静的htmlだとhtmlそのもののキャッシュも絡んでくるから面倒
別々の問題として考えるのが妥当 >>458
それブラウザ側じゃなくてサーバー側にキャッシュされてるんじゃないの？
あとはこれ
<Files ~ ".(css|js)$">
Header set Cache-Control no-store
</Files> Chromeの
「えーとですね、画面のどこかを右クリックして頂いて
え、あ、いや画面の中、どこでも、あ、じゃあヘッダの御社ロゴのところ、はい
右クリックして頂いて、ええ、「検証」ってありますよね？
え、ない？下の方、あ、そうですそうです、その「検証」選んで頂いて
あ、出ました？それが開発ツールなんですけど、それは無視していただいて
ええ、すみません、それは置いといて
それでリロードボタンを右クリ…ええリロードのボタン
URL欄の左の丸い矢印の、あ、アドレス欄です、はい、あ、それですそれです
あ、いえ、それをクリックではなくて、右クリックして頂いてですね
そうですそうです、ボタンを右クリック、はい、それで3つ項目出ましたよね？
ええ、その3つめの「キャッシュの消去とハード再読込」を選択してください
出来ました？あ、画像変わりました？よかったー…」
って話しないとお客のキャッシュクリアできないのが面倒くさい >>478
まったくキャッシュしてくれないと
それはそれで速度面で問題あるんだよなー >>479
メールの署名に組み込むとかどうよ？
＿/＿/＿/＿/＿/＿/＿/＿/＿/＿/＿/＿/＿/＿/＿/＿/＿/＿/＿/＿/
〜 ページ確認の際はCtrl+F5を押してから見て下さい 〜
株式会社WEB DESIGN 署名管理部 マネージャー
署名 ひかる / SHOMEI HIKARU
〒000-0000 東京都XX区XX XXビル XF
TEL: 00-0000-0000 FAX: 00-0000-0000
Email: hikaru@shomeidesign.com
URL: http://shomeidesign.com/
＿/＿/＿/＿/＿/＿/＿/＿/＿/＿/＿/＿/＿/＿/＿/＿/＿/＿/＿/＿/ >>457
そうだ、これUNIX TIMEですね！
記述省略してましたけど、実際こんな感じなので。
<img src="./images/parts/hoge.png?1501670092" alt=“fuga” />
cookieは無しで、JavaScriptかPHPでソース生成してるぽいです。
リロードのたびに数字部分だけ変わってます。
やっぱり、キャッシュ避けにタイムスタンプ入れてる感じ…なのかな。 最強のキャッシュ回避策
bodyには何も書かずに、ajaxで全部生成！
SEOは犠牲になるが気にするな >>482
> JavaScriptかPHPでソース生成してるぽいです。
なんでそこの区別が付かないんだよ
それはさておき、unix timeなんだったら、既に出てるの以外に、
「実はよくわからずにそう書いてる」とか
「意図があるんだけどやり方がまずくて意味を成してない」とかもありうる
キャッシュ避けだけならheader吐かせろよとか、画像も含めて最悪html内に直でぶっこむ方法とかあるから
あとはもう直接聞くしかないな
>>483
コードでxhrしろと書いても普通にキャッシュ使われる可能性が云々かんぬん >>484
え、ajaxでもキャッシュ使われるのか
確かにGET・POSTメソッドは同じだった そもそも論でいえば区別する必要ないしな
jsonやplain textがキャッシュされる設定に
なってないことが多いというのはあるかもしれない <img src="./images/parts/hoge.png?1501670092"/>
上をなんで、こう書かないの？
<img src="./images/parts/hoge_1501670092.png"/> >>488
ファイル名つけ直すのめんどくせえじゃん 異なる画像に、同じファイル名を使うのは、設計が悪い。
バグが出るのは、たいてい設計段階で、バグるように設計してる
同じ画像なのに、キャッシュから読み込まないのは、明らかに無駄 >>491
設計はできるけど実装できる予算がないから
出来る範囲でやってるに決まってんじゃん jsとかファイル名変えたらHTML側も変えなきゃいけなくなったりするじゃん
静的HTMLじゃないならバイトコードのキャッシュの都合でreloadしなきゃいけないケースもある
DBとかにファイル名突っ込んだりして動的にファイル名引渡してたらその分恒常的に負荷がかかることになる
設計にまで踏み込むんなら、相応の理由があってそうなってる可能性を考慮してもらわんと キャッシュ周りは本当にめんどくさい
「100%のユーザーに対してすぐに変更するようにして下さい」
「無理です」
「？？？」
「まずブラウザというものは…」
この流れなんとか死体 >>494に限っては>>494が無能なだけに見えるな 個人一般のサイトにて、
HTMLとjs両方のコメントにVerを記述している。
HTMLはほとんど変わらないがjsはたまに改善などでVerが変わる。
Ver管理で整合をとっているのでここまでは面倒もなくやれている。
で、HTMLのVerをコメントではなくidとして記述し、ロード直後両方のVerを比較し、
不整合ならユーザにリロードを促す・・・は、やりすぎだろうか？
フォームなど操作途中で異変に気づき、リロードせざるを得なくなるよりマシなのではと。
実際まだそこまでやってないが。 >>497
htmlは常に最新が読み込まれると思っておいていい
jsの更新漏れを防ぐためにはjsにパラメータを付ける
バージョン15
<script src="./main.js?ver=15"></script>
バージョン23
<script src="./main.js?ver=23"></script>
パラメータを変えると、別のファイルとして常に最新のものが読み込まれる
＞不整合ならユーザにリロードを促す・・・は、やりすぎだろうか？
この仕様は糞すぎる。ユーザーとしては死ねとしか思わん
あと恐らくもっとhtmlとjsを切り離すべきだと思う。そうすれバージョンとかどうでも良くなる
それとバージョンって書いてくれ。varと見えて変数かと思った >>497
> 不整合ならユーザにリロードを促す・・・は、やりすぎだろうか？
やりすぎ ではなくて やらなすぎ
作り手側で解決できる問題をやらないで、
ユーザーにさせている。
本来自分でやるべきことをやってないので
やらなすぎ。手抜き。サボり まあそういう対策の必要性があって、>>497にはどうにもならない事情でそのぐらいしか対応できない、っていうならアリかもとは思う
それと適当ぶっこいてる>>498は死んでおくべき >varと見えて変数かと思った
これはないわ
流れですぐわかるだろ
スペル違うし >>498
> もっとhtmlとjsを切り離すべきだと思う。そうすれバージョンとかどうでも良くなる
とはどういうことだろうか？
例えば機能追加でフォーム部品が増えたとする。するとjsも必然的に変わる。
Ver管理なくどうやっているのだ？ そうすれバージョン
と駄洒落を言いたかっただけのピュアな親父という可能性 >>503
JS側は、HTMLが期待通りでないことも想定して書くんだよ キャッシュ対策はgulpでリビジョン自動付与が便利だな
bundle.jp → bundle.{リビジョン番号}.js
の形にするのがよく使われる
高品質な海外サイトはほぼこの形
日本のサイトはレベルが低すぎてクソだわ >>510
そうなの？自分が知らないだけじゃない？ >>498や>>510はブラウザでキャッシュされないということかな
とするとそれも糞だな >>513
キャッシュされるよ。
バージョン＝内容が変わったときに
キャッシュされないということ >>513
横だがどんな方法使ってるの？
ファイルのタイムスタンプとブラウザのキャッシュ取得日（もしくはタイムスタンプ）を比較し、
キャッシュより新しい場合はそちらを読み込むとか？ >>506
> JS側は、HTMLが期待通りでないことも想定して書くんだよ
ではまずあなたがJSで何かの動作をするコードを書いてください。
私はあなたが期待しないHTMLを書きますので
あなたはそれを想定してコードを書いてください。 あ、もちろんJSはHTMLの内容を参照してくださいね
（HTMLを参照せずにalertだけ出すコードはダメという話です） >>519
俺が仕様を書いたら文句つけるだろ？
だからHTMLの内容を参照するのなら
どういうJSでもいいよ ・特定のidを持つdivの中にformや各inputを生成する、特定のidを持つdivが無かったりアクセスできなかったりしたら処理を一切しない
・document.bodyがなかったらbodyをつくりbodyの下にjsが使うelementを作りまくりjs自身でstyleも調整する
前者だけでもHTMLが期待通りでなくても、js自身はエラーを吐かず期待通りに動く
後者が究極のHTMLとjsの分離 >>521
極端な話そんな感じ
>>520
よくわからない。お題無しで答えろってそりゃめんどくさい 初心者の質問です。
| A | B | C | D |
上の様な感じのメニューを作りたいと思っています
しかし、以下のようにしたとき
| A | B | C | D |
↖(Aの右側)の(|)色が他と異なります。
どうしたらよいでしょうか？
お願いします。
＜HTML＞
<li class="main-left main-right"><a href="">A</a></li>
<li class="main-right"><a href="">B</a></li>
<li class="main-right"><a href="">C</a></li>
<li class="main-right"><a href="">D</a></li>
＜CSS>
.main-left {
border-left: inset 1px #dcdcdc;
}
.main-right {
border-right: inset 1px #dcdcdc;
} >>523
他のところでも聞いたのですが、いい答えを得られず… border-left: inset 1px #dcdcdc;
なんでinset？
border-left: solid 1px #dcdcdc;
じゃだめなの? insetだけじゃなく、何を書いてるかわかってないなら、ちゃんと勉強した方がいい
http://www.htmq.com/style/border.shtml >>525
>>526
ありがとうございます。
inset と solid の違いを理解してませんでした。
再度試してみたところ。解決しました。
>>526 urlまでありがとうございます。 >>522
> よくわからない。お題無しで答えろってそりゃめんどくさい
じゃあ<input type="button" id="btn">を押したら、id="result" の要素に
現在の日時を書き込むスクリプトを書いてみ
もちろん >>506 で言ったとおりHTMLが期待通りでないことを想定して書いてね
> JS側は、HTMLが期待通りでないことも想定して書くんだよ
その後、俺がHTMLが期待通りでない形に書き換えるから >>529
あ、どうも
先に回答書いてくれた人がいるけど、答えは>>521ね >バージョンとかどうでも良くなる
jsとHTMLの分離に実例で突っ込むより、こっちを突っ込んだほうが早いと思う
分離のために例外ガリガリ書いても最終的にユーザの利便性やシステムの安定に寄与しなければ無意味
全体で見たときにより多くの状況で「期待通り」になることが重要（なので497は別に悪くはない）
それどころかメンテナンス性が最悪になって時間の浪費になることも多い
具体的にはHTML構造の見通しが悪くなりすぎるのが痛い
少なくとも「HTMLとjsの分離」は常に妥当するルールではない
521はそういう皮肉で書いたんだけど、まさか答えと呼ばれるとは思わなかった プログム書く人は大変だな
あらゆる例外や状況を想定して丁寧に作っても
その労力が見えにくいから素人蔵だとその差に一切気がつかないかもな >>530
>>521じゃだめだろｗ
今はHTMLが変わったら新しいJavaScriptファイルが
使用されるようにファイル名の後ろに任意のバージョン番号を
つけろって話だ。
>>521は新しいJavaScriptファイルが使用された場合に正しく動作するように
作っているのに「処理を一切しない」ということは動かなくなってしまうということ。
つまりバグが有る状態だろ エラーが出なければ（正しく動かなくても）OKという考え方なら、
そんな要素が見つからなかった場合には処理を一切しないとかやる代わりに
try { } でくくればいい。
エラーは出ずに処理は一切しないという動作を簡単に作れるぞ
ここまで言えば理解できるような？
そういう話ではない。
正しく動くというのは、正しいHTMLとJavaScriptの組み合わせの場合と
同じように動くということなんだよ。 いや変数や属性にバージョン番号を入れて
html・js間のバージョン不整合があっても
検知できるようにするのはどうだって話だが >>535
それやるぐらいならファイル名の後ろに任意のバージョン番号を使ったほうが早い
なにせ検知すら必要なくなるのだから。 >>536
ユーザが最初から状況を把握できるように、
フォームへの無駄入力にならないように、って目的を達成できなくなるが >>537
バージョンがずれてるから無駄になるって話だろ？
俺はバージョンがずれないようにするって話をしてる。
お前はバージョンがずれないようにするのは、
お前の技術力では無理だと言ってる。
そうだな。お前には無理なだな。
前提としてお前のように技術がない人はどうするか？って
話がしたいのかはっきりしてくれ。 >>535
変数や属性にバージョン番号を入れて
html・js間のバージョン不整合があっても
検知できるようにするのはどうだって話
をしている所悪いんだが（笑）
そもそもバージョン不整合を起こさないように
すればいいだけだよんｗ
マヌケだね。
そのやり方はすでに出ているとおり ファイル名の後ろって
GET引数としてではなく
ファイル名そのもの変えろってことだろ それって1対1で紐付けられてる静的な.htmlでしか使えないのでは >>543
HTMLを修正しないのであれば、JavaScriptも修正しなくていいだろｗ
今はHTMLが期待通りでない形に修正された時に
JavaScriptも修正しなければいけないから
HTMLの修正にあわせてJavaScriptも最新版を使うようにする方法が
あるからそれ使えばいいという話をしてる
バージョン間に不整合があるなんて状態をなくせばいいだけなのに
なにをバカな方法をでっちあげてるんだバカなのかって話の流れ ああ、確かに
デメリットはせいぜい古い.js消せない、新旧切り替えができないことケースが少し増えるぐらいか
あと純粋な機能追加でjsだけ修正になったとき全部のhtml変えなきゃいけないこととか
…なんかかえって複雑になってね? >>545
> あと純粋な機能追加でjsだけ修正になったとき全部のhtml変えなきゃいけないこととか
純粋な機能追加でjsだけ修正になっても、jsが更新されないから
いつまでたっても機能追加されないって話なんですが？ なんか横から口出してすまんかった
>>546
ごめん、いつまでたっても機能追加されないのはどうよって話?
546はファイル名管理なんて使えねーよってスタンスなのか? >>547
ファイル名管理ってなんのことだ？
ファイル名変えたら全部のHTML変えなきゃいけなくなるだろ >>548
は?ファイル名の後ろに任意のバージョン番号ってそういうことだろ?
違うならなんで542否定されてないんだ? >>549
ファイル名変えたら全部のHTML変えなきゃいけなくなるから
嫌だって言ったのはお前だろ？
俺は嫌だとは言ってない。
そんなことは簡単にできることだからだ "ファイル名"の後ろにつけろっていうのは、
"ファイル名"が終わった後につけろって意味で
"ファイル名"の一部として付け足せって言ってるんじゃないからな？ >>521
必要以上に無駄で重い作りだな
特定idなかったら処理をしないというかされないだけで問題はないがデバグで混乱の元
問題はHTMLに部品があってjs側に処理の記述がない場合は？ >>521は明らかに間違い
> 前者だけでもHTMLが期待通りでなくても、js自身はエラーを吐かず期待通りに動く
jsがエラーを吐かないだけで、期待どおりに動くとは限らない >>550-551
>純粋な機能追加でjsだけ修正になっても、jsが更新されないから
>いつまでたっても機能追加されないって話なんですが？
これファイル名管理の欠点だろ?
ファイル名管理じゃなくてGET引数で管理すると絶対にズレない保証なくなるだろ?
PATHINFOで/javascript-filename/version-number/にしても実体が複数なら上の欠点残るし1個ならズレる危険残るだろ? >>554
だから最初からファイル名で管理するなって言ってるんですが？
お前馬鹿ですか？ >>556
ファイル名管理しないんだったら旧の.htmlと新の.jsが組み合わさっちゃう可能性あるんですが
?v=***は新しい.jsに切り替えるのをサポートするだけで古い.jsを出してくれたりしない >>557
> ?v=***は新しい.jsに切り替えるのをサポートするだけで古い.jsを出してくれたりしない
古いjsを出してくれたら困るだろｗ >>553
やっぱりそうか
エラー吐かずに動いてしまうゆえに後々面倒になるよな
それとコンソールで吐いてたりするし
小規模なコードしか書いたことないのだろうな シンプルに（？）>>497で整合しない場合勝手にリロードするというのはだめなん？
気味悪がられるかね jsでlocation.href変えるんじゃ駄目なん？
でも勝手にリロードしたら延々ループ続きそう >>566
> jsでlocation.href変えるんじゃ駄目なん？
ページ再表示したらしたら元に戻る >>566
> 延々ループ
ファイルのアップロード間違わなければそれはないだろ
最悪クッキーで回数制限もできる
phpのほうがよさげだが >>578
ファイル名の後ろにバージョン番号をつけるだけで
解決する問題に、そんなマヌケな仕組みを作る理由がない >>568
IE9など古いの以外リロードすればたいてい読み直すが
そんなブラウザあったっけ？ location.href等だと（再度）アクセスしろというだけの命令なので
キャッシュを使うかどうかはブラウザ・Proxy次第
下手すると本当に無限ループに陥る
location.reload(true);で
キャッシュ無視してリロードさせる手もあるが仕様外で動作がブラウザ・Proxyに依存する
FirefoxだとCtrl+Shift+Rと同様にPragma: no-cache、Cache-Control: no-cacheをつけてくれるが
ChromeだとCtrl+Shift+Rと違い普通にアクセスするのと同じ
やはり下手すると本当に無限ループに陥る fillプロパティでsvgの色を変えられると知ったのですが、background-imageで使っているsvgの色を変えることはできますか？ 記述内容変えるならまだしもファイル名変えるとは面倒だな
好みの問題か >>570
cookie受け入れないユーザーが延々ループ まあもっと単純に、
HTMLにバージョン埋めて
JavaScriptにバージョン埋めて
それが一致しないとーなんてアホな仕組みを作ると、
その仕組を作ると閉じたい無駄な上に
JavaScriptを更新したときに、
JavaScriptのバージョンを変更した上に
全てのHTMLのバージョンも変更しないといけないから
なにも楽になってないわけだ意味が無いわけだ。 >>571
まぁ言ってしまえばそうなんだけどね
一応考えてみたかった htmlだけは最終更新日を元に更新してくれればそれでほぼ全て解決するのに、
なぜ…なぜ… >>580
HTMLとJavaScriptのバージョンが
一致していないという問題だから
それとは別の問題 そろそろこれを説明してほしいな
>htmlは常に最新が読み込まれると思っておいていい CSSの質問を無視してJSにくっちゃべって何様なんですか？
答えられないんですか？ これか？
498 名前：Name_Not_Found[] 投稿日：2017/08/03(木) 21:11:23.17 ID:pXK0GuzJ
>>497
htmlは常に最新が読み込まれると思っておいていい
jsの更新漏れを防ぐためにはjsにパラメータを付ける
バージョン15
<script src="./main.js?ver=15"></script>
バージョン23
<script src="./main.js?ver=23"></script>
パラメータを変えると、別のファイルとして常に最新のものが読み込まれる
＞不整合ならユーザにリロードを促す・・・は、やりすぎだろうか？
この仕様は糞すぎる。ユーザーとしては死ねとしか思わん
あと恐らくもっとhtmlとjsを切り離すべきだと思う。そうすれバージョンとかどうでも良くなる
それとバージョンって書いてくれ。varと見えて変数かと思った >>583
そのCSSの質問ってのはどれのことを指してるのかね？ 最初の質問は>>497
htmlに
<script src="ver1_0.js">
jsは
ver1_0.js
バージョンアップがあれば
htmlに
<script src="ver1_1.js">
jsは
ver1_1.js
とするだけで何も問題が無いと思うんだが >>577
バージョンなり更新日なり記述してないの？
jsコードはそれらの値関係なく一致してるか否かだけだから最初1回記述すれば済む
HTMLのバージョンはある値以上か否かで判定すれば書き換える必要はないな >>588
すまん、よく考えたらバージョン管理なんてやったことなかった
いつもunixtimeそのまま付けてたわ >>587
それ>>586に対する回答ではないよな？
ま、いいとして>>497の３行目に注目
いちいちHTMLも書き換えることになるぞ >>592
> いちいちHTMLも書き換えることになるぞ
書き換えない方法がないのだからどうしようもない >>573
> location.reload(true);で
> キャッシュ無視してリロードさせる手もあるが
それはHTMLの強制リロードであって
JavaScriptの強制リロードではない >>594
もう少し説明してくれ
HTMLを書き換えること無く（つまりHTMLは変わらない）
JavaScrptがキャッシュされてる状態（つまり古いJavaScriptが使われてる）
つまり、古いHTMLとJavaScriptが使われているのに
どうやって変更を検知する気だ？ >>597
ああすまん眠くてボケてたわ、その通り
それに２行目の通り何にしろ書くんだな
>>575はある
好みか バージョンがどうこうの問題、jsを全部htmlファイルに書けば全部一気に解決するじゃん
変な手間も必要なし
寝よ 一番いいのはファイルの中身を変更するたびに
ファイル名にそのファイルのハッシュ値を含めることだよ。
script_5238be3a….js みたいにね。
なぜならページごとにHTMLがキャッシュされる or キャッシュされてない
状態ってのがあるのだから、新旧のJavaScriptファイルを同時に参照することがあり得る。
サーバーで提供するファイルは一つではいけないんだよ。
同時に複数のバージョンを配布しなければいけない
それをRailsなどのプログラマ系のフレームワークは
自動でやってくれている 手動でやってる馬鹿は
gulp-rev
gulp-rev-replace
ついでにgulp-rev-formatもググれよ
今時手動でキャッシュ対策してるやつなんかいんの？馬鹿ばっかだなここは。
ソース見て勉強しろ なんだろ、こういう一言余計な言葉つける人って
優越感に浸りたいのかな、実社会で逆だから 聞く方としては、口は悪くてもしっかり教えてくれる先輩がいてくれるとすごく嬉しい
内容伴ってなかったら死ねとしか思わんけどｗ >>604
記述やモジュールが増えるのを好まない、そこまでする必要もないという人もいるからな
必ずしも手動が馬鹿とは言い切れない >>606
わかる、口は悪くても有能だとツンデレって感じするよね。
うちにもそういう先輩居るけど好きだわ。 >>604
手動のほうが多いだろよ
それ知ってても使わないとか てめぇら馬鹿に教えてやるからよく読め。そして実践しろ
gulp-revはcss,js,画像のファイル名にハッシュ値を付与してくれる
画像に関しては手動でいいって場合には指定をしなければいいだけだ
例えば
app.js という名前で生成されるCSSに
app-17a6cb2dcc.js のようにファイル名を変えてくれる。
gulp-rev-replaceはhtmlに書かれたファイル名をgulp-revによって作られたリビジョン付のファイル名に置換してくれる
<script src="app.js"></script> の部分を自動で
<script src="app-17a6cb2dcc.js"></script> に変えてくれるわけだな
gulp-rev-formatは
app-17a6cb2dcc.js → app.17a6cb2dcc.jsのように好きなファイル名に変更できる機能だ。これは単なる好みだが、この形で使うサイトは多い気がするな
自動化とはいえファイル名変えるのってなんか嫌じゃんっていうやつは、パラメータ付与を自動化するプラグインgulp-version-numberっつーのもある
これはapp.js→app.js?v=17a6cb2dcc などの形に自動で書き換えてくれる（オプションで文字列変更可）
上記のような様々な方法で対策が取れるわけだな。馬鹿が。 誤字ってすまん
> app.js という名前で生成されるCSSに
JSだな。 ついでだから上記方法を採用してるサイトを紹介するぞ。
ソースをチェックしてみてくれ。
天下のAdobe様だな。源ノ明朝さんのサイトだ
https://source.typekit.com/source-han-serif/jp/
ここからは海外サイトになるな。
デザインが心地いいな。
https://www.10xbanking.com/
中々斬新なデザインだ。
http://shantellmartin.art/
HTMLが圧縮されてるが、該当箇所を探してみてくれ
http://festival.lattexplus.com/ 下記の文法はどちらが正しいでしょうか？
1：
<h4>当店取扱商品</h4>
<dl>
<dt>野菜</dt>
<dd>当店の野菜は国産・無農薬のみを扱っております。</dd>
<dt>肉</dt>
<dd>当店では鶏肉・豚肉・牛肉を扱っております。</dd>
</dl>
\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
２：
<h4>当店取扱商品</h4>
<h5>野菜</h5>
<p>当店の野菜は国産・無農薬のみを扱っております。</p>
<h5>肉</h5>
<p>当店では鶏肉・豚肉・牛肉を扱っております。</p> どう考えても下だな。
dt、dtは定義・説明リストなんだから
野菜の説明をしないといけない >>609
馬鹿て言葉使うのに限ってその意味わかってないよな
知らない、知ってても使わないは違うわな
特に必要でないライブラリは使わないに限る
見る側ユーザーからしたら手動だろうがなんだろうが関係ないこと
読み込み遅くしてまで使うメリットがあるかどうか
それは使う側次第で馬鹿か否かではない >>618
必要と必須の違い区別してる？
必須なライブラリはないし、DOM APIを使うのも必須ではない。
必要がないという話であれば、DOM APIを使うのも必要ではない
ユーザーから見れば、ライブラリを使うとか使わないとか関係ない
開発する側からしたらどちらが速く作れるというメリットが有るかどうか つーか、今の時代DOM APIを直接使うことなんて
なくなってきてるでしょ？ アセンブラと同じで
覚えても仕方ないなーと思う DOM APIは基礎なのだ。なんでも基礎は重要だ
基礎は勉強しておくべきことだ。
普段の開発で使わなくても基礎を知ってることが力になる >>618
ユーザーはキャッシュを理解してないケースが多いから、対策は開発者側ですべきだな。
一方開発者はどれだけ高品質な成果物を納期までに納品できるかが勝負になる。
大規模サイトで共通パーツに対するcssやjsが公開後にバージョンアップしたらどうだ？
全ページに手動でパラメータ付けに行くのか。時間と手間をかけて。
それが小規模サイトだとしても、複数ページに渡って作業が必要になることは確か。
同時に大規模サイトの開発を進めてたらどうだ？確実に自動化しておいた方が両方に取ってメリットしかないんだよ。 使う側にとってはどうでもいいこと
作る側にとってはそうではない。
使う側にとってどうでもよくて作る側にとって
意味があるのなら、作る側のメリットで使うことを
選んで何が悪いのか？ 自動化しないことで作る側が得るメリットって一体なんなのか 自動化するのもライブラリ覚えるのも
時間がかかるんだよ。それはコストが
かかるということだ
手作業が一番コストがかからない 今はライブラリやツールが氾濫しすぎて、覚えてもすぐに陳腐化するのが辛い
jquerymobile必死に覚えて使いこなせるようになった頃にはオワコン
bootstrap2を覚えたと思ったら3が出てたので覚え直し…てる途中に4登場
html5.0で記述中、5.1で機能が幾つか削除されている事を知る
しばくぞ＾＾ jQueryはどれだけ優秀かがわかるよな。
登場してから20年たつぞ。 >>616
dl/dt/ddは、前は定義リストだったが今は名前-値(値値 ...)のセットになっていればなんでも良くなったのでは
description listといっても説明リストというより記述リスト
http://www.w3.org/TR/html5/grouping-content.html#the-dl-element >>611
c/c++で書いてるcgiのソースを修正して再コンパイルして配置してくれたりすんの？ >>628
ちょっと難しいですね（工数外で家で勉強してこいや） >>633
そんなん俺は知らん。やったことないからな。
ググって対処してくれる？ >>623
> ユーザーはキャッシュを理解してないケースが多いから、対策は開発者側ですべきだな。
読み直し！ 上で馬鹿呼ばわりしてるのはJavaScriptやjQueryスレで荒らしてた人物だな
書き方ですぐわかる
相手されなくてこんなとこまで来てるとは <center>タグはテキストもテーブルも中央揃えにしてくれる便利なタグだけど
これ廃止になって使っちゃだめって言われたので困っている
中身いじれないブラックボックス化されたtableがあるとする
<center>table</canter>とすれば簡単だが<center>タグは使っちゃだめ
tableの中身いじっちゃだめなのでこのtableにはmargin:auto;はつけれない
この条件でこのtableをページの中央に配置するにはどうすればいいんですか？ >>627
それはあるな
実際覚えても結局使えないライブラリも数多い
jQueryでさえセキュリティ上の理由などで廃止や変更になった機能も数多い
結局シンプルで古い方法がそのまま長持ちしたりする live()が廃止になったときは呆然とした
>>638
<div>table</div>
div {
text-align:center;
} live()が廃止になったのは、on()に統合されただけで、
セキュリティ上の理由で廃止や変更になったわけじゃないよ。
知らなかったら恥かかせてごめんねｗ jQueryでセキュリティ上の理由で廃止になった機能なんて知らないな。
多いってことは3つぐらい挙げられる？ そもそもjQueryはFlash何かと違って
JavaScriptで実装されているから、JavaScriptの範囲内でしか
処理を行うことはできない。だからjQueryに問題があるとするならば
JavaScriptでもセキュリティ上の問題が発生するはず。
むしろJavaScript上で発生するセキュリティの問題が
jQueryの機能経由だと発生しないならば、
それはjQueryの方が生JavaScriptよりもセキュリティが
高いってことになるよね >>638
table{ margin : 0 auto; }
ではいかんの？ >>638
cssが自由に使用できない環境ならこれ
<div align="center">
table
</div> >>642
すまん、live()の話はセキュリティに対するレスじゃないよ
単にコーディング中に廃止されてｳﾜｰってなっただけ >>645
margin:0 autoは意味ないでしょ >>647
うわーとなったのはあんたの問題であって
世間的には大した問題じゃない。
なぜなら事前の告知とjQuery Migrate pluginによって
数年間は移行期間があったから >>649
そうか、それもそうか
当時は最新情報全く追いかけてなかった上、関数がなくなるなんて夢にも思ってない素人だったわ
なんかすまん xmlで書くメリットってありますか？
hタグが便利だなーと思ったのですが >>650
こういうのもあるからな
Microdata API が削除されました
https://www.fxsitecompat.com/ja/docs/2016/microdata-api-has-been-removed/
> Microdata DOM API は Firefox 16 で実装されましたが、後に HTML5 仕様から削除され、
> 今のところ他のどのブラウザーにも実装されていません。主にその itemId プロパティに
> 起因したさらなる サイト互換性問題 を防ぐため、この廃止された API への対応は Firefox 49 で削除されました。
他にもいっぱい削除されるものがある
DOM 関連の互換性ドキュメント
https://www.fxsitecompat.com/ja/categories/dom/ >>644
生jsだと普通起きない脆弱性が
jquery使っていると生じる、という可能性は論理上十分にありうる
開発者が自分で書いたコードの範疇外で生じる場合は気付けないため危険極まりない >>653
HTML LSだよ
> なお Microdata 自体は今でも HTML Living Standard の一部であり >>654
あのさー、可能性の話をしてるんじゃないの
過去に廃止されたというのであれば、
それは可能性じゃなくてすでに起こった事実なわけ
その過去に起きた事実をあんたに言えって言ってるのに、
将来の可能性の話（起きてないけどあるかもしれない）と
いう話をしだした途端、やっぱり起きてないんだねとしか
思いません 自分がついていけない技術だからって荒らし認定するなよｗ >>654
・生jsだと普通起きない脆弱性
・jQueryは生jsを使って書かれている
・ゆえにjQueryでは脆弱性は起きない
論理的に考えよう 口調は気持ち悪いが正しいことは言ってる
まともにレスすればいいのに勿体無い >>655
ff独自実装→W3C HTML仕様に検討されたけど除外→WHATWGがとりあえずぶっこんどいた、ってことですか
少なくとも一般的に使えた時期がないんだから、関数が無くなるって話からずれてる jqueryがjs貫通して脆弱性を搭載、ねぇ
Node.jsかなんかと勘違いしてない jQueryをflashなんかのプラグインと勘違いしてるんだと思う >>663
君が言いたいことはわかる
Living Standardの段階のAPIは消えることがある
だからこんなのを使わない方がいい
例えばFetch APIも使わないほうが良い。これもLiving Standardだ
だから今はjQueryのAjax命令を使ったほうが良い
https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API >>659
・jqueryがコード間違えててXSS脆弱性を生んでしまった
・普通にjqueryを使っていると気付かない
・生js書く人が絶対犯す間違いとはいえない
論理的に考えてありうる、というかかなりいっぱいあったね
http://www.google.co.jp/search?q=%22XSS%22+%22vulnerability%22+%22jquery%22+site%3Ahttps%3A%2F%2Fnvd.nist.gov%2F&;btnG=Search&num=100&filter=0&gbv=1
subtech.g.hatena.ne.jp/mala/20110624/1308881526 みたいなのも
なんかphpでregister_globalsの危険が危ないっていうのに近い >>665
あーなるほど、しっくり来た
胸のつかえが取れた気分だ、ありがとう >>667
クリックしてないけどURL見る限り
それただの検索結果じゃね？
そうやって逃げるから、やっぱり知らんのだって
思われるんだよ。 生javascriptで書いてきた人がjQuery否定したい気持ちは
0からcssを書いてきた人がbootstrapを今更使いたくない気持ちに
似ているのかもしれない（憶測です） JavaScriptには脆弱性がある。
だからJavaScriptを使ったライブラリにも脆弱性はある。
だからライブラリを使わなくても、
生jsで脆弱性は起きるんだよ >>666
いやそうじゃなくて、>>650にレスするにはニッチ過ぎる例じゃね、っていう軽い突っ込みだったんだが
fetch API使ったことないけど一般に広まったあと削除された関数に該当するんか？ってことよ >>667
それさぁ、「セキュリティ上の理由で消えた機能」じゃないよね？
なんで嘘ついたん？
機能が消えてしまったということを
聞きたかったのさぁ >>673
そりゃ>>644の
> だからjQueryに問題があるとするならば
> JavaScriptでもセキュリティ上の問題が発生するはず。
これに対してレスしただけだからな、
jqueryのやり方がまずくて普通起きない脆弱性が生じる可能性は十分にある、と言ったまでで嘘などついてない >>675
じゃあ、JavaScriptでもセキュリティ上の
問題が発生するとまで言ってくれじゃない。
jQueryで問題が発生するなら、
それと同じことをやれば生JavaScriptでも
セキュリティの問題が発生するでしょ jQueryjQuery言いたいだけの人たちはもうjQueryスレかJavaScriptスレに戻ってもらえないかな jQueryを使って質問者の問に答えるならいいけどさ すいません初めて質問します
ワードプレスでサイトを作っているんですが、検索結果に表示された時の説明文に画像の名前が表示されてしまい困っています
例
image15.jpgこのサイトは様々なゆで卵の食べ方について考察しています。さて…
どうすれば検索結果の説明文に画像の名前を含めないように出来るでしょうか？ >>679
image15.jpg
これはテキストで載っているの？
それともimg srcでｒしか使ってないのに反映されているの？ >>679
普通はならない。ソースかサイト開示しないと
第三者に原因はわからない。
投稿のサムネイルの保存場所が間違っているか
テンプレートファイルが壊れている可能性。
少なくともHTML/CSSの問題ではいだろうから
WPのフォーラムかスレ行きな。 >>679
テーマの名前教えて欲しい
もしかしたら原因わかるかも 要約で本文を出力する部分htmlspecialchars()などhtml無害化の方法が誤っていて
img部分までも文字列で出力している可能性もあるな
まあいずれにしてもスレチ >>681
image src でr しか使ってないっていうのはどういうことですか？？
無知ですいません
>>679の例で書いた通りにテキストで載ってます
>>682
ワードプレスだからなるっていうわけでもないんですね
フォーラム覗いてみたいと思います
>>683
stinger7です
使っている人多そうなんで他にも同じ症状の人がいるかと思ったんですが stingerとかアフィンガーは、stingerの開発者が儲けるための情弱向けツールだよ stiner7なら恐らく原因は
newpost-thumbnail-on.phpあたりだろうけどまあいいや >>679
検索結果テンプレートでthe_content()でとってきたのをそのまま出しちゃってるからだと思う
大雑把にやるならstrip_tags()かませるだけで消える、はず
細かくやるなら正規表現置換なりなんなりで不要なものちまちま消すといいかも stinger7は検索結果テンプレートはないよ。
カテゴリページ（投稿一覧）で使うitiran-thumbnail-on.phpかitiran-thumbnail-off.phpを共用している スタイルのためにdivをいっぱい使うのってまずいですか？
<div class="sofu">
<div class="oya1"><div class="ko">
<ul><li><li><li><li>
</div></div>
<div class="oya2">
<p>texttexttext</p>
</div>
</div> まずくはないが、そんなにいっぱい必要なことなんてないんじゃね？ってのが答 >>692
SEOとかには問題ないけど、いざ改修するとなったら自分がしんどいだけ
慣れてない内はだらだらdiv書きまくるのが楽に思えるけどね
頑張ってまとめよう
<section class="foo">
<ul class="bar"><li><li><li><li>
<p class="baz">texttexttext</p>
</section> >>693
divに限らずだが、デザインが凝ったものだと入れ子構造はしょっちゅう必要になる
例えば、
ページ全体の背景（全幅）にメインビジュアル部分のjsスライダーの背景（全幅）
スライド単体（コンテンツ幅）は中身をアニメーションする為に画像ではなくHTMLで組む場合を想像してみて >>691
>>665で納得するのがいるとはな
>>694
揚げ足取りするつもりではないがsectionとデザイン（スタイル）のdivは分けたほうがいい
意味の構造とデザインの構造は必ずしも一致するわけではないから
でも言いたいことはごもっとも
それと場合によってJavaScriptから見るのでなければ::afterなど擬似要素使うことでdivを数個消すこともできる >>697
ブレークポイントを多段にするとか、なんだかんだで入れ子増えていくよな >>698
じゃあ聞くが、例えばこのサイト
https://schoo.jp/guest
スライダー下の「生放送授業のスケジュール」の授業コンテンツのサムネイル画像があると思うが、
ハートマークの下にある動的な数字部分あるよな？
ここの部分をコーディングするまでに2〜3回のdivの入れ子構造でできるか？
ちなみに現在のその部分のXpathはdivが7回使われている
html/body/section[3]/ul/div/div/li[3]/a/div/div/div/div/button/div/span
↑これをお前なら具体的にどう変更できる？ 入れ子が象像できないとか言っているやつは
>>701のような複雑なサイトやった事ないんだろうな。
最近のはデザインはシンプルで済む事が多いからな >>692はid使ってるのかな？
sohu > div などでクラスは減らせる気がする
簡略化してるだろうから想像だし、メンテや将来の構造変更でクラス（やid）の方がいい場合もあるが
なんとなく >>700
そうそう。仮にPCだけなら必要なくてもレスポンシブにする為に
ソース上、必要になったりするよね
ちなみに>>701はデザイン自体はものすごいシンプルだな
コンテンツが複雑になるってだけで >>701
複雑には見えないが…
一日分ならこんな感じで組むと思う。timeをどこかには入れるけど、これは迷うな
.countはもちろんposition:absoluteでright:0かなんか
<ul>
<li><h1>8/16(水)</h1>
<dl><dt>19:00-20:00</dt><dd><div class="count"><i>ハート</i><p>445</p></div><img src="" alt=""><p>題名</p></dd></dl>
<dl><dt>19:00-20:00</dt><dd><div class="count"><i>ハート</i><p>445</p></div><img src="" alt=""><p>題名</p></dd></dl>
</li>
</ul> てか他の人にも聞きたいんだが、
>>701の構造見ると、aタグの中にdivが入っている。
これ、HTML4で書けって言われたらどうする？
リンク範囲を古いIEでも保つためにaタグ内はインライン要素のみで書かなければならない場合、
ひたすらspanで入れ子にするの？
a/div/div/div/div/button/div/span
↓
a/span/span/span/span/button/span/span これわかりにくすぎ テレビ欄みたいに特殊な段組みって難しいな
日付は見出しになるのかtimeになるのかわからん 古いIEだと、ってわざわざ古いIEでも機能するようにcssとjavascript書くのめっちゃキツそう >>706
タグを変えただけで、入れ子であることは変わってないんだが。
意味わかってるかい？？
でもdiv野郎ではない事はよくわかった。 >>710
divだらけなんだろ？と思ってソース見てなかったけど普通じゃねーか！ｗ
別にこれぐらいのdivの入れ子ならいいと思う。局所的なパーツなら幾らでもリファインできるし、例にあげることが変 >>711
複雑なデザインが見つからなかったんだよ。
ちなみにこのサイトsection3重にしてるからHTML4だと実質10回div使う事になるな。
まあ、こんなもんだよね。 >>701
やっつけ（無駄あり、改良点あり）だけどこんなんでいいの？
div一個も使わなかったけどｗ
https://jsfiddle.net/squvuq26/ >>710
> タグを変えただけで、入れ子であることは変わってないんだが。
> 意味わかってるかい？？
お前が意味わかってるかい？
divじゃないなら問題ないんだよ >>706
関係ないがh1をページ内に複数使うのはそろそろやめた方がいいんじゃない？
それともし使うならsection毎にh1つでないとおかしいのでは？ >>712
> ちなみにこのサイトsection3重にしてるからHTML4だと実質10回div使う事になるな。
だからなんだと。
sectionはその部分がセクションになってるならば問題ない。
divっていうのはデザインのためだけに使うもので意味を持たない。
意味がない囲いを何度も作る必要がない＝
意味がある囲いなら問題ない
セクションになっている部分にセクションを作ることは
何の問題もないんだが。
デザインのためだけのdivがいらない（そんなに使うことはない）
という話なんだがわかってるか？ >>709
> 古いIEだと、ってわざわざ古いIEでも機能するようにcssとjavascript書くのめっちゃキツそう
いや別に？ｗ
なぜならHTML5という仕様は、古いブラウザ・・・といっても実質IEだろうが
古いIEでも問題なく使えるように仕様が作られていったんだよ。
最初からIE対応が念頭に置かれている >>714
>>697のレスしたのが俺
「divに限らずだが、デザインが凝ったものだと入れ子構造はしょっちゅう必要になる」
「divに限らず入れ子構造はしょっちゅう必要になる」と言ったんだが。
これを
>>698で否定されたから
>>707を入れ子構造ししないでどう組めるか問うたのに
>>714
divじゃないなら問題ないんだよ
はぁ？？ >>718
え？ なんでdivをいっぱい使うって話をしてるのに
的外れの話をしちゃったの？
692 名前：Name_Not_Found[sage] 投稿日：2017/08/07(月) 22:01:48.59 ID:???
スタイルのためにdivをいっぱい使うのってまずいですか？
693 自分：Name_Not_Found[sage] 投稿日：2017/08/07(月) 22:04:50.20 ID:???
まずくはないが、そんなにいっぱい必要なことなんてないんじゃね？ってのが答 >>719
むしろなんで的外れだと思ったレスに
divの話で回答しちゃったの？ >>719
いやごめん、あんたまともそうだし、言葉遊びで争う必要はないわ。
それより、>>715に対して返信してくれ よしIE6でも現行chromeと同様に見れるように作ってくれ >>713
うめええええええええええｗｗｗｗｗ
これはプロいｗ
良いもの見れたし寝よ figcaptionがdivになってたところで誰もとやかく言わない気がするけど divを減らす目的でわざわざそれ以外のタグ使うのは筋違い
目的に応じたタグを使い、必要ならdivを何重になってでも使う
その方がレイアウト、デザイン、動的に操作するエリアと明確だし、複数人数で扱う保守性がいい divを減らすんじゃなくて意味がないブロックは殆ど無いんだから
自然とdiv以外を使うってだけの話 >>726
http://www.htmq.com/html5/figure.shtml
<figure>タグは、図表であることを示す際に使用します。 ここで言う図表とは、文書の本文（メインフロー）から参照されるようなイラスト・図・写真・ソースコードなどのことです。
図表は本文から参照される内容ですが、本文に影響を与えることなく、ページの端・専用ページ・別表にして切り離すことができます。
必要ならば、図表にキャプションや注釈を付けても良いでしょう。図表にキャプションを付ける場合には、<figcaption>タグを使用します。 >>732
うん、だから目的に応じたタグを使いと書いてある そして目的がないものなんてないから
divはほとんど使わないって話をしてる。 上で言う、レイアウト、デザイン、動的に操作する場合のみはdivになる場合多いんじゃね？
それが重なることがあるとその上で話してるぞ
もっとも小規模なコードしか書かないならさほどでもないだろうが 俺もハートと数字はdivで囲むかな
さすがにそこはええかなと妥協してしまう >>736
基本的にレイアウトを付けたい場所は何かしらのセクションなどになって、
そのセクション単位で右に表示したい、左に表示したいって書くんだよ >>692はdiv減らせそう、その後は>>736
すぱんすぱーんは基本インラインだから>>692からの流れで言うと適切ではない >>739
んなこたわかってるよ
セクションて<section>のことではないよな、まさか >>741
そりゃsectionの場合もあるだろうな。
スマホで見れば縦一列にしたいだろうし <section><header><aside>などはレイアウトのブロックとは別
段組み構造があって（通常div）その中に先生に教えるため各部分を上記でブロック分けするのが正しい >>743
レイアウトのブロックってなんだよｗ
CSSを使ってレイアウトを作るんだよ >>745
divで三重
ただそんなキモイデザインは普通しないけどね >>744
HTML4全盛だった時は、ユニット全体をcssのみでリンク範囲にしたい場合、
aタグの中にブロックレベル要素は構文的に持ってこれないから（IEでも実際効かない）
インライン要素（主にspan）をひたすらdisplay:blockしてデザイン頑張るしか無かった。
しかしさすがにspan連続は可読性悪すぎるし、クラスの乱用はjs使う上で都合悪かったので
周囲の人はemだのiだの駆使してやってたよ。 そうだったdiv乱用するとクラスだらけになるから駄目だったんだわ。
jsのパフォーマンスが悪くなる。
idにすればいいんだがidだらけも気持ち悪いし、結局タグの種類で構造指定するのが一番良いよ。 >>748
HTMLに可読性なんて必要？
ありゃあ機械が読むためのものであって
人間の読むものじゃないんだぜ 知らないみたいだから教えてあげるけど人間も読むものですよ 今はブラウザにHTMLの構造解析機能が当たり前に付いているからいいけど、
ちょっと前までこんなの一切無かったじゃん。Sass的なのも無かったし。
ソースにインデント付けられない案件は、div厨や同じタグばかり使うヤツのソースは触りたくなかった。 >>753
ちょっと前てｗ
Firebugが出来たの10年以上前だぞ >>746
なんでわからないんだよｗ
理解できないなら黙ってたほうがいい >>742
使い方違う
>>744
そりゃあるだろ
元の話とは関係ないし俺はそんなことしないがな 使い方違わない。
違うというのなら理由があるはずだが
それを書いてないってことは、
違う理由がないという意味になる 何かの要素をCSSで装飾するとき
ボックスを増やしたくなってもbeforeとafterの2個しか使えんのだから
それ以上必要であればHTML側で要素を継ぎ足すしかなかろう？
それの良し悪しなんて、誰かが決めるもんじゃなくね？ 何かの要素をCSSで装飾するとき
ボックスを増やしたくなったら
少し立ち止まって考え直したほうが良い
本来は意味があるブロックが存在すべきじゃないのかと
あるべき意味があるブロックを書き忘れているだけではないのかと
単純にスタイルのためにボックスを追加してスタイルを適用するのではなく
足りてないブロックを追加修正して、そこにスタイルを適用するのだ >>759
その論理はおかしい
<section>もだし<article>の類まだ理解してないの多いんだな 自称理解してる（笑）じゃだめなんだよ。
理解してると言いはるのなら
納得できる証拠を示さないと >>761
なんの意味もない空の<div>や<span>できちゃうじゃん
流石にそれは気持ち悪いよ >>763
それくらい他人のブログ見るなりして自分で勉強しなよ
その辺のタグの基本
>>764
そういうこと言ってるのではないのでは
少々ずれるが<i></i>でアイコン入れるとかはある >>765
お前の意見は検索した所で見つからない。
正しい説明や時として間違った説明は見つかるだろうが、
それがお前の意見と一致しているとは限らないからだ >>767
一発でしかも１番上で出るぞ
これ出すとかわいそうだから黙ってたが
http://www.htmq.com/html5/section.shtml
セクションは意味や機能のまとまりであるため、<section>をレイアウト目的の単なるコンテナとして用いるべきではありません。 そうした目的には<div>の使用が推奨されています。 HTMLのタグはは上から下へ流れていくような文書用に作られている。
それにたいしてHTMLは上から下へだけではなく、
再度とか横方向のリストとかあるから、本質を理解してないと
どうタグを使っていいかがわかりにくいのだろう。
例えば >>701 の https://schoo.jp/guest のサイト
文書とは構成が違うようにみえるから、どこがsectionなのかわかりづらい。
だけど、これを単純に上から下に流れていく文章で書くとしたらどうなるか？
一番わかり易いのは目次を書いてみることだ
目次
・ハイライト（カルーセル部分。タイトル名は例）
・明日の仕事に生きる「答え」に出会おう
・他
・生放送授業のスケジュール
・受けたい授業ランキング
・これから始めれる入門編授業
・グラフィックデザイナー になりたい人におすすめの授業
・よく見られている先生の授業
・あの有名企業の授業
・お知らせ
そう、つまりこの目次とその中身がsectionになるわけだよ。 >>768
いや、そんなのはわかってるｗ
俺のはるか後方からご苦労様
だからレイアウトのためにそこをdivとしたいと思ったら
その前にまずその部分が、本来はsectionであるべき部分ではないか？と
自問自答してみろってことだよ。
最終的なレイアウトしかイメージしてないから、
本来はセクションで（articleやasideなども含む）であるべき部分で
あることに気付いてない可能性が高い >>701のサイト なかなかちゃんと作られているではないかｗ
https://gsnedders.html5.org/outliner/process.py
このサイトでアウトラインを表示してみたら、まともな目次になってたぞｗ
こういうのはなかなかない。
どこでセクションを使うかがわかるだろう >>772
>>694から見てるよ
sectionはsection、divはdiv、別物
両方必要なら両方使えばいい
>>699の言う通り >>774
> 両方必要なら両方使えばいい
だから殆どの場合は、両方必要になることはないって話をしてるんだが？ >>776
>殆どの場合
君の中でのことを一般論かのように言われてもねえ
セクションの件はもうかたついたからあきらめろ 表の左上の、行と列の項目（バックスラッシュのような部分）どうやって作ってますか？
2つの項目名はpositionで位置付けするとして斜めの線
斜めでなくてもいいですが 訂正
>>701のサイト アウトラインはなかなかちゃんと作られているではないかｗ
せっかくアウトラインはちゃんとできてるのに
sectionは使われてないようだ。もったいない。
ヘッダによってアウトラインが構成されているのだから、
そのとおりにsectionに置き換えればいいのにな >>778
はい、さっきから俺が解説している通りってことですよね（笑） >>766
なにそれキモい
100歩譲ってAjaxで何か突っ込まれる予定というなら空要素もありかも知れんが
装飾のためになんて信じられない >>782
例えばかなり有名な
http://fontawesome.io/examples/
<i class="fa fa-camera-retro"></i>
別に信じたくなければ信じなくていい sectionやarticleって名前が違うだけで用途としてはdivとかと同じブロック要素ってことでいいんでしょうか？ >>704
ブロック要素という意味では一緒。
ただしdivがスタイルを割り当てるためだけに使うのに対して、
sectionやarthicleは意味があるブロックに対して使う。
ほとんどのドキュメントではブロックには意味があるものなので
divを使うことは殆ど無い >>785
自分あて、ですよね？
ありがとうございます
てことは例えばsectionやarticleを使うべきところでdivを使ったり
逆にdivの部分をsectionやarticleに変更したりしたとして
なにか不具合が起きてしまうようなことはないってことでしょうか？ 意味があっても適切なタグがあるとは限らない
HTML タグの種類など限られたニーズにしか対応してない、とも言える そりゃそうだろうね。
HTMLは文書を書くために作られたので
それにあわないようなもも、例えばゲームの
自キャラとか、何タグで作れば良いんだ？ってなる。
だけど普通のウェブサイトを作ってる限り
div使わなくてもなんとかなるよ
重要なのはCSSを外した状態で、構造化された文書に
なっているかどうかってこと。
これをきっちり守っていれば、スタイルのためだけにdivを
追加するなんて作業は殆どいらない HTML5 Doctor Resources
http://html5doctor.com/resources/
「日本語のフローチャート」の所に、タグ名の付け方が、図解されている >>760
空要素使いたくないけど、そういう時あるよな。
例えばCSSボタンのテキスト左側にリストアイコン、
右にCSSだけで矢印のアイコン、背景に柄の画像、
ホバーでオブジェクトが出現してそれらがアニメーションする・・とかさ。 セクショニング、きっちりマークアップ、面倒だからdiv、どれも気持ちわかる
有意義な議論だと思う
感情的になって変な方向にいかないでくれればいいが >>792
よくわからん。
CSSを適用せずにHTMLだけで表現したら
どういうマークアップになるんだ？
リストってことはこういうことでいいのか？
<ul>
<li><button>ボタン</button>
</ul>
CSSを適用してないHTMLだけでもちゃんと意味が通る
マークアップにしなきゃならないんだぞ CSSでボタンにしているだけでリンクって言いたいのかな？
<ul>
<li><a href="">ボタン</a></li>
</ul> こちらのサイトのヘッダー画像を
スマホで見たときに
写真の人物が全て写る様なレスポンシブにしたいのですがやり方がわかりません。
■サイト
http://asfeel-design.com/kaitou2/
■お
そらく弄るであろうCSS
.parallax-bg {
background-attachment: fixed;
background-size: cover;
}
■試したこと
cover → contain にすると上下に余白できてしまいます。 >>797
要素と縦横比が違う
・左右もしくは上下で必ず表示されない人が出て来る
・余白が出る
どちらかしかない
それとも縦横比は要素に合わせた方がいいの？ >>798
レスありがとうございます。
縦横比は要素に合わせたいですね； 物理的に無理だろ
無いものをどうやって出力するのよ >>800
これだけ。
background-size: 100% 100%;
縦横比揃えるならこっち
background-size: contain;
background-position: center center; >>787
それらは全く別もの。かなり大雑把に言えば
divはブラウザや我々のためのもので、arthicleなどはロボットのためのもの
変更したり置き換えるとかそういうものではない
したとして不具合はないがSEOには影響してくる
わからなければdivにしておけばいい >>804
煽る能力が低いから他人に成りすますんだね
朝鮮人みたいｗ >>792
アコーディオンメニューにアイコンつけるのに空span使ってるわ
classをつけてスプライト
それと昔float解除するのに空div使ってたな 文書構造だのなんだの言うけど結局はgoogle様のためなんだよなあ
障害者用の音声読み上げなんかは
HTMLタグより中身の記述の仕方のほうがずっと重要 >>803
美容師「あんちゅぁ〜んあんちゅぁ〜ん」 >>792
仕方ない時はあるよね
自分は空要素置くのではなく、divでもspanでもひとつ多めにくくって
それのbefore/afterを使うことが多いけど
本質的にはやってること変わらんと思ってる 答えられる人は居ませんか？
もういいです、ここはレベルの低いスレですね、知恵袋で聞きます。 HTMLはデータとして扱うデータ構造の側面よりも
見た目を整えるデザインの側面のほうが強いんだから仕方ない div厨にはちゃんと理解して書けよって思うけどdiv使うな厨はなんか気持ち悪いというか人とのコミュニケーションが欠落してる人種が多いな…お前らもうブラウザの一部なんじゃねーのキモ >>814
div使うななんて言ってるやつはいないぞ
（HTML5でタグが増えたので）divが必要になることは少ない
という事実を言ってるだけだ >>811
写真本来の縦横比を崩してbackground-size: 100% 140%;
のように縦に引き伸ばす以外に方法はないよ
しかしそれは対価を貰うプロの手法としてはありえない。だから誰も回答しない
本来ならスマホ用に最適化した写真を別途用意するか、足りない部分の余白をデザンで上手く対処する 正直sectionの使いどころがイマイチよく分からない・・・
navやarticleなんかはまだ分かるんだけど main
article
section
section
section
大雑把に言うとこんな感じ listboxのitemが選択済みのとき、Ctrl+Cクリップボードにコピーしたいのですが、
どうすればできますか？
1 japan
2 america
3 china
1,3が選択済みの状態でCtrl+Cで
クリップボードには、
1 japan
3 china
インナーテキストでコピーされるのが理想です。 >>819
article（記事）の中にsectionを入れるんだ？
今まで逆にしてたわ・・・ >>821
重要なのはアウトライン。アウトラインを自分が望む形にすること
あとは中に入れるものに応じて、articleやsectionやnavなんかを使い分けるだけ。
その結果sectionの中にarticleが入ることもあるが問題ない >>821
articleとsectionは一週間ぐらいみっちり勉強したわ
article「単独でなりたつ記事」
section「意味のひとかたまり」
まぁ、全然分からん
とりあえず大体これが定形とおぼえておけばいい
正直ややこしすぎるしみんな間違いまくっているので、SEOには影響しない（と思う） どんな使い方してもいや違う、俺が正しいっていちゃもんつけてくるやつがいるからあんまり気にすんな >>824
これな
もっと言えば内容・程度どっちも具体的な実害がなければどうでもいい >>819
articleとsectionはどちらが上下には関係なく逆もある
>>818
sectionは大雑把に言うと内容のまとまり
<h2>
<section>
<h3>
<p>
<section>
<h3>
<p>
articleもだがこの手のタグはSEOにこだわらなければなくてもいい
コンテンツ内容が悪ければあったところで意味ないし 常時SSL化対応進んでる？
SSLって金額がピンキリだけど、数ページ程度の規模の小さなサイトは
クライアントにいくらくらいのプラン薦めたらいいやら >>833
ひょっとしてブログの主？
ちなみに
× ブロック要素/インライン要素
↓
○ ブロックレベル要素/インライン要素
だよ ｈｔｍｌ超初心者です。
videoタグを使って、動画を見れるページを作ったんですけど、なぜかシークバーを動かせず、動画を途中から再生するこ
とができませんでした。ブラウザはchromeです
ちなみに、firefoxでは、シークバーを操作して好きな位置から再生することができました。
chromeのプレイヤーではシーク動かせないようになってるのでしょうか？もしそうならどうやれば動かせるようになりますか？ 今までホームページの更新をhtmlを編集して行っていたのですが
そういうのに詳しくない人でも更新出来るようにページタイトル、挿入画像、その他幾つかの文言や数値を打ち込むとテンプレートに適用されて
ページが完成する投稿フォームみたいなものを作るには何を勉強すれば良いですか？ >>838
そういうのは後々面倒だよ
一般的な手法のあれができない、これが使えない・・・
HTMLでやり始めたのならそのまま続けるほうが無難 2.3ページならヘッダとフッタをphpで共通化させる程度でいい Progateを使って有料会員でHTMLとCSSを勉強し、今中級あたりを勉強しているものです。
片手に本がいると思い、昔の「HTMLポケットリファレンス」をちらちら見ながら勉強しているのですが、リファレンス等ほかに持っておくべき本や勉強になる本などありますでしょうか？ 肛門のシワの数を数えてるとき、数え始めがどこだかわからなくなって
また最初からやり直すことがよくあるんですが
何かいい方法あったら教えてください 極細油性マジックを使えばCSSだろうがシワだろうが解決 >>849
本はいらん
とりあえず自分は何を中心で書くかを決める。分からなければhtml5.1
で、htmlタグとcssを一通り読む
後はひたすら書くのみ
flexとレスポンシブデザインは絶対に覚えること >>849
将来web関係の仕事に就こうとして勉強してる？
現場で実務経験が一番身に付く。いらないものと必要なものがわかるし >>852
お前様たちはやっぱまだw3c派なの？
ブラウザベンダーのこと考えるとLSの方に従った方が良い気がするんだけど >>854
基本どっちでもない。htmlはさすがに5だけど、できるだけ枯れた技術を使うようにはしている
他諸々だけど、w3cにかぎらずにできるだけクライアントが標準と認識できる標準に合わせるようにしている。要は言い訳ができるようにしている
何かが起こったときでも、「まさかこんな事になるとは予想できなかった、この仕様変更のおかげでどの企業様も同じ問題を抱えることになりました」は、言える
自分のサイトなら最新だろうが最古だろうが動けばいい、何か起こったら手直しすればいい、というスタンスで作るけどね 閲覧してるサイトの画像をURLを弄ることで拡大することは出来ませんか？ >>857
それはブラウザの話？
なら「ctrl」+「＋」 >>858
ちょっとわからないです、すみません
それをURLの最後に加えたら良いですか？ >>857
すまん、質問の意味が全然わからん
具体的にどういうことをしたいの
参考になるサイトがあればURL貼って >>860
携帯なのですが利用してるPCサイトの画像が小さいので
それを常時拡大するようにしたいんです >>861
ユーザーCSSの使えるブラウザを探すか
img要素の大きさを変えるJSを書いてブックマークレットにするといいかも ん？閲覧時って事は利用者の質問て事？
ここは制作者が制作について質問するところじゃないのか >>864
ありがとうございます
KZ BRAINとGoogleのモバイル変換で数値は弄ってますが
設定値を下回る小さい画像になってしまいます
個別で設定し直せば拡大出来ますが見る度直すのも手間で
> img要素の大きさを変えるJSを書いてブックマークレットにするといいかも
具体的にどういうやり方か教えて下さい >>865-866
意外な盲点
スレ違いかと思って眺めてたけどそうでもないのね そりゃあuser-cssだってあるしHTML/CSSの質問なら制作者に限らず閲覧者も対象になりうる
特定の機種、特定のサービスの設定がどうたらとか
javascriptでブックマークレットをどう書くかなんてのは場違いだが >>867
Array.prototype.forEach.call(document.querySelectorAll(‘img’),function(img){
img.width = ‘300px’;
});
こんなかんじで 扱う対象がサイト制作の技術であって
ブックマークレットはローカルで動くブラウザ側の拡張機能だから、ということかね？ いや、ブラウザの機能についてもサイト制作の範囲内でしょw
例えばChromeだけ印刷結果がおかしいです。
回避方法はないですか？とかさ。 >>1のこれぐらいまもれよ
> 類似質問大いに結構。分からない人は何回聞いても結構
> HTML / CSS 関係の事なら何でもOK 誘導されるであろう板の住人なんだけど
結局またそっちにたらい回されるだけだと思う
ブックマークレットなんて99.9%JSとHTML/CSSのことだし
その分野に関してはあんたらが一番詳しいだろ
なんでそんなに頑ななん？ このスレは俺のなんだわ。俺の許可なく話題を増やすな
何が良くて何が悪いかは俺が決める 画像が小さい→ブックマークレットって解決作はありえんだろ
拡大すれば終わりなのに
せめて拡張機能だろう。あるかどうか知らんけど このスレでjsもわかる人がいたとしてスマホならまだしも機種依存バリバリのガラケー（現時点で機種不明）
そのうえモバイル変換経由
ブックマークレットとかusercssなんてそもそも使えないだろう
全知全能ユーザサポートスレじゃないから 誰も無能なお前に答えてなんて言ってないよw
黙ってればいい >>890
js（jQueryも）わかるがキモくて調べる気にならんわな Selenium, PhantomJS などで、ブラウザを自動操作すれば？ 優しくなれないｗ
なんじゃそりゃ、その必要性ないし読み違えてるし 左の空欄はタブ禁止半角スペースが推奨されてるがタブだと何か不具合が？
入力楽だしサイズ減るしエディタで自由に幅変えられるし利点多いのだが http://www.dotup.org/uploda/www.dotup.org1340552.png
この画像のように、スライドショーの上にナビを重ねるのはposition：absolute;を使うしかないでしょうか？
レスポンシブデザインにするとき面倒くさそうなのであまり気乗りしないのですが・・・
皆さんならどうやりますか？ レスポンシブでめんどくさいの意味がよくわからないんだけど >>898
スライドショーの上にナビを重ねない
＞レスポンシブデザインにするとき面倒くさ
全く感じない
それはhtmlをややこしく考え過ぎ
<div>
<nav><ul class="slideshow"></ul>
<ul class="slideshow"></ul>
</div>
こんな感じにしておけばPC版はnavをabsolute、
モバイル版ではstaticにするだけで済む >>900
ありがとうございます。
static全然使ってませんでした・・・
ちなみになんですが、↑のスライドショー+ナビのやつはwidth:100%でやろうと思っていました。
しかしnavi部分にwidth:100%;を指定して位置調整するのがうまくできず断念したのですが、うまいやり方ありますか？ めんどくさかったらHTML側は要素のセット一式を2つ作って
画面によって片方 display: none; にしちゃえばいいじゃん スライドに関するメニューならともかくグローバルなメニューなら
jsで動的に表示非表示にしたほうがいいな
PCの広い画面ならともかくスマホの小さい画面でナビがでしゃばられるとうっとうしい スマホ用の大きい画像をPC表示の時にも使いまわそうと思い、imgのwidth属性で元サイズより小さい値を設定したら画像がぼやけてしまいます。
これは画像自体のファイルデータか形式の問題ですか？ それとも幅の設定方法を変えれば解決するのでしょうか？ >>901
いくらでもある
position:absolute
bottom:0
で下端固定とか
「うまいやり方ありますか？」じゃなく、css一通り読ｂｾほうがはるｂｩに速くて良いャTイト作れるよ
>>902
navぐらいならいいけど、スライドショーを二重にするのは重すぎる
>>905
iphoneなら
「レティーナ対応」などでぐぐってくれ
簡単に言うと縦横2倍のサイズで作らないとぼやける コメントページにコメント順と日時を記録して送信してくれるコメントフォームを作りたいです
いろんなページのソースを見て参考にしようとしたけどちんぷんかんぷんでした
どうやって作るべきか検討すらつかないです誰か助け舟をお願いします >>907
HTMLとCSSの質問ではありません
WEBプログラミング板あたりへ行ってください >>908
ググってみたんですがこれ既存のホームページにコメントフォームを設置するためのものとして使えそうにないような…
>>909
HTMLとCSSじゃ作れないんですね…どうも失礼しました >>910
そう、1から作り直しになるけどそのほうが手っ取り早い気がする
コメントはセキュリティホールにもなるし、本気で作ろうと思うとかなり大変だよ >>911
なるほどありがとうございました
あとはもうここのスレで話すことではないのでもう失礼しますね >>906
スマホ用に大きめに作った画像をPC表示だとおきすぎるので小さく設定して表示したらぼやけたと言っているんですが
検証もRetinaではないPCで行ってます >>906
あれ困るな
アップルのレティーナディスプレイではボケないんだよな、chrome >>913
実寸の整数倍以外の大きさに変更するとボケんのよ
あとtranslate等でgpuに処理を渡した時とかも なるほど、大きければいいというわけではないんですね
そうなるともうPC表示用は別の画像を使うしかないですよね
ありがとうございます >>916
スマホの方は大丈夫だから
PCで使うサイズの整数倍で作って、スマホの方で縮めて使うのよ
ただこれデスクトップ版Chromeの不具合みたいなもんだから
そのうちしれっと治ると思うけどね すいません、ご質問よろしいでしょうか？
.htaccessのwww統一についての質問です。
-----
www・index無しを.htaccessでリダイレクトして統一したいと思い、
以下を.htaccessに書き加えました。
正常に動作しましたが、以下のようになってしまい困っています。
ファイルの拡張子が書き加えられてしまいます。
http://○○○.jp/×××
↓（にwwwを書き加えて飛ぶと）
http://○○○.jp/×××.html
できれば上記のように拡張子を書いていない場合はwwwを付け加えても
ファイルの拡張子なしでの表示をしたいのですが、それは可能でしょうか？
使っているサーバーはさくらのスタンダードプラン・ファイルの属性は604です。
是非、知恵をお借りしたいです。回答お待ちしています。
-----
RewriteEngine On
RewriteCond %{HTTP_HOST} ^www\.○○○\.jp$
RewriteRule ^(.*)$ http://○○○.jp/$1 [R=301,L]
RewriteCond %{THE_REQUEST} ^.*/index\.html
RewriteRule ^(.*)index.html$ http://○○○.jp/$1 [R=301,L] >>918 です。
すいません、ageるのを忘れてしまったのでageます。 >>904
dsiplay:noneってあんまよくないの？ >>920
同じ目的の要素をダブらせるのが非効率・美しくないってだけだぞ メンテ性落ちて重くなってSEO的にもよくないだろうね スライドショーをダブらせるのは重すぎる
普通のサイトなら最も重いコンテンツだろ CSSはあくまで見た目であって、
ドキュメントの内容というのは、CSSを適用しなかった状態のもの
あとは同じ文章が複数出てくるドキュメント（文書）は
読んでいて意味がわからない文書になるだろって話 jsを少しかじったぐらいで、プログラミング経験はなくHTML、CSSができるくらいのひとにおすすめのjsの本教えてください。 >925
そんなんでおすすめなんてわかるはずがないだろ >>923
jsやcssで切り替えてるならdisplay:noneで非表示になってる限り
画像はロードされないんじゃないんか htaccessの質問はさくらサーバーで自由に検証できる環境がある人でないと回答できないんじゃないか >>927
imgならべて普通にsrcで画像指定して、cssで時間差アニメーションだけかけてスライドショーに見せるタイプは画像が読み込まれる
background-imageでやってるなら確かに画像は読み込まれない
jsでやってるなら問題はないが、なら他もjsでなんとかしろよという話
imgならべてcssでスライドショーさせること自体が重いんだクソがというなら正しい 2カラムレイアウトを作る時はどれ使ってる？
flaot、position、display:table、display:flex 高さ揃える必要ないならinline-blockにしてる html初心者です。
質問があるのですが、スマホの画面(縦)に、3つのテキストボックスを縦に並べてそれぞれのボックスを横に中央に配置しようと思ってるのですが、うまくいきません。どう書けばいいのでしょうか。宜しくお願い致します。 質問です
floatで横並びにする際、ブラウザ最新しか対応しない場合、
もうclearfixのような記述は不要でしょうか？
自己解決しました。 >>936
全て用途が違くね？
「2カラムだから〜を使う」じゃなくて、フローティングしたくて float を使うとか、設計思想の問題だろ
俺は float の動きを好んで使う(レスポンシブが楽)が、そういう設計をしない奴もいるだろうし、求める結果は人それぞれだぞ
「よく分からないから最も利用者の多いプロパティを使おう」
という発想なら考え方を変えるべき >>928 >>932
>>918 です。レスありがとうございます。
誘導もあったので、こちらの質問は取り下げたいと思います。 >>937-939 >>941 >>944
答えてくれてありがとう
944の回答が図星で参った
出直してくる 同じく。
floatだとレスポンシブの時、float解除を一括制御でラクチン floatはその要素で完結しないのが猛烈に気持ち悪い
かと言ってclearfixはゴテゴテしてるし clearfixについてはそうだが、段組み構造の目印と前向きにとらえてる
ulなどは余分なdivなくそのまま使えるし
上の人同様レスポンシブが楽だしそこそこ古いブラウザも対応してるし無難
>>940はもういいのかな？一応
テキストボックスか親要素のwidth固定ならmargin auto auto float は clear するまでフローティングし続けるんだから、あの挙動が正しいんだよ
むしろ、段組の機能と決め付けて、clearfixする設計の方が気持ち悪い(float は段組の為のプロパティじゃない)
後続要素で clear すればいいだけなのに余計な疑似要素を作るとか、用途が間違ってるだけだろ
フローティング要素がページ末尾の時は困るだろうが、フッタをフローティングする事はないから困ったことはないな >>952
clearfixしないとボックスの高さを認識できないよ（ボーダー付けると良く分かるが） >>953
分かっている
それは、後続要素で clear すれば良いだけだろう？
「clear するまで float し続ける仕様」を理解せず、段組用のプロパティと認識される事が異質に感じるという事
clearfix は DOM 構造的に美しくない >>952
元々段組みの機能でないものを気持ち悪いというのはわかる
用途が間違ってるというか、当時なかったから仕方なく使ってるわけだから
でも当時も今も有効便利な手であることは確か
後続要素でclearは要素挿入やデザイン変更でメンテ性が悪い
空divもだが一長一短だな
あと>>951「テキストボックスか親要素の」は「テキストボックスの親要素が」だった
寝ぼけてるとつまらんミスしてしまうorz 後続要素で clearはわかる
ただ、間に要素が追加されるといちいち消したり付けなおしたりする必要があるのでそれはそれで面倒 floatって元々imgとテキストの段組みのためのものだろう
それをブロック要素に適用仕出した辺りからおかしくなった >>957
テキストの回り込みのため、だな
>>958
隙間対策が気持ち悪い、でfloatと同様結局好みになる inline-blockってIE7以下で効かなかったから避けてたが
IE7無視し始めた頃あたりから喜んで使い始めた記憶
inline-blockでもfloat付けないと横に並ばない時があったが、どういう時か忘れた >inline-blockでもfloat付けないと横に並ばない時
気になるんだけどどんな時か考えても全然わからん vartical-align設定してるとガタガタになる
marginを付けている
うーん letter-spacingとかfont-sizeで調整いるのがちょっと手間ね このように中途半端な出来のものを
ありがたがって使う輩がいたからめちゃくちゃになった
CSSは少しはましになったがまだ完璧ではない。
使いづらい部分ははっきりとだめというべきだ 全部divでabsolute配置しろよ
って感じじゃなければマシさと思うようになってきてしまっている 究極的には文書構造とは全く関係なく
ブロックごとに配置を決められるべきだろうけどね。
その点でabsoluteは考え方的には近い機能では有る
ただabsoluteの欠点はブロックの中に入っている文字によって
別のブロックの位置を調整できないってこと
ブロックの内容（大きさ）が変わらないのであればabsoluteで
完璧なレイアウトができるのだけど、実際には文書の中身は変わるし
ユーザーが使用しているフォントやウインドウの幅などで
ブロックの大きさは変わる。
それに追尾して他のブロックを調整する機能がない。
だからCSSの機能はブロックごとに左に寄せたり右に寄せたり
横一列にしたり順番を変えるというような機能にならざるをえない
CSSの進化はどれだけ文書構造とは関係ない配置を作れるかという
機能の実現でも有る >>965
そういうフレームワークが昔あったな
そしてそれを使っていたｗ
すげー使いやすかった 究極的には文書構造とは全く関係なく
ブロックごとに配置を決められるべきだろうけどね。
は？ は？っていったらは？だよ！
だから何と言われても困る！
良い返す言葉がでてこないんだから、は？ ＞ブロックごとに配置を決めたい
個性的だね
＞ブロックごとに配置を決められるべき
は？ >>970
いい加減反論しろよｗ
反論はないですーっていうのなら
そういうことなんだろうけどさｗ >>971
イメージマップは画像の一部分をクリックできるようにするもので
全く関係ない話だね。
それと勘違いしちゃってたのかな？
それはマヌケだｗ 以前試しに
長さ単位を全部vwにして、全てposition: absolute配置で
過去に作ったLP系のページをやり直して見たことある
要素の多いところや下の方は計算面倒だったけど
わりとキレイに出来てビックリした
ただ、ちょっとしたアコーディオンとかをどうしたら良いか悩んで
めんどくさくなって放置した思い出 確かほーむぺーじびるだーも絶対配置絶対配置でやってた気がする
ある意味で合理的ではあった vwって古いAndroid対応してないのが面倒
気にしなくていいならとっても使いやすいのだけれど clearfixは高さそろえることにも有効なんだな
背景つけるとき重宝 >>964
そんなこと全世界で言ってるよ
規格やブラウザ作ってる側の対応悪すぎ >>955
IE6全盛期当時は代替手段がなかったから、「仕方なく」floatを段組の為に使っていた、というのは分かる
だが、過去に段組のプロパティとして浸透してしまった影響か、>>957のように認識する輩が増えてきてげんなりしてる
酷いのになると、「float を使って、ウインドウ幅を狭くすると右側のボックスが下に回り込むのですが、回り込まないように出来ませんか」と質問する人までいる
float の仕様を理解していない人が不当に float を貶めているように思えてならない >>981
だから俺は昔からfloatを段組みに使うのは間違い
CSSはクソって言い続けてきたんだよ。 >>982
1行目から2行目への論理の飛躍に笑った >>983
お前は知らんだろうけど、
俺はIE5ぐらいからCSS使ってるからな
その頃から「物理要素タグやテーブルレイアウトは使うな。
見た目はCSSを使って書け」という原理主義者に対して。
その理想はわかったがCSSはそれが実現できるほどの機能がない。
まずその問題を解決してから理想論を口にしろ
今のCSSはクソだって言い続けてるからな。
随分まともになったがまだ足りない >>982は正しいと思う
float、clearはどう考えても使いにくいだろう
flexの登場も遅すぎた >>984
floatで段組を作るのは間違いに異論はないが、それはfloatの問題ではないだろ
floatを段組として使う奴が悪い
それから、CSSの何が問題なのかを具体的に言及せずに否定しても机上の空論だぞ
CSSの仕様をずっと問題視してるなら、仕様策定のメーリングリストで要望を出すのが筋だと思うがね
ただ、文句をいうだけならガキの戯れ言と同じ >>983
論理の飛躍？その通りだが
突っ込むなら「元々」のとこだろ
>>985
では何を使えと？ >>987
inline-blockだが、これはこれで不便な点も多々あった
高さをそろえるためだけにpadding9999px、magin-9999pxとかやってたしな
どう考えてもアホだった。web業界全体が未熟だった >>987
>982 !== >955 だと思うが、同一人物なのか？
>955の「元々」には特に違和感はなかった 未来にはHTML/CSSなんて無くなってもっと根本的に違う概念のものになってそう >>980が立てる様子がないので、次スレを立てた。
テンプレの意見よろしく。 >>988
floatは元々は新聞にある回り込みなんだよな
新聞に段組みもあったのにそのプロパティを作らなかったのはなぜなんだろ
当時でもブラウザ実装で技術的に問題あるようには思えないが >>989
>>955は俺で>>982は別人
突っ込み所は>>957の「元々imgとテキストの段組みのため」のこと
>>981は別人で、float本来の意味や段組みと回り込みの区別や理解してないことに言ってるのだろ
その前の流れからすれば特に飛躍というほどでもないと思う、ということ >>982
> だから俺は昔からfloatを段組みに使うのは間違い
その通り。
floatは段組のプロパティではないので、ユーザの使い方が間違っている。
> CSSはクソって言い続けてきたんだよ。
これは上述の「ユーザがfloatを段組と勘違いしている事」とは別の論題だから、論理の飛躍。 >>993
> 新聞に段組みもあったのにそのプロパティを作らなかったのはなぜなんだろ
当時も display: table-cell; はあったよ。
使われる事がなかったのは一重に IE がアップデートをさぼったから。
そして、MS が古い IE をいつまでも見限らず、サポートし続けたから。
仕様が策定されようが、実装されなければ使えない。
実装されない仕様を策定する事は無意味。だから、停滞した。 >>996
論理の飛躍じゃないよｗ
ユーザーがfloatを段組と勘違いしたのは
段組の機能がなかったからだ >>997
> 当時も display: table-cell; はあったよ。
> 使われる事がなかったのは一重に IE がアップデートをさぼったから。
なかったよ。俺が言ってるCSSっていうのはIE5時代の話な。
当時はCSS使ったら落ちるブラウザネスケがライバルだったｗ display: table-cellをIE以外が実装したのは、
2010年ぐらいですかね？
おそい。おそすぎるｗ このスレッドは１０００を超えました。
もう書けないので、新しいスレッドを立ててくださいです。。。
life time: 33日 22時間 7分 36秒 ２ちゃんねるの運営はプレミアム会員の皆さまに支えられています。
運営にご協力お願いいたします。
───────────────────
《プレミアム会員の主な特典》
★ ２ちゃんねる専用ブラウザからの広告除去
★ ２ちゃんねるの過去ログを取得
★ 書き込み規制の緩和
───────────────────
会員登録には個人情報は一切必要ありません。
月300円から匿名でご購入いただけます。
▼ プレミアム会員登録はこちら ▼
https://premium.2ch.net/
▼ 浪人ログインはこちら ▼
https://login.2ch.net/login.php レス数が1000を超えています。これ以上書き込みはできません。
