(X)HTML/CSS/Dreamweaverの質問に優しく答えるスレ20at HP
(X)HTML/CSS/Dreamweaverの質問に優しく答えるスレ20 - 暇つぶし2ch432:Name_Not_Found
16/02/09 20:46:59.16 .net
管理者モードなどでテーブルの色や枠線の幅を設定する場合
スタイルシートはHTMLタグにstyle="border:Solid 枠線の太さ設定変数 枠線の色設定変数"のように埋め込むしかないですよね?
外部ファイルにcssを置くとcssファイルに設定値を書き込んでいる最中に
cssファイルを読み込まれることになるから

433:Name_Not_Found
16/02/09 20:58:40.85 .net
管理者モードって何の?

434:432
16/02/09 22:34:36.36 .net
ワードプレスです

435:Name_Not_Found
16/02/09 22:49:48.23 .net
掲示板とかの管理者モード

436:Name_Not_Found
16/02/09 22:54:50.04 .net
ワードプレスかよw
まあなんにしてもHTMLタグのstyle属性に直接記述することはあまりない
あと>>432の後半2行は意味不明
全般的にもっと読む人がわかりやすいように書けw

437:Name_Not_Found
16/02/10 02:30:00.48 .net
>>432
作業中のCSSがリアルタイムで読み込まれるわけじゃないから。
一時的にページが崩れるくらい大幅なメンテやアップデートするときに、閲覧者に見られたくないんであれば、
作業してる間だけサイトをプライベートにしておくか、ローカルでテストしてからアップすればいいよ。

438:Name_Not_Found
16/02/10 11:00:01.46 .net
多分スレチな内容なんだろうと思うけどどこで質問すればいいのかわからなかったからこちらに
昔流行りそうだった、フレームを使ってメニューやヘッダーを分けるみたいに、
フレーム無しでメニューやヘッダー、を外部ファイルから読み込んで来るような
いわゆるオブジェクト指向の構造を作るにはどの分野を勉強すればいいんだろうか
コンテンツが一つ増えるごとに全ページのメニュー編集とかがそろそろ追いつかなくなってきて
勉強したいもののどうぐぐればいいのかがさっぱり状態

439:Name_Not_Found
16/02/10 11:11:14.11 .net
>>436
じゃあちょっと質問かえる
phpやperlなどのプログラムでスタイルシートの背景色や枠線の太さの設定値を自動生成する場合
直接htmlタグにstyleを埋め込むしか思いつかないんだけど
こういう場合はcssを外部ファイルに置くと言うのは無理なので埋め込むしかないですよね?

440:Name_Not_Found
16/02/10 11:17:22.22 .net
付け加え
掲示板で投稿毎に投稿ごとの背景色が変わるようにする場合は
外部にcssを置くのって無理じゃないかってことです

441:Name_Not_Found
16/02/10 12:21:54.45 .net
overflow-y:scroll に設定したエレメントについて
最下部にスクロール済みの状態をcssだけで再現可能でしたら方法を教えて下さい
よろしくお願いします

442:Name_Not_Found
16/02/10 12:32:33.32 .net
無理です

443:Name_Not_Found
16/02/10 12:51:16.06 .net
>>440
結局何がしたいの?背景色をランダムで変えたいって事??

444:Name_Not_Found
16/02/10 12:55:13.47 .net
>>438 SSIじゃだめかい?

445:Name_Not_Found
16/02/10 13:40:42.86 .net
>>439
プログラムでclass属性を出し分ける方法もあるよ
実際のスタイルはあらかじめcssファイルに定義しておく
style属性をいじってもいいけど
変更するCSSプロパティが増えると煩雑になりがちなので
どちらの方法をとるかはケースバイケースで

446:Name_Not_Found
16/02/10 13:43:20.25 .net
>>438
SSI
php インクルード
HTMLテンプレートエンジン
などでググれ

447:Name_Not_Found
16/02/10 13:46:02.41 .net
>>440
445の続きだが投稿ごとにstyle-1、style-2などのclassを付与する
外部cssにそれぞれのclassのスタイルを定義する

448:Name_Not_Found
16/02/10 14:06:55.63 .net
すみません、教えてください
table要素で表を作成したのですが、表全体が左側に偏ってしまいます。
中央に配置させたい時は、どうしたら良いでしょうか?

449:Name_Not_Found
16/02/10 14:09:28.20 .net
>>440
447の続き
それからstyle-1、style-2などにIDも付与してやる
外部cssにそれらも定義してからstyle名を一括変更

450:Name_Not_Found
16/02/10 14:12:27.47 .net
>>448
table-position:center;

451:Name_Not_Found
16/02/10 14:12:56.02 .net
>>450
ありがとうございます

452:Name_Not_Found
16/02/10 14:27:51.41 .net
>>448
margin: 0 auto; /* 0のところはお好みで */
>>450
なんやtable-positionてw

453:448
16/02/10 14:29:39.82 .net
>>452
ありがとうございます
450さんの方法で試したら上手くいかなくて試行錯誤してましたw

454:Name_Not_Found
16/02/10 14:34:52.03 .net
>>439
CSSシグネイチャの考え方を導入してbodyタグのクラスを変化させるとか?

455:Name_Not_Found
16/02/10 14:54:04.87 .net
tinpo-family: skined;
tinpo-position: left;
tinpo-size: 5cm;

456:Name_Not_Found
16/02/10 17:42:06.62 .net
>>438
jqueryでも読み込めるよ

457:Name_Not_Found
16/02/10 18:01:15.03 .net
まぁ定番はphpだろう

458:Name_Not_Found
16/02/10 18:02:06.26 .net
>>456
横だがそれだとSEO的に大丈夫なん?

459:Name_Not_Found
16/02/10 20:47:58.00 .net
ここでいいのか、わからないけど教えて下さい。
float:leftした時のmarginが効かない時に、親要素を overflow:hidden するみたいですが、結構な数の要素にoverflow:hiddenを適用してるんですが、SEO的には特に問題なしですか?

460:Name_Not_Found
16/02/10 20:49:59.26 .net
問題なし

461:Name_Not_Found
16/02/10 21:06:42.25 .net
>>460
ありがとうございます。

462:Name_Not_Found
16/02/10 21:10:12.40 .net
>>459
もはやSEOってのは非リンクの事だから問題ない。

463:Name_Not_Found
16/02/10 21:36:13.83 .net
>>438です
色々な手法があるみたいですね ちらちら見てphpが他にも色々使えそうなのでこれ勉強してみたいと思います
沢山のレスありがとうございます

464:Name_Not_Found
16/02/11 00:03:41.16 .net
TD.menu a:hover{
background-color:#00ff00;
color: #fff000;
}
これをstyle=""の形にするにはどうすればいいのですか?

465:Name_Not_Found
16/02/11 00:22:14.17 .net
>>464
htmlに直接書くのは無理。
スクリプトで当てるってのは出来るけど、それならcssでいいし。

466:Name_Not_Found
16/02/11 13:09:12.07 .net
>>462
ありがとうございます。
もう一つ教えて下さい。
class指定の仕方で、liタグやhタグを変更するときに
cssで#test li{}としたほうがいいのか、それともタグに
直接<li id="">とタグの中に?直接入れるのではどう違うのでしょうか?
SEO対策なのか、作者の好みで分けるのかいまいちわかりません。

467:Name_Not_Found
16/02/11 13:24:23.41 .net
class指定で、#やidは使わないよ

468:Name_Not_Found
16/02/11 14:15:57.74 .net
>>466
とりあえずネットに溢れてるSEOの情報は気にしなくて良い。
そのほとんどがアフィリエイト目的で作られてページに過ぎないから。
htmlに直接スタイル当てるのが推奨されてないのは、
文字数が増えてhtmlのファイル自体のサイズが増える=読み込みに時間がかかる=ページが重くなる
ページが重くなれば閲覧する人にはマイナスにしかならないから。それだけの話。
あと、制作する人が管理しやすいってのもある。htmlに直接スタイル書くとタグが長くなって見にくくなるから。
htmlにはクラスだけ指定しておいて、cssで装飾するってのが一番効率的で、作業しやすい。
後から変更を加えたいって時でも、cssをちょっとイジるだけで良いし。

469:Name_Not_Found
16/02/11 14:50:53.80 .net
>>468
俺はhtmlファイルの容量増加よりも役割分担のためって認識だなぁ

470:Name_Not_Found
16/02/11 15:13:41.35 .net
>>469
俺もそう思うし、>>468も本当はそう思っている

471:Name_Not_Found
16/02/11 16:06:02.93 .net
>>468,469,470
ありがとうございました。
色んなサイト見ると、<li id="">等直接書いているパターンが多い気がしたから
これが綺麗な書き方なのかなぁと。
一応、cssやタグの正しい使い方等がある程度わかってきたので
次は綺麗な書き方というか、正しい書き方を学ぼうかなと思いまして。
感謝します。

472:471
16/02/11 16:20:11.51 .net
cssは互いのものでしか?

473:Name_Not_Found
16/02/11 16:35:21.50 .net
>>471
いろいろ見えてくると楽しくなるよね。
新しい疑問も出てくるだろうけど、それらもいずれ解消するだわさ。

474:Name_Not_Found
16/02/12 12:00:17.48 .net
>>471
<li id="">等直接書いているパターン
文書内に常に1 個しかないことがわかってるなら、全然あり
#test p {}
と書けば id=test の中の p 以外の p には干渉しないことが保証される
id セレクタは詳細度が高いので、他より優先させたいスタイルをあてがいやすい
利点もある

475:Name_Not_Found
16/02/12 12:34:53.64 .net
DW2015使ってるのですが、まとめサイトなどの下のほうにあるコメント欄をつけたいのですが。DWの機能でないでしょうか?
一応下記のようなものは発見したのですが、こういうのって安全なのでしょうか?
URLリンク(fukafuka295.jp)

476:Name_Not_Found
16/02/12 13:25:15.52 .net
>>475
> DWの機能でないでしょうか?
ない
> こういうのって安全なのでしょうか?
わからない
ただ、オレならこんなの仕込まないで、自分で作る

477:Name_Not_Found
16/02/12 15:57:37.48 .net
>>475
dwの機能はないと思うよ。
コメントまわりはDISQUSというサービスが割とポピュラーな印象ある。

478:Name_Not_Found
16/02/12 16:05:17.92 .net
>>475
まとめサイトは基本ブログベースだから
コメントもブログのコメント機能を使ってるのが多いと思われる

479:Name_Not_Found
16/02/12 18:40:31.21 .net
一般的なCSSの記述方法って
・HEAD内で外部CSSを読み込む
・HEAD内にSTYLEを直接書き込む
の二通りだよね?

480:Name_Not_Found
16/02/12 18:57:09.91 .net
セルの結合colspanをcssで書くにはどうすればいいんですか?

481:Name_Not_Found
16/02/12 19:06:46.50 .net
>>480
書けない
ので、無理やりcssで書くなら、はみ出さす!
引き継ぎの時に変態と言われるコードになる

482:Name_Not_Found
16/02/12 20:25:56.71 .net
>>479
だね。
他にはbodyタグ以降に直接とか。
でも少し前にやりとりがあったように、あんましやらない。

483:479
16/02/12 21:01:36.71 .net
>>482
外部CSSを読み込んでるとレンダリングが阻害?されてるらしくていろいろ考えてたんよ(´・ω・`)
レスありがとう

484:Name_Not_Found
16/02/12 21:03:39.27 .net
>>483
ファーストビューのcssは直接記入とかルールはあるけど今はまだ大丈夫かな
表示速度を細かく気にしないなら全部外部でおkだし

485:479
16/02/12 21:22:50.90 .net
>>484
今日は半日くらいグーグル先生とにらめっこしてた
現在進行形

486:Name_Not_Found
16/02/12 22:28:45.09 .net
i.imgurをsrcで表示させようとしたら失敗するんだけど
どうやったら対処できんの?

487:Name_Not_Found
16/02/13 00:47:05.15 .net
ダイレクトリンクでやってる?

488:Name_Not_Found
16/02/13 00:53:23.55 .net
>>483
阻害?
外部cssにすることによるオーバーヘッドって気にするほど大きい?
httpリクエストが1回増えるだけだろ?
外部cssがたくさんあればまた別だけど

489:Name_Not_Found
16/02/13 01:59:44.90 VNURWcQN.net
HTMLやCSSの読み込みの順番について教えてください。
<head>内に外部CCSを指定しています。
HTMLの上から順番に読み込むそうですが、classやid等cssで指定した部分はその都度、ブラウザがcssを見に行って描画されるのでしょうか?
HTMLとCSSを分離する利点はよくわかるのですが、インラインで書いた方が描画が早かったりとかしますか?
また、例えば、TOPページに<input>があって、その装飾を外部cssに記述してあったとします。
仮に外部cssが1000行あって、inputの指定が一行目にある場合と1000行目にある場合で
ブラウザの描画時間の差が出ますか?

490:Name_Not_Found
16/02/13 04:36:12.95 .net
今時のブラウザで、imgにボーダーがデフォルトでつくのってありますか?
また、いつごろのブラウザからつかなくなったのでしょう?
今でもリセットで
img { border-width : 0; }
は必須でしょうか?

491:Name_Not_Found
16/02/13 05:10:10.37 .net
>>490
IE7まで

492:Name_Not_Found
16/02/13 05:12:29.99 .net
>>489
URLリンク(tokkono.cute.coocan.jp)

493:Name_Not_Found
16/02/13 08:56:52.49 .net
>>488
バリデータにでも引っ掛かったんでない?普通はきにならないもんだろうし

494:Name_Not_Found
16/02/13 09:56:43.11 .net
だよね
それか大量の外部cssを読みにいってるか

495:Name_Not_Found
16/02/13 10:48:20.59 .net
GoogleのなんたらInsiteあたりかな

496:Name_Not_Found
16/02/13 11:25:35.48 oizcU6fK.net
1つ手前の要素(class、idなし)を指定する方法ってないですかね?
下の9と11にスタイルを効かせる場合、どういう方法がありますか?
<p>7</p>
<p>8</p>
<p>9</p>
<p class="current">10</p>
<p>11</p>
<p>12</p>
11については隣接セレクタでいけますが、9が特定できないんです

497:Name_Not_Found
16/02/13 11:29:04.47 .net
nth-childでいけるお(´・ω・`)
かんばれお(´・ω・`)

498:Name_Not_Found
16/02/13 12:40:33.99 .net
>>496
:has()
URLリンク(www.hcn.zaq.ne.jp)

499:Name_Not_Found
16/02/13 12:56:22.50 .net
>>496
そのコードが、完全自前で作れるものなら、9と11に専用のクラス当てるのが一番楽だよ。
自動で生成されるhtmlなら仕方ないけど。

500:Name_Not_Found
16/02/13 15:56:02.39 .net
:has()てjQueryのみの疑似クラスでなかったけ

501:490
16/02/13 15:56:45.99 .net
>>491
IE7以前を無視するとすれば、
img { border-width : 0; } はもはや不要なんでしょうか?

502:Name_Not_Found
16/02/13 16:11:46.31 .net
:has()って初めて知った!
使ってみたけど使いこなせなかった!
ムズイ;;

503:Name_Not_Found
16/02/13 16:43:22.57 .net
>>497
それだとpの数だけ設定必要じゃない?

504:Name_Not_Found
16/02/13 17:04:10.39 .net
Pがどこにあるかにもよるだろうけど いけると思われる
ソースが出てくれば試しに組んでみてやってもいい
って↓が言ってた

505:Name_Not_Found
16/02/13 17:13:53.14 .net
>>501
悪いけどそんぐらい自分で判断してくんない?

506:Name_Not_Found
16/02/13 17:33:55.42 .net
IE7以前を無視しちゃダメだよ
無視されたら悲しいでしょう?
俺だったら無視するなー

507:Name_Not_Found
16/02/13 19:29:23.61 .net
>>501
最近それが不要かどうかでこのスレで長々と揉めてたから、このスレの前半、もしくは前スレ漁ってみ

508:Name_Not_Found
16/02/13 21:10:15.74 .net
サイト用の画像素材の手入れをしているんですが
既存のGIFやPNG画像の色数を確認するにはどうしたらいいのでしょうか?
PNG24で作られた画像が256色以下なら、PNG8で作り直したいなと。
仮に(極端な話)257色だったらそのままにしておき、255色だったらPNG8に作り直したいといった状況です
フォトショCS4が作業環境としてあります
よろしくお願いします

509:Name_Not_Found
16/02/13 21:36:44.90 .net
板違いです。

510:Name_Not_Found
16/02/13 22:04:40.90 .net
拡大して色を数える

511:496
16/02/14 00:22:27.33 .net
すいません>>496は自動生成のページ送りの部分です。ほぼそのままです。
カレントの前後に効果をかけたいという内容です。
>>497
相対位置であること、総数不定ですが、できますかね?
>>498
初めてしりました。が、具体的にどう使っていいのかわかりません。
>>499
自動生成です
>>504  試しにこれでどうでしょう(下記の例では3と5が対象)
<div id="pager">
<p>1</p>
<p>2</p>
<p>3</p>
<p class="current">4</p>
<p>5</p>
<p>6</p>
省略(7~100)※数量不定
</div>

512:496
16/02/14 00:26:31.41 .net
※補足
ページ送り:googleの検索結果にあるようなナンバリングのやつ
カレント:現在表示しているページ数(常に変化する)
今回の対象:カレントが変化するので今回の対象も相対的に常に変化する

513:Name_Not_Found
16/02/14 01:26:32.38 .net
ページ送りなら、別にcurrentだけでいいんじゃないの?

514:Name_Not_Found
16/02/14 02:34:47.51 .net
jsなら朝飯前だが使えんの?

515:Name_Not_Found
16/02/14 02:36:14.73 .net
>>508
そこまでこだわる理由なにかあるの?

516:496
16/02/14 02:37:42.53 .net
>>513
まあ、色々事情があってですね。
レスポンシブでより見やすくするために工夫したいんです。(ここはjQueryナシで)
それと今回はページ送りですが、技術的に今はCSSだけでどこまでできるか知りたいので。

517:496
16/02/14 02:48:37.03 2AgJFe13.net
>>514
js使ったら、自分でも解決できますが、データ遷移してもURLに変化がない(クエリ文字なし)ので
ページロードはキーになりません。(初回のajax-load時は掛かるが、遷移時は消える)
いちいちページ送りボタンをclick時にfunctionさせるのもナンセンスなので、
cssでできないかと思いました。

.current + p →1つ後ろの要素が指定できる
.current - p →1つ前の要素 ←こんなのがあればいいのですが。

518:Name_Not_Found
16/02/14 03:10:32.13 .net
そんなもんあっても滅多に使わないよ。
とりあえずスマホ用のページ送りを作ればいいんじゃね。

519:Name_Not_Found
16/02/14 04:48:33.72 mKonVvrO.net
>>515
256まではPNG-8でいけるのに、257になったとたんPNG-24で容量が増える
塵も積もればで
マルチアイコンとかね

520:Name_Not_Found
16/02/14 10:01:57.35 .net
時には妥協も大事である
js使って楽になっちゃいなYO!

521:498
16/02/14 12:30:37.61 .net
>>511
仕様書に隣接セレクタの事例が載っていたはずだが、どこがわからない?
ただし、実装されているブラウザが存在するかまでは調べていない。
:has() はMDNにも載ってないぐらいだから少なくとも Firefox では未実装なのだろう。
他の手段としては :not(:not()) で肯定先読み的なセレクタが作れるかも知れん(未検証)。
論理構造的にはサーバサイドでclassやidでマークアップさせる方が素直な実装だとは思うが。
<p class="prev">3</p>
<p class="current">4</p>
<p class="next">5</p>

522:496
16/02/14 12:58:51.24 .net
>>521
わからない点は、今回はクラスがキーになり、構造だけでは指定できない点です。
こういう感じで書ければいいのですが、効かないようっす。(そういう意味ではない?)
p:has(p + .current),p:has(.current + p){
}
サーバーサイド含め、解決はできるのですが、今回はCSSでできないものか知りたいだけなんです。
具体的にはWordPressのFAQmanagerというプラグインでページ送りの設定にした場合のケースです。
プラグイン側をカスタマイズするよりもCSSで解決できないものかと。

523:Name_Not_Found
16/02/14 13:19:52.73 .net
>>500
これは違うのか?

524:Name_Not_Found
16/02/14 13:31:58.47 .net
>>523
>>498はW3Cのサイト。

525:Name_Not_Found
16/02/14 14:23:28.21 .net
>>522
プラグイン側をいじればすぐ出来るのに。

526:498
16/02/14 17:35:21.21 .net
>>522
class がキーになろうが、基本原理は変わらないと思うのだが。
URLリンク(www.hcn.zaq.ne.jp)
> 次の選択子は,別の dt 要素が直後に続く dt 要素に合致する:
> dt:has(+ dt)
上記のようにあるので、>511のHTMLに倣うなら p:has(+.current) で良いだろう。
開発者ツールのCSSタブでも見ればブラウザが対応しているかも分かるはずだ。
> サーバーサイド含め、解決はできるのですが、今回はCSSでできないものか知りたいだけなんです。
繰り返すようだが、Selectors API Level 4 で可能だから CSS で出来る。
Editor’s Draft で実装が整っていないだろうし、実用段階とも思えんが、実験目的なら良いだろう。

527:Name_Not_Found
16/02/14 18:29:21.21 .net
CSS4っていつ頃から使えるようになるんですの?

528:Name_Not_Found
16/02/14 21:57:24.91 .net
URLリンク(www.htmllint.net)
このサイトでテストしてみたら
body内のarticleをマークアップしてるmainはダメだって怒られた
mainはセクショニングコンテンツに入ってないし
問題ないと思ったんだけど、bodyの下位要素にはmainはダメなんだっけ?

529:Name_Not_Found
16/02/14 22:32:33.74 .net
>>527
ブラウザベンダーに聞けとしか

530:Name_Not_Found
16/02/15 01:45:23.40 .net
>>525
アップデートで初期化する対策は?

531:Name_Not_Found
16/02/15 10:43:11.50 .net
>>528
> body内のarticleをマークアップしてるmainはダメだって怒られた
意味が分からんから現象を再現可能なHTMLを書け

532:Name_Not_Found
16/02/15 11:27:35.63 .net
なんで偉そうなの?

533:Name_Not_Found
16/02/15 11:29:14.54 .net
回答に必要な情報が足りないからじゃね?

534:528
16/02/15 12:15:00.78 .net
>>531
失礼した
htmlがこちら→ URLリンク(jsfiddle.net)
念のため URLリンク(www.html5.jp) から見本のコードを張って試してみたけど構文エラーが出る感じ
他の構文チェッカーだとエラーが出ないから、このサイトが対応してないだけなのかな

535:Name_Not_Found
16/02/15 20:20:53.30 .net
IE未対応。モバイルFF以外全部未対応。

536:Name_Not_Found
16/02/15 21:39:36.15 .net
>>534
サイト自体が悪い。情報も古い。
ブックマークから削除してよし。

537:Name_Not_Found
16/02/16 09:43:45.30 .net
このAnotherHTML-lint5って全然更新されていない古いサイトだったんですね
更新されるまでブックマークから消すことにします

538:Name_Not_Found
16/02/16 10:17:29.69 .net
そこが悪いんじゃなくてメインタグが推奨じゃないんだけどな

539:Name_Not_Found
16/02/16 11:30:09.32 .net
>>537
スレリンク(hp板:256番)n でも語ったが、Another HTML-lint 5 は本家Another HTML-lintを少しだけ拡張して HTML 5 に不完全ながら対応したもの。
古い本家をベースにして HTML 5 に対応したわけだが、本家に及ぶほどの厳密性は無いので期待しない方が良い(または判定結果で信頼できる部分だけを抽出する知識が必要)。
HTML 5 のバリデータとしては URLリンク(html5.validator.nu)URLリンク(validator.w3.org) でチェックすれば十分なのが現状。
宗教的なチェッカとして URLリンク(openlab.ring.gr.jp) を併用していた時期もあったが、WCAG 1.0 が今では古いので流石に諦めた。
# せめて、HTML-lint 5 が WCAG 2.0 に対応して HTML 5 と WCAG 2.0 の判定機能をOn/Off出来ればまだ使い道があったのだが…。
# WCAG 2.0のバリデータは欲しいところなんだがな。

540:Name_Not_Found
16/02/16 11:33:45.52 .net
>>538
どういう理由でどういう場合に非推奨なのかを詳しく
URLリンク(momdo.github.io)

541:Name_Not_Found
16/02/16 12:19:38.46 .net
ショートハンドで記述できるものって他になにかあったけ
・background
・margin
・padding
・font
・border
・border-radius
・transition
・text-decoration
・animation
・list-style

542:Name_Not_Found
16/02/16 14:57:50.41 .net
<div></div>で囲まれた部分を中央揃えする場合
テキストの部分はtext-align:centerで中央揃えになりましたが
テーブル部分は中央そろえになりませんでした。
どうすればテーブルも中央揃えになりますか?

543:Name_Not_Found
16/02/16 15:42:09.67 .net
table-align:center

544:Name_Not_Found
16/02/16 15:49:10.87 .net
>>542
テーブル部分は、ブロック要素なので、
margin: 0 auto;
とする。
ブロック要素の親要素の幅に対する中央揃えは、みんなこのパターン。
因に高さに対するセンター合わせは、結構面倒い

545:Name_Not_Found
16/02/16 16:46:24.02 .net
>>542
table-align: center;

546:Name_Not_Found
16/02/16 16:47:53.51 .net
align属性での指定はダサい

547:Name_Not_Found
16/02/16 18:09:25.62 .net
>>545
URLリンク(jigsaw.w3.org) で div { table-align: center; } を検証すると「プロパティ table-align は存在しません」のエラーが返ってくるのですが

548:Name_Not_Found
16/02/16 18:40:58.60 .net
>>536
横からですが、どちらのサイトが古いのですか?
HTML-lintの信頼性は置いておくとして、どちらも新しい情報を載せていると思うのですが

549:Name_Not_Found
16/02/16 19:24:58.51 .net
developer.mozilla.org/ja/docs/Web/HTML/Element/main
>>540
モバイルが非サポートだと何回言わせる。
mainタグがあってもなくても属性がわかるようにdivのclassあたりで明記するほうが生産性ある。

550:Name_Not_Found
16/02/16 20:20:15.01 .net
>>549
MDNを参照するなら英語版でしょ
URLリンク(developer.mozilla.org)
URLリンク(caniuse.com)
Android 4.3- をサポートするなら <main role="main"></main> で十分だと思うけど、何か問題がある?
サポートしないブラウザではアウトラインに影響してしまう問題ぐらいだけど、div要素を使っても同じ問題があるよね

551:Name_Not_Found
16/02/16 20:22:56.34 .net
>>548
>>528の事です
HTML-lintです

552:Name_Not_Found
16/02/16 20:23:44.69 .net
>>548
古いと思ったのは
トップページを見たときに最終更新日が2014年代だったからです

553:Name_Not_Found
16/02/16 22:09:51.68 .net
>>552
本家と比べれば新しいとは思うのですが、最新仕様に追従できてないのは確かですね
日本語でないと満足できない人向けというところでしょうか

554:Name_Not_Found
16/02/16 22:21:55.70 .net
まぁ、そんなんに褒められてもしゃーないで

555:Name_Not_Found
16/02/16 22:27:16.73 .net
ウェブページでmainタグ使うのと使わないのとでは、具体的にどう違うの?

556:Name_Not_Found
16/02/16 22:53:57.57 .net
ブラウザのキャッシュというのは、なにもしないとずっとそのままなんでしょうか?
素朴な疑問で、自分のウェブサイトを時々見に来てくれる人がいて、
その人がブラウザのキャッシュをずっとクリアしていなかったら
私が更新した情報が、いつまでたってもその人は見られていなかったりする可能性はありますでしょうか?

557:Name_Not_Found
16/02/16 23:00:32.81 .net
キャッシュには期限を設けることができる!?

558:Name_Not_Found
16/02/16 23:24:11.59 .net
>>556
If-Modified-Since
URLリンク(www.hcn.zaq.ne.jp)

559:Name_Not_Found
16/02/16 23:44:48.71 .net
>>556
キャッシュやクッキーの期限は管理者が変更出来るよ。
ブラウザもバカじゃないからちゃんと更新もするし。

560:Name_Not_Found
16/02/16 23:46:33.68 .net
キャッシュの期限をウェブページで制御する方法ではなく、
ブラウザの仕様としてどうなってるのか知りたいです
普段、自分では意識してませんが(定期的にクリアしているので)
そういうことをしない一般的な閲覧者にはどう見えているのかなと

561:Name_Not_Found
16/02/17 00:04:35.65 .net
とりあえずその人が使ってるブラウザとバージョン、あとキャッシュの設定を教えて

562:Name_Not_Found
16/02/17 00:16:32.04 .net
>>560
そういう事をしてない一般的な閲覧者なら尚更問題ない。
保存されるキャッシュの容量も無限じゃないから。
それをオーバーすりゃ勝手に消えてくれるし。
一般的なブラウザなら、ページが更新されてれば勝手に取ってくるし。
心配する程の事じゃ無いって。

563:Name_Not_Found
16/02/17 00:43:19.23 .net
キャッシュ制御はブラウザ依存性の高い挙動なのできちんとサーバ側で対策したほうが良い
特に Date, Last-Modified, Expires は適切に設定した方が良い
何も対策しなくて問題がないなら URLリンク(example.com) のようにクエリで更新日時を付与してキャッシュを読み込まないバッドノウハウが出回るわけがない
URLリンク(www.hcn.zaq.ne.jp)

564:Name_Not_Found
16/02/17 01:40:42.18 .net
>>547
「table-align」なんてプロパティ存在しないので気にするな
>>544が正解

565:Name_Not_Found
16/02/17 13:09:54.53 .net
>>564
自分の勉強不足の可能性を1%考慮する程度で分かってはいましたが、本人が間違いを認めて欲しかったところです

566:Name_Not_Found
16/02/17 14:01:12.17 .net
すいません本人です間違いを認めます

567:Name_Not_Found
16/02/17 14:53:45.33 .net
キャッシュ関連の話題が気になるけど、また質問者は回答を放置する流れなのかねー

568:Name_Not_Found
16/02/17 15:07:27.40 .net
放置も何も、大した質問じゃないやん

569:Name_Not_Found
16/02/17 15:16:11.55 .net
>>568の完璧な回答を期待

570:Name_Not_Found
16/02/17 15:51:30.69 2xIqGzAB.net
教えていただきたいのですが、
wordpress最新版でこれからWEBサイトを作ろうと思うのですが、
DreamweaverCS6を使うと、編集がやりやすくなるのでしょうか。
特に動画や画像表示に凝ったのを作ろうとしています。
wordpressは初心者で、始めたばかりです。メニューの設置で右往左往しています。
Dreamweaverは、CSSなしの単純な使い方をずっとしていました。10年前から同じソフトで。(^^;ゞ
Dreamweaver CS6で編集するメリットが特にないなら、wordpressだけでやろうと思います。
宜しくお願い致します。

571:Name_Not_Found
16/02/17 16:05:02.37 .net
> 放置も何も、大した質問じゃないやん
何だ、その理屈

572:Name_Not_Found
16/02/17 16:42:09.74 .net
お、怒らないでよ…
ふえぇ…

573:Name_Not_Found
16/02/17 16:48:07.69 .net
>>569
しっかり解答してやったじゃねーか。他に何がいるんだ??
完璧な解答というなら 板違い の一言で終わるわけで

574:Name_Not_Found
16/02/17 16:56:06.20 .net
>>573
で、どれがお前の回答なの?
俺エスパーじゃないから

575:Name_Not_Found
16/02/17 17:02:08.03 .net
さあっ始まりました!
今日のレスバトル!
まずは選手の紹介だ!
と思ったがめんどくさいのでやめるぜ!

576:Name_Not_Found
16/02/17 17:04:21.25 .net
口がでかいだけで中身がスカスカの奴って逃げ口上だけは多いよな

577:Name_Not_Found
16/02/17 17:09:35.32 .net
>>570
WordPress(以下WP)のカスタムテンプレートを作るという話なのかな?
Dreamweaver(以下ドリ)でCSSも編集出来ないようだけど、
もしそうなら、圧倒的なスキル不足なので、ドリで編集する以前の話だと思うよ。
ドリでWPのテンプレートは、あまり編集し易くない。ドリは、PHP、JS書くのイマイチだから。
オレ的よく使っているのは、NetBeansとBracket(いずれもフリー)。
WPだけでやると言っているが、それはキツいと思うよw

578:Name_Not_Found
16/02/17 17:19:54.26 .net
CSS4 で ? がありましたが、現仕様でも存在するのでしょうか
URLリンク(myakura.github.io)

579:Name_Not_Found
16/02/17 17:26:29.58 .net
アカン
タグの使い方 考えすぎて
ゲシュタルト崩壊してきた
ドロップダウンに使う入れ子って、使用タグはulが一般的だよな?
他に入れ子に適してるタグってあるかえ???
ほわぁぁぁっ!

580:Name_Not_Found
16/02/17 17:33:58.95 .net
ドロップダウンならselect要素を使え

581:Name_Not_Found
16/02/17 17:35:39.16 .net
そんなんあるの!?
タグ大杉
もうタグの存在意義すらわからんようになってきた(´・ω・`)

582:Name_Not_Found
16/02/17 17:38:47.63 .net
[role=listbox]
URLリンク(momdo.github.io)
URLリンク(developer.mozilla.org)

583:Name_Not_Found
16/02/17 18:29:19.08 .net
>>581
勉強すればいいんじゃね

584:Name_Not_Found
16/02/17 18:33:46.45 .net
>>583
ありがとうございます!

585:582
16/02/17 18:40:16.67 .net
俺は無視か (´・ω・`)

586:Name_Not_Found
16/02/17 18:43:48.77 .net
アンカーつけないと分からないんじゃね?

587:Name_Not_Found
16/02/17 19:16:53.29 .net
>>585
んー!
ありがとうございます!

588:Name_Not_Found
16/02/17 20:58:58.65 .net
>>570
そもそもwpがなんなのかすらわかってなさそうだからもうちょっとweb全般について勉強してきなさい

589:Name_Not_Found
16/02/17 22:34:20.38 .net
>>588
web全般wバカっぽくていいねww

590:578
16/02/17 22:54:53.95 .net
>>578をお願いします

591:570
16/02/18 08:04:23.49 9MqlsBds.net
>577
アドバイスありがとうございます。
wordpressのテーマを、慣れてきたら少し改訂できればいいなと思った次第です。
CSSなどもっと勉強してからにします。
ドリ CCの体験版を使ってみたら、以前のようにデザインのページから編集できないようで
使いにくかったです。もしかしたら、できるのかな。
それで、いろいろ検索していたら、Aptana Studioというのにも遭遇しましたが、いずれにしても
まだまだ使いこなせないので、勉強します。

592:Name_Not_Found
16/02/18 11:13:12.46 .net
誰か知恵を貸してくだちぃ(´・ω・`)
URLリンク(jsfiddle.net)
↑今テスト中のコードなんだが、背景色の位置はそのままに
contentの部分だけ上に動かして重ねるってことできないかな
昨夜から考えてるんだけど無理なんかなぁ(´;ω; `)タチケテ

593:592
16/02/18 11:28:54.56 .net
解決できた(´・ω・`)
おじゃましますた

594:578
16/02/18 12:53:44.02 .net
解決しました

595:Name_Not_Found
16/02/18 16:58:58.24 .net
>>589
お前にはぴったりだろwww

596:Name_Not_Found
16/02/18 17:16:19.77 .net
IEは背景を白
IE以外は背景を黒にしたいときは
どのようにするのが一般的なんでせう
ネットで検索してみたら
メディアクエリやCSSハックやベンダープレフィックスなどがあるらしいのですが
皆さんはどんな感じで指定してるんですか?
@media screen and (-ms-high-contrast:active),(-ms-high-contrast:none)
↑のメディアクエリでの動作は確認できましたが、他に良い方法などはあるのでせうか

597:Name_Not_Found
16/02/18 18:07:24.69 .net
せうとか使わなくていいよ

598:Name_Not_Found
16/02/18 18:45:27.46 .net
ブラウザで色変えるとか変態かよ。
ua読んでそれぞれ切り分けたcss呼び出せや。

599:Name_Not_Found
16/02/18 18:53:50.38 .net
>>596
みなさんはそんなことしないし一般的もくそもない。

600:596
16/02/18 19:07:39.67 .net
参考にさせてもらいます
ありがとうございますた

601:Name_Not_Found
16/02/18 21:15:46.84 .net
そういえば>>596の-ms-high-contrastのactiveとかnoneって何が違うんだ?

602:578
16/02/18 22:21:32.62 .net
>>601
URLリンク(msdn.microsoft.com)

603:601
16/02/19 09:19:11.23 .net
>>602
センキュー

604:Name_Not_Found
16/02/19 09:38:21.24 JwyeAgwn.net
<ol><li>で番号付きリストを作ると、ブラウザ上でコピーする時に番号を含めて選択することができないみたいなんですが
選択できる方法はないでしょうか?

605:Name_Not_Found
16/02/19 09:57:23.59 .net
ulにして番号手打ち

606:Name_Not_Found
16/02/19 10:23:54.18 .net
>>604
地味にクソ仕様だよなあ

607:Name_Not_Found
16/02/19 10:26:31.01 .net
スタイル設定もしにくいしな
番号の自動付与のメリットを活かせない

608:Name_Not_Found
16/02/19 11:51:24.66 .net
どなたか>>578への回答をお願いします

609:Name_Not_Found
16/02/19 12:21:01.01 .net
>>608
好きです
付き合ってください

610:Name_Not_Found
16/02/19 13:01:15.75 .net
>>606
ソースに含まれてないものを具現化させる方が危険

611:578
16/02/19 13:13:31.93 .net
自己解決したのでもういいです
役立たずばかりですねここは

612:Name_Not_Found
16/02/19 13:16:45.95 .net
>>604について、うまい方法があるなら俺も知りたい

613:Name_Not_Found
16/02/19 14:24:41.40 .net
>>611
二度と来るなよw

614:Name_Not_Found
16/02/19 14:52:58.57 .net
>>604について、うまい方法があるなら俺も知りたい

615:Name_Not_Found
16/02/19 15:12:32.22 .net
俺も知りたい。

616:Name_Not_Found
16/02/19 15:42:00.95 .net
ol {
 list-style-type: none
 counter-reset:number;
}
ol li {
 counter-increment:number;
}
ol li:before {
 content: counter(number) ". ";
}
<ol>
 <li>あああ</li>
 <li>あああ</li>
 <li>あああ</li>
 <li>あああ</li>
</ol>
IE8以上
jsでもありだけどソース汚くなるかな

617:Name_Not_Found
16/02/19 15:56:07.48 .net
ページの最右下にロゴと(C)表示したくて
div.footer{
font-size:13px; position:absolute; top:5025px; right:20px;
}
みたいにしてるんだけど、これってtopからしか指定できないんでしょうか?
bottomにするとウィンドウの右下に固定されちゃうし
中身が増えるたびに topからのピクセル数を足していくのはスマートじゃないなぁと

618:Name_Not_Found
16/02/19 15:59:47.03 .net
>>616
回りくどいことしているけど、結果はふつうのolと同じw
選択できない

619:Name_Not_Found
16/02/19 16:03:34.77 .net
>>604
javascript使わないと無理だよ

620:Name_Not_Found
16/02/19 16:11:06.65 .net
テーブルに入っている文字列を中央揃えする場合はtext-align:centerでいいけど
テーブルに入ってない文字列を中央揃えするには<DIV style="margin:0px auto">文字列</DIV>のように
DIVで囲んでするしかないんですか?

621:Name_Not_Found
16/02/19 16:26:21.49 .net
誰が何の為にコピーするの?

622:Name_Not_Found
16/02/19 16:27:40.71 .net
>>617
絶対配置やめればいいだけのような気がするが
それじゃだめなん

623:Name_Not_Found
16/02/19 16:28:51.68 .net
>>614
Mac使っているなら、プリントから「プレビューでPDFを開く」を選択で、プレビューで開くので、コイツをコピペできるんじゃないの。
WINなら、一度PDF保存して、そいつをコピペでOKじゃないか

624:Name_Not_Found
16/02/19 16:38:49.93 .net
>>616
コピペはともかくスタイルつけやすくていいな

625:Name_Not_Found
16/02/19 16:41:51.11 .net
>>618
すまん、Chromeでは選択できるからコピペできるもんだと思ってたら出来なかった。
FFでは選択すらできなかったな、IEでは選択もコピペも出来た。
まあJSで書くしか無いな。
>>620
htmlには大きく分けて
・ブロックレベル要素(<p>, <ul>, <div>, <h1>, <h2>, ...)
・インライン要素(<a>, <span>, <img>. <label>, ... )
の2大要素がある
CSSでwidth, heightを指定しない場合、
ブロック要素
width → ブラウザ幅いっぱいまで
height → 子要素の高さ分
<p style="background-color: #000">ブロック要素</p>
↑の記述をするとテキスト1行分、ブラウザ幅いっぱいまで真っ黒な領域が描画される。それがdivの描画範囲。
インライン要素
width → 子要素の幅分
height → 子要素の高さ分
<span style="background-color: #000">インライン要素</span>
↑の記述をするとテキスト1行分、テキスト7文字分真っ黒な領域が描画される。それがspanの描画範囲。
text-align: center は描画範囲内で中央寄せをする、つまり幅がテキスト7文字分の中でテキスト7文字を中央寄せしても目では何も変わらない。
ブラウザ幅いっぱいまで幅を使っているブロックレベル要素なら目で確認できるはず。
要はブロックレベル要素に対してtext-align: centerを指定しろという話

626:578
16/02/19 17:07:55.81 /b2cNYB0.net
自己解決していません。
他人をこき下ろすのがそんなに楽しいのでしょうか。

627:Name_Not_Found
16/02/19 17:10:55.10 .net
他人にコキコキしてもらうと気持ちいいよね

628:578
16/02/19 17:17:56.86 .net
早く答えろ

629:Name_Not_Found
16/02/19 17:21:56.24 .net
>>626
これがこのスレのレベル。君が期待してる程、こいつら役に立たないぞ。

630:Name_Not_Found
16/02/19 17:24:32.35 .net
個人レベルの手作りサイトで、
下記をメールでお知らせください
1.商品名
2.個数
3.お名前
4.ご住所
5.電話番号
6.その他
みたいになってて
コピペしたら数字が付いてこなくてムキーってなったことあった
体勢に影響ないが
こういう場合、olの意味ってあんまりないよね

631:Name_Not_Found
16/02/19 17:26:50.71 .net
>>622
絶対配置止めたら右下に配置されるの?

632:578
16/02/19 17:28:07.34 /b2cNYB0.net
>>625
> 要はブロックレベル要素に対してtext-align: centerを指定しろという話
正確にはtext-align はCSS のものなのでHTMLの用語は出てきません。
text-align はブロックボックスを代表とするブロックコンテナに適用可能です。
URLリンク(www.hcn.zaq.ne.jp)

633:Name_Not_Found
16/02/19 18:14:25.90 .net
table-align: centerを指定しろという話

634:Name_Not_Found
16/02/19 18:24:08.13 .net
>>631
上の要素を絶対配置/固定配置したりフロートさせたりしてなければ
下の要素は上の要素の下に表示される
右寄せにするのはtext-align:rightでええじゃろ

635:617
16/02/19 19:37:58.80 .net
説明補足します。
単純に、ロゴ等を上の要素の下に表示さたいのではなくて

【メイン要素】
div.main{
width:800px;
margin:0 auto;
}
<div class="main">画像/画像/画像……</div> ←これがずらずらとある。
この800px幅のメイン要素とは別に、ページの最右下にロゴと(C)表示したいんです
div.footer{
font-size:13px; position:absolute; top:5025px; right:20px;
}
<div class="footer">ロゴ/丸C</div>
現状は右上からの絶対配置をしている状況。

636:Name_Not_Found
16/02/19 19:46:58.02 .net
>top:5025px;
って…もしかしてbody要素の一番上から指定しているのか…
せめてfooterの上にposition: relative; のfooter_wrapperなり作ってそこから指定すべきだろ…

637:617
16/02/19 20:00:31.28 .net
>>636
そうなんです。
真ん中に画像がひたすらつらつら繋がってるだけで、あとは右下にロゴと丸Cを添えたいだけ


638:Name_Not_Found
16/02/19 20:20:46.28 .net
>>637
>>634とかを無視しちゃだめだよ。
現状のままtext-align:rightってのが一番いいと思う。
800の要素と重ならないし、特に見た目も悪くないでしょ。
重なってもいいのであれば、footerに、footerの高さ分のマイナスmarginを指定する。
こういう感じ
div.footer {margin-top:-1.5em}
1.5文字分上にめり込んでいくから、数字は任意で変えてみて

639:Name_Not_Found
16/02/19 20:28:07.97 .net
>>637
よく分からんがこういうことか?
ソース URLリンク(jsfiddle.net)
キャプチャ URLリンク(i.imgur.com)

640:617
16/02/19 20:43:40.31 .net
>>638
すみません。無視したわけではなく
>>634だとメイン要素の下にスペースがあいちゃうので。
マイナスマージン、試してみます。

641:617
16/02/19 20:50:24.44 .net
>>639
お手数おかけしました
こういうことです
URLリンク(imgur.com)

642:Name_Not_Found
16/02/19 20:53:01.91 .net
>>630
ナンバリングすることがタグの役割じゃないからな。
ブラウザに箇条書きですって知らせるもんだからな。

643:Name_Not_Found
16/02/19 20:57:11.68 .net
>>641
bodyにrelativeでそいつにabsoluteとbottom:0

644:617
16/02/19 21:00:20.54 .net
position:absolute; 止めて、text-align:right+マイナスマージンでうまくいきそうです。
が、>>643のような方法もあるんですね。
どちらがスマートだろう??

645:Name_Not_Found
16/02/19 21:04:09.24 .net
あとは自分で決めてくれ。スマートかそういうの無いから。

646:617
16/02/19 21:07:37.81 .net
ありがとうございました。
前者の方がfooterのCSSを少し書き直すだけで済むのでラクそうです。
bodyにrelativeとか、発想がなかったので勉強になりました

647:Name_Not_Found
16/02/19 21:38:34.73 .net
アドバイスをください
URLリンク(jsfiddle.net)
上のPタグとULタグを横幅50%で並べる方法を調べています
試しに作ってみたのですが、他に横に並べる方法はどれくらいの種類があるものなのでしょうか
HTMLはそのままにCSSだけでできる方法があればアドバイスをください
よろしくお願いします

648:617
16/02/19 21:50:06.28 .net
position:absolute; 止めて、text-align:right+マイナスマージンにしたら、
右側マージン20pxが無効になってしまいました。
position:absoluteを復活させたら意図通りの表示になりました
元:
div.footer{
font-size:13px; position:absolute; top:5025px; right:20px;
}
変更後:
div.footer{
font-size:13px;
position:absolute; margin-top:-1.5em; right:20px;
}
特におかしくはないですよね?

649:Name_Not_Found
16/02/19 22:04:39.22 .net
はい

650:Name_Not_Found
16/02/19 22:32:12.27 .net
ちゅーかwidthなしってことはメインとかぶるぞ。モバイルひょうじはどうすんの。

651:Name_Not_Found
16/02/19 22:40:44.51 .net
>>647
そのままでいいやん
方法はいくつかあるけど、特に変える必要ないよ

652:617
16/02/19 23:12:29.55 .net
>>650
Z-indexで手前にしてますが、そもそもスマホで見るに適さないページなので、
そこはあまり気にしてません

653:647
16/02/20 00:06:20.00 .net
>>651
レスありがとうございます
このままいくことにします

654:Name_Not_Found
16/02/20 02:17:10.82 .net
>>653
でも、floatの解除は忘れずにねw

655:647
16/02/20 10:35:05.59 .net
>>654
はい!

656:Name_Not_Found
16/02/20 16:26:48.04 .net
<head>内に
<script type="text/javascript"><!--
function hogehoge
// --></script>
とある場合、メタタグの
<meta http-equiv="Content-Script-Type" content="text/javascript">
は省略しても大丈夫でしょうか?
body内に組み込みイベントはありません

657:Name_Not_Found
16/02/20 17:03:14.39 .net
(´・ω・`)
(´・ω`)
(´ω`)

658:578
16/02/20 17:33:58.74 Gj3+WtSo.net
回答に期待できないようなので>578はとりさげます。
>>656
onclick系のHTMLイベント属性を使ってないなら問題ありません。
HTML5なら Content-Script-Type は廃止されています。

659:578
16/02/20 17:51:42.76 .net
(´・ω・`)

660:Name_Not_Found
16/02/20 18:02:56.84 .net
lang="ja"の必要性について教えてください
ズバリこの記述は必要なんでしょうか?
テンプレ的に使っていましたが、試みに全部日本語のページを<html lang="en">としてみましたが、
文字化けもなくきちんと表示されます。(IE11/GC48)
分かりやすい説明のあるサイトの紹介でも構いません
よろしくお願いします

661:656
16/02/20 18:13:20.49 .net
>>658
ありがとうございます
<head>内の
<script type="text/javascript"><!--
function hogehoge
// --></script>
に対する
<body onLoad=" ">
が唯一ありました
動作はしているようです
記述の作法としてメタタグ省略でOKでしょうか
今のところHTML4.01です

662:Name_Not_Found
16/02/20 18:46:15.11 .net
>>660
そりゃ日本語のページを日本語対応ブラウザで見て文字化けするはずが無いよ。
どの言語で書かれてるのかってのを明確にgoogleとかアプリに知らせるもの。
多くのサイトでhtml要素に入れてるのは、ページ内をまとめて全部指定するため。
日本人向けの日本語サイトなら、それ書いて無くても、日本語ページとして認識されるしSEO的にも問題ない。

663:578
16/02/20 22:56:52.18 Jfxds2xr.net
>>661
onload があるなら Content-Script-Type を指定すべきでしょう。
>>660
ブラウザによっては font-family が異なるかもしれません。
botによっては言語毎に異なる処理をするかとしせません。
多言語環境を構築する場合には :lang で言語を指定出来ます。

664:660
16/02/20 23:08:37.71 .net
>>662
それもそうですね…
あってもなくてもいいような感じでしょうか
実は一部英文ページがあって、ja→enに変えてみました
そしたら、charsetが気になってしまいました
ここから別の質問です
lang="en"
charset=shift_jis"
という組み合わせで、海外の英文ブラウザではきちんと英文は表示されるのでしょうか?

665:Name_Not_Found
16/02/20 23:54:08.70 .net
>>664
全角アルファベットで書かれてなければ表示されるから心配いらない。
そもそもブラウザに向けて明示してるものじゃないから。
lang属性どうこうより、charsetをUTF-8にする方が重要。

666:660
16/02/21 00:00:38.69 .net
>>665
ありがとうございます
実はまずその英文ページ(shtml)をUTF-8に変えようと思っていたのですが、SSIのincludeで複数のhtmlを読み込んでいるページだったと気が付きました
現状、すべてのページ(大元のshtmlもパーツのhtmlも)がShift_jisです
やるならすべてUTF-8に変えないと意味ないですよね?

667:Name_Not_Found
16/02/21 01:02:16.15 .net
実は…
実は…
実はってさー…
小出しにすんなよ
解答者のスキル調査でもしてんのかよ

668:Name_Not_Found
16/02/21 02:24:49.73 .net
>>666
というか全部UTF-8でいい。Shift_jisとかいらない。
そんなに心配なら、英語環境作ってテストするべき。

669:656
16/02/21 05:04:50.97 .net
>>663 ありがとうございました。

670:Name_Not_Found
16/02/21 13:28:01.53 .net
>>667
質問回答のやり取りで新たな疑問がわいてきてもおかしくないだろ
スルーすればいいだけで憤るところかね?

671:Name_Not_Found
16/02/21 13:59:25.60 .net
スキル調査か
よし俺に問題出してみろ
って↓が言ってた

672:578
16/02/21 14:35:41.71 .net
>>578をおぬがいします

673:Name_Not_Found
16/02/21 14:38:33.29 .net
果たして本人か
それとも偽物か
(´・ω・`)

674:578
16/02/21 15:10:08.04 .net
ごまかさないで答えてくれてもいいのに

675:578
16/02/21 15:11:35.00 .net
もうやめてください

676:578
16/02/21 15:55:08.90 .net
自己解決したので(*^^*)

677:578
16/02/21 15:58:27.02 .net
性格悪すぎですね

678:578
16/02/21 16:12:52.64 .net
俺のブームきたな

679:Name_Not_Found
16/02/21 18:49:04.29 .net
こいつらには質問が難しいんだよ。
ここはググって分かる程度の答えしか返ってこない。

680:Name_Not_Found
16/02/21 20:11:43.53 .net
>>668
> というか全部UTF-8でいい。Shift_jisとかいらない。
主観で言われても...
なんでUTF-8がいいの?

681:Name_Not_Found
16/02/21 20:17:50.17 .net
>>580
亀だけどドロップダウンってselect要素で作れるっけ?
っていうか入れ子にできるのか?
select要素は使う機会がないからさっぱりわからん!
詳しい人教えて(´・ω・`)

682:Name_Not_Found
16/02/21 20:20:47.06 .net
>>680
世間のデファクトを個人の主観と捉えるその精神ならこんなとこで聞く必要ないと思うが

683:Name_Not_Found
16/02/21 20:26:13.50 .net
>>682
いやいや、世間のデファクトかどうかなんて分からないレベルの人も聞きに来てるんだから
そういう人から見たら>>668の発言が主観で断定されてるように見えてもおかしくない
“というか全部UTF-8にした方がいい。今時Shift_jisとか流行らない。なぜなら…”
とかだろ、返すならふつうは

684:Name_Not_Found
16/02/21 20:28:42.86 .net
所詮ここはこのレベル(´・ω・`)

685:Name_Not_Found
16/02/21 20:36:47.73 .net
蔵「どうしてShift_JisじゃなくてUTF-8なんでしょうか?」
俺「全部UTF-8でいいです。Shift_Jisとかいらないです。」
蔵「なぜ?」
俺「世間のデファクトなんです」

686:Name_Not_Found
16/02/21 20:36:56.30 .net
で、正解は?

687:Name_Not_Found
16/02/21 21:02:33.65 .net
shift_jis のページだとURLのエンコードデコードにshift_jisが利用される場合がある
js ライブラリはおよそUTF-8を前提に書かれているだろうから問題になる場合があるかもしれない

688:Name_Not_Found
16/02/21 21:08:30.32 .net
>>683
ねぇねぇ正解は??

689:Name_Not_Found
16/02/21 21:11:56.75 .net
ふえぇ
喧嘩しちゃやだよー(ゲス顔

690:Name_Not_Found
16/02/21 22:19:04.57 .net
回答すべきは>>668>>682だろ
中途半端な意見するくらいなら黙っとけと

691:Name_Not_Found
16/02/21 23:06:47.40 .net
それ自分の事じゃんw

692:Name_Not_Found
16/02/21 23:50:32.40 .net
教えてください
<h2>や<h4>などのタグを使うとき
例 <h2>あああ</h2>
この「あああ」の部分に下線を引いて、文字とは違う色を付けたい時は
どう指定したら良いのですか?

693:Name_Not_Found
16/02/22 00:04:56.36 .net
>>691
だから、オレ知らないんだから教えてよ

694:Name_Not_Found
16/02/22 00:33:56.49 .net
>>692
CSSでh2に下線とカラーの設定を行う

695:578
16/02/22 00:38:28.51 .net
>692みたいな質問にはドヤ顔で回答するくせに私の質問には答えられないんですよね

696:Name_Not_Found
16/02/22 00:41:37.89 .net
回答になってないだろw

697:Name_Not_Found
16/02/22 00:46:50.97 .net
>>687
JavaScriptもShift_JISで記載していれば問題ない

698:Name_Not_Found
16/02/22 01:03:16.79 .net
>>694
すみません
そのCSSの設定方法を教えてください

699:Name_Not_Found
16/02/22 01:22:34.77 .net
>>698
CSSの経験はあるの?
あるのと、ないのとでは答え方がだいぶ異なるので。

700:Name_Not_Found
16/02/22 01:43:54.52 .net
>>693
ググれや

701:Name_Not_Found
16/02/22 02:12:27.14 .net
>>699
基礎は理解しています。
実際に今まで自分でサイトを立ち上げたときにCSS使いました

702:Name_Not_Found
16/02/22 03:05:01.50 .net
すっごい矛盾を感じる

703:Name_Not_Found
16/02/22 03:06:49.94 .net
css 下線ってググっただけでかなり出てくるけど、そういうのはダメなの?

704:Name_Not_Found
16/02/22 03:08:02.59 .net
わざとらしい感ハンパない
何か流したいレスでもあったんだろうか

705:578
16/02/22 08:53:39.78 .net
ねぇよんなもん

706:Name_Not_Found
16/02/22 09:19:28.76 .net
>>701
>>694が理解できないなら、基礎ができてるとは言えないと思うよ。自己評価、高すぎ。

707:Name_Not_Found
16/02/22 11:59:42.50 .net
出来ない奴ほどアピールするからなぁ
質問スレではそんなの重要じゃないのに

708:692
16/02/22 12:07:20.95 .net
CSSで underlineを指定するのは知ってます
けど、それだと文字と同じ色にしかならないので
下線だけ違う色にしたいんです。
この場合、どう指定したら良いですか?

709:Name_Not_Found
16/02/22 12:27:45.01 .net
>>708
意地悪なアドバイスだったが、あなたにも問題がなかったとはいえない。
初めからそこまで説明できていれば無駄にスレを費やす必要はなかった。
URLリンク(developer.mozilla.org)

710:Name_Not_Found
16/02/22 12:29:20.57 .net
プログレッシブ・エンハンスメントが許容できないならborder-bottomで我慢するしかない
下線の範囲は工夫すれば出来る

711:692
16/02/22 12:32:10.27 .net
>>709-710
こちらこそすみません。
ありがとうございました。

712:578
16/02/22 12:51:51.85 .net
いいってことよ

713:578
16/02/22 13:26:25.38 .net
ここの連中は、簡単な質問にもイチャモンつけてうやむやしにしようとするからな

714:Name_Not_Found
16/02/22 13:31:57.42 .net
アホか
>>692で「文字とは違う色を付けたい」といってるんだから、即>>709のレスで終了じゃないか
無駄レス消費してるのは回答側だ

715:Name_Not_Found
16/02/22 14:07:21.92 .net
>>694で終了してるよ
回答を得るのと手取り足取り教えてもらうのは同じじゃない

716:Name_Not_Found
16/02/22 15:30:23.29 .net
「どう指定したら良いのですか?」
という手取り足取りと思われる質問なんだが
わざわざ遠回しに回答し、スレを消費する意味はなに?

717:692
16/02/22 15:32:07.14 .net
解決したのでもういいです

718:578
16/02/22 15:56:06.43 .net
そんなことより>>578をお願いします。

719:Name_Not_Found
16/02/22 16:12:08.23 .net
>>716
しつこい

720:578 ◆jG/Re6aTC.
16/02/22 17:11:18.25 DhhUVIdQ.net
>>658で取り下げた質問をいつまでもなりすましで不当に貶めるのは本当に質が悪いですね。
終わった質問にまで食ってかかられるとは思っていませんでした。
現行仕様では :has() が ? に取って代わっている気がするものの、読解力に自信がなかったのですが、質問は既に取り下げました。
以降、このトリップではない人物は>578ではありません。

721:Name_Not_Found
16/02/22 17:52:06.28 .net
>>720
css4のセレクタ?にブラウザが対応してるか調べることができるサイトがあるから そこで調べれ
ほとんど載ってるから便利やで

722:578
16/02/22 18:00:41.75 .net
ちょwトリップ付けてまで騙るかね
取り下げてませんから

723:578
16/02/22 18:01:23.85 .net
>>721
ありがとうございます
見てみます

724:Name_Not_Found
16/02/22 20:13:33.81 .net
|д゚)ミテイルゾ

725:Name_Not_Found
16/02/22 20:26:41.01 .net
>>724
|(゚ε゚(O三(>_<`)o

726:578 ◆jG/Re6aTC.
16/02/23 00:18:49.18 .net
>>721
申し訳ありませんが、知りたいのは仕様であって実装状況を知りたいわけではありません。
(仕様から削除されればいずれ廃止されるのは明白ですので)
あるいはそのサイトで仕様について言及されているのでしょうか。
URLリンク(caniuse.com) を探しましたが、CSS 4 の対応比較表や文献は見つかりませんでした。
該当サイトについて教えてください。
URLリンク(www.w3.org)
ではある気がしますが、
URLリンク(drafts.csswg.org)
ではないような気がしますが、自信がありません。

727:Name_Not_Found
16/02/23 07:02:50.42 .net
>>726
横だけど親を指定できるのは「?」じゃなくて「!」だった気がする

728:578 ◆jG/Re6aTC.
16/02/23 12:04:55.26 .net
>>727
「対象を表す名前」には議論の余地があったようで仕様書を読むと名前が少しずつ変わっているんです。
「$ -> !」までは追えましたが、"?" に変わった版までは終えませんでした。
("!" だった版) URLリンク(www.w3.org)
("$" だった版) URLリンク(www.w3.org)
URLリンク(myakura.github.io) によれば
"NOTE: 公式な草案にリンクしている部分はあるものの、このノートが参照する仕様書はEditor's Draftの情報になります。"
とあるので、URLリンク(drafts.csswg.org) で "?" に変わった時代があるのであろうと想像しています。
しかしながら、URLリンク(drafts.csswg.org) には過去の版を参照する方法が見つからなくて途方に暮れている状況です。
URLリンク(myakura.github.io) では
"NOTE: FPWDが出てすぐ、$から?になりました。(参照)"
とあり、ML参照先 ( URLリンク(lists.w3.org) )がありますが、仕様書の該当箇所が見つかりませんでした。

729:578 ◆jG/Re6aTC.
16/02/23 12:12:05.89 .net
改めて考えてみると、"?" に変更する事が検討されたメール送信日時が「Fri, 30 Sep 2011 13:26:57 -0700」なので、時系列的には「$ -> ? -> !」になりそうですね。
>>727さんの仰る通り、最新版では "!" が正しいのかもしれません。
最終的に "!" が廃止されたのか、が気になるところですが…。
現行版で「3.2. Determining the Subject of a Selector」が削除されたのは間違いありませんが、他の節に移動している可能性を考えると全てを理解できている自信がない私としては確信を持てない状況です。

730:Name_Not_Found
16/02/23 12:26:28.65 .net
そうですか、お大事に

731:Name_Not_Found
16/02/23 12:59:55.98 .net
>>729
なんにせよ、親を指定するセレクタはくるだろう(と思いたい)し、まだ一部しか実装されてないから気長に待った方がええよ

732:Name_Not_Found
16/02/23 13:38:23.54 .net
>>729
おそらく :has() 擬似セレクタで可能になる機能なので廃止された
! が無くなった時期と :has() が登場した時期が大体同じ頃じゃないかな

733:Name_Not_Found
16/02/23 13:40:56.05 .net
>>732
訂正
擬似セレクタ → 疑似クラス

734:Name_Not_Found
16/02/23 15:31:43.28 .net
>>731
親を指定するセレクタは便利だけど、万人が頻繁に使うものじゃないから実装はないだろ

735:Name_Not_Found
16/02/23 15:40:48.01 .net
CSSに詳しい方、アドバイスをください
URLリンク(jsfiddle.net)
↑のURLにある二つの段落の横幅を同じ状態で横に並べる方法は
・float
・inline
・position
・transform
以外にありますでしょうか
よろしくお願いします

736:578 ◆jG/Re6aTC.
16/02/23 16:36:34.23 .net
>>732
確信が持てないのが辛いところですが、同様の想像をしています。
>>735
幅は width で指定するとして、横に並べる方法には display: table-cell, flex, inline-block があります。

737:735
16/02/23 16:48:45.55 .net
>>736
おぉ!ありがとうございます!
助かりますです!

738:Name_Not_Found
16/02/23 18:54:45.36 .net
.
.
.
板違い(?)の上に、話をさえぎってしまいゴメンナサイ!(*_ _)人
でも、この板のユーザーさんにも有意義な告知かと思うのでカキコませてください。
★ 謝礼は十分いたします ★ アメブロなどのサイト制作ができる方!! 
アメブロなどを使用してのサイト制作のできる方を早急に求めています!
私はリケジョやPC女子からはほど遠く、サイト作成にはまったく疎いのでとても不自由しています…(> <;)
そこで私に代わりサイトを作成してくださる方を求めてこの場をお借りしました。
■サイトの内容…
アダルト系、違法性、その他公序良俗に反するものではありませんのでご安心ください。
■サイト制作の仕様ベース…
アメーバブログで十分です。願わくばwordpressなどのブログ形式のサイトを希望します。
それに準ずるもので使い慣れたものがあれば別のものでも構いません。
■条件はありません…
技術さえお持ちでしたら、学歴・職歴等は一切問いません。
フリーター、ニート、高齢ニート、コミュニケーション障害をお持ちの方、引きこもりの方、中年失業者、長期無職等、歓迎!
■作業形態…
作業は在宅でやって頂くことになりますので、時間の指定は一切ありません。別のお仕事の傍らに…でもOKです。
■詳細をお知りになりたい方は…
下記メールアドレスまでご連絡ください。詳しく書いた返信文を差し上げます。
※真剣な告知です。冷やかしはご遠慮ください。
井 上
inoue1952w★gmail.com
迷惑メール対策のため@部分を★にしてあります。
実際に送信する際には★を@マークに変えてください。
.
.
.

739:Name_Not_Found
16/02/24 01:26:12.04 XjgSXqV3.net
<h1>等の見出しタグはどうしても必要なものなんでしょうか?
お題目があって、文章、見出し、文章、見出し…みたいなページはタグ付しやしですけど
画像や映像だけで見せるようなページでも、ロゴをムリヤリで囲ったり
テキストを欄外にインデントさせたりまでしてでも必要なものなのでしょうか?

740:Name_Not_Found
16/02/24 01:52:39.51 .net
>>739
いらないよ。

741:Name_Not_Found
16/02/24 02:35:53.48 .net
ごちゃごちゃしてない写真家のサイトでF12でタグみるといい。
見せ方も含めて勉強になる。

742:Name_Not_Found
16/02/24 02:43:18.84 .net
>>741
どこよ

743:Name_Not_Found
16/02/24 06:00:06.73 .net
>>739
下手すると誰も来ないけどね
アーティストとして名前が通ってれば別だけど

744:Name_Not_Found
16/02/24 11:55:09.07 .net
>>743
>下手すると誰も来ないけどね
ん?h1タグ使わないと下手するとだれも来ないってこと?

745:743
16/02/24 12:16:19.79 .net
そうだよ

746:Name_Not_Found
16/02/24 12:35:26.45 .net
検索画面に出ない(可能性がある)ってことね

747:Name_Not_Found
16/02/24 12:55:42.70 .net
h1がないと検索結果に上位表示されないなんてのは、都市伝説

748:Name_Not_Found
16/02/24 13:16:43.10 .net
>>747
だが、インデックスのされやすさは、titleタグのテキストノードとh1のテキストノードが一致していることが推奨されている。for Google

749:Name_Not_Found
16/02/24 13:57:11.19 .net
質問はそこじゃないだろ
SEOの話は他でやれば良い

750:Name_Not_Found
16/02/24 19:17:11.24 .net
だからって、
text-indent:-9999px
がいいとは思えないわ

751:Name_Not_Found
16/02/24 19:24:13.11 .net
> titleタグのテキストノードとh1のテキストノードが一致していることが推奨
それ本当??
ページタイトル(title)≠見出し(h1)
重複させる意味がわからない

752:Name_Not_Found
16/02/24 19:25:24.12 .net
質問です
div.allで全体を囲ってmax-width:700pxを指定しているのですが、
01 02 03 04 05
のように半角数字と全角スペースのみでリンクをずらっと並べてる部分が
FireFoxで見ると指定した幅でちゃんと改行されるんですが、
chromeで見ると改行されないままひたすら画面外まで続いています
どうしてこうなるのか分からないのですが、対処法はないでしょうか

753:752
16/02/24 19:40:54.15 .net
すみません、自己解決
そこの部分だけword-break: break-all;を使ったら改行されました
なんでデフォだとブラウザによっては改行されなかったのかよく分からないままですが、
とりあえず解決はしたので質問取り下げます、ありがとうございました

754:Name_Not_Found
16/02/24 21:08:29.94 .net
>>748
一致じゃなくて関連してた方がいいってだけだろ。

755:Name_Not_Found
16/02/24 22:31:11.37 .net
>>748は一致と断言してるが
ソースを提示してくれ

756:748
16/02/24 23:00:36.78 .net
ふざけんなよ
俺は悪くねぇ

757:Name_Not_Found
16/02/24 23:53:53.79 .net
見出しタグの重要度が高いなら、フラッシュサイトはかすりもしないよね

758:Name_Not_Found
16/02/25 00:19:39.82 .net
リンクされてる文字列と、そのリンク先のタイトルや最上位の見出しに関連性が無さすぎるとスパム判定くらう可能性があるって程度。
画像メインのページをGoogleにインデックスさせたいって話なら多少は考えた方がいいが、別にそういう話じゃないでしょ?

759:Name_Not_Found
16/02/25 00:39:13.61 .net
未だにtext-indent:-9999pxとかfont-size:0pxとか見かけるな
こんなクソギミックを優位に扱うほど、今のグーグルはバカじゃないだろ

760:Name_Not_Found
16/02/25 01:42:51.34 .net
かといって、一律でタイトルロゴを<h1>で括るのをよく見かけるが
なんか違うと思う
ページタイトルは見出しじゃない

761:Name_Not_Found
16/02/25 02:06:21.97 .net
タイトルが社名だったりすれば意味があるんじゃない?

762:Name_Not_Found
16/02/25 02:12:30.97 .net
titleにも社名入るでしょ
重複させることがSEO的にいいのであれば、それはそれでよしなのかもしれないが
毎ページh1が社名っておかしい

763:Name_Not_Found
16/02/25 02:21:23.32 .net
"見出し"じゃなくてHeadingだからね。意味は広いでしょ。
SEO的にもブラウザ的にも問題無いんだから、事実上問題ないよね。
Googleのロゴもh1だし。

764:Name_Not_Found
16/02/25 03:05:09.16 .net
titleタグは主に検索エンジンや外部からの流入用
h1タグはページを閲覧する人用
用途が違う
見出しはなくてもページが成立するならそれでよいのではないか
紙のビジュアル書なんかだと、くどくど見出しつけたりしないケースも多い

765:Name_Not_Found
16/02/25 03:21:45.05 .net
そもそも、単にページ内を構造化させるためのタグだから
今は専用タグが出来て使い方が少し変わったが

766:Name_Not_Found
16/02/25 08:49:06.00 WNpqEE2C.net
<table>
<tr>
<td><a href="test.html">テスト</a></td>
</tr>
</table>
このテーブル内のテキストリンクを画像リンクに差し替える方法あったら教えてください

767:Name_Not_Found
16/02/25 09:00:41.80 WNpqEE2C.net
↑はcssでタキストリンクを画像リンクにかえるってことです

768:Name_Not_Found
16/02/25 09:29:44.93 .net
どなたか教えてください
URLリンク(jsfiddle.net)
上記のサイトで、ひとつめのPタグにposition:absolute;を指定したら次のPタグが回り込んでしまいます。
この回り込みを解除する方法がありましたら教えてください。
検索の仕方が悪いのかfloatの回り込みの解除しか出てきませんでした。
よろしくお願いします。

769:Name_Not_Found
16/02/25 09:41:22.62 .net
CSS初心者スレの15、落ちた?

770:Name_Not_Found
16/02/25 09:45:49.79 .net
ここの補助役みたいなもんだし
なくてもいんじゃね(´・ω・`)

771:Name_Not_Found
16/02/25 12:32:15.46 .net
>>766
<table>
<tr>
<td><a href="css.html">画像</a></td>
</tr>
</table>

772:Name_Not_Found
16/02/25 13:37:44.07 .net
>>755
一致は、完全一致ではなく、一部一致ということです。
具体的には、そのページの主題となるキーワードがどちらにも含まれているという事です。
URLリンク(web-tan.forum.impressrd.jp)
URLリンク(liginc.co.jp)

773:Name_Not_Found
16/02/25 13:42:43.41 .net
>>768
position: abosolute の意味を検索しましょう。
あと、『回り込み』という表現が間違っている様に思えます。
ここでは、『重なる』と表現しなければ、正確な答えを得ることができません。
by おさるのアイちゃん

774:768
16/02/25 14:21:05.63 .net
解決しました。
>>773
気を付けます。

775:Name_Not_Found
16/02/25 16:48:30.46 .net
h1はページに一つでキーワードをちりばめる

とかこういうの本当に恥ずかしい

776:Name_Not_Found
16/02/25 21:54:05.41 .net
見出しタグの初期化は
h1, h2, h3, h4, h5, h6 {
margin: 0;
padding: 0;
font-weight: normal;
font-style: normal;
font-size: 100%;
}
でオケですか?

777:Name_Not_Found
16/02/25 22:13:45.25 .net
font:inherit
だけでおk

778:776
16/02/25 22:22:01.49 .net
追記ですいません
(主に)h1で画像を使用と思っています
マージンとパディングは必須かなと思うのですが
フォント関係は、代替テキスト用に残しておいた方がよいのかな?と思ったり
宜しくお願いします

779:Name_Not_Found
16/02/25 23:05:35.31 .net
必須だと思うなら入れればいいだろw
リセットってのはサイトに合わせてやるものだから、正解みたいなものはない。
自分で判断できないのであれば、専用のcssダウンロードして使うべし。

780:Name_Not_Found
16/02/26 00:34:14.39 .net
>>778
特に決まりはないし自分なりに納得というか妥協できればいいんじゃない?

781:Name_Not_Found
16/02/26 01:10:38.23 .net
>>776
font-style: normal;
は余計だと思う
見出しタグに斜体とかないと思うので
そういうブラウザもあるの?

782:Name_Not_Found
16/02/26 16:34:45.49 .net
text-indent:-9999999999999999999999999999999px
とか書くとブラクラになりますか?

783:Name_Not_Found
16/02/26 18:19:49.92 .net
非表示は範囲外に飛ばすよりdisplay:noneの方が自然だよ。
メディアクエリにさりげなく入れておけばいいし。

784:Name_Not_Found
16/02/26 19:25:21.61 .net
iframeのname属性は、外からのターゲットリンクが無ければ(サイトの新着情報表示にのみ使用)不要でしょうか?
それともnameをつけておくことにより、なんらかの情報(たとえばSEO的によいとか)として必要でしょうか?

785:Name_Not_Found
16/02/26 20:07:39.36 .net
display:flexなブロック要素をネストさせるとwin7のIE11で子側のwrapが効かなくなるのですが、これはIEのバグですか?
chromeとfirefoxでは問題ないんですけどね

786:Name_Not_Found
16/02/26 20:55:17.76 .net
flexの子はブロック要素じゃないから

787:Name_Not_Found
16/02/26 21:46:45.95 .net
>>786
div > pとul > liを試しましたがどちらもwrapされませんでした
小出しですみませんがレイアウトはヘッダ、メイン、フッタの縦3flex。
メイン部分は水平2flexで右側が固定幅、左側の子要素にflex指定したulを使用しています。
で、今しがた親のflex要素(メイン左)にoverflow:hiddenを指定したらwrapされました。
これはよくあるwidthが分からない的なパターンでしょうか?

788:Name_Not_Found
16/02/27 00:35:48.02 .net
説明が分かりにくいからソース貼ってみて

789:Name_Not_Found
16/02/27 01:57:14.09 .net
title属性がツールチップとして表示されないのは、Chromeの仕様でしょうか?
バージョンは48です

790:Name_Not_Found
16/02/27 02:17:42.58 .net
3flex、2flexて

791:Name_Not_Found
16/02/27 03:36:43.90 .net
>>788
URLリンク(codepen.io)
こちらになります
chromeとfirefoxではABCDEの各要素は折り返されますがIE11は折り返されずに横スクロールバーが出てしまいます
>>790
たしかに、flexに単位付けるのは変ですね

792:Name_Not_Found
16/02/27 09:12:48.73 i8pc7M6n.net
tableタグにborder:Solid 20px #0000ff;をつけた場合
テーブルの内側外側のどちらに20pxの枠線ができるんですか?
外側だったらテーブル幅の設定値より40pxテーブル幅が広くなるよね?

793:Name_Not_Found
16/02/27 10:52:11.49 .net
>>792
ボックスモデルのborder領域にできる。
外側とか内側とかないよ

794:Name_Not_Found
16/02/27 14:22:22.06 .net
>>784をおねがいします

795:Name_Not_Found
16/02/27 16:30:10.88 .net
>>794
不要でいいと思いました

796:Name_Not_Found
16/02/27 17:15:12.63 .net
>>794
SEO的に必須。name属性には狙ったキーワードを2,3個ちりばめて下さい。

797:Name_Not_Found
16/02/27 17:36:27.97 .net
>>794
そうseoに必須なんだよ
キーワードを入れるほどサイトが上位に表示されるようになる
俺は10個くらい入れてる

798:Name_Not_Found
16/02/27 18:01:57.55 .net
まじめにお願いします

799:Name_Not_Found
16/02/27 18:28:16.70 .net
割りとガチなんだが

800:Name_Not_Found
16/02/27 18:29:06.70 .net
>>798
どういう答えがお望みなんだよ
ケチつけてる間に自分で調べろ

801:784
16/02/27 19:24:43.55 .net
SEO狙いは特別には意識してなくて、例えとして出させていただきました
もちろんSEO効果がある(かもしれない)のであればそれはそれでありがたいですね
さすがにキーワード詰め込むのはどうかと思いましたが
iframeの中身をnameで明示することで、他に利点があるのか気になりまして

802:Name_Not_Found
16/02/27 19:28:57.04 .net
SEO気にするより内容濃くする努力したほうがはやい

803:Name_Not_Found
16/02/27 19:31:02.54 .net
メインのdivボックスがドカンと真ん中にあって、それとは別に
絶対配置でdivボックスをウィンドウの右上とかに配置したいのですが(SNSボタンとか)
HTML内で、この絶対配置divを記述する場所にルールはありますか?
メインdivボックスの前はさすがにおかしい気がしますが、後ろであればどこでもいいのでしょうか?
SNSボタンはページのコンテンツとは別要素なのでどこでもいい気がしますが
フッターの前がいいとか、一番最後(</body>の直前)がいいとか
なにかこうした方がいいよ、みたいな指針・ご意見あれば教えてください。
よろしくお願いします。

804:Name_Not_Found
16/02/27 20:00:40.60 .net
そんなこといわれても

805:Name_Not_Found
16/02/27 20:32:57.95 .net
>>801
じゃあ不要。

806:Name_Not_Found
16/02/27 20:38:44.35 .net
>>803
一番下でいいよ。</body>直前じゃ無くてもいいけど、コンテンツより下がいい。

807:Name_Not_Found
16/02/27 22:43:22.55 .net
重要度順や

808:Name_Not_Found
16/02/27 23:33:52.16 .net
ezHTMLってソフトなんだけど、あれどうやってあのソフト使ってサイト作ったか調べてるの?
テキストだからバイナリ埋め込むの無理そうだし

809:Name_Not_Found
16/02/27 23:56:59.52 Ehx/WSxm.net
誰が調べてるの?

810:Name_Not_Found
16/02/28 00:01:19.12 .net
>>809
ソフトの作者
リンクウェアみたいだし
例えばライブラリを使うのにリンク貼れだったらすぐ調べられるけど、テキストエディタじゃ難しくない?

811:Name_Not_Found
16/02/28 01:56:13.87 .net
メインカラムの<div>が左側にあって、サブ要素の<div>を右上にposition: absolute;で置きたいと考えています。
ソースは全く違いますが、大雑把な見た目イメージとしてはこんな感じです。
URLリンク(marblecat.finito-web.com)
このサイトでウィンドウを狭めると右上の画像が段々メインカラムに近づき、終いには重なってしまいます。
これを重なる前にストップさせ(重ねたくない)、横スクロールバーが出るようにしたいのですが、どうしたらよいでしょうか?

812:Name_Not_Found
16/02/28 02:49:43.55 .net
>>811
あてずっぽうだけど左divにmin-widthを設定するとか?

813:Name_Not_Found
16/02/28 03:01:24.18 .net
>>810
板違い

814:Name_Not_Found
16/02/28 15:12:21.43 .net
レスポンシブでスマホの調整に手間がかかる。
特に、上下の余白調整、fontサイズの調整
この2つ。
効率的な方法はないすか? 
imgのようにウイウンドウサイズに応じて
現在指定されているfont-sizeが
max-font-size:100%;
みたいに上限設けて可変するようにできないものか

815:Name_Not_Found
16/02/28 15:36:30.82 .net
レスポンシブデザインはそういうのに向いてない。
それぞれを細かく設定したいならhtmlを分ければいい。

816:811
16/02/28 16:56:34.99 .net
自己解決したかも
totとrightのほか、left: 500px(メインカラムdivの幅)で右側も指定、
さらに
text-align:right
を追加したらうまくいきました

817:Name_Not_Found
16/02/28 17:37:46.91 .net
@mediaで分けたそれぞれにベースになるフォントサイズを一旦指定しておいて、個々のフォントサイズはemで指定するとか?

818:Name_Not_Found
16/02/28 18:47:01.94 .net
スマホ側はemよりremの方が楽かも?

819:Name_Not_Found
16/02/28 20:17:55.06 .net
なんで?

820:Name_Not_Found
16/02/29 01:23:28.78 .net
スマホの横幅って
<meta name="viewport" content="width=device-width">
がいいとされてるけどさ
<meta name="viewport" content="width=620">
とか固定の方が作りやすいしよくないか?
世界的には画面の小さなスマホのことも考える必要あるのかもしれないが日本はみんないいスマホ持ってるから関係ないんだよね
width=device-widthにしてても結局300px固定デザインで隙間だらけでズームも禁止されてて何のためのwidth=device-widthなのかわからんとこ結構あるぞ

821:Name_Not_Found
16/02/29 01:46:43.09 .net
誰かに肯定してもらわないと自信ないの?

822:Name_Not_Found
16/02/29 02:15:19.85 .net
固定より可変の方が楽だお(´・ω・`)

823:Name_Not_Found
16/02/29 02:56:59.17 .net
>>814
vm,vh

824:Name_Not_Found
16/02/29 03:13:38.56 .net
いや自信とかではなくて1ユーザーとしても不便だからさ
とりあえずwidth=device-width書いとけばいいんでしょ的な風潮が嫌なんよ

825:Name_Not_Found
16/02/29 08:11:12.73 .net
そうだよ風潮だよ風潮
わかってんのか?あぁん?

826:Name_Not_Found
16/02/29 11:00:37.12 .net
> いや自信とかではなくて1ユーザーとしても不便だからさ
「制作者として」では?
ユーザとしてなら可変の方が便利に決まってる

827:Name_Not_Found
16/02/29 13:27:40.04 .net
>>820
正解、本当は固定値当てるのが正しいらしいよ。
原文読んだ人が、ネットで書いてた。
device-widthってのは、プログラムでいうところ hoge みたいなもので、何も設定していないのと同じらしい。
なんだかわからないが、device-width ってのがデファクトスタンダードみたいになってるけど、
環境によって、解釈がマチマチになんだって。
オレも数字入れてる

828:Name_Not_Found
16/02/29 14:04:48.87 .net
おれも!おれも数字いれてるわ
うん

829:Name_Not_Found
16/02/29 18:59:09.56 .net
PCサイトと同じで結局固定で落ち着くだろ
今ってだいたい4~6インチ代のサイズでサイズ拡大の流れも一段落ってところ
固定でデザインしてもまったく問題ない
最小サイズにデザインを合わせた可変デザインで普通のスマホから見るとスカスカ、ズーム禁止、
PCサイトよりも情報削って、そのうえアコーディオン開かないと情報取得できないわ、メニューはハンバーガー押さないと開かないなんてスマホサイトだらけでユーザー目線からしてもうんざりだよ
device-widthに合わせたデザインしてねってのはweb制作者ではなくてハード側のスマホ制作者の言い分だと思うわ

830:Name_Not_Found
16/02/29 19:04:33.89 .net
とあるデータ系サイトで縦画面はスマホ表示で横画面はパソコン表示にしてるサイトあったけどそれでいいと思った
スマホサイトを横で見たいユーザーは少ないしデータ系の表が多いサイトは横長でないとな

831:Name_Not_Found
16/02/29 19:10:02.04 .net
ハンバーガーうざいよね
もう家帰ってからPCで見るわ

832:Name_Not_Found
16/02/29 19:25:08.46 .net
dfnタグの使い方について教えてください
<p>
<dfn>2ch</dfn>とは、2ちゃんねるという巨大匿名掲示板である。
</p>
という使い方は正しいと思うのですが、
<p>
<dfn title="2ちゃんねるのこと。巨大匿名掲示板である。">2ch</dfn>は、見ているだけで楽しい。
</p>
のようにtitleだけで説明するのは間違いなんでしょうか?

833:Name_Not_Found
16/02/29 21:16:11.45 .net
<HR STYLE="border:Solid 1px #0000FF">
1pxなのに線の太さが2pxか3pxくらいあるように見えるけど
ちゃんと1pxの太さで表示するにはどうすればいいですか?

834:814
16/02/29 21:30:31.44 .net
>>818
emとかの相対はブラウザによって解釈が微妙に違うイメージあって
あまり使いたくなかった。
remは気にはなっていたが、横幅に対する相対ではないからルートの数値をmediaqueryで分岐という事か。
>>823
それはfontに対して?ボックス上下の余白に対して?
divや背景画像の縦横比保持の為にたまに使っているが
微妙におかしい(%の計算数値通りにならない)という印象。
上手く使いこなせているサイトを教えてほしい。

835:Name_Not_Found
16/02/29 21:58:59.43 .net
>>833
STYLE="border-bottom: solid 1px #0000FF"
など

836:Name_Not_Found
16/02/29 22:10:04.03 .net
>>832
一般的に、定義は正規の文章で説明される必要があるだろう。
後者の例だと
「2chとは、「見ているだけで楽しいもの」である」
(以下、2chという単語が現れたら「見ているだけで楽しいもの」に置換して読んでください)
という感じになりそう。

837:Name_Not_Found
16/02/29 22:13:03.07 .net
>>832
>titleだけで説明するのは
そういう使い方をしたいなら abbr が適する

838:Name_Not_Found
16/02/29 22:46:50.63 kwKLL7xR.net
>>835
それでも1pxの線にはならなかったです

839:Name_Not_Found
16/03/01 00:55:11.41 .net
>>807
亀だけど、重要度ってなんですか?

840:Name_Not_Found
16/03/01 00:59:39.82 .net
そういうものがあるんや(´・ω・`)

841:Name_Not_Found
16/03/01 01:05:11.71 .net
>>833
heightを0に、かなぁ。

842:Name_Not_Found
16/03/01 01:20:11.26 .net
>>838
2pxや4pxにしても同じ太さになるのか試してみたか?
( px の寸法は絶対的長さとして定義されてはいない)
同じ太さになるなら他のスタイルで上書きされている可能性がある

843:Name_Not_Found
16/03/01 01:23:46.13 .net
>>842
pxってそうなの?

844:Name_Not_Found
16/03/01 10:08:39.13 .net
>>830
これってどうやるの?

htmlのviewportに任意の固定数字入れて
cssはmedia screen and (max-width:適当) and (orientation : portrait)
としたら手元のios9とandroid4.4で同様の事象を再現できたが正しいのか分からん
横にしたときはviewportは無視されるもんなのか?

845:Name_Not_Found
16/03/01 15:02:37.59 bQV12xtf.net
>>841
heightを0にしてもだめでした
拡大してみたら1pxの青色の線の上に1pxのねずみ色の線ができてしまうので2pxに見えることがわかりました

>>842
2pxだと3px分に見えて4pxだと5px分に見えます

846:Name_Not_Found
16/03/01 15:18:32.80 8HSmkIwl.net
本来テキストで<strong>で囲みたいところをロゴ画像にしなければならなくて
これを<strong>で囲むことは文法上おかしくないでしょうか?

847:Name_Not_Found
16/03/01 15:24:22.82 .net
モウマンタイ

848:Name_Not_Found
16/03/01 17:47:32.93 .net
解☆決

849:845
16/03/01 18:13:08.72 .net
ありがとうございました。

850:845
16/03/01 18:21:59.47 .net
無知ですみません
<strong>で囲ってみましたが、見た目何も変わりませんね…w
テキストをstrongタグ使うと、見た目がboldになるだけで
paddingやmarginが変わるわけではないのですね

851:Name_Not_Found
16/03/01 18:22:49.85 .net
せやで

852:Name_Not_Found
16/03/01 18:28:22.91 .net
見た目変わってないけどブラウザはちゃんと見てくれてるで。

853:Name_Not_Found
16/03/01 18:32:07.12 .net
>>845
はじめにborder:0でリセットしておく

854:845
16/03/01 18:48:41.77 .net
>>853
imgのborderですね。
ありがとうございます。

855:Name_Not_Found
16/03/01 18:52:44.21 .net
>>854
あれ?hrの話しじゃなかったの。

856:846
16/03/01 18:55:32.68 .net
ごめんなさい!845ではなく846でした。
騙りのつもりはなかったのですが
失礼いたしました。

857:Name_Not_Found
16/03/01 19:16:57.79 .net
許さないよ(´・ω・`)
ホントだよ(´・ω・`)
絶対だからね(´・ω・`)
まぁ気をつけなよ(´・ω・`)

858:Name_Not_Found
16/03/01 23:36:47.37 .net
否定疑似クラス難しい

859:Name_Not_Found
16/03/02 01:00:32.38 tR97nYWW.net
aタグで囲ったimgがあって、altとtitleを両方つける必要がある場合、
以下のどちらが正しいでしょうか?

<a href="URLリンク(hoge"><img)<) title="△△"><img src="hoge.png" alt="○○"></a>

860:Name_Not_Found
16/03/02 07:41:11.95 .net
両方ともつければいんでね?
よくわからんけど(´・ω・`)

861:Name_Not_Found
16/03/02 08:50:40.56 .net
>>859
普通に考えれば、前者は画像そのものを説明する title
後者はリンク先を説明する title になるんじゃないか

862:Name_Not_Found
16/03/02 09:13:05.48 .net
>845
boeder-width:1px 0px 0px 0px;
のように上下左右きっちりと指定する

863:Name_Not_Found
16/03/02 09:54:45.28 .net
リストを作るならul
表を作るならtadleでいいのです?

864:Name_Not_Found
16/03/02 11:32:59.58 .net
tableで思い出したけどcolspanってcssで代用できるんかね

865:Name_Not_Found
16/03/02 13:00:59.42 .net
>>863

意味的には君の言う通りだけど、昨今はレスポンシブデザインだから、
tableにしたところが、上手くレスポンシブに馴染まないのだよ。
だから、表を dl で組んだりする事が多いよ

866:863
16/03/02 13:52:13.81 .net
>>865
そうなのですか
教えてくれてありがとうです

867:Name_Not_Found
16/03/02 20:00:37.67 .net
>>864
無理っす

868:Name_Not_Found
16/03/02 23:55:24.14 .net
そっすか

869:Name_Not_Found
16/03/03 13:11:52.02 KuMGwuid.net
【超絶】SEO対策済ホームページテンプレート
URLリンク(www.infocart.jp)

870:Name_Not_Found
16/03/03 18:32:41.45 XRrcKlYX.net
TOPページの一ヶ所にだけiframeを使用していて、インラインCSSでサイズやボーダースタイルを指定しています
こういった一ヶ所にしか使わないスタイルも外部CSSに書いた方がいいのでしょうか?

871:Name_Not_Found
16/03/03 19:20:03.28 .net
>>870
やりやすいようにやればいい
CSPありだとインラインCSSは使えなくなる場合もあるが

872:Name_Not_Found
16/03/03 21:56:06.98 z5JGhxqL.net
>>871
ありがとうございます
そこだけ唯一インラインだったので、特にデメリットがないのであれば外部に移した方がスッキリするので移そうと思います


次ページ
最新レス表示
レスジャンプ
類似スレ一覧
スレッドの検索
話題のニュース
おまかせリスト
オプション
しおりを挟む
スレッドに書込
スレッドの一覧
暇つぶし2ch