HTML/CSS のどんな質問にも優しく答えるスレ 34
- ： Name_Not_Found [sage] 2018/10/08(月) 11:45:57.53ID:???
- ここは初心者からベテランまで、全ての人を対象に優しく答えるスレです
類似質問、重複質問、丸投げ大いに結構。HTML / CSS 関係の事なら何でもOK
分からない人は何回聞いても結構。質問するときはIDを出すためにメール欄を
age にすることをおすすめします。
回答してくれる方は優しい人のみ！ 質問者に対して暴言を吐く人はこのスレを見るな！！
終わった話を蒸し返すやつは このスレにくるな！！！
自分で調べろという回答も禁止！！回答するかさもなくば何も書き込むな！！
質問側も節度あるレスで！質問前にスレ内を検索しましょう
■次スレについて
基本的にレスナンバーを取った人（立てられない場合は次の宣言者）が立てて下さい
重複を避けるため、独断でスレ立てはせず必ず意思表示をしてから立てて下さい（を取った場合も）
立てられない事が予め分かっている場合は、付近の書き込みは自重しましょう
■前スレ
HTML/CSS のどんな質問にも優しく答えるスレ 33
ttp://mevius.5ch.net/test/read.cgi/hp/1531279252/">ttp://mevius.5ch.net/test/read.cgi/hp/1531279252/
■関連スレ
Webサイト制作初心者用質問スレ part249
ttp://mevius.5ch.net/test/read.cgi/hp/1529144063/
■HTML
HTML Living Standard 日本語訳
ttp://https://momdo.github.io/html/index.html
■CSS
Selectors Level 4 日本語訳
ttp://https://triple-underscore.github.io/selectors4-ja.html - ： Name_Not_Found [sage] 2018/10/08(月) 11:52:22.06ID:???
- 969 名前：Name_Not_Found[sage] 投稿日：2018/10/07(日) 22:23:52.27 ID:???
どうやるの？
flexって好きな位置でのwrapと
複数行にわたる縦幅の一致ができないよね
それさえできれば万能なのに
973 名前：Name_Not_Found[sage] 投稿日：2018/10/07(日) 22:57:41.72 ID:???
更新してなかった
具体的にどうするんです？
＜div class="container" style="width:1000px"＞
＜div＞＜img src="ttp://placehold.jp/200x100.png"＞＜/div＞
＜div＞＜img src="ttp://placehold.jp/200x200.png"＞＜/div＞
＜div＞＜img src="ttp://placehold.jp/200x100.png"＞＜/div＞
＜div＞＜img src="ttp://placehold.jp/200x100.png"＞＜/div＞
＜div＞＜img src="ttp://placehold.jp/200x100.png"＞＜/div＞
＜div＞＜img src="ttp://placehold.jp/200x100.png"＞＜/div＞
＜div＞＜img src="ttp://placehold.jp/200x100.png"＞＜/div＞
＜div＞＜img src="ttp://placehold.jp/200x100.png"＞＜/div＞
＜div＞＜img src="ttp://placehold.jp/200x100.png"＞＜/div＞
＜/div＞
これを (width height 指定一切なしで) flex 関連のスタイルだけで
3 x 3 の等サイズの四角形に配置できます？ - ： Name_Not_Found [sage] 2018/10/08(月) 12:31:55.23ID:???
- ほれ
flexで合わせてやったぞ
前スレでアスペとか言ってたヴァカは脳みそ足りねえからてめえはスルー
ttps://i.imgur.com/NvwzobL.jpg - ： Name_Not_Found [sage] 2018/10/08(月) 12:46:20.98ID:???
- ぐーぐるこわい
あいつらその気になればせかいほろぼせる - ： Name_Not_Found [sage] 2018/10/08(月) 13:01:40.67ID:???
- 画像だけで証拠になってると本気で思ってるならアスペすぎだろ
- ： Name_Not_Found [sage] 2018/10/08(月) 13:16:39.76ID:???
- 確かに行にまたがって高さ合わせたい場合あるよなー
リンクボタンで１つだけ長い文章で２行になったりするとみっともない
<style>
a {
display: block;
width: 50%;
border: solid 1px #000;
margin: 1em auto;
padding: 1em;
border-radius: 0.5em;
color: #000;
text-decoration: none;
text-align: center;
}
a:hover{
background-color: #eee;
}
</style>
<a href="#">長ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーい文章</a>
<a href="#">短い文章</a> - ： Name_Not_Found [sage] 2018/10/08(月) 13:25:40.73ID:???
- めんどくせーからできるかだけでいいって前スレで言われてるからソースは不要ってことだろうな
- ： Name_Not_Found [sage] 2018/10/08(月) 14:16:04.39ID:???
- できないからごめんなさいっていえばいいのに
- ： Name_Not_Found [sage] 2018/10/08(月) 14:36:40.02ID:???
- flexboxで割付した際に余白のpx知りたいんだけど
デベロッパーツールで確認って出来るん？ - ： Name_Not_Found [sage] 2018/10/08(月) 14:51:55.94ID:???
- さすがにこれは恥ずかしい
- ： Name_Not_Found [sage] 2018/10/08(月) 14:56:56.85ID:???
- js使えば何でもできるぞ
- ： Name_Not_Found [sage] 2018/10/08(月) 15:15:15.50ID:???
- let max_width = 0, max_height = 0;
$('.container > div').each((_, e) => {
if($(e).width() > max_width ) max_width = $(e).width();
if($(e).height() > max_height) max_height = $(e).height();
});
$('.container > div').width(max_width).height(max_height); - ： Name_Not_Found [sage] 2018/10/08(月) 15:20:05.14ID:???
- 高さ合わせるのは無理でも折返しぐらいはできないの？
折り返しできないなら flex って inline-block 以下じゃん - ： Name_Not_Found [sage] 2018/10/08(月) 16:10:59.09ID:???
- 折り返しってなに？wrapのことではなく？
- ： Name_Not_Found [sage] 2018/10/08(月) 16:35:57.38ID:???
- たかが１０レスも遡れないアスペだらけ
- ： Name_Not_Found [sage] 2018/10/08(月) 16:37:53.52ID:???
- 残りスペースに関係なくすきなところで折り返すって意味だと思うよ
早い話 <br> をやりたいってことかと - ： Name_Not_Found [sage] 2018/10/08(月) 17:00:32.77ID:???
- 好きなところで折り返すなら最初からそう作れよカス
- ： Name_Not_Found [sage] 2018/10/08(月) 17:17:56.85ID:???
- 最初からってどいういうこと？
最初からそう作るにはどうするかって話なのに
flexで何でもできるとか言い出したのお前じゃん - ： Name_Not_Found [sage] 2018/10/08(月) 17:35:43.66ID:???
- バカかこいつ
一生悩んでろよクズwww - ： Name_Not_Found [sage] 2018/10/08(月) 18:19:56.27ID:???
- ちょいちょい俺の荒らしレス入れてるから話がごっちゃになっとるねぇ～
- ： Name_Not_Found [sage] 2018/10/08(月) 18:26:22.45ID:???
- ttps://i.imgur.com/GUXsbca.png
- ： Name_Not_Found [] 2018/10/08(月) 19:11:55.65:oTgN8l1Y
- HTMLの初歩を学んでいるんですが、img要素ってわざわざp要素で囲まなきゃいけないんですか？
囲まなかったらどうなるんですか？ - ： Name_Not_Found [sage] 2018/10/08(月) 19:16:07.87ID:???
- 普通pで囲わないよ
- ： Name_Not_Found [] 2018/10/08(月) 19:20:01.86:oTgN8l1Y
-
そうなんですか？
だったら自分が今学習しているサイトはちょっと信頼できないかもしれないですね
画像をパラグラフ要素で囲むって意味分からないですもんね - ： Name_Not_Found [sage] 2018/10/08(月) 19:26:08.99ID:???
- BEM記法とかそこまで厳密じゃなくても
基本的にインライン要素はブロックで囲むってのは推奨されてるね
flexがでてからは１つ外側に指定したいからスタイル当てるのがやりやすい - ： Name_Not_Found [sage] 2018/10/08(月) 19:30:33.12ID:???
- divでもいいけど p で囲むのはデフォルトで p のほうが下側にマージンが付いてるから
がぞうが連続した場合でもレイアウトがみやすいってことかと
意味論を重視するなら コンテナー div であるべきだけど
p のほうが何もかかずに見栄えよくなるから好みかな
困ったら p つかっとけってコーディングスタイルはウェブコーダーでも普通にいる - ： Name_Not_Found [] 2018/10/08(月) 19:46:22.04:oTgN8l1Y
- >>26
ありがとうございます
まだまだ勉強が足りないですね - ： Name_Not_Found [sage] 2018/10/08(月) 21:20:31.70ID:???
-
俺の中でだが
インライン要素は生もの食品のイメージで裸で置いてはいけない。
魚、肉とかが何も包装されてない状態を連想するようにしてる - ： Name_Not_Found [sage] 2018/10/08(月) 21:29:10.21ID:???
- もし<p>を書かずに<span>を書きたくなったらこうすればいい
<body>
<div class="main">
自由に配置できる
</div>
<body>
全てがdivブロックの中にあるので、のルールを破ることなく
インライン要素を自由に配置できる - ： Name_Not_Found [sage] 2018/10/08(月) 22:15:10.23ID:???
-
お前みたいなのがいるからな…divなくなって欲しいわ無能 - ： Name_Not_Found [] 2018/10/08(月) 22:26:38.06:8cvJ3V9E
- を見て思ったのだけど、
なんとなくbodyにCSSをあまりくっつけたくないから、
ページ全体をdivで囲って、そこにページの基本となるCSS
（background-imageとかfont-familyとか）
をくっつけてるんだけど、
これってマズイんだろうか - ： Name_Not_Found [sage] 2018/10/08(月) 22:38:57.40ID:???
- bodyの末尾になんか追加するjqueryプラグインとかあるからなあ
<div>いれとくのはちょっと気持ち悪いけど仕方ないかなって思ってる - ： 31 [] 2018/10/09(火) 00:53:58.27:RZPtjwyI
-
文法以外の所で、divを入れる必要性があるのか
そういう可能性は頭になかった
ありがとう - ： Name_Not_Found [sage] 2018/10/09(火) 02:00:15.10ID:???
-
俺の中でだが
1枚の袋に魚、肉とかまとめてブっ込んで
カオスに入り乱れてるイメージ
中のインライン要素をまとめて1つの段落やアウトラインとして認識されていいならいいのかも - ： Name_Not_Found [] 2018/10/09(火) 05:32:15.12:Tanwg30a
- ニラ玉食べたい
- ： Name_Not_Found [] 2018/10/09(火) 05:32:27.36:Tanwg30a
- 誤爆すまぬ
- ： Name_Not_Found [sage] 2018/10/09(火) 07:46:49.24ID:???
-
無能はお前。インライン要素はブロックに入れずに置いていい。
それだけの話なのに、ブロックに入れないとダメとかいうから
お前の話は矛盾してるって突っついてやったんだよ - ： Name_Not_Found [sage] 2018/10/09(火) 08:18:49.59ID:???
- htmlタグは気にせずにCSSのdisplayを駆使しまくれということでええのかな
- ： Name_Not_Found [sage] 2018/10/09(火) 09:58:11.14ID:???
- まさに今の議論がここにかいてあるぞ
ttp://https://soundorbis.com/htmlimgp/ - ： Name_Not_Found [sage] 2018/10/09(火) 11:26:38.21ID:???
- めんどくさ
そんなことしなくてもサイトに表示されればいいんだよ
細けえよ - ： Name_Not_Found [sage] 2018/10/09(火) 13:59:10.69ID:???
- ul,olを入れ子状に何度も繰り返して配置する時、最大いくつまで入れ子に出来ますか？
- ： Name_Not_Found [] 2018/10/09(火) 14:18:44.23:XWo9Vima
-
HTMLのルールと
スタイルとはまた別問題
良し悪しは別として - ： Name_Not_Found [] 2018/10/09(火) 14:18:58.71:XWo9Vima
-
無限に - ： Name_Not_Found [sage] 2018/10/09(火) 14:28:47.85ID:???
-
規定として入れ子レベルに制限はないけど、5000階層とかなったらブラウザの処理が重くなるかもしれない。勿論ul,ol直下にli以外は置いてはいけない。 - ： Name_Not_Found [sage] 2018/10/09(火) 14:45:43.18ID:???
- 5000くらいならへーきへーき
ttp://http://jsfiddle.net/2pqh16nz/ - ： Name_Not_Found [sage] 2018/10/09(火) 15:30:45.65ID:???
-
酔った、吐きそう - ： Name_Not_Found [sage] 2018/10/09(火) 15:33:25.49ID:???
-
何の話だよw
単純にdivのブロック要素で生置きspanが回避できる！っていってることがおかしいって話だよ
てかこの話何回目だろうぇ
多分divがある限り永遠と繰り返されるんだろうな - ： Name_Not_Found [sage] 2018/10/09(火) 15:47:21.09ID:???
- MathJaxを使っています
$\begin{array}{cc}
a & b \\
c & d
\end{array}$
はちゃんと機能していますが、
$\begin{array}{cc}
a & b \\
\multicolumn{2}{c}{d}
\end{array}$
が機能しません。
なぜですか？
MathJaxでは\multicolumnは実装されていないんですか？
使っているMathJaxは
<script type="text/javascript"
src="ttp://https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.0/MathJax.js?config=TeX-AMS_CHTML">
</script>
です。 - ： Name_Not_Found [] 2018/10/09(火) 18:28:21.49:VPq4a9rB
- レシポンジブで、フォントの大きさ指定する単位は何でしてる？
rem？vw？それともpx…
なんか色々読んだけど。pxでいいような気がしてきた… - ： Name_Not_Found [sage] 2018/10/09(火) 19:16:29.89ID:???
-
pxだとデバイス毎に全～～部指定しなおさなきゃいけないから面倒じゃない？
remならrootのpxだけ定義すればいいから楽だぞ - ： Name_Not_Found [sage] 2018/10/09(火) 19:22:05.20ID:???
- でも大手見るとpxでやってるとこはまだ多くある
デザインカンプに超忠実にやらなければならない場合
pxの方がいちいち計算不要だから作るのは早い
illustratorやphotoshopのカンプがpxで指定さいれてるわけだから
それをremに計算するといちいち面倒になる。
vwなんてウインドウサイズで文字以外の要素とのバランス崩れるから大変
全部の要素を完全リキッドに対応させる必要がでてきちゃう
海外サイトみたいに文字中心のざっくりデザインのサイトなら余裕だけど - ： Name_Not_Found [] 2018/10/09(火) 23:14:27.26:0tZw6BK+
-
もはやvwしか使いたくない
viewportを画面の大きさに合わせる仕組みがあるのならpxでも構わないと思う
何れにせよリキッドじゃなければそれほど面倒はないはず - ： Name_Not_Found [sage] 2018/10/10(水) 00:03:25.96ID:???
- フォームのパーツでプルダウンの中身まで作ってあるデザインをもらって、selectタグで再現できないからulとJSのクリックイベントを使って実装したのですが、タブキーで操作できるようにしてくれないかと言われてしまいました。
たしかにselectタグを使えばタブで選択して項目を選ぶことができたのですが、HTMLでselectやinput「っぽい」パーツを作って、タブで操作できるようにすることは可能なのでしょうか？ - ： Name_Not_Found [] 2018/10/10(水) 00:16:35.49:A5twItpy
-
そのくらいなら、はい - ： Name_Not_Found [sage] 2018/10/10(水) 00:18:00.17ID:???
- プルダウン自体はCSSだけで可能だよ
ただ前スレでもでてたけど select というか option にデザインあてるのが結構制約あるから
デザイン指定されてるなら厳しいかもね
すでにJSで実装してるなら accesskey=key とかつけるだけでいいんじゃないの - ： Name_Not_Found [sage] 2018/10/10(水) 00:37:22.88ID:???
-
まさにoptionの方のカスタマイズが必要だったのでselectを使いませんでした。
accesskeyは調べてみましたが、あくまでほかのフォームパーツと同じようにタブ操作できるようにするのが目的なのでちょっと違うかなと思いました。 - ： Name_Not_Found [sage] 2018/10/10(水) 01:26:59.44ID:???
- タブキーで操作ってのをぐらいかしてくれないとよくわからないけど
jQueryUIのselectableとかなら数行かくだけでわりと高機能なことができた気がする - ： Name_Not_Found [sage] 2018/10/10(水) 03:46:29.52ID:???
-
漏れは、画像の高さに、vh を使えば「ctrl +-」で拡大縮小ができなかったから、
最初にJavaScript で、window.screen.availHeight で、
タスクバーのような、固定部分を引いた画面の高さ (ピクセル単位) を取得して、
728 px など、その値を元に、画像の高さを、px で設定した
vh, vw は便利だけど、拡大縮小ができないだろ？ - ： Name_Not_Found [sage] 2018/10/10(水) 03:57:47.56ID:???
- semanticをhtmlに、presentationをcssにとキレイに切り分けるためにはcss側で要素を追加する機能がまだ貧弱だと思うんだよね
::beforeと::afterの2人しか作れない…
ネストして::before::beforeと孫を追加したり、::before(2)で2人目のbeforeを作ったりしたいにょ - ： Name_Not_Found [sage] 2018/10/10(水) 07:48:57.94ID:???
- :nth-child(3):hover:beforeとか疑似要素疑似クラスできるのには驚いた
- ： Name_Not_Found [sage] 2018/10/10(水) 08:10:23.04ID:???
-
正確にできそうだけどサイトのフォントサイズ定義の場合
js使用前提だとなんとなく嫌だな
いやなんとなくなんだが - ： Name_Not_Found [] 2018/10/10(水) 08:52:55.42:Ziy1F9Mv
- HTML5のフォームバリデーションを本番で使った人いる？
まだまだ、本番では使えないような気がするんだが… - ： Name_Not_Found [sage] 2018/10/10(水) 09:14:55.08ID:???
-
vwって最大最小決めれないからどこまでもでかくなり、どこまでも小さくなるよな
media queryで変更できるけど、どんなふうに使ってるんだ？ - ： Name_Not_Found [] 2018/10/10(水) 09:39:26.46:YG+zE8tT
-
その通りメディアクエリで区切ってる範囲内だけど
別にいいじゃん小さくなっても - ： Name_Not_Found [sage] 2018/10/10(水) 10:07:25.55ID:???
-
読みやすさは必ずしも横幅と一致しないんだが
まあ人それぞれだからどうでもいいんだけど - ： Name_Not_Found [sage] 2018/10/10(水) 14:09:34.21ID:???
- ライブドアブログですが
画像に枠を入れようと思い
img {
padding: 5px;
border: 1px solid #808080;
をCSSに入れたいのですが、どこに入れても
サイドバーが表示されなくなったりします。
どこに入れたらいいでしょうか？ - ： Name_Not_Found [sage] 2018/10/10(水) 14:12:21.74ID:???
-
ほんそれ。
文字は文字であってオブジェクトじゃないのにな。
一行の長さだって段組の常識があるのに・・・ - ： Name_Not_Found [sage] 2018/10/10(水) 14:14:55.26ID:???
-
ここでライブドアのブログなんて使ってる人なんてほとんどいないと思うから
ブログ系のスレとかアフィリエイトのスレの方が回答もらえそう - ： Name_Not_Found [sage] 2018/10/10(水) 15:08:13.18ID:???
- まぁimgに指定してるのが悪さしてんだろ
- ： Name_Not_Found [] 2018/10/10(水) 15:17:39.39:S3yFh3/C
-
セレクタがざっくりしすぎ
imgって書いたらドキュメント内のすべてのimg要素が対象になっちまう
だからサイドバーとかにも影響が出る
親要素で限定するとよかろう
あとimg要素やフォームの部品のような
何かに置き換わる奴を置換インライン要素なんて呼んだりするんだけど
大雑把にいうとpaddingは使わんほうがいい
少なくともCSSを理解できるようになるまでは - ： Name_Not_Found [sage] 2018/10/10(水) 17:11:03.06ID:???
-
ありがとうございます
暇つぶしニュースにある画像みたいに
画像に小さく枠がほしいんですけど
リンクが貼れなくて申し訳ありませんが - ： Name_Not_Found [] 2018/10/10(水) 17:23:31.04:K6Ege0oc
-
ブラウザはChromeかFirefoxかSafariを使おう
んで、真似したいものがあったら
例えばChromeだったら、それを右クリして一番下の「検証」を選ぶんだ
そうすっと、開発ツールってのが開いて
そこのHTMLとCSSがどうなってんのかわかるから、真似すればいい
んでそのニュースは見てないけど
十中八九、img要素の外に小さい枠のためのボックスが別にあると予想 - ： Name_Not_Found [sage] 2018/10/10(水) 18:34:05.28ID:???
- ありがとうございます
ttp://https://imgur.com/a/PlKfeRd
この画像の1.2.3当たりがCSSだと思うのですが
コピー参考にするヒントをいただけませんでしょうか？ - ： Name_Not_Found [sage] 2018/10/10(水) 19:22:26.23ID:???
-
２
.article-body img { hoge: fuga; }
ってのは「article-bodyというclassを持つ要素の子孫のimg要素」って意味だよ
意地悪で言うわけじゃないんだけど
このくらいのことは聞く前にまず試してみたほうが、早いし理解も深いと思うよ - ： Name_Not_Found [sage] 2018/10/10(水) 19:42:50.17ID:???
-
ありがとうございます
やってみます - ： Name_Not_Found [sage] 2018/10/10(水) 20:24:15.80ID:???
- ２の.article-body-more img {}
の{}の中にカーソル合わせると左にチェックボックス出てくるから
オン・オフすると即時連動した変化が確認できるので
imgの枠線に重要な部分もすぐわかると思う
（もちろん自分のサイトを作る時の確認にも活躍する） - ： Name_Not_Found [sage] 2018/10/10(水) 21:10:56.93ID:???
- ありがとうございます。
ならない、、、のは
.article-body-more img {
margin: 5px 0;
max-width: 695px;
padding: 3px;
border: 1px solid #CFC7AF;
}
とCSSに入れればいい。という単純なことではないんですね、、 - ： Name_Not_Found [sage] 2018/10/11(木) 00:01:22.53ID:???
-
FF で試したら 100 段までしか… - ： Name_Not_Found [sage] 2018/10/11(木) 00:26:54.05ID:???
-
のコードから察するに
もしも、CSSの基本中の基本で躓いてる？なら
問題点はまず、
img {
の部分で括弧が開きっぱなしな点
img {}
という風に括弧を閉じないといけない
あとは、セレクタ（どの要素を選択するかの文字列）の意味と用法はググってもらうとして
CSSの基本は、
セレクタ { スタイル }
という形式になる、ということ。
＞とCSSに入れればいい。という単純なことではないんですね、、
の例で言うと、セレクタは
.article-body-more img
の部分で、意味はざっくり言うと
「クラス名がarticle-body-more要素の、子要素のimg要素全部を選択する」
なので自分のサイトのHTMLに、そもそも「クラス名がarticle-body-moreの要素」が存在しなければ
何も起こらない
ライブドアブログを使っているということなのでおそらく
テンプレの長文コードに滅入っていると推察。
さらに、HTMLもCSSの基本（中の基本）もわからないとなれば
おそらく、「要素にarticle-body-moreというクラス名を付加する」
というのを理解できているかどうか、そこから始めないといけない段階 - ： Name_Not_Found [sage] 2018/10/11(木) 02:18:56.84ID:???
- 質問です。
特定のサイトを閲覧する際にユーザーCSSを適用し（ChromeのStylusを使っています）、
tableをflexなりgridなりで並べ替えたいのですがどうすればよいでしょうか？
<table>
<tr><td></td><td></td></tr>
<tr><td></td><td></td></tr>
…
…
</table>
と縦にひたすら並んでいるのを強制的に
┌──┬──┬──┬──┬──┬──┬──┬──┬──┬──┐
│ｔｒ│ｔｒ│ｔｒ│ｔｒ│ｔｒ│ｔｒ│ｔｒ│ｔｒ│ｔｒ│ｔｒ│
├──┼──┼──┼──┼──┼──┼──┼──┼──┼──┤
│ｔｒ│ｔｒ│ｔｒ│ｔｒ│ｔｒ│ｔｒ│ｔｒ│ｔｒ│ｔｒ│ｔｒ│
├──┼──┼──┼──┼──┼──┼──┼──┼──┼──┤
と横並び、かつ10個並ぶごとに自動で折り返してくれるようにしたいのです。
displayの値をtableやtable-cellから変えればよいのでしょうけれど、
flexやgridといった新しい要素は何度いじってもまだなかなか慣れなくて……。 - ： Name_Not_Found [sage] 2018/10/11(木) 02:23:03.96ID:???
- tr に display:block; float:left つけて
tr: nth-child(10n):after に clearfix でもつければいいんじゃない - ： Name_Not_Found [sage] 2018/10/11(木) 14:09:02.74ID:???
-
ありがとうございます
セレクタ（どの要素を選択するかの文字列）の意味と用法
勉強してみます。 - ： 80 [sage] 2018/10/11(木) 19:23:27.51ID:???
-
あ、新しいやり方をしないといけないと思い込んでいましたが
ずっと昔ながらのやり方でできましたね。ありがとうございます
どうもclearfixが効かないので、もう少し色々試してみます
（一応widthを調整するだけで無理やり10個ずつにはできましたが） - ： Name_Not_Found [sage] 2018/10/11(木) 21:19:20.78ID:???
- div > section とあって
h1に画像をバックグラウンドを指定して
その下に
div > p class="utaimonku"に画像の謳い文句を書いていたのですが、
この謳い文句が文字だけなのも寂しいので画像にしつつ、文字としてもhtml上で記述するということはできますか？ - ： Name_Not_Found [sage] 2018/10/11(木) 21:34:45.92ID:???
- はい
- ： Name_Not_Found [sage] 2018/10/11(木) 23:00:15.81ID:???
- 寒くなってきたので、そろそろ扇風機をしまい
電気ストーブを出そうと思います。
でもその前に秋物の洋服を着るとそこそこ暖かくなるのですが
電気ストーブをつけつつ扇風機はしまわずおいておき
服だけはまだ夏物にしてもいいですか？ - ： Name_Not_Found [sage] 2018/10/11(木) 23:05:37.98ID:???
- はい
- ： Name_Not_Found [sage] 2018/10/11(木) 23:22:02.29ID:???
- はいじゃないが
- ： Name_Not_Found [sage] 2018/10/11(木) 23:55:09.77ID:???
- いいえ
- ： Name_Not_Found [sage] 2018/10/12(金) 01:00:26.58ID:???
- よし
- ： Name_Not_Found [sage] 2018/10/12(金) 01:20:28.02ID:???
- キーボードの設定が全角かなと半角英数を間違った状態で
打ち始めている事って頻発しない？
これなんとかならんかなあ - ： Name_Not_Found [sage] 2018/10/12(金) 01:21:47.85ID:???
-
電気ストーブなら扇風機も回した方がいい
暖められた空気は上に行くので扇風機を上に向けて空気を回す
その方が暖まる
というか秋物着て暖かいんならそれでストーブつけなければ電気代うくんじゃないか？
というかこれってスレチじゃないか？ - ： Name_Not_Found [sage] 2018/10/12(金) 06:44:32.75ID:???
-
F10 - ： Name_Not_Found [sage] 2018/10/12(金) 10:30:45.74ID:???
- 電気ストーブ初心者スレここだったか
- ： Name_Not_Found [sage] 2018/10/14(日) 11:53:08.20ID:???
- アメブロですが
2chまとめくすで まとめサイト作ってみたのですが
<em style=color: %color%; background-color: %bgcolor%;
font-weight: bold;" class="specified">ID:%id%</em>
この文章に
<em style=size="1"color: %color%; background-color: %bgcolor%;
font-weight: bold;" class="specified">ID:%id%</em>
と変更しても駄目でした。アドバイスお願いします - ： Name_Not_Found [sage] 2018/10/14(日) 12:46:41.06ID:???
- 仕事変えたほうが良いよ
これがアドバイス - ： Name_Not_Found [sage] 2018/10/14(日) 12:57:36.08ID:???
- 普通のブラウザならば、
<details>
<summary>あ
<div>い</div>
う</summary>
<p>えお</p>
</details>
と書いた時、要約部分には｢あいう｣が表示されるはずですが、
現在の私の環境では｢あ｣しか表示されません(▲をクリックしたら展開されたところに｢いう｣が見えます)
何が原因だと考えられそうですか？ - ： Name_Not_Found [sage] 2018/10/14(日) 13:06:28.69ID:???
- お前の頭
- ： Name_Not_Found [sage] 2018/10/14(日) 13:29:16.10ID:???
-
style=size="1"color: の部分が特におかしい。
正しくはこう
<em style="size: 1; color: %color%; background-color: %bgcolor%; font-weight: bold;" class="specified">ID:%id%</em> - ： Name_Not_Found [sage] 2018/10/14(日) 13:41:14.06ID:???
-
そんなタグが新たに追加されていた事すら知らなかったｗ
しれっと増えてるのなんとかなんないのかよ
こういうのって追加された時、どこで情報得てるの？ - ： Name_Not_Found [sage] 2018/10/14(日) 13:43:33.96ID:???
- こういう情報があるから
5ｃｈが地味に役にたってるんだよな
HTML5.1について見てみたけどコンテキストメニューとかまだFirefoxしか対応してなかったり
下手に手出すと廃止になったりするから使うタイミングがむずいな - ： Name_Not_Found [] 2018/10/14(日) 13:47:04.19:FOdMOjgv
- 元宇宙人が教祖な詐欺団体 ノーザンコペルニクス
ttps://mevius.5ch.net/test/read.cgi/internet/1539396820/ - ： Name_Not_Found [sage] 2018/10/14(日) 14:03:24.57ID:???
-
ありがとうございます
2ｃｈまとめくすの設定で
日付/IDの文字を小さくしたいわけなんです。
で、その設定画面に
言われたように打ちましたが変わりませんでした。
ttp://https://imgur.com/a/0zty9vS
どこがおかしいのでしょうか？
すみません。。 - ： Name_Not_Found [sage] 2018/10/14(日) 17:02:18.82ID:???
- たまにデベロッパーツールで開けないサイトあるんだけど
どういう仕組みなのか分かる人いますか？
自分のサイトでもやってみたい＆他人のサイトを覗いてみたい - ： Name_Not_Found [sage] 2018/10/14(日) 18:32:04.77ID:???
- ない
- ： Name_Not_Found [sage] 2018/10/14(日) 19:20:51.02ID:???
-
別の部分からの影響があるかもしれないのでそのサイトのURLか
もしくは吐き出された実際のソース部分をブラウザで見てみないとこれ以上はなんとも - ： Name_Not_Found [sage] 2018/10/14(日) 22:45:45.13ID:???
- 初心者でやっとホームページの公開がうまくできた
レンタルサーバー借りたりFTPの設定とかいろいろ大変だった。
そこでようやくHTMLとCSSの本格練習していこうと考えてるんですけど
ファイルやフォルダの基本形式？ってどうなってますか？
今の所、index.htmlとstylesheet.cssだけなのですべて同じwwwフォルダに入れてるんですがｉｍｇとかも増えるでしょうし
フォルダで階層わけしたりするんでしょうか？
例えば、wwwフォルダ(index.htmlとCSSフォルダ(cssファイルがいっぱい)imgフォルダ(imgファイルいっぱい))など
もしそうするとしてちゃんと読み込んで貰えるものなのでしょうか？
ファイルを挟んだ場合パス？の指定をすれば大丈夫？？ - ： Name_Not_Found [sage] 2018/10/14(日) 23:12:58.09ID:???
- はい
- ： Name_Not_Found [sage] 2018/10/14(日) 23:29:58.36ID:???
- せっかくながなが書いたのになぜY/N質問にしちゃうんだろうｗ
- ： Name_Not_Found [sage] 2018/10/15(月) 03:34:25.46ID:???
-
w3cの方はちゃんと
草案がまず出て、その後に勧告になってるよ
whatwgのLSもそのはず
ちゃんと追っかけてないから違ったらすまん - ： Name_Not_Found [sage] 2018/10/15(月) 09:40:43.40ID:???
-
HTML5への端境期までは草案も追ってたんだけど
w3cのサイトを定期的にチェックするとかダルすぎるな
最新情報を常に発信しているような制作会社やブログを定期チェックしてればいいんだが
重要じゃない情報やメインになりえない情報も多すぎて、見なくなってきたわ - ： Name_Not_Found [sage] 2018/10/15(月) 12:43:22.42ID:???
-
ありがとうございます
文字サイズを小さくしたいのは
ttp://http://blog.livedoor.jp/nanjstu/archives/54101260.html
このまとめサイトのように
6: 風吹けば名無し 2018/09/06(木) 11:48:46.63 ID:u6cU61gi0
え？2本打ったんか
の、
6: 風吹けば名無し 2018/09/06(木) 11:48:46.63 ID:u6cU61gi0
の文字だけ小さくしたいのです。
それの2chまとめくすの
設定 4
日付/ID欄の設定の設定という場所がどうも鍵みたいで
ttp://https://imgur.com/a/0zty9vS
ここを書き換えればどうにかなるのかな？けど書き方がわからない
という感じなんであります - ： Name_Not_Found [sage] 2018/10/15(月) 12:59:08.14ID:???
- > え？2本打ったんか
ダメ。ゼッタイ。
＿_(＼--、
／⌒ ⌒ ＼∧
/ (●(●) ∨
｜(＿＿＿ノ ﾄ､
(ﾐ) ヽ_／ (ﾐ))
∨ﾀﾞﾒ｡ｾﾞｯﾀｲ/~
＼＿＿＿／
＿|｜｜|＿
(ヽ…)( …/)
￣￣ ￣￣
薬物乱用防止 - ： Name_Not_Found [sage] 2018/10/15(月) 13:50:00.02ID:???
-
なんでわざわざそんな二次情報を追うのか知らんが
超最新の、まだ誰も知らない方法を教えてあげよう
whatwgやw3cのサイトでは更新をXMLで配信してくれてるんだ、RSSっていうんだけど
だからそれだけ見てればいちいちサイトチェックなんてしなくてもいいんだ
これで最新情報に乗り遅れることもなくなるね！
みんなには内緒だよ！ - ： Name_Not_Found [sage] 2018/10/15(月) 14:23:54.45ID:???
- RSSチェックだるい
- ： Name_Not_Found [sage] 2018/10/15(月) 17:53:06.11ID:???
- 35歳だけど、HTML5の資格取得して転職できるかな？
今は社内SEでVBAマクロとか、SQLのサーバー管理、データ抽出してます。
来月に子供生まれるんで、育休1年取って独学で勉強しようと思います。
年収は今は450万程度です。380万くらいにはなっても良いです。アドバイスお願いします - ： Name_Not_Found [sage] 2018/10/15(月) 18:17:53.16ID:???
- やめたほうがいい
- ： Name_Not_Found [sage] 2018/10/15(月) 18:58:01.56ID:???
- html5の資格取っても無意味
学生でさえ使えるものなのに
取得しようとしてる技術が子供レベルなんだが… - ： Name_Not_Found [sage] 2018/10/15(月) 20:04:33.49ID:???
-
マジレスするとフロントは一通りさらうくらいにしといてディレクターとかを目指した方が良い - ： Name_Not_Found [sage] 2018/10/15(月) 20:07:23.20ID:???
-
逆にどのレベルが子供じゃないですか？ - ： Name_Not_Found [sage] 2018/10/15(月) 20:12:16.31ID:???
- HTMLCSSってのはマジで誰でも出来るからそれプラスの技術ないと
- ： Name_Not_Found [sage] 2018/10/15(月) 20:27:34.63ID:???
- デザインできるかプログラムできるかディレクションできるかどれか
HTMLなんてほんとガキでもできるし
それだけ覚えても仕事ではなんの役にもたたない
サイト更新のパートや学生バイトレベルのお仕事しかないで - ： Name_Not_Found [sage] 2018/10/15(月) 20:33:35.47ID:???
- そんな簡単なレベルなんですね。
もっと難しいかと思っていました。
プラスアルファで目指すとしたらおすすめありますか？
ネットワークではCCNAを２ヶ月でとりました - ： Name_Not_Found [sage] 2018/10/15(月) 20:48:07.44ID:???
-
おれ資格なんか一つもないけど仕事はいくらでもくる
営業してないけど勝手にくる
そんで、資格取るのやめてアプリつくりな
その無駄な2ヶ月をアプリ作る時間に使う - ： Name_Not_Found [sage] 2018/10/15(月) 20:56:23.10ID:???
- だが2ヶ月じゃまともなアプリはできない
- ： Name_Not_Found [sage] 2018/10/15(月) 21:11:36.65ID:???
- 一年あるなら持ってれば食っていける資格がいいと思う
- ： Name_Not_Found [sage] 2018/10/15(月) 21:51:01.34ID:???
-
何がおすすめ？ - ： Name_Not_Found [] 2018/10/15(月) 22:24:58.38:by3GfRhw
- テキスト入力のinputを横幅いっぱいにしたいのですが、フォントサイズを大きくすると
横幅をはみ出してしまいます。フォントサイズが小さいときは問題ないです。
inputに横幅を指定しないといけないのでしょうか？
<div style='width:360px'>
...
<div style='display:flex'>
<input type=text style='flex:1 1 auto;font-size:40px;'>
</div>
...
</div> - ： Name_Not_Found [sage] 2018/10/15(月) 22:40:24.13ID:???
-
1級建築士 - ： Name_Not_Found [sage] 2018/10/15(月) 22:45:14.98ID:???
-
inputもただの置換インライン要素なので
大きさはwidthとheightで決めてあげてください - ： Name_Not_Found [sage] 2018/10/15(月) 22:46:04.01ID:???
-
参考サイトのソースを見たいんじゃなくて、
ttp://https://imgur.com/a/0zty9vS で設定し、出力された実際のページのソースが見たいの。
何故かと言うと、その設定がそのままブラウザに表示されていない可能性と、それ以外の強いセレクタが邪魔をしている可能性があるから。 - ： Name_Not_Found [] 2018/10/15(月) 23:03:55.68:by3GfRhw
-
ありがとう。
いちいちwidthめんどくせーと思ったが、幅指定は先祖のdivに任せて
inputにはwidth:0を指定しとけばぴったり収まるようになった。 - ： Name_Not_Found [sage] 2018/10/16(火) 11:19:40.33ID:???
- jsを使わずにテキスト文字列をキーにセレクタ作れないもんかねぇ
- ： Name_Not_Found [sage] 2018/10/16(火) 11:27:29.69ID:???
-
仕事来るってのは全部アプリ製作がらみなん？ - ： Name_Not_Found [sage] 2018/10/16(火) 12:16:47.77ID:???
-
そうだよ
あとwordpressのテーマ作ったりプラグイン作ったり
wordpress使ったことなかったけど独学で一ヶ月半でテーマとプラグイン作った
そもそも俺は36歳から独学でコーディング勉強したおっさん
今は普通に他の開発者と連携して大規模アプリ作ったり、一人で開発したりしてる - ： Name_Not_Found [sage] 2018/10/16(火) 13:04:39.61ID:???
-
あなたすごいね。
何から勉強すればいいか教えて - ： Name_Not_Found [sage] 2018/10/16(火) 13:04:50.90ID:???
-
案件はどこから得てる？
立ち上げ当初と現在では経路は変わった？
立ち上げ時は今と比べて苦労してた？そうでもない？
今後に不安はある？ない？そう考える理由は？ - ： Name_Not_Found [sage] 2018/10/16(火) 13:18:07.51ID:???
-
すっごいなあ
フリーランスなりたいけどどうすりゃいいのか探している最中だわ - ： Name_Not_Found [sage] 2018/10/16(火) 14:01:13.76ID:???
-
コネなしで始めるのはハードル高い、どころか棒なし棒高跳だよなあ
この商売に限った話じゃないけど
未経験ならなおさら
おっちゃんが始めた頃はまだ未開の地だったので
やりたい放題だったなあ - ： Name_Not_Found [sage] 2018/10/16(火) 14:05:14.43ID:???
-
はい、かっこいいよｗｗｗ - ： Name_Not_Found [sage] 2018/10/16(火) 14:36:55.38ID:???
-
好きなところからでいいと思う
どうせ必要に応じてなんでもやらないといけなくなるし
知人が勝手に案件持ってくる
その知人は営業が得意でIT関連のコンサルやったりしてるから
あとは自分で作ったアプリをサイトで売ったりしてると、そのアプリのこういう機能つけたの作ってくれみたいな話がくる
フリーランスになるなら自分で営業ができるかが大事だね
俺は営業まったくできないから上の営業マンと組んでる - ： Name_Not_Found [sage] 2018/10/16(火) 15:40:54.65ID:???
-
だよなぁ・・・
クラウドソーシングサイトなんか見ても仕事取れる気せんわ。
とういか取れない - ： Name_Not_Found [sage] 2018/10/16(火) 16:08:44.81ID:???
-
あらかりてぇ。
拝んどこ(‐人‐) - ： Name_Not_Found [sage] 2018/10/16(火) 16:40:19.80ID:???
- 自分はIT関連コンサル営業の知人に不払いされた…
- ： Name_Not_Found [sage] 2018/10/16(火) 17:53:55.43ID:???
- すいません、ワードプレスのSTINGER8使ってるのですが、
レイアウトのズレみたいなのが気になります・・
質問てここで大丈夫でしょうか？ - ： Name_Not_Found [sage] 2018/10/16(火) 20:59:35.33ID:???
- wordpressスレがあるのでそちらでどうぞ
- ： Name_Not_Found [sage] 2018/10/17(水) 13:20:04.38ID:???
- フリーエンジニアは、Ruby on Rails だろ
YouTube の動画にあったけど、
エージェントに、10% とか払えばよいって - ： Name_Not_Found [sage] 2018/10/17(水) 14:59:59.00ID:???
- containerクラスのついて質問なんですが
・containerクラスの中にheader, main, footer要素を入れているサイト
・header, main, footer要素にそれぞれcontainerクラスを入れているサイト
の2つを見かけますが違いとか正解とかはあるんでしょうか？ - ： Name_Not_Found [sage] 2018/10/17(水) 15:34:45.36ID:???
- 自由にやればいい
- ： Name_Not_Found [sage] 2018/10/17(水) 15:55:01.18ID:???
- クラス名は特に意味ないんで
好きにしたらいいんだぜ - ： Name_Not_Found [sage] 2018/10/17(水) 16:08:39.23ID:???
- どっちでもいいんですね、
こだわりもっている人多いのかなと思って聞いてしまいました - ： Name_Not_Found [sage] 2018/10/17(水) 16:12:22.69ID:???
- できるやつがこだわりを持っているだけ
- ： Name_Not_Found [sage] 2018/10/17(水) 18:16:34.93ID:???
- ライブドアブログのスマホ版での広告の余白がどうにかなりませんか？
ttp://https://imgur.com/a/igybrDW
このように右側に大きな余白ができてしまいます
レイアウトで2つ並べても同じ形が2つ縦に並びます。
どうしたらびしっと埋まるような広告を作ることができますか？ - ： Name_Not_Found [] 2018/10/17(水) 21:06:26.60:iY90Vo4v
- ＜table＞
＜tr＞
＜td class="col1"＞＜／td＞
＜td class="col2"＞＜／td＞
＜td class="col3"＞＜／td＞
＜／tr＞
＜／table＞
table{
width:100%;
}
td.col1{
width:50px!important;
}
td.col2{
width:40%;
}
td.col3{
width:40%;
}
こんな風にすると、ブラウザの幅を変更した場合に、
col1は出来る限り50pxになると思ったのですが、
実際は、勝手に変化してしまいます。
たぶん、100-(40+40)=20% の幅になっているようです。
そう言うもんですか？
やりたいのはcol1を50pxくらいに固定して、
col2,col3は同じ幅にしたいのですが。 - ： Name_Not_Found [sage] 2018/10/17(水) 21:38:40.49ID:???
- flexでやった方が楽そう
- ： Name_Not_Found [sage] 2018/10/17(水) 23:05:23.07ID:???
- col2とcol3をcalc(50%-25px)にしたら？
- ： Name_Not_Found [sage] 2018/10/18(木) 02:22:11.01ID:???
- 私たち日本人の、日本国憲法を改正しましょう。
総ム省の、『憲法改正國民投票法』、でググって
みてください。拡散も含め、お願い致します。 - ： Name_Not_Found [] 2018/10/18(木) 07:27:30.95:HZJuwx98
-
さっそく試してみました。
その結果col1は50pxに固定出来たのですが、
col2,col3が同じ幅になりません。
col3のほうが広くなります。原因わかりません。
>155
flexでやると言うのはtableを使わないと
言う事ですか？もしそうなら、どんな要素を使えば良いですか？ - ： Name_Not_Found [sage] 2018/10/18(木) 07:43:39.29ID:???
-
156に加えて、tableにtable-layout: fixed;をつけてみたらどう？ - ： Name_Not_Found [] 2018/10/18(木) 08:35:35.12:HZJuwx98
-
さっそく試してみたら、
col1,col2,col3が同じ幅になりました。
もうわけ分かりません。 - ： Name_Not_Found [sage] 2018/10/18(木) 09:16:07.49ID:???
-
col2とcol3の指定がいらないので外す。
<style>
table{
width:100%;
}
td.col1{
width:50px;
}
</style>
色付けて可視化
<style>
table{
width:100%;
}
td.col1{
width:50px;
background-color: #ddd;
}
td.col2{
background-color: #f5f5f5;
}
td.col3{
background-color: #eee;
}
</style> - ： Name_Not_Found [sage] 2018/10/18(木) 09:31:59.95ID:???
- そういえばクロームは大丈夫なんだけど、
FirefoxとIEだとテーブルが崩れてtable-layout: fixedで直ったな
display:tableで子供全員に幅書いてたんだけど - ： Name_Not_Found [sage] 2018/10/18(木) 09:52:11.42ID:???
- Table ってつかわくなったな
- ： Name_Not_Found [] 2018/10/18(木) 10:04:28.72:HZJuwx98
-
col2,col3のwidthを指定しないと、
それらのwidthは中のテキストの長さに応じて
勝手に決まりますよね。
ご提示いただきましたコードを試しましたが、
col2=col3にはならなかったです。 - ： Name_Not_Found [sage] 2018/10/18(木) 10:09:03.43ID:???
- つかうよ
- ： Name_Not_Found [sage] 2018/10/18(木) 13:08:22.84ID:???
- table-cellの幅の決まり方って独特だからポイントで使いたくなることはある
- ： Name_Not_Found [sage] 2018/10/18(木) 13:27:49.93ID:???
- どう独特なの？
- ： Name_Not_Found [sage] 2018/10/18(木) 19:17:47.16ID:???
-
ごめん。文字数考えてなかった
バグというかダメぽいな
もうdiv+tabelでやるしかないんじゃね - ： Name_Not_Found [sage] 2018/10/18(木) 20:45:30.17ID:???
- たべる
- ： Name_Not_Found [sage] 2018/10/19(金) 14:46:03.93ID:???
-
tdの親、つまりtrに対してflexを使うか
tdに対してinline-blockだな
table{
width:100%;
}
tr{
display: flex;
}
td.col1{
width:50px;
}
td.col2{
width: calc( 50% - 25px );
}
td.col3{
width: calc( 50% - 25px );
} - ： Name_Not_Found [sage] 2018/10/19(金) 15:14:39.89ID:???
-
ごめん、flexならcalcは要らないか
んでIE11とかも考慮するなら下記みたいな感じIE9とかは知らない
col2とcol3は設定いらない
table{
width:100%;
}
tr{
display: flex;
}
td{
display: block;
flex: 1;
}
td.col1{
flex: 0 0 50px;
} - ： Name_Not_Found [] 2018/10/19(金) 15:21:30.85:/OVo9gpo
- header,footer,mainなどのタグでセクショニングすると、マシンリーダビリティが向上するのって、構成が分かりやすくなるから？それとも、タグで囲む事自体が重要なの？
タグで囲む事自体が重要なら、めちゃくちゃシンプルなコードでもセクショニングはした方がいいってこと？
例えば、php使った簡単な問い合わせフォームのコードをセクショニングすると、main要素だけになっちゃう場合とか。 - ： Name_Not_Found [sage] 2018/10/19(金) 15:26:07.19ID:???
- 構造がわかりやすくなるからだろ
header footerなど共通部分は重複コンテンツとみなさないように重要度下げるのに対し
main部分を重要視したり
でもアクセス数やアクセス内容の重要度に比べたらほんと大した差は無いと思うがね。 - ： Name_Not_Found [sage] 2018/10/19(金) 15:36:57.32ID:???
- tableにdisplay:blockでレスポンシブにしたらいい
- ： Name_Not_Found [] 2018/10/19(金) 18:11:54.53:/OVo9gpo
- ttp://https://www.javadrive.jp/phpappli/keijiban/index4.html
ここに載ってるサンプルコードもheader,mainぐらいには分けた方がいいのでしょうか… - ： Name_Not_Found [sage] 2018/10/19(金) 19:14:45.19ID:???
-
このサンプルを無理やりマークアップするならこんな感じになる。
<hrader><h1>掲示板</h1></header><main>投稿部分</main>
サンプルだからというのもあるけど、知らない人を集めようとするならもっと親切にサイトについて書かないといけない。
何の掲示板で、どういうルールがあって、どういうメニューがあって、問い合わせ先はどこで、とか。
それらが全て自然とマークアープに繋がるから本来は自然とnavもfooterも必要が出てくる。
必要ないというならそもそも人を集める必要がないページなんだよ => つまりSEOは不要 - ： Name_Not_Found [sage] 2018/10/19(金) 21:26:09.24ID:???
- 生cssでいつのまに変数が使えるようになってたか・・・
:root {
--main-gutter: 12px;
--main-position: center;
--main-lh: 1.5;
}
と思ったらIEだけ・・死ね - ： Name_Not_Found [sage] 2018/10/19(金) 21:29:22.93ID:???
- ↑androidも含めてIE以外は主要ブラウザは全部対応OKなんだが使ってる？
- ： Name_Not_Found [] 2018/10/19(金) 22:20:06.66:oxDjTXud
- 使ってない
普段scssだからなあ - ： Name_Not_Found [sage] 2018/10/19(金) 22:40:23.97ID:???
- 使ってるぜ
- ： Name_Not_Found [] 2018/10/20(土) 00:25:42.06:yOre4lbB
-
table{width:100%;}
tr{display:flex;}
td{display:block;flex:1 1 1px;word-break:break-all;}
td.col1{flex:0 0 50px;}
tdのflex:1 1 1pxとword-break:break-allを追加しました。
ie11とfirefoxで確認。 - ： Name_Not_Found [sage] 2018/10/20(土) 07:36:39.54ID:???
- >>171
どの方法でも上手く行きました。
ありがとうございました。 - ： Name_Not_Found [sage] 2018/10/20(土) 17:16:46.69ID:???
- formって不便じゃない？
ネストできなしいサブミットにアドレスつけられないし
フォーム共通にして別のアクションにポストしたいときどうしたらいいの - ： Name_Not_Found [sage] 2018/10/20(土) 17:37:38.02ID:???
- ネストできるしサブミットにアドレスつけられるが
そんな事しなくても普通に、フォームに複数のアクションボタンをつければいいだけ
サーバー側で同じアドレスへのポストをパラメータ見て振り分けるだけ - ： Name_Not_Found [sage] 2018/10/20(土) 17:38:24.65ID:???
-
アクション先を変えればいいだけじゃん
もしくはアクション先を同一にしてポストするsubmitボタンの判定で別けるとか
どうにでもできる - ： 184 [sage] 2018/10/20(土) 18:01:59.36ID:???
- あー、ネストはできなかったな
- ： Name_Not_Found [sage] 2018/10/21(日) 10:51:34.04ID:???
- どういうこと？
<form method="post">
<form method="get">
<input>
<input>
<submit>
</form>
<submit>
</form>
とか
<form>
<input>
<input>
<submit action="get">
<submit method="post">
</form>
ってできるの？ - ： Name_Not_Found [sage] 2018/10/21(日) 11:29:02.65ID:???
- できねーっていっとんじゃ
- ： Name_Not_Found [sage] 2018/10/21(日) 12:16:40.61ID:???
- ＞サブミットにアドレスつけられるが
＞アクション先を変えればいいだけじゃん
これ具体的にどうかいて何をかえれるの？
name属性で同じCGI内でボタン識別できるのは知ってるけど
URLやGET,POSTメソッドかえることってできるの？ - ： Name_Not_Found [sage] 2018/10/21(日) 12:28:06.48ID:???
- 動的に好きなように変えればいいじゃん
- ： Name_Not_Found [sage] 2018/10/21(日) 12:35:02.88ID:???
- まあそうなんだけどだからJSの力をかりないとできないの不便だなーと
- ： Name_Not_Found [sage] 2018/10/21(日) 15:40:14.32ID:???
- スライダー沢山あるけど、使い分けるんじゃなく、どれか1つでカスタマイズ次第でなんでも可能なものですか
ttp://https://creive.me/archives/10461/#jQuery - ： Name_Not_Found [sage] 2018/10/21(日) 16:39:26.63ID:???
- SlickとBxsliderだな
自分では作らん - ： Name_Not_Found [sage] 2018/10/21(日) 17:21:54.92ID:???
- swiperが熱いらしい
- ： Name_Not_Found [sage] 2018/10/21(日) 17:46:43.82ID:???
-
なんでも可能かはドキュメント見るしかないけどまぁ試して見るのが手っ取り早い。
可能なことが多いと設定が多岐にわたり簡単なスライダー実装する時めんどくさかったりもするけど。 - ： Name_Not_Found [sage] 2018/10/21(日) 18:12:33.71ID:???
- 俺はいつもswiperだな
前はslick、その前はbx使ってたけどもう使うことはないな - ： Name_Not_Found [sage] 2018/10/21(日) 19:23:22.83ID:???
- 俺もswiperだな
bxsliderはautoの扱いが癖強くてなあ - ： 192 [sage] 2018/10/21(日) 19:45:00.37ID:???
- 私もSWIPERです。最初に覚えたのがそれだったので。Slickとかのほうがメジャーとは知らず。
先日画像サムネイルとキャプションをつけたくてFotorama使ったけど、Swiperでもできたのかも。 - ： Name_Not_Found [sage] 2018/10/21(日) 20:25:12.90ID:???
- 自分はbx
1つのページ内に複数のスライダーがあって全部違うの使ってるのに出会ったことがある
悩んだんだろうな - ： Name_Not_Found [sage] 2018/10/21(日) 21:47:28.78ID:???
- スライドとかのアニメーションcssでも出来るけど無駄かね？
アニメーションであんまりjs使いたくない病なんだが… - ： Name_Not_Found [sage] 2018/10/21(日) 22:13:10.20ID:???
-
組んでるとパズルみたいで面白くはあるけど枚数変わるたび直さなくちゃいけないじゃん - ： Name_Not_Found [sage] 2018/10/21(日) 22:37:38.46ID:???
- そういう場合にscssを使うのです
- ： Name_Not_Found [sage] 2018/10/21(日) 23:45:53.26ID:???
- だいたい更新頻度高いじゃんスライダー入れるとこって
- ： Name_Not_Found [sage] 2018/10/22(月) 00:17:29.47ID:???
- 画像のサイズ同じならファイル名同じにして上書きすればいいだけだから
そんな面倒じゃなくね？ - ： Name_Not_Found [sage] 2018/10/22(月) 00:19:26.62ID:???
-
んで蔵がキャッシュ消さずに見て
更新されてないんですが!!
までテンプレ - ： 名無しさん＠そうだ選挙に行こう！ Go to vote! [sage] 2018/10/22(月) 09:45:08.04ID:???
-
いや、CSSだけで作るやつの話
枚数増えると破綻するから - ： 名無しさん＠そうだ選挙に行こう！ Go to vote! [sage] 2018/10/22(月) 10:32:23.34ID:???
- そもそもcssだけだとフリックも吸着もできないなー
- ： Name_Not_Found [sage] 2018/10/23(火) 00:49:09.64ID:???
- スライダーに最低限必要なもの
・自動スライド
・スライドからのリンク
・フリック(左右)
・ナビゲーション(前次のやつ)(左右)
・ページネーション(ドット/サムネイル)
jsなしでできるのって最初の2つだけじゃね？ - ： Name_Not_Found [sage] 2018/10/23(火) 01:52:52.78ID:???
- もうスライダーがメインのサイトは古く感じるわ
- ： Name_Not_Found [sage] 2018/10/23(火) 18:03:24.24ID:???
-
ナビゲーションとページネーションはcssでも出来る
フリックはやったことないな - ： Name_Not_Found [sage] 2018/10/23(火) 18:10:04.61ID:???
- ページネーションをcssってまたチェックボックスだろｗ
そういうのさわりたくない - ： Name_Not_Found [sage] 2018/10/23(火) 18:43:11.43ID:???
- すまん。教えてくれ。
<div class=外側>
<div class=内側>
<p>ああああ</p>
</div>
</div>
これで、全画面固定して、内側の上下にボーダー引こうとしても引けない…。
内側で線を引こうとしてるのは、全画面の半分の幅だけに引きたいからなんだけど。
別の方法探るしかないかね - ： Name_Not_Found [sage] 2018/10/23(火) 19:42:01.30ID:???
- cssも書け
- ： Name_Not_Found [sage] 2018/10/23(火) 20:02:10.40ID:???
- <label></label>
の内側ってブロックでも何でもいれてもいいの？ - ： Name_Not_Found [sage] 2018/10/23(火) 20:45:05.38ID:???
- Form 作り方わからんぞ これHTMLとCSSで済む問題じゃないよな。
作り方サイト見てもことごとくそこにしか触れてない。 - ： Name_Not_Found [sage] 2018/10/23(火) 22:53:15.92ID:???
-
HTMLとCSSで
なんとかなってない人の方が少ないと思うけどなあ - ： Name_Not_Found [sage] 2018/10/23(火) 23:25:03.40ID:???
-
PHPかvus.jsかAWSのサービス使え - ： Name_Not_Found [sage] 2018/10/23(火) 23:58:02.42ID:???
- htmlとcssができない人に
php、vue、awsを勧めるのかｗ - ： Name_Not_Found [sage] 2018/10/23(火) 23:58:54.63ID:???
- ひょっとしてサーバーサイドがないと
form意味ないだろって言ってるのか - ： Name_Not_Found [sage] 2018/10/24(水) 00:45:14.46ID:???
- jsでいいでしょ
- ： Name_Not_Found [sage] 2018/10/24(水) 01:51:16.95ID:???
- form受け取る側で無料サービスでできるのってPHPぐらい？
他のフレームワーク無料で使えるとこってあるの？ - ： Name_Not_Found [sage] 2018/10/24(水) 02:35:24.05ID:???
- フレームワークは無料ですよ
- ： Name_Not_Found [sage] 2018/10/24(水) 08:55:01.65ID:???
- htmlとcssって頑張ればどのくらいである程度できるようになります？
システム管理やってるものですが、急にHP担当がやめることになって勉強しないといけないです。
アドバイスもあれば教えて下さい - ： Name_Not_Found [sage] 2018/10/24(水) 10:04:41.15ID:???
- 頑張れば3日でできるレベル
- ： Name_Not_Found [sage] 2018/10/24(水) 10:27:26.00ID:???
-
線を付けるだけならcssで内側のdivにborder付ければいいだけ
内側div幅が画面いっぱい100%のまま線の横幅だけ50%にしたいって言うなら
内側divに疑似要素:beforeと:afterを使ってそれぞれにborderを付けて幅50%とかすればいい
HTMLのバージョンと仕様による - ： Name_Not_Found [sage] 2018/10/24(水) 11:29:58.61ID:???
-
それはないだろ
なにいってんだこいつ - ： Name_Not_Found [sage] 2018/10/24(水) 11:42:58.73ID:???
- ある程度って書いてるだろ
正直、3日もいらん
1日で十分 - ： Name_Not_Found [sage] 2018/10/24(水) 12:33:11.55ID:???
- フォームはGoogle Formを埋め込むのが利用者目線ではベストじゃないかね。
- ： Name_Not_Found [sage] 2018/10/24(水) 12:33:13.81ID:???
-
人にもよるけど
だいたい3日から30年ってところ - ： Name_Not_Found [sage] 2018/10/24(水) 13:56:16.74ID:???
-
ﾑﾘﾑﾘ - ： Name_Not_Found [sage] 2018/10/24(水) 15:27:03.81ID:???
- 1週間あれば余裕だろ
- ： Name_Not_Found [sage] 2018/10/24(水) 15:32:45.18ID:???
- どっちにしても誰でもすぐに習得できる
できないなら人間やめろ - ： Name_Not_Found [sage] 2018/10/24(水) 19:10:36.51ID:???
- システム管理やってるって書いてんだからプログラマだろ
JavaやC++を完璧にマスターしてるかもしれんから
HTMLくらい余裕だろ。 - ： Name_Not_Found [sage] 2018/10/24(水) 19:42:16.60ID:???
- JavaやC++完璧にマスターしてる人はシス管なんてやんないよ
- ： Name_Not_Found [sage] 2018/10/25(木) 16:01:34.62ID:???
-
って言う人って
蓋開けてみると条件付きでしか習得してない印象 - ： Name_Not_Found [] 2018/10/25(木) 23:18:29.47:o5FKZ+A8
- キーボードを押すだけで、
リンク先に飛ぶような、ｈｔｍｌを記述する事ってできるのですか？
リンク先は、他のサイトでも良いし、同じページ内の別の場所でも良いのですが。
それとも、そんなサイトを作る事は不可能ですか？ - ： Name_Not_Found [sage] 2018/10/26(金) 01:15:49.69ID:???
- HTMLもCSSも言語的には簡単よ
アルファベットわかるなら小学生でも覚えられる
ただそれらをつかってデザインする
デザイナーがつくったデザインをコーディングする
ディレクターやクラが言う要望のアクションをつけるってなると
また別なんよ - ： Name_Not_Found [sage] 2018/10/26(金) 09:03:35.89ID:???
-
JSで可 - ： Name_Not_Found [sage] 2018/10/26(金) 10:55:39.11ID:???
- >>210
比較的新しい仕様で
CSS Scroll Snapというのがある。
ttp://https://drafts.csswg.org/css-scroll-snap/#snap-overflow
以下のページにあるCodePenのサンプルをスマホで最新のChromeで触ってみたら問題なく動いた。
ttp://https://newinweb.com/2018/09/06/css-scroll-snap/
Googleの解説も参照のこと。
ttp://https://developers.google.com/web/updates/2018/07/css-scroll-snap - ： Name_Not_Found [sage] 2018/10/26(金) 11:13:08.50ID:???
- CSSトリックの翻訳記事もあった
ttp://https://coliss.com/articles/build-websites/operation/css/how-to-use-css-scroll-snap.html
あとはいつものMDN - ： Name_Not_Found [sage] 2018/10/26(金) 11:22:32.58ID:???
- すごーい初めて知った
- ： Name_Not_Found [sage] 2018/10/26(金) 12:59:49.42ID:???
-
すげえ - ： Name_Not_Found [sage] 2018/10/26(金) 13:24:30.08ID:???
- まえに一度使おうとして断念したんだけど
CSSのscrollsnapって、JSで拾えるイベントあるもの？ - ： Name_Not_Found [sage] 2018/10/26(金) 13:36:16.82ID:???
- えぇ、それならJSで実装すればいいだけでは…
- ： Name_Not_Found [sage] 2018/10/26(金) 14:53:50.13ID:???
- まあそうなんだけど
snapしたときになんかイベントあったら便利なのになー
と思いまして - ： Name_Not_Found [sage] 2018/10/26(金) 15:52:49.81ID:???
- 便利だと思う挙動は他人には不便な場合が多い
- ： Name_Not_Found [sage] 2018/10/26(金) 16:26:34.94ID:???
- そりゃあったほうがいいわな
transitionのtrantitionEndみたいなもんだろ？ - ： Name_Not_Found [sage] 2018/10/26(金) 16:30:42.72ID:???
- わかる
snapした瞬間
ズギャーーーーーーン！！！
って鳴らしたいよね
このスレの総意 - ： Name_Not_Found [sage] 2018/10/26(金) 16:32:03.74ID:???
- ごめん、人によって
ガシューーーーーーン！！！
かもしれないから総意とは言えなかった - ： Name_Not_Found [sage] 2018/10/26(金) 17:44:23.96ID:???
- 発火するだけならあった方が便利だろうさ
- ： Name_Not_Found [sage] 2018/10/26(金) 17:58:18.00ID:???
- タッチイベント組み合わせて組めるのでは？知らんけど。
ttp://https://developer.mozilla.org/ja/docs/Web/API/TouchEvent - ： Name_Not_Found [sage] 2018/10/26(金) 18:01:43.66ID:???
- LP的なアニメーションごりごりを作る時に
ぶっぴがーん！に合わせてアニメーション始めたいというのは当然あるな
同等のことをするJSライブラリが
停止時に発火するコールバックを設定できるのもそのためだろう - ： Name_Not_Found [sage] 2018/10/26(金) 18:55:23.25ID:???
- もういいから病院行け
- ： Name_Not_Found [sage] 2018/10/26(金) 22:45:11.93ID:???
- え、あれイベント発生しねえの
- ： Name_Not_Found [sage] 2018/10/30(火) 02:10:07.11ID:???
- amazonと楽天にリンクするボタンがほしいのです
それっぽいのどこぞにプログラムございませんでしょうか？ - ： Name_Not_Found [sage] 2018/10/30(火) 07:38:40.38ID:???
- アフィリンクのボタンならそれぞれのアフィ審査受けないとリンクはもらえん
ただのボタンならプログラムじゃなくてaタグ - ： Name_Not_Found [sage] 2018/10/30(火) 12:18:49.33ID:???
- Superfish モバイル用のハンバーガーメニューの設定がわからない。
- ： Name_Not_Found [sage] 2018/10/30(火) 12:22:19.03ID:???
-
ありがとうございます
アマゾンも楽天も通ってます。
ttp://https://imgur.com/a/Yg8lNFi
このようなボタン形式のリンクがほしーのです、 - ： Name_Not_Found [sage] 2018/10/30(火) 13:50:03.65ID:???
-
aタグのリンクにcss適用すればいい
aタグ ボタン cssで検索すればいくらでもでてくる - ： Name_Not_Found [sage] 2018/10/30(火) 15:13:01.68ID:???
- cssが何かもよくわかってないんだろ
カエレバ CSSで検索 - ： Name_Not_Found [sage] 2018/10/30(火) 16:34:35.39ID:???
-
ありがとうございます。こういうふうな仕組みなんですね、勉強になります
いろいろ触ってみますが、また何かあったらお助けお願いするかもです、、
ありがとうございます！ - ： Name_Not_Found [sage] 2018/10/30(火) 17:37:16.06ID:???
- ステマっ盛り
- ： Name_Not_Found [] 2018/10/30(火) 20:10:11.43:vCSL+t+e
- inline-blockである .dan と .jo がDOMツリー上で
男女女女男女男女男男女女
と並んでいるとき
男女
女
女
男女
男女
男
男女
女
と左右に並べ分けたいのですが、どういう方法がありますか？
floatとかですか？
.dan + .jo { float: left } …うーん？ - ： Name_Not_Found [sage] 2018/10/30(火) 20:15:01.48ID:???
- ちょっと圧縮してみた
男姦嬲嫐女 - ： Name_Not_Found [sage] 2018/10/30(火) 20:58:32.04ID:???
-
男が一人消えてるやり直し - ： Name_Not_Found [sage] 2018/10/30(火) 21:22:26.01ID:???
- 姦姦姦
姦嫐姦
姦姦姦
真ん中が俺 - ： Name_Not_Found [sage] 2018/10/30(火) 22:09:51.13ID:???
- .dan, .jo {
display: inline-block;
width: 49%;
}
.dan {
background-color: #eef;
margin-right: 2%;
}
.jo {
background-color: #fee;
}
.jo + .jo {
margin-left: 51%;
}
こんなじゃだめ？ - ： Name_Not_Found [sage] 2018/10/30(火) 23:10:06.46ID:???
-
マンコだらけ、略して曼陀羅 - ： Name_Not_Found [] 2018/10/31(水) 01:30:49.54:CBp4tfQF
-
JavaScriptの事で良いんですか？
解りました。
ありがとうございました。 - ： Name_Not_Found [sage] 2018/10/31(水) 02:36:22.03ID:???
-
ありゃ
htmlでって書いてたのにjsでいいの？ - ： Name_Not_Found [] 2018/10/31(水) 10:48:59.68:4RdtlEAQ
- CSS Gridについて教えてください。
<div class="container">
<div class="a"><img></div>
<div class="b"><img></div>
<div class="c"><img></div>
...以下大量に。
</div>
この様な感じで、インスタグラムの様に、.a .b .c ...の中にあるimgをひたすら詰め込んで羅列したい場合は、
レイアウトする画像のサイズが決まっていれば(例えば300px角)
grid-auto-rows:300px と grid-template-columns:repeat(auto-fit,300px)
で可能ですが、
ウィンドウサイズによって画像のサイズも変動する様にするには、
（100px角にも800px角にもなったりする）
auto-rowsもrepeatも使用せずに、
.a .b .c ... にgrid-row と grid-columnをそれぞれのクラスに指定しなくてはならないのでしょうか？ - ： Name_Not_Found [sage] 2018/10/31(水) 11:24:06.45ID:???
- IEのクソ対応を考えたらcss gridは使いたくない
- ： Name_Not_Found [] 2018/10/31(水) 11:40:26.37:4RdtlEAQ
- こちらのサイト（カントリーマウム）は
gridを使用しているとのことで、
ウィンドウサイズを変えるとそれに伴って中の画像のサイズも変動していますが、
これは画像1枚1枚をcolumnとrowで1/5や5/17と1つずつ指定しているのかと思いまして - ： Name_Not_Found [] 2018/10/31(水) 11:40:58.77:4RdtlEAQ
-
URLを貼り忘れました すみません
ttp://https://www.fujiya-peko.co.jp/countrymaam/ - ： Name_Not_Found [sage] 2018/10/31(水) 13:53:18.41ID:???
-
display: grid;を利用してるわけじゃなくてデザインがグリッドレイアウトなだけだと思う。 - ： Name_Not_Found [] 2018/10/31(水) 14:14:16.08:4RdtlEAQ
-
検証を使うとdisplay:gridなら縦横の点線が出ると思うのですが、これにはでないので不思議でした
そういうことだったのですね・・・
このサイトはテーブルセルとtext-alignで画像を配置しているのでしょうか
ありがとうございます！ - ： Name_Not_Found [sage] 2018/10/31(水) 15:22:50.40ID:???
-
flex-boxでwrapすればいいのでは？ - ： Name_Not_Found [sage] 2018/10/31(水) 16:23:07.20ID:???
- 今日のおやつはカントリーマアムだな
- ： Name_Not_Found [] 2018/10/31(水) 18:06:30.65:yE26+RAR
- CSSに凝りだすと、ちょっと画面が狭い場合にはこんな感じで
@media screen and (max-width: 480px){
設定を書く
}
とやりますよね。
でも、こう言うメディアクエリを一箇所に集めるのは手間が掛かります。
別の要素に対してCSSを書いていて、その場合にも少し狭い場合には、
@media screen and (max-width: 480px){
別の設定を書く
}
みたいに、CSSの中に上のような同じ記述が何度も出て来ます。
WEBプログラミング上級者の人は、こう言う場合どのように対処されているのでしょうか？
@media screen and (max-width: 1030px){・・・}
@media screen and (max-width: 768px){・・・}
@media screen and (max-width: 480px){・・・}
みたいなのは一箇所にまとめるべきですか？ - ： Name_Not_Found [sage] 2018/10/31(水) 18:36:58.71ID:???
- SASS使おう
- ： Name_Not_Found [sage] 2018/10/31(水) 19:06:52.74ID:???
-
ファイルをメディアによって分け、linkタグのmedia属性でメディア種別やクエリを指定する。
このリソースはメディアの条件が真になった場合のみ読み込まれるので、
１ファイルにまとめるより読み込まれる容量も減る。
ttp://https://developer.mozilla.org/ja/docs/Web/HTML/Element/link
SASSは所詮ブラウザに直接解釈されないので、使う場合はどのようなCSSになるのかを念頭に置きながら使わないといけない。
ツールが何をやっているかも分からずツールに使われているのようになってはいけないよ。 - ： Name_Not_Found [sage] 2018/10/31(水) 19:33:16.31ID:???
-
えええええ
そっちの方が面倒臭いじゃん… - ： Name_Not_Found [sage] 2018/10/31(水) 19:41:40.84ID:???
-
面倒くさいにも二通りの意味があってな
作業を効率化する（のが面倒くさい）が、その後の作業自体は楽になる
と
作業を効率化しなくて楽だが、その後の作業自体は面倒くさい
どっちの面倒くさいを取るかなんだよ？ - ： Name_Not_Found [sage] 2018/10/31(水) 19:41:58.97ID:???
- まぁそれがめんどくさいレベルの規模なら自動化の契機だな。PostCSSとnpm scriptまたはgulpで自動化できる。
- ： Name_Not_Found [sage] 2018/10/31(水) 19:43:09.09ID:???
-
> SASSは所詮ブラウザに直接解釈されないので、使う場合はどのようなCSSになるのかを念頭に置きながら使わないといけない。
ブラウザで直接解釈されても、同じことでは？ - ： Name_Not_Found [sage] 2018/10/31(水) 19:44:27.06ID:???
- ｽﾚﾁ野郎は巣に帰れ
ttp://mevius.5ch.net/test/read.cgi/hp/1519547237/ - ： Name_Not_Found [] 2018/10/31(水) 21:31:49.57:yE26+RAR
-
解説ありがとうございました。
>このリソースはメディアの条件が真になった場合のみ読み込まれるので、
これはブラウザのウインドウ幅を変化された場合に、
それに応じてメディアファイルが読み込まれると言う事ですか？ - ： Name_Not_Found [sage] 2018/11/01(木) 02:14:38.46ID:???
-
あたまかたーい
普通は
その後の作業が面倒くさくならないように、作業を効率化するよねー - ： Name_Not_Found [sage] 2018/11/01(木) 02:55:06.73ID:???
- @media なんかを使っている、WEBプログラミング上級者は100%、SASS！
というか、海外では初心者でも90%、SASS
知らないのは、50% の日本人だけ - ： Name_Not_Found [sage] 2018/11/01(木) 02:59:28.07ID:???
-
日本でもそんなに変わらんじゃろ
流石に
普及してから何年経ったと - ： Name_Not_Found [] 2018/11/01(木) 04:52:41.04:+y4YZeqs
-
すんません。
さっぱり解らないんですが、ｈｔｍｌのｊｓってのが有るんですか？
それと、ｊａｖａとｈｔｍｌってのは違うものなのですか？
自分としては目的のサイトを作れるのなら、方法については
何でも良いのですが。 - ： Name_Not_Found [sage] 2018/11/01(木) 05:14:30.37ID:???
-
なんでもいいのなら他人に任せたほうが良い
自分でやるなら、理解しろ - ： Name_Not_Found [sage] 2018/11/01(木) 12:44:07.97ID:???
-
JSはJavaScriptのことだ
名前はJAVAと似ているが全くの別物だ
JAVAとJavaScriptは、メロンとメロンパンくらい違うものだ
JavaScriptはブラウザの中で動くプログラムのことだ
んでHTMLは文章の構造を決めるものでたいした機能はないんだ
何かを押したらどうこうする、みたいなのはJavaScriptの仕事だ - ： Name_Not_Found [sage] 2018/11/01(木) 12:51:39.71ID:???
-
まったくわかりません。
もっとわりやすく説明できませんか？ - ： Name_Not_Found [sage] 2018/11/01(木) 13:12:45.81ID:???
- ミニ丼セットの丼だけのオーダーはお受けできませ「ぬ！」
- ： Name_Not_Found [sage] 2018/11/01(木) 16:47:53.33ID:???
- メロンとメロンパンの例えに感動した
- ： Name_Not_Found [sage] 2018/11/01(木) 17:07:01.91ID:???
-
いや昔からよく言われるから - ： Name_Not_Found [sage] 2018/11/01(木) 17:13:13.76ID:???
- この上なくわかりやすいけどなぁ
- ： Name_Not_Found [sage] 2018/11/01(木) 17:16:37.87ID:???
- 英語圏で色々もあるよー
difference java javascript でググると似たような与太話しいっぱいヒットする
CatとCatfish
hamとhamstar
CarとCarpet
CockとCocktail
とかとか - ： Name_Not_Found [sage] 2018/11/01(木) 20:55:35.84ID:???
- 仕様見てると
<h1>
<p>~</p>
</h1>
も
<p>
<h1>
~~~~
</h1>
</p>
もどっちも書いても良さそうだけど、ブログで後者はNGって記事をよく見る
実際どうなんやろ？ - ： Name_Not_Found [] 2018/11/01(木) 20:56:38.59:+y4YZeqs
-
自分は２９１ですが、
良くわかりました。
ありがとうございました。 - ： Name_Not_Found [sage] 2018/11/01(木) 21:00:41.05ID:???
-
20代前半はそういう職場で働いてたわ
皆おっとりしてたから居心地は良かったが
性格悪い奴とか気性が荒い女が紛れてると
パシリに使われるかボイコットされたり最悪な環境にもなりえるんだろうな - ： Name_Not_Found [sage] 2018/11/01(木) 21:07:03.94ID:???
-
それは汎用性、メンテナンス性に欠けるクソ構造だよ
更新や編集の多いサイトを深く運用してみれば意味がわかるようになる。
優れたデザインは常にシンプル。
複雑なものを複雑に書くより
必要なもの以外をいかにそぎ落としていくかに尽力した方がいい。 - ： Name_Not_Found [sage] 2018/11/01(木) 22:45:47.80ID:???
-
>優れたデザインは常にシンプル
それ複雑なデザインをまとめられないだけなんじゃ… - ： Name_Not_Found [sage] 2018/11/01(木) 22:53:38.17ID:???
- 複雑なデザインをまとめるってどういうこと？
- ： Name_Not_Found [sage] 2018/11/02(金) 01:05:16.95ID:???
- 整理してシンプルにすること
- ： Name_Not_Found [sage] 2018/11/02(金) 03:10:17.06ID:???
- 複雑なものを整理してまとめることは誰でもできる
複雑なものを複雑なままバランス取るのは素人にはできん - ： Name_Not_Found [sage] 2018/11/02(金) 04:16:34.13ID:???
- なら誰でもできることをやったほうが良いのでは？
- ： Name_Not_Found [sage] 2018/11/02(金) 16:59:34.85ID:???
-
よさそうじゃない
どっちもだめ。 - ： Name_Not_Found [sage] 2018/11/02(金) 20:11:59.71ID:???
- 根拠
- ： Name_Not_Found [] 2018/11/02(金) 20:20:39.04:hPJ8g+KP
-
少なくとも後者は駄目だわな
<p>はブロックレベル要素を内包できない
だから無理やり入れると、そこで<p>のブロックは一度切れるじゃろ？
前者はどうだろう
<h1>って内包してはならん要素ってあったかなあ - ： Name_Not_Found [sage] 2018/11/02(金) 21:04:11.56ID:???
- 前者はいい
後者はだめ
根拠はchrome - ： Name_Not_Found [] 2018/11/02(金) 22:02:05.52:DYmjkWhV
- 所見です
font-sizeについて質問があります。
全ての要素のサイズをvmまたは%で指定し、
font-sizeもvmで指定すれば理論上、画面幅をいくつにしようが
全ての縦横比、スタイルは保持され、
文字もまた、行内文字数、行数が保持されるはずなのですが、
実際に画面幅を変えると、行内文字数、行数は変化してしまいます。
これはなぜでしょうか？
例外的にstrong内の文字は行内文字数、行数は変化しないことを発見しました。
これはなぜでしょうか？ - ： Name_Not_Found [] 2018/11/02(金) 22:08:05.63:DYmjkWhV
- vmではなくvwでした
- ： Name_Not_Found [sage] 2018/11/02(金) 22:28:57.56ID:???
-
h要素はブロックレベル入れられないから - ： Name_Not_Found [sage] 2018/11/02(金) 23:22:45.29ID:???
-
やってもいいしちゃんと表示されるけど
正しいHTML構造文としてはNG
SEO的に評価下がるよってだけ - ： Name_Not_Found [sage] 2018/11/02(金) 23:36:36.76ID:???
-
それを世間一般ではやっちゃダメって言うやろ - ： Name_Not_Found [sage] 2018/11/03(土) 00:06:06.53ID:???
- SEOきにしない趣味のサイトならいいんじゃね
- ： Name_Not_Found [sage] 2018/11/03(土) 02:17:30.15ID:???
- 実際にはSEOの評価は下がらんのやけどねｗ
何故かと言うと結局の所検索で重要視したいのは
HTMLの文法ではなくてコンテンツだから。
HTMLのタグの違いによるスコアの差が悪用されたから
タグによってのスコアの差はなくなってしまっている
今はコンテンツ（CSSなどを反映した実際に画面に表示される内容）で
判断されるようになってる。昔は不正なHTMLをどのように解釈されるかが
バラバラだったから、正しいHTMLを書くことが推奨されていたけど、
HTML5になってから不正なHTMLも同じように解釈するようになったので
ブラウザで表示されてるように解釈される
例えば隠し文字は評価対象から外れるとかね - ： Name_Not_Found [sage] 2018/11/03(土) 08:47:05.46ID:???
- ブロックレベルってhtml5でもまだ言うの?
まあフローコンテンツとかより分かりやすい気もするんだけど - ： Name_Not_Found [sage] 2018/11/03(土) 11:40:17.31ID:???
- div多用したら怒られたんだけど…
divっていっぱい使ったらあかんのか？ - ： Name_Not_Found [sage] 2018/11/03(土) 11:42:21.97ID:???
- そりゃ必要ないときに使うのはだめだろうな
適切なタグを使っていれば、divは殆どいらない - ： Name_Not_Found [sage] 2018/11/03(土) 13:37:56.48ID:???
- ネストしたレイアウトが必要だったり
アコーディオンやタブみたいに変化するようなのはdiv大量になるのは仕方ないんじゃない
逆にそういうのBEM記法使わずにコンテナでかこわなかったりすると
flex がとじてもどしたら block になったとかで変なバグ入りそう - ： Name_Not_Found [sage] 2018/11/03(土) 15:40:16.03ID:???
- 変な空divでレイアウト崩れることもあるからなぁ
- ： Name_Not_Found [sage] 2018/11/03(土) 15:49:53.74ID:???
-
Google「・・・」 - ： Name_Not_Found [sage] 2018/11/03(土) 16:10:21.17ID:???
-
いくらでも使っていいぞ
なんなら二、三個くらいおまけしてやってもいい
余分なタグは使うなとかいう
カビの生えたストリクト原理主義者の言うことに耳を傾ける必要はねえ
マジで - ： Name_Not_Found [] 2018/11/03(土) 17:26:19.28:pS15NHy1
- 現場に出なきゃわからないことが多いんだろうな
今はfloatは使わずにflexで、inlineは使わずにinline-blockが普通？ - ： Name_Not_Found [sage] 2018/11/03(土) 18:20:29.18ID:???
- 普通っていうか、その場に適したものを使うだけよ。
- ： Name_Not_Found [sage] 2018/11/03(土) 19:12:51.62ID:???
- いまの現場ほぼdiv
かなりネストしてる
SEO関係ないけどどうなのよと思ってる - ： Name_Not_Found [sage] 2018/11/03(土) 19:27:12.16ID:???
- Google「・・・」
- ： Name_Not_Found [sage] 2018/11/03(土) 19:37:58.27ID:???
- そうですよねgoogleさん…
- ： Name_Not_Found [sage] 2018/11/03(土) 19:38:31.69ID:???
-
キュレーションサイトの問題で
構造より無意味な文章1万文字のほうが評価が高いって結果でちゃったからなぁ
あれからグーグルがなんか対策したならしらんけど - ： Name_Not_Found [] 2018/11/03(土) 21:18:59.56:6Ec8PRLb
- 何らかの要素を
display:none;
した後で、再び表示させたい場合、
display:unset;
display:initial;
どちらをセットしても同じような挙動になりますか？ - ： Name_Not_Found [sage] 2018/11/03(土) 21:30:13.88ID:???
-
実際には vm や % で指定されてないスタイルがまだあるんじゃないか
ブラウザの UA スタイルシートなど暗黙的に設定されているやつ - ： Name_Not_Found [sage] 2018/11/03(土) 21:37:30.84ID:???
-
同じ挙動になるとは限らないので、元の display 値を覚えておくか、専用の class でオンオフ切り替えるしかないな
hidden 属性を設定する方法もある（ hidden を消せば元に戻る） - ： Name_Not_Found [] 2018/11/03(土) 21:50:30.55:6Ec8PRLb
-
ありがとうございました。
大変参考になりました。
クラスでやります。 - ： Name_Not_Found [sage] 2018/11/04(日) 01:10:29.25ID:???
- そのためのコンテナー
外側はとりあえず div にしといて display は none と block できりかえる
flex 使いたければ内側にかく
jquery の .show() hide() 使えばそれやってくれるから楽だよ - ： Name_Not_Found [sage] 2018/11/04(日) 07:05:50.53ID:???
-
いつの時代だよ？そうやって適当に教えるな - ： Name_Not_Found [sage] 2018/11/04(日) 09:41:29.72ID:???
- 画面を小さくすると、背景画像の両端がトリミングされるコードが分からない。
- ： Name_Not_Found [sage] 2018/11/04(日) 10:06:35.97ID:???
- の何がおかしいのかよくうわからない
うちでもそうしてるからもっといい方法があったら教えてくれ - ： Name_Not_Found [sage] 2018/11/04(日) 12:24:33.70ID:???
- 自分の会社でもブロック以外は裸でおかずにとりあえずとりあえず div か p でかこっとけっていわれてるわ
BEM記法ほど厳密じゃないが - ： Name_Not_Found [sage] 2018/11/04(日) 12:30:39.68ID:???
-
img に width height を pixel で設定して親に overflow: hidden つければいいんじゃないかな
object-fit:none; とか
absolute にして親に padding つける方法もある - ： Name_Not_Found [sage] 2018/11/04(日) 16:26:59.57ID:???
- show hideは結局インラインでdisplay直接きりかえてるからスマートじゃないってことじゃないclassを使った方がなにかとよい
- ： Name_Not_Found [sage] 2018/11/04(日) 16:38:29.87ID:???
-
background-size: cover; かな？
とエスパーしてみる - ： Name_Not_Found [sage] 2018/11/04(日) 16:47:12.39ID:???
-
background-sizeを指定しなければ勝手に両端切れなかったっけ
忘れちった - ： Name_Not_Found [sage] 2018/11/04(日) 17:25:29.52ID:???
- background-positionをcenterじゃないの
- ： Name_Not_Found [sage] 2018/11/04(日) 17:37:13.84ID:???
- background-size:auto 100%;
とか？ - ： Name_Not_Found [sage] 2018/11/05(月) 00:33:00.19ID:???
-
ありがとうございます。
いまいち画像サイズの概念やoverflowプロパティを理解してないから、
縦横比を維持したまま縮小してしまうんですよｗ - ： Name_Not_Found [] 2018/11/05(月) 09:22:11.55:rg4rpwwX
- display:block;
をセットしている要素に対して後から追加した
display:none;
が有効に出来たのですが、display:table;に対してはnoneが効きませんでした。
それでnone:!importantにして解決したのですが、そういうもんですか？ - ： Name_Not_Found [sage] 2018/11/05(月) 09:54:21.10ID:???
- display: table; とか関係なく、詳細度が低いんじゃないのかな
- ： Name_Not_Found [sage] 2018/11/05(月) 14:45:25.29ID:???
-
画像、と書くと
<img>要素のことか、background-imageのことか
混乱するから区別して書くといい
overflowは
内包するコンテンツが自分より大きい時に
どのようにするか（はみ出す・はみ出さない、スクロールする等）
を決めるプロパティ - ： Name_Not_Found [sage] 2018/11/05(月) 16:42:19.89ID:???
- お前らborder imageって使う？
難しいから使うなって言われたんだが…。 - ： Name_Not_Found [sage] 2018/11/05(月) 16:56:51.34ID:???
- 「難しいから」は理由じゃない。
お前の都合でしか無いって言ってやれ - ： Name_Not_Found [sage] 2018/11/05(月) 20:05:46.62ID:???
-
今まで使うような案件に出会ったことないや。最近シンプルな画面ばっかだし - ： Name_Not_Found [] 2018/11/05(月) 21:27:09.78:n+lZq6iO
- 質問失礼します
趣味ブログを運営しています。
アクセス数が増えてきたので、google adsenceに応募したら審査が通り、広告を張ってみたいのですが、張る場所の方法に書いてった＜head＞タグの下に埋め込んでも広告が表示されません。
他のブログテンプレートでは表示されるのですが、お気に入りのブログのみが操作不能です。HTMLの書き方によって広告が張れないということは起こりうるのでしょうか？ - ： Name_Not_Found [] 2018/11/06(火) 09:02:29.68:G7U6fKUW
- divで作った長方形の領域があり、その幅を右側に最大化したいのです。
ただし、左端はマージンがあるので、ウインドウの左端から離れています。
太線をウインドウの両端
細線をdiv域とすると、こんな感じです
┃ │ │┃
┃ │ │┃
ウインドウ幅を広げるとdiv左のマージンは増えますので一定ではありません。
ですので、 width:calc(100% - 200px) みたいな記述が出来ないので困っています。
良い方法はありますか？ - ： Name_Not_Found [sage] 2018/11/06(火) 10:00:32.57ID:???
- ?
div って何もしなくてもめいっぱい領域使うよ
floatや 親にflex がついてたりしないか margin padding をもう１度よく確認してみて - ： Name_Not_Found [sage] 2018/11/06(火) 10:05:49.39ID:???
- その増える左マージンがどう算出されるのかによる
- ： Name_Not_Found [] 2018/11/06(火) 14:14:15.30:mqnTYbJk
- Pseudo-classesからです。
１ ttp://https://gyazo.com/02535a5de4acdc8219053950a6949a72
２ttp://https://gyazo.com/31affd8fb9780903bd3b89a3b26126c2
１と２を比較して、 text-decoration: noneとtext-decoration: underlineがあるないのは
どういう違いがあるのですか - ： Name_Not_Found [sage] 2018/11/06(火) 14:58:21.29ID:???
-
ブラウザの開発ツールで見てみるといいよ
制作者がCSS書かなくても
各要素にはブラウザがデフォで用意したスタイルが当たってる
a:linkはデフォでtext-decoration: underline;
だから下線がつく
ここでCSSにtext-decoration: none;を書くと
デフォのスタイルが上書きされて
下線がつかなくなる - ： Name_Not_Found [] 2018/11/06(火) 14:58:22.09:T3/sSPxo
- 【浜、マⅰトレーヤ】 ナマポ、ニート、ヒキコモリ ＜対＞ ユニクロ、自民党 【分ち合い抵抗勢力】
ttp://rosie.5ch.net/test/read.cgi/liveplus/1541471001/l50 - ： Name_Not_Found [] 2018/11/06(火) 18:54:53.93:9qlSO4j+
- ここで良いのか分からないのですが、ツイッターの埋め込みツイートのデザインはcssで編集出来ますか？
togetterでは普通の埋め込みとはデザインが違うので何かしら方法があると思っているのですが、検索しても全然わかりません
htmlとcssの基本くらいしか分からないので、難しいようであれば諦めます - ： Name_Not_Found [sage] 2018/11/06(火) 19:04:57.39ID:???
- OGP Twitterとかで検索してみればすぐできると思う
- ： Name_Not_Found [] 2018/11/06(火) 19:25:00.20:lodyECL3
- 大切な女性を傷つけられた
相手の男性をdisplay:noneする方法を教えてください
今彼女は入院しています - ： Name_Not_Found [] 2018/11/06(火) 19:54:18.66:Opl2e+DL
- よくわからなくなってきたんだが、beforeとafterの使い分けってどうしてる？
どっちでも同じことできるような気がするんだが。 - ： Name_Not_Found [sage] 2018/11/06(火) 19:59:51.44ID:???
- あそう
- ： Name_Not_Found [sage] 2018/11/06(火) 20:09:14.94ID:???
- 「大切な女性を傷つけられた相手の男性」って被害者じゃないですかね。CSSの前に日本語の勉強した方がいい。
- ： Name_Not_Found [sage] 2018/11/06(火) 22:51:06.23ID:???
-
ある男性と女性が付き合っていて、364がその女性に好意を抱いている
ある時、男性が女性を傷つけた(と364が思っている)←実はただの痴話喧嘩
364「相手の男性を消し去りたい」
つまり364はストーカー - ： Name_Not_Found [sage] 2018/11/06(火) 23:30:50.31ID:???
-
beforeはその要素のコンテンツの前に入る擬似要素
afterは後ろに入る擬似要素
って意外に違いはないよ
普通にHTML書くときに、何かの前や後ろに要素置くときと
同じ考えでいいよ - ： Name_Not_Found [] 2018/11/07(水) 00:11:05.72:L2hnebu7
-
ありがとうございます
これも知らない知識だったので勉強になりました！
特定のツイートを自分のサイトに埋め込んだ時のデザイン変更はやっぱり難しいですかね - ： Name_Not_Found [sage] 2018/11/07(水) 00:14:51.66ID:???
-
jsでやる方法ならあるよ - ： Name_Not_Found [sage] 2018/11/07(水) 00:33:33.63ID:???
-
重なり順は気にする - ： Name_Not_Found [] 2018/11/07(水) 00:56:06.96:L2hnebu7
-
JavaScriptですかー
それは未習得なので普通の埋め込みで妥協します
ありがとうございました - ： Name_Not_Found [sage] 2018/11/07(水) 11:05:55.62ID:???
- <h1>タイトル文字</h1>
というHTMLがあったとして、
CSSで「タイトル文字」をtext-indentやpaddingで要素外に出しoverflow:hiddenで非表示しつつ
badkgroundで背景画像を指定ってのをちょいちょいやるんですが
SEO的にはこの「タイトル文字」は無視されちゃうのかな？ - ： 374 [sage] 2018/11/07(水) 11:10:49.85ID:???
- SEO的には～無視って日本語がちょっと変でした
サーチエンジン的にはこのタイトル文字は無視されるのか、ですか - ： Name_Not_Found [sage] 2018/11/07(水) 12:45:44.18ID:???
- いいえ
- ： Name_Not_Found [] 2018/11/07(水) 12:46:31.94:SKekrxCb
-
なんでタイトル文字を隠すん？ - ： Name_Not_Found [sage] 2018/11/07(水) 13:21:18.87ID:???
-
そりゃ画像にするためでしょ - ： Name_Not_Found [sage] 2018/11/07(水) 13:39:24.96ID:???
- SEO会社にimgとalt使えって言われたことある
それも意味あるんかなぁ - ： Name_Not_Found [sage] 2018/11/07(水) 13:47:43.41ID:???
- 差があった時期もあった
- ： Name_Not_Found [sage] 2018/11/07(水) 13:56:39.45ID:???
-
imgのaltと違うんかね？ - ： Name_Not_Found [sage] 2018/11/07(水) 13:58:15.72ID:???
- タイトルを画像にすることなんかないなあ
ほとんどの場合、Webフォントをsubset化して＋cssで装飾してる - ： Name_Not_Found [sage] 2018/11/07(水) 14:10:44.10ID:???
-
フェレットでそんな記事読んだな。
ttp://https://ferret-plus.com/6036
ほとんどのホームページでは、H1タグは テキスト というよりもロゴ画像で囲んでいることのほうが多いのではないでしょうか。 - ： Name_Not_Found [sage] 2018/11/07(水) 15:42:34.88ID:???
- img src
って必ずＷｉｄｔｈ Ｈｅｉｇｈｔ 指定した方がいいのかな。
素材画像のサイズそのまま表示されたらいい時でも - ： Name_Not_Found [sage] 2018/11/07(水) 15:47:57.11ID:???
- 好きにしろ
- ： Name_Not_Found [sage] 2018/11/07(水) 16:09:26.55ID:???
-
気にしたことないな
SPサイトくらいか - ： Name_Not_Found [] 2018/11/07(水) 17:11:22.60:D6OVyDfn
-
大きさを明示すべき理由は
画像の読み込みが進むに連れて、ページのレイアウトがガコガコ動いてしまうから、というもの
なのでガコガコしないようにスタイルを書いてあればOK - ： Name_Not_Found [sage] 2018/11/07(水) 17:14:44.56ID:???
- 画像サイズ指定しないと読み込みのパフォーマンス落ちた気がするが、もうその情報は古いかね
- ： Name_Not_Found [sage] 2018/11/07(水) 17:35:39.45ID:???
- いやGoogleがAMPの要件に挙げてんだからパフォーマンスがらみだろ
- ： Name_Not_Found [] 2018/11/07(水) 18:52:26.46:SKekrxCb
-
ああそうか・・・ありがとう - ： Name_Not_Found [sage] 2018/11/07(水) 22:28:49.90ID:???
-
最近だとロゴのSVG画像じゃね？
altにテキスト入れときゃ問題ないけど - ： Name_Not_Found [sage] 2018/11/07(水) 22:50:32.82ID:???
-
書体限られるじゃんそれ - ： Name_Not_Found [sage] 2018/11/07(水) 23:07:02.54ID:???
-
ん？サイトロゴとかじゃなくタイトルでしょ？
「プライバシーポリシー」とか「会社概要」とかのページタイトル
そんな特殊なフォント使う？ - ： Name_Not_Found [sage] 2018/11/08(木) 10:36:26.66ID:???
- 結構あるかな、例えば
フォントにイラストが付いていて変形されてたり一部に色が付いてたり
背景テクスチャに乗算でフォントが乗ってるとか
エッジに紙のような処理が施されてたりスタンプのような加工がされてたり
縁取りが2重3重に付いてたりとまあいろいろ - ： Name_Not_Found [] 2018/11/08(木) 14:14:46.67:kX71hxJk
-
余談だけど
paddingで押し出すやり方は
Androidで、長押しするとテキスト出てきちゃう機種があるので注意を - ： Name_Not_Found [sage] 2018/11/08(木) 23:39:51.49ID:???
- text-indentでテキストすっとばすのってブラックハットと同じ手法じゃん
テキストを背景と同じ色にして隠し埋めするのと同じで
CSSや画像内の文字すら認識できるGoogleにはバレバレだろうけど、プラスにもマイナスにもならなそう - ： Name_Not_Found [sage] 2018/11/08(木) 23:42:38.96ID:???
- いや認識してもらう為にやってる訳だが
- ： Name_Not_Found [sage] 2018/11/09(金) 10:45:12.66ID:???
- 自分のやらないことは非常識
自分のやっていることが常識
という思い込みは愚者への第一歩である
哲学者エトゲル・ダーフィト - ： Name_Not_Found [sage] 2018/11/09(金) 12:46:50.12ID:???
-
スパム
ttp://https://support.google.com/webmasters/answer/66353?hl=ja
普通にimg要素でやりなさい
そもそも、前景と背景の使い分けがおかしいし - ： Name_Not_Found [] 2018/11/09(金) 12:50:49.12:ASEv2lmV
- まったく問題ねえけどなあ
単体の単語ではなく、文字と図がいくつもレイアウトされてしまってる画像とかだと
alt属性の文字列だけでは説明しきれないから
背景画像にして、その要素の中にHTMLで詳しく書く、とかよくやる
検索にもちゃんと引っかかるし、そのせいで検索スパム扱いされたこともねえな - ： Name_Not_Found [] 2018/11/09(金) 12:51:37.99:ASEv2lmV
- たぶんだけど
検索スパム判定は、そんなに単純じゃないんだと思う - ： Name_Not_Found [sage] 2018/11/09(金) 21:41:10.05ID:???
- 質問お願いします
親要素は背景の枠組み
その中の文章が違うため改行数が変わり
下に配置させたい画像？も位置が変わってしまいます
子要素に
position: absolute;
bottom: 0;
これで設定しようとしたのですが
その親要素を複数回使用してるため
position: relative;を使うと全ての配置がおかしくなってしまいます
この場合自分で改行を追加して行を合わせる
もしくは親要素を一つずつ変更していくしかないのでしょうか？ - ： Name_Not_Found [sage] 2018/11/09(金) 22:07:08.69ID:???
- 今日初めてこのスレにきたけど、
文章で書かれても全然わからんね - ： Name_Not_Found [sage] 2018/11/10(土) 00:53:33.92ID:???
- じっくり読めばわかるだろ
と、じっくりがんばって読んだけどまじでわからなくて草 - ： Name_Not_Found [sage] 2018/11/10(土) 01:30:53.28ID:???
-
つまり親要素と言ってるものが複数横並びになっていて、親要素同士の高さと画像の位置を全部一緒にしたい？ - ： 402 [sage] 2018/11/10(土) 01:38:17.00ID:???
- 説明が下手ですみません
classでサイズを指定した親要素の中に
文章と画像（スワイプ）を入れようとしてます
それと同じclassを何度も使い、違う内容の文章を書いてるのですが
文章量が違うため、画像の位置がバラバラになってしまいます
調べたところ
親要素に
position: relative;
子要素に
position: absolute;
bottom: 0;
で下に配置できるとのことでしたが
先ほどお伝えした通り同じclassを何度も使ってるので
position: relative;を使うと全て同じ位置に重なってしまい
配置がおかしくなってしまいます
この場合、かなり量はあるんですが一つ一つclassを変える
もしくは改行のタグを入れて合わせていくしかないでしょうか？ - ： Name_Not_Found [sage] 2018/11/10(土) 02:57:41.49ID:???
-
いや適切にクラス名与えてればそんなことにはならないはず
どっか閉じタグ忘れたりしてない？ - ： Name_Not_Found [sage] 2018/11/10(土) 05:54:00.53ID:???
-
クラスは何個も書いていいんだよ
今まで使ってた親要素のクラス名を「zaku」として
新たに「gelgoog」というクラスを用意して
.gelgoog{ position: relative; }
<div class=“zaku”>今までのやつ</div>
<div class=“zaku gelgoog”>あたらしいやつ</div>
ってすれば、後者にはザクとゲルググの両方のスタイルが適用されるので
今までのやつに影響することなく、やりたいことできるっしょ - ： Name_Not_Found [] 2018/11/10(土) 08:40:26.92:EHwUXFqT
- background: url('image.png');
background: url(image.png);
のどちらでも出来たのですが、クオーテーションマークは無しでも良いですか？ - ： Name_Not_Found [sage] 2018/11/10(土) 09:55:37.51ID:???
-
どっちでもいいよ
ちなみにダブルクォーテーションでもいい
ただし、ないとは思うけどURLにスペースが入る場合は必須
俺はなし派 - ： Name_Not_Found [sage] 2018/11/10(土) 10:04:40.87ID:???
-
relativeとabsoluteをつける要素を間違えてるんじゃない？ - ： Name_Not_Found [] 2018/11/10(土) 10:16:27.39:EHwUXFqT
-
ありがとうございました。 - ： Name_Not_Found [sage] 2018/11/10(土) 11:00:19.99ID:???
- せめてHTMLタグの階層ぐらいはかいてくれないとまだ意味がわからない
本当に解決したいなら質問内容を伝えるのに図ぐらいは描いてほしいところ - ： Name_Not_Found [sage] 2018/11/10(土) 11:11:30.80ID:???
- <container><img><文字></container>
<container>ちがう文章１</container>
<container>ちがう文章２</container>
みたいになってて（クラス名＝タグ名の略式だとおもってね）
container に relative を使うとちがう文章にも影響がでるからつかえない
っていいたいのかな？
そもそも役割のおなじものにちがうスタイルをあてたくなるってことがナンセンスだから
relativeをあてたいクラスにはちがう役割があるはずでちがう名前をつけるべきかと
<container><swipe><img><span>文字</span><swipe></container>
でswipeにrelativeをつけるとか
<container container-swipe><swipe><img><span>文字</span><swipe></container>
.container.container-swipe に限定してrekativeをつけるとか
CMSの自動出力なんかでHTMLをどうしても変更できないとかなら
.container:nth-child(1) とかで何番目のクラスにだけスタイルを適用とかもできる - ： Name_Not_Found [sage] 2018/11/10(土) 12:39:12.79ID:???
- 何度もすみません
水色で小さく枠どった背景の中に
青い線が文章、黄緑がスワイプ画像です
文章がそれぞれ違うので画像の高さがばらばらになります
画像は枠内の一番下に統一したいです
classはfloatがrightのものもあります
left rightともに何度も使ってます
- ： 415 [sage] 2018/11/10(土) 12:40:40.93ID:???
- <div class="left">
<p>
あああああああああああああ<br />
</p>
<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide"><img src="1.jpg"></div>
<div class="swiper-slide"><img src="2.jpg"></div>
</div>
<div class="swiper-pagination"></div>
<div class="swiper-button-prev"></div>
<div class="swiper-button-next"></div>
</div>
.left{
float: left;
width: 650px;
height: 600px;
margin: 50px auto 120px 180px;
padding: 30px;
border: 50px;
border-radius: 30px 30px 30px 30px;
background-color: #faf7e6;
} - ： Name_Not_Found [sage] 2018/11/10(土) 13:08:31.56ID:???
- 画像の高さが決まってるなら親要素に画像の高さ分のpadding-bottomを設定して画像をabsoluteで下付にする
もしくは
matchHeight.jsなど高さ揃えのプラグインをいれてテキストの高さを揃える
floatをやめてflex使えばいけそうだけどな - ： Name_Not_Found [sage] 2018/11/10(土) 13:45:01.99ID:???
- .left, .right {
position: relative;
}
.swiper-container {
position: fixed;
bottom: 0;
}
だけでいいような気が - ： Name_Not_Found [sage] 2018/11/10(土) 14:28:07.35ID:???
- それこそ absolute で重なっていいんだったら backgroud-image で済む話じゃないのん
文章と重なってほしくないなら
.left の中に文章エリアとスワイプエリアの２つがきっちりわけられてるし
.left {
display: flex;
flex-direction: column;
justify-content: space-between;
}
でいいと思う - ： Name_Not_Found [] 2018/11/10(土) 18:28:05.96:EHwUXFqT
- ulの中の数個のliに以下のようにafterを追加しました。
li::after{
content:"★";
position:absolute;
right:0;
bottom:0;
・・・
}
など指定。
こうすればliの後ろに★が出ると思ったのですが、実際は画面の最下部に出ました。
どうやらliではなくてbodyに対してrightやbottomの指定が効いているようなのです。
そう言う事ってありますか？ - ： Name_Not_Found [sage] 2018/11/10(土) 18:48:33.64ID:???
- absoluteが何を基準にしてるか調べて
- ： Name_Not_Found [] 2018/11/10(土) 18:52:08.00:EHwUXFqT
-
どうやって調べるんですか？ - ： Name_Not_Found [sage] 2018/11/10(土) 18:56:51.62ID:???
- すみませんWEB系に行こうと勉強してるんですが、教えてください
CSSの最初にhtml,body,p,h1...という感じでにタグを網羅してからmarginpadding:0やってるサイトをよく見かけるんですが、
全選択セレクタの *｛ﾏｰｼﾞﾝﾊﾟﾃﾞｨﾝｸﾞ0｝ の方を仕事としてWEB製作やってく上で使ったら駄目な理由とかってありますか？ - ： Name_Not_Found [sage] 2018/11/10(土) 19:03:20.42ID:???
-
right、bottomってどこを基準にして設定したいの？
で、それをあなたちゃんと指定している？してないからbodyが基準になってるんじゃないの - ： Name_Not_Found [] 2018/11/10(土) 19:07:44.57:EHwUXFqT
-
>right、bottomってどこを基準にして設定したいの？
liを基準にしたいです。
と言うか、liのafterでabsolute指定すると、それはliに対して指定した事になると思っていたのですが、
それは間違いですか？ - ： Name_Not_Found [sage] 2018/11/10(土) 19:15:13.38ID:???
-
日本語で - ： Name_Not_Found [sage] 2018/11/10(土) 19:23:10.14ID:???
-
liを基準にしたいって書くんだよ
あとはグーグルでabsoluteの挙動について調べればわかる - ： Name_Not_Found [sage] 2018/11/10(土) 19:46:18.99ID:???
-
リセットCSSってやつね
ブラウザの差異を吸収するために使うけど当然デメリットも有る
まあここら辺読んでみるといい
ttp://blog.3streamer.net/html-css-beginner/reset-css-1/ - ： Name_Not_Found [sage] 2018/11/10(土) 19:57:52.56ID:???
- absoluteは親をたどって最初にstatic以外の要素を基準にして位置が決定される
特定の親要素の中にabsoluteで配置したい場合はその親要素にrelativeを指定する
relativeをどこにもつけないとbodyを基準にした相対配置になる - ： Name_Not_Found [] 2018/11/10(土) 20:17:26.75:EHwUXFqT
-
そうなんですか！
それは知らなかったです。
ありがとうございました。 - ： Name_Not_Found [sage] 2018/11/10(土) 21:15:51.32ID:???
-
有難うございます
一回用意しとけばコピペで済む話なんで、可能なら*ではなくリセットかけるタグをそれぞれ書いた方が良い。ということですね
どっかからコピペして使うことにします - ： Name_Not_Found [sage] 2018/11/10(土) 21:18:24.22ID:???
- ぜんぜん違うけどまあいいや
実際に仕事で動作環境指定されてはじめて問題になることで最初に覚えることじゃないし好きにしていいよ - ： 415 [sage] 2018/11/10(土) 22:34:52.84ID:???
- 皆さんの知恵を拝借し、なんとかできました
助かりました
ありがとうございました - ： Name_Not_Found [sage] 2018/11/10(土) 23:24:30.97ID:???
- inputのボーダーをチカチカ点滅させたいんですがCSSで可能でしょうか？
出来ればルーレットのように点滅しながら回転させたいです。
ttp://https://www.youtube.com/watch?v=yVF-Dhz2oKE
こんなふうに。 - ： Name_Not_Found [sage] 2018/11/10(土) 23:27:37.51ID:???
- 可能だとは思うけどめんどうくさそう
- ： Name_Not_Found [sage] 2018/11/10(土) 23:28:45.91ID:???
- GIF用意して背景画像にするのが楽なんじゃないの
- ： Name_Not_Found [sage] 2018/11/11(日) 04:42:18.48ID:???
- cssのanimation keyframe使えば可能だと思う
- ： Name_Not_Found [sage] 2018/11/11(日) 14:38:00.68ID:???
- google fontsってローカルに保存してつかえますか？
- ： Name_Not_Found [sage] 2018/11/11(日) 17:24:57.92ID:???
- はい
- ： Name_Not_Found [sage] 2018/11/11(日) 21:48:32.82ID:???
- htmlとcssだけでニコニコのコメントみたいに横方向に流すことってできますか？
- ： Name_Not_Found [sage] 2018/11/11(日) 21:59:48.37ID:???
- はい
- ： Name_Not_Found [sage] 2018/11/11(日) 22:00:35.43ID:???
-
どうやるんですか - ： Name_Not_Found [sage] 2018/11/11(日) 22:15:37.02ID:???
- ttps://developer.mozilla.org/ja/docs/Web/CSS/CSS_Animations/Using_CSS_animations
文字列がブラウザーのウィンドウを横切る - ： Name_Not_Found [sage] 2018/11/11(日) 22:35:11.07ID:???
-
ありがとうございます
横に動くたびに文字が細かく動くのがちょっと気持ち悪いですね - ： Name_Not_Found [sage] 2018/11/12(月) 19:22:53.82ID:???
- 要素の高さが足りないと背景で指定している画像が
見切れてしまいますが、それを自動的に防ぐ方法ありますか？
<style>
.hoge{
background: url("ttps://www.google.co.jp/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png") no-repeat 0 0;
background-color: #ddd;
}
</style>
<div class="hoge">
ここのdivの高さを背景画像の高さに応じて自動的に変化するようにしたい
できればmin-heightのように最低値として
</div> - ： Name_Not_Found [sage] 2018/11/12(月) 19:36:54.95ID:???
- img要素にするのが一番簡単じゃないの
- ： Name_Not_Found [sage] 2018/11/12(月) 19:38:28.02ID:???
-
そうですよね...
img要素って縦横比も自動的に保つし
何気に素晴らしい - ： Name_Not_Found [sage] 2018/11/12(月) 19:55:53.37ID:???
- imgが素晴らしいってよりbgは用途が違うからなぁ
- ： Name_Not_Found [sage] 2018/11/12(月) 20:53:56.95ID:???
- 少なくとも背景画像サイズをCSSで認識する方法はないので background-image では無理
img を使うしかない - ： Name_Not_Found [sage] 2018/11/13(火) 13:19:41.72ID:???
- compassで幅・高さ測って
要素の縦横比を合わせる
ってことはちょくちょくする - ： Name_Not_Found [sage] 2018/11/13(火) 16:11:18.16ID:???
- >>210
こういう古いcssライブラリ見つけたぞ
ttp://http://benschwarz.github.io/gallery-css/
これにcss scroll snapくっつければいいんや！ - ： Name_Not_Found [] 2018/11/13(火) 19:47:48.50:qy0X8zKf
- javascriptで、要素の高さとかを合わせるようにしてるんだけど、描写後に変更するから画面が少しちらつく。
どうしたらええやろか…
Hiddenして、要素の高さ合わせた後にhidden解除したらいけると思ったけどダメだった… - ： Name_Not_Found [sage] 2018/11/13(火) 20:43:00.17ID:???
-
最近よくあるやつ
ページ遷移する度にloadingの画面になってアイコンを数秒見せてごまかすやつは？ - ： Name_Not_Found [sage] 2018/11/13(火) 21:27:58.87ID:???
-
loading画面の要件がないので使えない。
あくまで普通に開くことが必要…
まぁ俺が気になったから直したいだけなんだが… - ： Name_Not_Found [sage] 2018/11/14(水) 00:23:44.09ID:???
- wordファイルから効率良くきれいなhtml用のソースを作成する方法ないかな？
インラインスタイルが邪魔で削除したいが、変な所で改行されてたり微妙に正規表現で上手く消せない・・・ - ： 455 [sage] 2018/11/14(水) 00:25:41.74ID:???
- DreamweaverCCで画面切り替えると検索窓がいちいち消えるのなんとかならないのだろうか
入力しておいた文字が消えるし、常に表示しておきたい - ： Name_Not_Found [sage] 2018/11/14(水) 00:44:32.70ID:???
-
それよりマルチ画面対応を先にしろと - ： Name_Not_Found [] 2018/11/14(水) 02:00:23.18:PBwVpdkn
- ライブとコードの画面をマルチにできる様に？
あれ謎よね 一番最初に実装しなきゃならんでしょあんなの
DWあんまり使ってないから良いけど - ： Name_Not_Found [sage] 2018/11/14(水) 02:06:03.42ID:???
- ChromeでDevTool開けば似たようなもんだろ。
- ： Name_Not_Found [] 2018/11/14(水) 04:10:00.54:+5SfBosb
- Dreamweaver結構使ってるんやね
慣れなくて速攻使うのやめたわ… - ： Name_Not_Found [sage] 2018/11/14(水) 08:33:40.76ID:???
- あどべの技術力じゃ無理なのじゃ
- ： Name_Not_Found [sage] 2018/11/14(水) 08:46:12.43ID:???
- 逆にDW以外だとみんななに使ってるのか知りたい
JSPが編集できるとうれしいんだけど - ： Name_Not_Found [sage] 2018/11/14(水) 08:54:25.42ID:???
- vscode
- ： Name_Not_Found [sage] 2018/11/14(水) 10:04:14.85ID:???
-
ちがう
ファイルをマルチ画面(分割画面)でひらけるようにだ。
なんでわざわざ別ファイル開いてウィンドウ吸着解除して手でならべなかなゃならんのだ？
お前の関連ファイルタブは飾りか？っておもうわ
ライブとかどうでもいい。 - ： Name_Not_Found [sage] 2018/11/14(水) 10:16:24.48ID:???
- よくない
- ： Name_Not_Found [sage] 2018/11/14(水) 10:17:50.81ID:???
-
いいという話は聞くけど、DWから乗り換えろといったら反発されるんでは - ： Name_Not_Found [sage] 2018/11/14(水) 10:26:53.40ID:???
- エディタなんてなんでもよくてDwテンプレートの代わりに何使うかでしょ
- ： Name_Not_Found [sage] 2018/11/14(水) 11:06:34.69ID:???
- 画面の一部に blur 効果の窓をつけたいんだけど
背景画像が固定じゃないとつけられない？
すでに表示してるページの上にぼかし窓のせたいんだけど
ttps://hacknote.jp/archives/2470/
とかいくつかサイトみてると背景と同じ画像を設定するってあるので
普通のページ要素をぼかすのは無理なのかな - ： Name_Not_Found [sage] 2018/11/14(水) 12:49:56.16ID:???
-
まさにそれ - ： Name_Not_Found [sage] 2018/11/14(水) 13:07:57.10ID:???
-
blurは要素をぼかし窓にするものではなく設定した要素自体がぼける
blurした要素に背景がなければ下がくっきり見える
sectionにblurしたところでsectionの中身がぼけるだけ
くっきりした背景(body)の上にぼけた文字(section)が載ってる状態になる
section:beforeにしてもそいつに背景がないと意味をなさない
透明をぼけさせても透明だからね
なので下に見える背景画像と同じ背景画像を設定してそいつをぼけさせると一見ぼかし窓っぽく見えるという騙しテクニック - ： Name_Not_Found [sage] 2018/11/14(水) 18:51:03.65ID:???
- Brackets使ってるがDWよりマシとはいえもっさりしてるから乗り換え検討中
- ： Name_Not_Found [sage] 2018/11/14(水) 19:11:47.16ID:???
- さくさく動いて快適なのはsublimeだな
- ： Name_Not_Found [sage] 2018/11/14(水) 19:19:18.51ID:???
- atomモッサリなのにvscodeに次いで二番手、sublimeはサクサクなのになんで廃れたんだ？
- ： Name_Not_Found [sage] 2018/11/14(水) 19:58:42.92ID:???
- vscodeが軽くなって一択になったわ
他のエディタでできることだいたいできる
sublimeは軽いし見た目も良いエディタだけどライセンス催促とコード補完の弱さとサイドバーの使いづらさで捨てた - ： Name_Not_Found [sage] 2018/11/14(水) 21:26:08.02ID:???
-
となると固定画像以外の文字や動画含むドキュメント自体にblur窓をつけるのは無理なんですね
ありがとうございました - ： Name_Not_Found [sage] 2018/11/14(水) 21:30:57.55ID:???
- ライセンスは金払えばいいだろw
他は、まあおっしゃる通り
vscodeはどんどん良くなっていくな、手離せなくなってきた - ： Name_Not_Found [sage] 2018/11/14(水) 22:11:24.27ID:???
-
ttps://teratail.com/questions/114413 - ： Name_Not_Found [sage] 2018/11/14(水) 22:16:27.12ID:???
-
vscodeでsublimeのctrl+,に相当するのってなんかある？(タグ領域の選択的なやつ) - ： Name_Not_Found [sage] 2018/11/14(水) 22:20:24.60ID:???
- いい加減ツールスレいけよ
質問がない間はいいが質問流してまで雑談続けるバカは何なんだ - ： Name_Not_Found [sage] 2018/11/14(水) 22:25:24.81ID:???
-
そういうのは荒れるし自分も流してるじゃん俺もな。 - ： Name_Not_Found [sage] 2018/11/14(水) 23:13:37.99ID:???
- bpm って何か理解してないままコーディングしている
- ： Name_Not_Found [sage] 2018/11/15(木) 01:35:02.99ID:???
- beats per minute
- ： Name_Not_Found [sage] 2018/11/15(木) 08:01:32.04ID:???
-
Atom使ってる人多いね
。Sublimeは有料だからでは？ - ： Name_Not_Found [sage] 2018/11/15(木) 08:02:43.90ID:???
- サイズ指定はpxを極力さけたほうがいいよな
- ： Name_Not_Found [sage] 2018/11/15(木) 09:29:55.71ID:???
-
なんで？ - ： Name_Not_Found [sage] 2018/11/15(木) 09:47:58.64ID:???
-
レスポンシブにするには、相対的なサイズ指定がよろしくない？ - ： Name_Not_Found [sage] 2018/11/15(木) 11:03:51.56ID:???
- 誰かが作ったフォントサイズ関数使うと想像以上にフォントサイズが小さくなる
- ： Name_Not_Found [sage] 2018/11/15(木) 12:55:52.87ID:???
-
atomはgithub謹製なのがでかい
あとsublimeが軽いがまだ不安定だった頃だったし - ： Name_Not_Found [sage] 2018/11/15(木) 13:33:03.42ID:???
- リセットCSS は自作するもの？ ノーマライズとか無駄にでかいよな。
- ： Name_Not_Found [sage] 2018/11/15(木) 13:58:17.67ID:???
- じゃあ自作すればいいんじゃね
- ： Name_Not_Found [sage] 2018/11/15(木) 14:44:47.37ID:???
-
emmet:バランスアウトで出来た - ： Name_Not_Found [sage] 2018/11/15(木) 15:11:04.55ID:???
-
必要最低限だけリセットしてる - ： Name_Not_Found [sage] 2018/11/15(木) 16:04:07.45ID:???
- reboot.cssやnormalize.cssを削って作る。
- ： Name_Not_Found [] 2018/11/15(木) 17:17:03.68:5kh5dpTO
- テーブルの初歩的な質問ですがすみません。
下記で<tr>要素を縦並びにしたいのですが、横に繋がってしまいます指摘お願いします。
<table border="1" cellspacing="0" cellpadding="0"; id="dailytable">
<tbody>
<tr><td class="hour" rowspan="2"><br></td><td colspan="2" class="timetable">aaa</td>
<td rowspan="2" class="hour"><br></td>
</tr>
<tr><td class="station"><span class="station-name"><a href="#" target="_blank">a</a>
</span></td><td class="station"><span class="station-name"><a href="#" target="_blank">b</a></span></td>
</tr>
<!--一つ目の縦につなげたい要素--!>
<tr><td rowspan="12" class="hour">6</td><td rowspan="12" class="program">
<div class="time">06:00-07:00</div><div class="title"><a href="">a</a></div>
<div class="actress">a</div></td><td rowspan="12" class="program"><div class="time">06:00-07:00</div><div class="title">
<a href="">aa</a></div><div class="actress">a</div></td><td rowspan="12" class="hour">6</td>
</tr>
下記に続く↓ - ： Name_Not_Found [sage] 2018/11/15(木) 17:18:33.96ID:???
- 493の続き
<!--2つ目の縦に繋げたい要素--!>
<tr><td rowspan="12" class="hour">6</td>
<td rowspan="12" class="program"> <div class="time">06:00-07:00</div>
<div class="title"><a href="">a</a></div>
<div class="actress">a</div></td><td rowspan="12" class="program"><div class="time">06:00-07:00</div>
<div class="title"><a href="">aa</a></div><div class="actress">a</div></td><td rowspan="12" class="hour">6</td>
</tr>
</tbody>
</table>
宜しくお願いします。 - ： 494 [sage] 2018/11/15(木) 17:22:23.35ID:???
- 画像で見るとこのような感じです
ttps://i.imgur.com/Njb8qox.jpg
二つ目の<tr>要素を縦に繋げたいです
宜しくお願いします - ： Name_Not_Found [sage] 2018/11/15(木) 17:57:06.53ID:???
- DWの質問スレが無いんだがどこで聞いたらいい？
マルチカーソルで複数個所を同時に編集する際、
Cｔｒｌ＋pのようなタグで括るショートカットが効かないんだが、
複数個所を選択して一括でタグで括る方法ないかな（手で打たないで） - ： Name_Not_Found [sage] 2018/11/15(木) 19:25:45.14ID:???
- ここではないことは確か
- ： Name_Not_Found [sage] 2018/11/15(木) 23:54:08.32ID:???
-
最近はめっきりReboot.cssだな - ： Name_Not_Found [sage] 2018/11/16(金) 09:52:25.89ID:???
-
確かに謎だね
HTMLはあってるようにみえる
rowspan だけの行ってダメだったりするのかな…
ちなみにrowspan=12は何のためにつけてるの？
高さを指定したいならCSSにまかせてrowspanなしにすれば縦に並ぶけど - ： Name_Not_Found [sage] 2018/11/16(金) 11:49:18.69ID:???
- 俺もreboot.cssだな。だけどどれでもたいした違いはないだろう。
- ： Name_Not_Found [sage] 2018/11/16(金) 12:52:38.00ID:???
-
tdがすべてrowspan="12"なのでtr12行単位で横に並ぶ
表示が1行のうちは頭位置揃ってるけど２行以上になると階段状になるのでどういうことか理解しやすいかと
あと、tableのid前のセミコロンが余計
コメント閉じは --!> ではなく --> - ： Name_Not_Found [sage] 2018/11/17(土) 00:35:22.14ID:???
- VSCode などの構文解析できるエディタを使えば、
コメントになったかどうかは、色が変わるから、すぐわかる - ： Name_Not_Found [] 2018/11/17(土) 04:19:28.86:Cp+G4Otv
- すいません。
サイトにランダムで飛べるページを作ろうと思いまして、色々と質問していたところ
.entry-title-link
要素が無いから飛べないと言われました。そもそもこの.entry-title-link要素とは何なのでしょうか？ - ： Name_Not_Found [sage] 2018/11/17(土) 05:34:46.86ID:???
- 質問していたやつに聞け
- ： Name_Not_Found [sage] 2018/11/17(土) 07:52:10.27ID:???
- 「entry-title がありません」「entry-title css」「entry-title wordpress」で検索！
wordpress のスレで聞けば？ - ： Name_Not_Found [sage] 2018/11/17(土) 11:15:43.24ID:???
- background-imageで画像のサイズをmax-widthにしたい場合、どうしたらいいの？
- ： Name_Not_Found [sage] 2018/11/17(土) 12:03:29.18ID:???
- auto contain cover px % しか無理だね
- ： Name_Not_Found [sage] 2018/11/17(土) 12:06:03.24ID:???
- 背景を max-width したい場合ってのがよくわからん
背景はしょせん背景だからみきれようとどうでもいい
というよりどうでもいいものを背景にするべき
画像を画面内でみせたいなら img にするべき - ： Name_Not_Found [sage] 2018/11/17(土) 13:10:55.22ID:???
- 文字セット って10個ぐらいフォント並んでるのがあるが、あんなに必要か？
- ： Name_Not_Found [sage] 2018/11/17(土) 18:36:28.92ID:???
- デバイスフォント使い分けかな
- ： Name_Not_Found [sage] 2018/11/17(土) 20:01:10.99ID:???
-
べきw
実務やったことないなら口出すなよ - ： Name_Not_Found [sage] 2018/11/17(土) 20:38:12.90ID:???
-
自分がデザインしたわけじゃないんだがね。
わかりやすいのだとこういうのとか
ttps://hp-seed.jp/useful/img/pixta_30140996_M.jpg
100%だと実際のピクセルより引き伸ばされてボヤけるからダメ。
imgをz-indexで重ねるのはいいけど本来の用途と違う気がする（altとかどうすんねん） - ： Name_Not_Found [sage] 2018/11/17(土) 20:39:03.31ID:???
-
質問者の俺が言ったと思われたら嫌だから
穏便な口調でおねがします - ： Name_Not_Found [sage] 2018/11/17(土) 22:11:28.50ID:???
-
ぜんぜん関係ないけど、こういうレスって初めて見た気がする
匿名掲示板なんだから、これは自分じゃない、ってことはよくありそうだけどね
ただ、いくら何でも質問者がこんなレスはしないと思うよ - ： Name_Not_Found [sage] 2018/11/17(土) 22:12:19.61ID:???
- ID出ないスレだしな
- ： Name_Not_Found [sage] 2018/11/17(土) 22:16:36.18ID:???
- width:100% max-width:1200px
みたいな指定が多い - ： Name_Not_Found [] 2018/11/17(土) 22:57:11.05:V7h8h9GY
- Webフォントって使ってる？
自分のサイトで試しにGoogleフォントの日本語使って問題ないっぽいけど客のに使うのはちゅうちょする - ： Name_Not_Found [sage] 2018/11/17(土) 23:08:05.21ID:???
- 重たいもんなー
- ： Name_Not_Found [sage] 2018/11/17(土) 23:24:55.63ID:???
-
じゃあ答えてやれば？
実際無理なものは無理
それはCSSが不便なんじゃなくそうするべきではないからそういう機能がついてないだけ - ： Name_Not_Found [sage] 2018/11/17(土) 23:33:10.72ID:???
-
Notosansjapaneseを常用してる - ： Name_Not_Found [sage] 2018/11/17(土) 23:49:07.14ID:???
-
うちもNoto。
検証して見る限り、重いっても誤差かなと思うけど、みんな使ってるか気になった - ： Name_Not_Found [sage] 2018/11/17(土) 23:58:35.07ID:???
- 日本語Webフォントはサブセットで使ってる
そうすればくそ小さくなるから気にせず使える
あとはNoto Sansなら使ってるサイト多いからキャッシュ使われる確率高い - ： Name_Not_Found [sage] 2018/11/18(日) 08:12:59.77ID:???
- FontAwesomeなどのアイコンは使わないことにしている。あれは重いよね。
- ： Name_Not_Found [sage] 2018/11/18(日) 08:16:00.19ID:???
- 「Noto Sans Japanese」の不要なものは削除して必要なものだけ読み込む方法【Webフォント高速化】
ttp://https://haniwaman.com/noto-sans-japanese/ - ： 507 [sage] 2018/11/18(日) 09:51:52.82ID:???
-
そうするべきじゃないと言われても、実際の現場ではこういう対応が必要なデザインが上ってきてるわけでして、、
それとこの1例でも別に完全否定するようなデザインではないと思うんだが。（自分ならレスポンシブでこんなのしないけど）
ttps://hp-seed.jp/useful/img/pixta_30140996_M.jpg
とてもとてもありふれたものじゃん？
css3になる前だったらこれら文字とリボンそのまま画像にするのが一般的な対応だったわけだが
css3を駆使すればテキストと背景でなんとかできそうな気がして聞いてみたわけだが
まあ、無理という事でOKだね - ： Name_Not_Found [sage] 2018/11/18(日) 11:03:25.08ID:???
- だから img つかえって言ってんの
backgroud-image では無理なだけでデザインが無理とはいってない - ： Name_Not_Found [sage] 2018/11/18(日) 11:10:39.53ID:???
- == だったのかよ
- ： Name_Not_Found [sage] 2018/11/18(日) 11:19:46.48ID:???
-
このデザインだったら width height100% でいいじゃん
レスポンシブで大きさ変えたらどのみちぼやけるし
大きさを変えないで完全固定するか
ぼやけてもいいかどっちかしか選択肢なんてなくない？ - ： Name_Not_Found [sage] 2018/11/18(日) 11:24:39.07ID:???
-
話の流れがちゃんとわかってないけどこれが質問者なの？
というかこのデザインで max-width が必要になるってどういうこと？
ななめに表示するためにブロック自体に画像の上にのるように
max-width: 60%; margin-left:20% みたいにしたいってのはわかるけど
背景だけ max-width つけたら文字拡大したときに文字だけはみでることになるじゃん - ： Name_Not_Found [sage] 2018/11/18(日) 11:59:45.96ID:???
- サイズレスポンシブなデザインはプログラミングに近いセンスがいるからなー
4Kモニタk時代がきていつまでも幅1000pxとか1200pxとか固定するわけにもいかなくなってきたし - ： 507 [sage] 2018/11/18(日) 12:03:53.51ID:???
-
誰？?
↓これおかしくね？このデザインだとリボンはどうみても背景だよね？
> 背景はしょせん背景だからみきれようとどうでもいい
> というよりどうでもいいものを背景にするべき
は違うよ
いや、最大値は原寸までで、小さくなる分には小さくなるようにしたい。
つまりmax-width:100%
そうだよ。
>max-width: 60%; margin-left:20% みたいにしたいってのはわかるけど
↑違うし
文字拡大はこの際、対応しなくていいよもう。
最大値は原寸までで、小さくなる分には小さくなるようにしたい。 - ： Name_Not_Found [sage] 2018/11/18(日) 12:05:39.85ID:???
- アンカ間違えた
は違うよ
いや、最大値は原寸までで、小さくなる分には小さくなるようにしたい。
つまりmax-width:100% - ： Name_Not_Found [sage] 2018/11/18(日) 12:07:58.54ID:???
-
いうて1000より縮まないようにしとくだけで広がる分には問題ないように作るのはそんな大変じゃないかと
１年ほど前に400px幅の絶対配置で作られたサイトはみたことあるが…
よほど奇抜なデザインしてない限り画像解像度を高めにしておいて
font-size を vw 指定
margin padding や位置指定に px じゃなく rem と % 使う
改行位置に依存したデザインをさける
ぐらいだと思う - ： 507 [sage] 2018/11/18(日) 12:08:00.15ID:???
- もうカオスでややこしいから
この質問は終わりでいいや。
cssでできるやついるかどうかをしりたかっただけ。 - ： Name_Not_Found [sage] 2018/11/18(日) 12:09:54.72ID:???
-
それってデザイン画像があまり無いサイトの話だよね。 - ： Name_Not_Found [sage] 2018/11/18(日) 12:11:22.62ID:???
- >文字拡大はこの際、対応しなくていいよもう
だったらブロック自体に画像サイズと同じ max-width をつけておいて背景は contain なり 100% でいいじゃん - ： 507 [sage] 2018/11/18(日) 12:11:55.29ID:???
-
うんそれでいいと思うわ。 - ： 507 [sage] 2018/11/18(日) 12:14:27.77ID:???
- は優秀そうだな
そもそもの質問は違うんだが、
例の対応方法としては一番共感するわ。
と言う事で終了。 - ： Name_Not_Found [sage] 2018/11/18(日) 13:41:32.28ID:???
-
509=527=537 ぜんぶ同じだが？
>このデザインだとリボンはどうみても背景だよね？
それはデザイン者の意図次第
リボン全体を画面におさめたい＝リボンという形に意味がある＝背景ではない
背景であるなら形や全体図形にこだわるべきではない＝見切れても問題ない画像にすべき
単に文字にかさなってるから背景というわけじゃない
>最大値は原寸までで、小さくなる分には小さくなるようにしたい
これが意味がわからない
要件定義をきっちりしてないとなにをしたいのかわからない
文字と独立に背景だけ縮んだらはみだすわけじゃん
ふつうは body とかに min-width 設定して一定以上ちぢまないようにするものだけど
仮にそうしないで画面縮めたら文字だけ折り返すかはみでるかして
どのみちりぼんから文字の横か縦どちらかがはみでる - ： Name_Not_Found [sage] 2018/11/18(日) 13:46:01.99ID:???
-
そこそこ大手のウェブ制作会社だけどまだpixel指定だよ
サイズレスポンシブ？っていうの？
覚えないとやばいのかな… - ： Name_Not_Found [sage] 2018/11/18(日) 13:50:11.31ID:???
- うちもまだサイズフリーのレスポンシブでくんでくれって案件はきたことないな
ただいわれてみればモニタが４Kなのにいつまでも1000固定で作ってるわけには行かないよな - ： Name_Not_Found [sage] 2018/11/18(日) 13:55:39.28ID:???
- いつも小さいモニターの話しか出てこないけど、
いつか大きいモニターにも対応しなきゃならんくなるのか
そうすると画像はSVG一択なのかな - ： Name_Not_Found [sage] 2018/11/18(日) 14:21:47.79ID:???
- メディアクエリでスマホ版と２パターンデザインするだけじゃあかんのか？
それもただ複数カラム floatとflexをばらして無効にするぐらいしかやってないわ - ： Name_Not_Found [sage] 2018/11/18(日) 14:25:49.07ID:???
- 逆に言うとほとんどがモバイル対応しかやってない今
サイズフリーレスポンシブ４K対応を唄えば仕事取り放題だよ
ノウハウがたまるまではそれなりに技術が必要になるが - ： Name_Not_Found [] 2018/11/18(日) 14:56:28.65:G1HgllPO
- サイズレスポンシブだと
pixel指定もmax-widhtが必須になる感じか - ： Name_Not_Found [sage] 2018/11/18(日) 15:24:17.11ID:???
- まだそういう求人見たことないな
いまだにスマホ大丈夫ですか？って聞かれる
早くIE11を見放して欲しい - ： Name_Not_Found [sage] 2018/11/18(日) 15:30:31.71ID:???
- ttps://webtan.impress.co.jp/e/2018/04/04/28482
半年ほど前から大画面対応の話はちらほらきくけど
現場レベルだとなかなかすぐに対応かえるってのは難しいんじゃね - ： Name_Not_Found [sage] 2018/11/18(日) 15:55:09.55ID:???
- WindowsServer2016インストールしたら標準ブラウザがEdgeじゃなくてIE11だった
- ： Name_Not_Found [sage] 2018/11/18(日) 17:25:16.50ID:???
- 動画以外で4Kを使う場面が思い浮かばなかった
- ： Name_Not_Found [sage] 2018/11/18(日) 17:41:40.29ID:???
- つーか検証できる環境が無いな
- ： Name_Not_Found [sage] 2018/11/18(日) 17:46:21.46ID:???
- 今時、4Kモニターでネット見る人なんて
ゲーマーかこだわりエンジニアかオタクしかいないからなぁ
一般人は8割スマホとタブレット
PCあっても学生は液晶がクソな低価格のノートPCかアップル製品
ご家庭だと10年前のノートとかザラだし - ： Name_Not_Found [sage] 2018/11/18(日) 17:55:58.35ID:???
- つまりIE8に対応するようなものか
- ： Name_Not_Found [sage] 2018/11/18(日) 18:50:11.20ID:???
- もう３～４万から買えるし次買うなら４Kって人は多いと思うけどな
- ： Name_Not_Found [sage] 2018/11/18(日) 18:58:40.28ID:???
- 数年後考えるとね
- ： Name_Not_Found [sage] 2018/11/18(日) 20:14:58.79ID:???
- 一般人が数年後にディスプレイ買うかな…
- ： Name_Not_Found [sage] 2018/11/18(日) 20:37:48.55ID:???
-
サイトによるじゃん - ： Name_Not_Found [sage] 2018/11/18(日) 21:02:44.29ID:???
- 4Kって解像度だよね？
ならば px 単位のリアルな大きさは変化しないことになるので
特に対応する必要はないんじゃないのか？ - ： Name_Not_Found [sage] 2018/11/18(日) 21:21:03.87ID:???
- 昔からべき論者は自分で知らない出来ないことをべきべき言って批判しかしてこないからな
- ： Name_Not_Found [sage] 2018/11/18(日) 23:15:57.07ID:???
- 文字列に下線を引いて、その下に注釈文字列を書き込む方法を教えて下さい
例えば、
あいうえお
--------
いろは
みたいな感じにしたいです。
よろしくお願いします。 - ： Name_Not_Found [sage] 2018/11/18(日) 23:16:28.90ID:???
- いろは のインデントがズレましたがやりたい事はわかると思います。
- ： Name_Not_Found [sage] 2018/11/19(月) 00:55:20.57ID:???
- <style>
.notice {
display: inline-block;
border-bottom: solid 1px black;text-decoration: position: relative;
}
.notice-text {
font-size: 80%;
position: absolute;
display: block;
}
</style>
かきくけこ<span class="notice">あいうえお<span class="notice-text">いろは</span></span>さしすせそ
とか？
<span class="notice" title="いろは">あいうえお</span>
みたいなこともできるけど - ： Name_Not_Found [sage] 2018/11/19(月) 01:16:16.66ID:???
-
ありがとうございます。
ところで、｢いろは｣を"下に配置する"という明示的命令はないのに、positionという言葉だけでなぜ｢いろは｣が下に配置されるんでしょうか？
それと、
｢text-decoration: position: relative;｣という"3連"の表記は初めて見たのでどう理解すればいいのか分からないのですが、
解説しているサイトを教えて頂ければと思います。 - ： Name_Not_Found [sage] 2018/11/19(月) 01:18:37.50ID:???
- 書き間違いだな
- ： Name_Not_Found [sage] 2018/11/19(月) 01:20:44.64ID:???
- したり顔
- ： Name_Not_Found [sage] 2018/11/19(月) 01:32:31.36ID:???
-
問題がありました
その仕方だと
かきくけこ<span class="notice">あいうえお<span class="notice-text">いろは</span></span>さしすせそ<br />
ああああああああああああああああああああああああ
とすると、｢いろは｣と｢ああああ…｣が重なってしまいます - ： Name_Not_Found [sage] 2018/11/19(月) 01:34:09.14ID:???
- text-decoration:
については無くてもよいと言う事で理解しました。 - ： Name_Not_Found [sage] 2018/11/19(月) 07:38:42.61ID:???
- 疑似クラスみたいな感じで特定の文字色や背景色の要素だけを指定する方法ってありますか？
- ： Name_Not_Found [sage] 2018/11/19(月) 09:31:33.44ID:???
- 行頭文字なら指定できるけどそれ以外はjavascriptじゃないと無理じゃないかな
特定の文字にタグをつければできるから
内容が固定なんだったらエディタの replace とかつかえばタグにするのは簡単だけど - ： Name_Not_Found [sage] 2018/11/19(月) 09:33:56.79ID:???
-
line-height あければいいんじゃないの？
というか要件定義をきっちりしてほしい
注釈がはいった場合だけ行間をあけたいのか
常に注釈が入るスペーををあけておくのか - ： Name_Not_Found [sage] 2018/11/19(月) 10:00:08.45ID:???
- スペー
- ： Name_Not_Found [sage] 2018/11/19(月) 10:17:16.04ID:???
- ド
- ： Name_Not_Found [sage] 2018/11/19(月) 10:38:23.99ID:???
-
特定の文字色や背景色があるってことは
そこに何かしらの要素があるってことじゃろ？ - ： Name_Not_Found [sage] 2018/11/19(月) 11:19:49.38ID:???
-
ttp://http://www.jquerystudy.info/reference/selectors/equals.html
これを参考にcolor=〇〇で指定してるけど何故かうまく行かない…… - ： Name_Not_Found [] 2018/11/19(月) 11:52:54.10:tqrnCjgk
- こういうのってどんくらい気をつけてる？
ttps://sole-color-blog.com/blog/31/
ぶっちゃけ同じ値にしてもズレまくるから、見た目重視にやってるんだが、こだわる人がいて面倒。 - ： Name_Not_Found [sage] 2018/11/19(月) 12:26:32.63ID:???
-
なんか不毛だな…
最初からブラウザでデザインするような拡張機能ねーかな… - ： Name_Not_Found [sage] 2018/11/19(月) 12:40:44.04ID:???
-
>同じ値にしてもズレまくるから、見た目重視にやってる
↑全く持ってその通り。
数値が当てにならない。結局見ながら何度も修正するハメになる - ： Name_Not_Found [sage] 2018/11/19(月) 13:05:15.13ID:???
- line-heightの挙動に理解がないデザイナーはわりといる
- ： Name_Not_Found [sage] 2018/11/19(月) 13:05:36.64ID:???
- ただのバカだろ
- ： Name_Not_Found [sage] 2018/11/19(月) 15:46:55.13ID:???
- HTMLの出力として、各行に行番号を表示させる方法について説明しているサイトを教えて下さい。
ググっても殆どは｢HTMLソース編集中に｣行番号を表示させる事ばかりが載っているので、私の望みではないです。
細部の仕様については使いながら考えていきたいと思っています。 - ： Name_Not_Found [] 2018/11/19(月) 16:08:06.11:cvABDKO5
-
code-prettifyとかsyntax-highlighterとか
そのへんの話かな？ - ： Name_Not_Found [] 2018/11/19(月) 16:11:04.39:cvABDKO5
-
最近はnoto使うことが多いから
デザインカンプ通りの数値でほぼ大丈夫だな
トラッキング→letter-spacingの変換はsassのmixinでやってる - ： Name_Not_Found [sage] 2018/11/19(月) 16:19:16.30ID:???
-
行番号の表示スタイルとしてはそれなんですが、それも結局はソースコードを読者に見せるための行番号表示であって、
私の望むところとしては、普通の文章に行番号をつけて読者に見せたいんです - ： Name_Not_Found [sage] 2018/11/19(月) 16:29:27.85ID:???
-
普通の文章だと横幅によって行番号は変わる。
文章の中で○行を参照してくださいとか
書かないと約束できるか？ - ： Name_Not_Found [sage] 2018/11/19(月) 16:37:40.12ID:???
-
取りあえず使えるサイト教えて下さい - ： Name_Not_Found [sage] 2018/11/19(月) 16:42:11.66ID:???
- prism.js というものがソースコードをプログラマー読者向けに書けるようにしてくれるみたいですが、
これが｢結果として出てくる普通のHTML文章｣に適応できたらいいんですがね - ： Name_Not_Found [sage] 2018/11/19(月) 17:07:57.00ID:???
-
こういうのが嫌なら自分で作るしかねえんじゃね？
需要ねえし
そのブロックのline-heightに合わせて
左に行番号をじゃーっと羅列すりゃあいい
やり方はJSスレで聞いておくれ - ： Name_Not_Found [sage] 2018/11/19(月) 17:56:14.71ID:???
- ttp://http://shanabrian.com/web/javascript/element-get-number-of-lines.php
- ： Name_Not_Found [sage] 2018/11/19(月) 18:07:10.79ID:???
-
そんなことを書くバカはいちいち相手にしない
社内でまともに相手にしようとしてるヤツがいたらやめろと言うレベル
んなもんまともに対応するのが当然と思われたらかなわんわ - ： Name_Not_Found [sage] 2018/11/19(月) 18:27:52.30ID:???
-
これ、正確に数えられるんか？
ざっとしか見てないけど、1emの幅を測ってボックスの高さ超えるまで足してるみたいだけど - ： Name_Not_Found [sage] 2018/11/19(月) 18:29:29.10ID:???
- うーーん、やっぱお前ら程度の頭には入門書を越える内容となると途端に何の有益な回答も得られないか…
せいぜい<div>,<span>,float,margin,paddingレベルの｢初級ワード｣を駆使して入門者に教えた気分に浸っとけｗｗｗ - ： Name_Not_Found [sage] 2018/11/19(月) 18:30:28.77ID:???
- そうだねじゃあこの件は閉めよう次の方～
- ： Name_Not_Found [sage] 2018/11/19(月) 19:05:25.85ID:???
- Bulmaってフレームワーク使ってみたい
HTMLもJSも知識なくても頑張って勉強したら使えるかな - ： Name_Not_Found [sage] 2018/11/19(月) 19:13:07.73ID:???
-
いいえ - ： Name_Not_Found [sage] 2018/11/19(月) 19:13:24.92ID:???
- <div style="display:none">
はインラインといいますが、
以下2つの呼び方ってありますか？
<link rel="stylesheet" type="text/css" href="foo.css" media="all">
<style type="text/css">
div {
display:none;
}
</style> - ： Name_Not_Found [sage] 2018/11/19(月) 19:33:34.46ID:???
- あってません
- ： Name_Not_Found [sage] 2018/11/19(月) 19:36:38.51ID:???
- あるかないかを聞いています。
あってるかあってないかではありません。 - ： Name_Not_Found [sage] 2018/11/19(月) 19:40:16.10ID:???
- いいえ、あるきません
- ： Name_Not_Found [] 2018/11/19(月) 19:44:33.07:aX6xe0rD
-
ID出し忘れました、すいません
への回答、よろしくお願いします - ： Name_Not_Found [sage] 2018/11/19(月) 20:09:23.66ID:???
-
internal
external - ： Name_Not_Found [sage] 2018/11/19(月) 20:09:52.29ID:???
-
ありがとうございました！ - ： Name_Not_Found [sage] 2018/11/19(月) 21:26:20.78ID:???
-
一般的には外部css、内部cssって呼ぶ - ： Name_Not_Found [sage] 2018/11/19(月) 21:43:25.06ID:???
-
レスポンシブどうすんの。 - ： Name_Not_Found [sage] 2018/11/19(月) 21:50:57.68ID:???
- ボックス内のテキストに1文字ずつ<span>をつける
↓
ひとつずつoffsetTopを見ていって、数値が変わったら行が変わった位置になる
↓
行番号の要素を追加
↓
window.onresizeで上記をもう一度
これでどうだろう？ - ： Name_Not_Found [sage] 2018/11/19(月) 21:58:30.62ID:???
- 重くなりそうだな
そんな押し付けがましくやることなのか - ： Name_Not_Found [sage] 2018/11/19(月) 23:48:44.40ID:???
- 質問させてください
HTMLのdialogタグでモーダルウィンドウを表示したところ、ウィンドウが画面の左に寄せて表示されてしまいました
特にそういった設定はしておらず、調べてもどうもデフォルトで真ん中になっているようで良い情報がなかったのですが、どこか怪しいところとか、確認すべき箇所ってありますか？
ブラウザはChromeです - ： Name_Not_Found [sage] 2018/11/19(月) 23:57:28.26ID:???
-
dialog {
display: block;
margin: 0 auto;
}
多分親要素がtext-align:leftか何かを設定している - ： Name_Not_Found [sage] 2018/11/20(火) 00:04:11.28ID:???
-
俺ならwrapperと左に兄弟要素作って
見出しに使い、親要素のheight＝元のボックスのheightってのをやってみるかな
なんにしろめんどくさいけど - ： Name_Not_Found [sage] 2018/11/20(火) 00:06:30.38ID:???
-
ありがとうございます
後で試してみます
新しいタグは当たり前ですが情報少ないですね…かなり便利そうなので普及してほしい - ： Name_Not_Found [sage] 2018/11/20(火) 00:17:23.86ID:???
- フロントは専門外なので勉強のためにここを
のぞいてるんだけど、そんなタグがあるなんて
初めて知った
へー。 - ： Name_Not_Found [sage] 2018/11/20(火) 01:35:03.92ID:???
-
display: blockを指定するとダイアログの下の表示がずれてしまいましたが、
margin: 0 autoだけでもきちんと中央に表示されたので解決しました
早い回答ありがとうございました - ： Name_Not_Found [sage] 2018/11/20(火) 09:21:20.19ID:???
- margin: autoはblockにしか効かないんじゃなかったか・・・？
- ： Name_Not_Found [sage] 2018/11/20(火) 12:26:23.62ID:???
- レスポンシブで、スマホの時はヘッダ（ナビ）とフッタ固定にしてるんだけど
背景を画面全体で一枚置いてるだけなので、スクロールすると文字が被っちゃう
固定部分に重なった文字だけ色を背景画像に近づける、もしくはコンテンツだけを固定部分に重ならないようにスクロールできるようにすることは可能ですか？
できればCSSとタグだけで実装できるなら嬉しい…
手打ちだけで使えるならJavaScriptもがんばってみま
- ： Name_Not_Found [sage] 2018/11/20(火) 12:36:39.60ID:???
-
中心部分にpaddingを付けて、paddingの上にヘッダ・フッタを乗せるようにする
中心の部分にpadding漬けにくかったら、body要素にでもpadding付けて後はヘッダ・フッタのtopなどで調節すればok
cssだけで行ける - ： Name_Not_Found [sage] 2018/11/20(火) 13:43:17.87ID:???
-
あざっす！
やってみます - ： Name_Not_Found [sage] 2018/11/20(火) 14:47:13.63ID:???
- paddingの浅漬け
- ： Name_Not_Found [sage] 2018/11/20(火) 14:55:02.44ID:???
- marginの糠漬け
- ： Name_Not_Found [sage] 2018/11/20(火) 17:18:27.97ID:???
- ちょっとしたモーダルウィンドウを画面中央にするのってcssだけじゃ無理なのかなあ
cssだけでてきたら素敵なんだけどなあ - ： Name_Not_Found [sage] 2018/11/20(火) 17:26:48.69ID:???
- checkedで表示切り替え
display:block
position:fixed
flex（ほか何でもいいけど）で中央揃え
本気出せばこの辺で行ける - ： Name_Not_Found [sage] 2018/11/20(火) 17:49:06.79ID:???
- ちょっとしたモーダルなら
margin上下左右ゼロではダメかね？ - ： Name_Not_Found [sage] 2018/11/20(火) 17:53:06.86ID:???
- モーダル、あなた突かれているのよ
- ： Name_Not_Found [sage] 2018/11/20(火) 18:45:27.01ID:???
- flexとかmarginだと親要素の中央じゃない？
画面(ウィンドウ)より縦長のページで画面中央にしたい
bodyのheightがウィンドウの高さより高いからbodyの中央にしても画面外に行くんだよね - ： Name_Not_Found [sage] 2018/11/20(火) 19:10:36.13ID:???
- calc使えばよくね
- ： Name_Not_Found [] 2018/11/20(火) 19:12:58.66:dd1HvjpL
- fixedじゃいかんの？
- ： Name_Not_Found [sage] 2018/11/20(火) 19:30:04.55ID:???
- サイズ決まってるならcalc
決まってないなら
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
とか - ： Name_Not_Found [sage] 2018/11/20(火) 19:33:44.23ID:???
- 画面全体を覆う要素を用意してモーダルを包み、flexとalign-items:centerとか
汎用性低い？ - ： Name_Not_Found [sage] 2018/11/20(火) 21:14:19.36ID:???
- エスパーにそこそこ自信あったが
の意味がわからなかった
何がどこの何と被るのか、主語が無いのはこういう奴のあるあるパターンなんだが、
今回はだめだたわ - ： Name_Not_Found [sage] 2018/11/21(水) 02:11:01.29ID:???
-
calcでどう位置をだせばいいの？
それだと画面の外に出るね
例えば1920x1080のモニタで高さ2000pxのページの一番上を表示してる時にそれすると画面の下の方に見切れるよね
画面全体を覆う要素というのが用意できないかと…
画面の高さと表示してる位置が取れないからなんかもやもやする… - ： Name_Not_Found [sage] 2018/11/21(水) 02:49:00.03ID:???
- モーダルウィンドウをなにでどう表示したときの話をしてるんだ？
625のやり方ではみ出るってのがよくわからなう - ： Name_Not_Found [sage] 2018/11/21(水) 09:19:10.00ID:???
-
109vw * 100vhの要素にflexで入れればいけるんじゃ - ： Name_Not_Found [sage] 2018/11/21(水) 09:21:06.83ID:???
- 親要素より子要素の高さがあるときalign-itemsの挙動ってどうなるっけ
- ： Name_Not_Found [sage] 2018/11/21(水) 10:10:19.38ID:???
-
画面中央であってページ全体の中央じゃないでしょ？
だったら100vw100vhのdivをfix,flexの縦横centerにして中にdivおけばいけるでしょ - ： Name_Not_Found [sage] 2018/11/21(水) 13:06:53.41ID:???
-
俺もこれだわ - ： Name_Not_Found [sage] 2018/11/21(水) 13:28:19.58ID:???
-
作ったよ
pushって要素をクリックすればウィンドウっぽいものが出るようになっている
ttp://http://jsfiddle.net/cLty4hpg/2/ - ： Name_Not_Found [sage] 2018/11/21(水) 20:01:01.82ID:???
-
z-indexのことかと思ったけど614を読んでもよくわからなかった - ： Name_Not_Found [sage] 2018/11/21(水) 23:36:10.06ID:???
-
以前、cssのdisplayプロパティには表示/非表示を切り替える役割（jQueryでいう.show()/.hide()）と
インライン/ブロックなどのレイアウトを切り替える役割の2種類があって
表示/非表示を汎用クラスで使用する場合、無理があるって言ったら
このスレで意味不明とか言ってスゲーバカにされたわ。
言いたかったのはあなたのような使い方で、表示/非表示をここではflexを使用しているが
汎用クラスにする場合、出来ないっつー事だったんだがな
バカにされた意味が未だにわからん。 - ： Name_Not_Found [sage] 2018/11/21(水) 23:54:54.90ID:???
-
どっちがどっちの言い分かわかんない文 - ： Name_Not_Found [sage] 2018/11/21(水) 23:57:24.94ID:???
- > 以前、cssのdisplayプロパティには表示/非表示を切り替える役割（jQueryでいう.show()/.hide()）と
> インライン/ブロックなどのレイアウトを切り替える役割の2種類があって
・インラインで表示
・ブロックで表示
・表示しない（インラインでもブロックでもない）
の1種類しか役割はない
「表示しない」もレイアウトの一つ
> 表示/非表示を汎用クラスで使用する場合、無理があるって言ったら
> このスレで意味不明とか言ってスゲーバカにされたわ。
何が言いたいのかわからん。意味不明と言われても当然だろう
> 言いたかったのはあなたのような使い方で、表示/非表示をここではflexを使用しているが
> 汎用クラスにする場合、出来ないっつー事だったんだがな
何が出来ないのかさっぱりわからない。日本語がおかしい - ： Name_Not_Found [sage] 2018/11/21(水) 23:58:02.65ID:???
-
が正しいと思うよ。
表示非表示に関しては、そもそもがcssの欠陥だと思う
class="show block"や、class="show flex"みたいにするか。めちゃくちゃかっこ悪いけど
汎用classにするならwrapperをdisplay:inlineにすると影響が少ないのかな
そもそも論を言うとここはやはりjQueryに任せるべきか - ： Name_Not_Found [sage] 2018/11/22(木) 00:02:37.99ID:???
- > class="show block"や、class="show flex"みたいにするか。めちゃくちゃかっこ悪いけど
意味不明。show blockがあるってことは、その反対
「ブロックで表示しない」や「flexで表示しない」があるってことか？
それは一体どういう意味だ？
表示しないのであれば、そこになにもないで当然だろう
そこにもの（ブロック等）があるが見えないだけっていうのならvisibilityがある
displayは物自体がなくなるのだから、それはブロックでもflexでもない - ： Name_Not_Found [sage] 2018/11/22(木) 00:10:13.65ID:???
- > 言いたかったのはあなたのような使い方で、表示/非表示をここではflexを使用しているが
> 汎用クラスにする場合、出来ないっつー事だったんだがな
.onっていう汎用クラス使ってるじゃん - ： Name_Not_Found [sage] 2018/11/22(木) 00:12:06.71ID:???
- visibilityは使い勝手悪くない？
何かバグも合ったはずだけど忘れた - ： Name_Not_Found [sage] 2018/11/22(木) 00:15:17.76ID:???
- 使い勝手？
visibilityを使ってこんな裏技考えてみましたとかやる気か？
そこに物はあるが見えなくしたいってときに使うだけだろ - ： Name_Not_Found [sage] 2018/11/22(木) 00:48:27.89ID:???
-
なんで汎用クラスにしたら全部が全部汎用クラスでの運用になるん？ - ： Name_Not_Found [sage] 2018/11/22(木) 07:40:03.20ID:???
-
>そもそもがcssの欠陥
その欠陥は認知されていて、過去に box-suppress とかいう表示切り替え専用のプロパティが提案されたこともあった
なので現状では、元のスタイルを display:none で上書きする専用のclass（その class を外せば flex や giid など何であれ、元のdisplayに復帰する）か、hidden属性で対処するしかない（それで十分とも言えるので box-suppressはお蔵入りになったのかもしれん） - ： Name_Not_Found [sage] 2018/11/22(木) 08:45:10.41ID:???
-
ありがとう！
歴史に詳しい人がいるとうまくまとまるね - ： Name_Not_Found [sage] 2018/11/22(木) 10:07:56.05ID:???
-
提案されて却下ってことは、みんなが欠点に気づいていないってことじゃなくて、
それは欠点ではないと結論が出たってことなんだよ - ： Name_Not_Found [sage] 2018/11/22(木) 10:09:19.98ID:???
-
> なので現状では、元のスタイルを display:none で上書きする専用のclass（その class を外せば flex や giid など何であれ、元のdisplayに復帰する）か、hidden属性で対処するしかない
対処するしか無いんじゃなくて、そのやり方がCSSの正しいやり方ってことだよ
他の属性だってみんなそのやり方なんだから - ： Name_Not_Found [sage] 2018/11/22(木) 12:18:18.11ID:???
- 1つだけわかった
たぶん、意味不明とか反論している人は、使用場面に遭遇した事ないんだわ
以前に動的サイトをロクに作った事無い奴に、その手法は動的では使えないよって
言っても最初全く通じなかったのと同じだわ
わかる人だけは何人か反応してるからもういいわ - ： Name_Not_Found [sage] 2018/11/22(木) 12:46:29.60ID:???
- 汎用クラス .on があったとして
表示させるためのプロパティがdisplay:blockだったとすると
flexでレイアウトしていた要素は非表示から表示時にflex状態で復帰できないとか
display:noneで非表示してしまうと再表示時に再度コンテンツの読み込み直しになるとか
そういうところが不便ってことじゃなくて？ - ： Name_Not_Found [sage] 2018/11/22(木) 13:17:31.14ID:???
- やっぱおまえら
unsetは使わんの？IEで使えないから - ： Name_Not_Found [sage] 2018/11/22(木) 13:23:55.74ID:???
-
使えんかったのか
普通に使ってたわ - ： Name_Not_Found [sage] 2018/11/22(木) 14:34:44.15ID:???
-
使用場面に遭遇したことがあるというのなら、
その使用場面を言えば？
それが出来ないから意味不明って指摘に反論できないんだろ。
自分が悪いのに他人のせいにするな - ： Name_Not_Found [sage] 2018/11/22(木) 16:41:08.86ID:???
-
ホームラン級に日本語下手 - ： Name_Not_Found [sage] 2018/11/22(木) 17:08:31.57ID:???
-
ずっと前から欲しかった機能だわこれ
存在を知らなかった - ： Name_Not_Found [sage] 2018/11/22(木) 19:01:13.13ID:???
-
そういう事。だからラッパーに頼るしかなくなる
IEでバグるから回避して以来、ずっと忘れてた・・・
今って問題なく使えるの？ - ： Name_Not_Found [sage] 2018/11/22(木) 19:11:09.25ID:???
- IEは今でも駄目だと思う＞unset
- ： Name_Not_Found [sage] 2018/11/22(木) 19:16:42.27ID:???
- > そういう事。だからラッパーに頼るしかなくなる
えぇ？それが理由ならお前の勘違いってことじゃん
ラッパーなんかいらないし
<div class="dialog on">ダイアログ</div>
.dialog { display: none; }
.dialog.on { display: block; }
クラス名は階層にしなくても繋げられるんですよ？ - ： Name_Not_Found [sage] 2018/11/22(木) 19:38:45.75ID:???
-
.dialog.on { display: block; }
これがblockかflexかinlineかわからないよねって話してるの - ： Name_Not_Found [sage] 2018/11/22(木) 19:39:40.74ID:???
- .red { color: red } と書いたらだめな理由知ってる？
クラス名 = 見た目 になってるからだめ
クラス名で一律に見た目が決定されたらだめなんだよ
同じ理由で .on { display: block } というのもだめ
.on というのは見た目ではなくて状態を表す言葉。
.on という状態でどういう見た目になるかは
そのコンポーネント次第 - ： Name_Not_Found [sage] 2018/11/22(木) 19:42:20.22ID:???
-
display: blockって書いてあるんだからblockじゃん？
flexならdisplay: flex、inlineならdisplay: inline って書くんだよ
CSSの勉強をしよう！ - ： Name_Not_Found [sage] 2018/11/22(木) 19:54:56.96ID:???
- 未だに全て物のはインライン要素かブロック要素のどちらかに分類されるって
思ってるのかな？
HTML5でそういう分類は廃止されたんだが
ttp://https://developer.mozilla.org/ja/docs/Web/HTML/Block-level_elements - ： Name_Not_Found [sage] 2018/11/22(木) 19:56:04.27ID:???
-
それがonという汎用classで使いまわせないって話 - ： Name_Not_Found [sage] 2018/11/22(木) 19:59:38.02ID:???
- onでまわせないならoffでまわせばいいじゃない
- ： Name_Not_Found [sage] 2018/11/22(木) 19:59:38.28ID:???
-
やっぱアカンか、ありがとう
IEいつまで独自仕様なんだろう - ： Name_Not_Found [sage] 2018/11/22(木) 20:00:17.96ID:???
-
> それがonという汎用classで使いまわせないって話
あー、やっぱりだｗ 良くない使い方をしている
汎用classで使いまわしたらだめ
だ・め
理由はにも書いたとおり
長くやってる人ならわかってると思うんだけど、
クラス名の使い方には二通りある
一つはコンポーネントを表すクラス名
もう一つは状態を表すクラス名
状態を表すクラス名は、見た目と紐づけてはいけない
つまり.onという汎用classで使い回すなんてことはやってはいけない。
ある状態でどういう見た目になるかはコンポーネント次第。
だから、.dialog.on { 見た目 } にコンポーネントと紐づけて使う
.on { 見た目 } のような使い方をしてはいけない - ： Name_Not_Found [sage] 2018/11/22(木) 20:00:22.45ID:???
-
そう、offは出来る
display:none !important
で必ず非表示になるからそれは問題ないんだ - ： Name_Not_Found [sage] 2018/11/22(木) 20:01:05.49ID:???
-
!importantを使うのも下手の証拠 - ： Name_Not_Found [sage] 2018/11/22(木) 20:02:40.41ID:???
-
＞状態を表すクラス名は、見た目と紐づけてはいけない
＞つまり.onという汎用classで使い回すなんてことはやってはいけない。
では、理由をどうぞ
100%消したいんだからimportantを付ける事に何の問題があるの？ - ： Name_Not_Found [sage] 2018/11/22(木) 20:04:12.62ID:???
-
> では、理由をどうぞ
だからに書いたって言ってるだろうが - ： Name_Not_Found [sage] 2018/11/22(木) 20:04:55.42ID:???
- 良くないと言われているから何も考えずに従っているだけだろう
bootstrap等のフレームワークは
＞状態を表すクラス名は、見た目と紐づけてはいけない
紐づけまくっているが、どう問題があるんだ？
フレームワークだからいいとか言うなよ - ： Name_Not_Found [sage] 2018/11/22(木) 20:05:55.90ID:???
- > 良くないと言われているから何も考えずに従っているだけだろう
> bootstrap等のフレームワークは
> ＞状態を表すクラス名は、見た目と紐づけてはいけない
> 紐づけまくっているが、どう問題があるんだ？
紐づけていない。状態を表すクラスは必ずコンポーネントと組み合わせて使われている - ： Name_Not_Found [sage] 2018/11/22(木) 20:07:42.49ID:???
- .赤 { color: 赤 } と .表示 { 表示 } は
どちらも同じ間抜けな使い方だってことに気づいてないんだよな
初心者やで - ： Name_Not_Found [sage] 2018/11/22(木) 20:09:06.95ID:???
- 非表示にしたい時に
.off{
display:none !important;
}
つければいいだけじゃん - ： Name_Not_Found [sage] 2018/11/22(木) 20:10:06.05ID:???
-
だからいい加減
赤 { color: 赤 } とか .表示 { 表示 } は
.非表示 { 非表示 } みたいな使い方はやめろ - ： Name_Not_Found [sage] 2018/11/22(木) 20:13:29.41ID:???
-
ttp://http://studio-key.com/Bootstrap/glidDecoration03.html
>紐づけていない。状態を表すクラスは必ずコンポーネントと組み合わせて使われている
?? - ： Name_Not_Found [sage] 2018/11/22(木) 20:19:05.53ID:???
- jQuery何かでtoggle()を使う場合、.みたいに自作classのトグルにしないとバグる事があるよ
普通は問題ないけど、プラグイン何かで設定されるインライン要素のdisplay:noneに勝てない事がある - ： Name_Not_Found [sage] 2018/11/22(木) 20:21:53.34ID:???
-
そいつはそもそも状態を表すクラスじゃないし、
メディアクエリーと組み合わせて使われてる
ダイアログのようにJavaScriptからつけたり外したりしねーだろ
状態というのは変わるものだ。変わらないものは状態ではない - ： Name_Not_Found [sage] 2018/11/22(木) 20:31:20.38ID:???
-
ウィンドウサイズによって変わるなら同じ事だね
で、メディアクエリーなら問題なくこういう使い方してもいいって事なのね
ふ～ん
まぁ俺は良いと思うけど - ： Name_Not_Found [sage] 2018/11/22(木) 20:36:35.76ID:???
- フレームワークってそういうもんなんだから、フレームワークだからいいって言い切って良かったのに
何を意地になってんだか - ： Name_Not_Found [sage] 2018/11/22(木) 20:42:55.62ID:???
- 別にフレームワークだからって綺麗に実装されてるわけじゃないしな、CSSに限らず
まあフレームワークと違って自分達で書いたコードは自分達が保守運用するんだからメンテしやすいに越したことはない - ： Name_Not_Found [sage] 2018/11/22(木) 20:45:57.82ID:???
-
それってさー、むかーしから言う人いるけど矛盾がない？
「redってネットワークのことです」って言われたらそれまでで
結局その言語を理解できる人だけにしか通じない話じゃん
意味ない気がする
結局classやidなんて識別子でしかないんだから
何書いても問題ねえよ - ： Name_Not_Found [sage] 2018/11/22(木) 20:55:55.55ID:???
- おすずの本教えてください
- ： Name_Not_Found [sage] 2018/11/22(木) 21:02:15.29ID:???
- はい
ttps://i.imgur.com/b5c6QqF.jpg - ： Name_Not_Found [sage] 2018/11/22(木) 21:09:35.27ID:???
- 状態を表すクラス名に見た目(css)を紐付けるのは問題ないわ。コンポーネントごとに状態に対しての見た目が変わったっていい。
問題は見た目をクラス名にすることであって。 - ： Name_Not_Found [sage] 2018/11/22(木) 21:14:16.75ID:???
-
それはお鈴（おりん）ちゃんだ！ - ： Name_Not_Found [] 2018/11/22(木) 21:28:54.30:HOJRMS6b
- 質問です。
youtubeの動画を埋め込む際、見終わった後の関連動画を表示させない方法で
2018年現在も有効な方法ってありますか？
ここに書いてあるような「?rel=0」って現在は効かないですよね？
ttp://https://beginners-high.com/youtube-kanren-display/ - ： Name_Not_Found [sage] 2018/11/22(木) 21:28:56.79ID:???
- いやー勉強になるなー
- ： Name_Not_Found [sage] 2018/11/22(木) 21:35:52.18ID:???
-
同じ理由で .on { display: block } というのもだめ
.on というのは見た目ではなくて状態を表す言葉。
↑
矛盾してない？
自分で 見た目{見た目} がだめっていってon{display:block}はonが見た目じゃなくて状態を表してるから
っておなじ理由じゃないじゃん - ： Name_Not_Found [sage] 2018/11/22(木) 21:43:57.12ID:???
- 要は
.hoge .on{display:block}はダメ
.hoge.on{display:block}はokってことだろ？
なんでこれだけのことをやれ汎用だコンポーネントだとぐちゃぐちゃいってんの？日本語壊滅すぎるだろ - ： Name_Not_Found [sage] 2018/11/22(木) 21:55:48.73ID:???
- うひゃー、全然分からんわ
- ： Name_Not_Found [] 2018/11/22(木) 21:57:20.79:NTIoZt38
-
今年の夏くらいに仕様変わった
消せない
ttp://https://developers.google.com/youtube/player_parameters?hl=en#release_notes_08_23_2018 - ： Name_Not_Found [sage] 2018/11/22(木) 22:00:51.00ID:???
- 基本クラス名は好きな食べ物の名前にしてる
- ： Name_Not_Found [sage] 2018/11/22(木) 22:16:54.87ID:???
-
王長島だからセーフ - ： Name_Not_Found [sage] 2018/11/22(木) 22:38:46.36ID:???
- colorの値ってborder,text-decoration,box-shadow等の色に継承されてんだな
なんでfont-colorってプロパティ名にしなかったのかやっとわかった - ： Name_Not_Found [sage] 2018/11/23(金) 00:01:33.25ID:???
-
明確なご回答アリガトゴザイマス!! - ： Name_Not_Found [sage] 2018/11/23(金) 00:59:14.20ID:???
-
> 矛盾してない？
全然矛盾してない。.onを状態として扱うなら、
.onのときに表示するか非表示にするかはコンポーネント次第。
つまり、 .dialogと組み合わせて初めて
どういう表示になるかが特定できる
.onだけで決めてはだめという話
> .hoge .on{display:block}はダメ
> .hoge.on{display:block}はokってことだろ？
ほら間違ってる。だから説明がいるんだよｗ
.onが状態（JavaScriptから変更するもの）ならば、.onだけで
見た目が決定されたらだめ。必ずコンポーネントを表すクラスと組み合わせて使う
.hoge .on は .on だけでは何も決まらず、 .hoge と組み合わせているから問題ない - ： Name_Not_Found [sage] 2018/11/23(金) 01:04:24.08ID:???
-
> それってさー、むかーしから言う人いるけど矛盾がない？
> 「redってネットワークのことです」って言われたらそれまでで
何がそれまでなのかわからない。
.redを赤という意味で使うなって話だろ。
.redをネットワークの意味で使ってるなら別にいいよ
本当にネットワークの意味で使ってるならな
お前の屁理屈は、それまでだなｗ - ： Name_Not_Found [sage] 2018/11/23(金) 01:11:04.02ID:???
-
> そういう事。だからラッパーに頼るしかなくなる
どうやら反論もないし、ラッパーはいらないってことでいいね - ： Name_Not_Found [sage] 2018/11/23(金) 01:50:05.20ID:???
-
.hoge.on{}だって、ほかと組合わさってるじゃんほんと意味不
ほらwとか書いてないで日本語ちゃんとかいてくれよ - ： Name_Not_Found [sage] 2018/11/23(金) 02:26:26.35ID:???
-
css以前に日本語が出来て無い
言ってる事が合ってるかどうか以前に何を言ってるかわからない
酔っ払ってるの？ - ： Name_Not_Found [sage] 2018/11/23(金) 02:32:41.94ID:???
-
690はお前への援護レスだろうに…間違ってねぇじゃんよ。お前がそのすぐ下に書いてるコメントと… - ： Name_Not_Found [sage] 2018/11/23(金) 02:33:16.20ID:???
-
理解できない頭は辛いなｗ
.on { 見た目 }
やってはいけないのはこれだけ
状態を意味するクラスに直接見た目を書いてはいけない
これ以上の説明いる？ - ： Name_Not_Found [sage] 2018/11/23(金) 02:39:45.04ID:???
-
言わんとすることはわかるが、幾ら何でも説明が下手すぎる
cssの表現なんて見た目以外ないんだから何を指して「見た目」と言っているのか
そこを説明しないと - ： Name_Not_Found [sage] 2018/11/23(金) 02:49:52.74ID:???
-
状態を意味するかどうかなんてわかんないじゃん - ： Name_Not_Found [sage] 2018/11/23(金) 02:52:30.58ID:???
-
頭が短絡的すぎる
「状態を示すクラス単独に見た目を書くな」と言ったんだよ
言い換えると「状態を示すクラスはコンポーネントを示すクラスと組み合わせて見た目を書け」
と言ってるんだよ。誰が「見た目を書くな」っていったんだ。
「状態を示すクラス単独に」を抜かすんじゃねーよボケ
> 状態を意味するかどうかなんてわかんないじゃん
状態である以上変わるもの。変わらないならば状態ではない。
JavaScriptでつけたり外したりするのが状態だよ - ： Name_Not_Found [sage] 2018/11/23(金) 02:55:41.75ID:???
- クラス名を気分でつけてのかな？
クラス設計というものを勉強したほうが良いぞ
BEMとかOOCSSとか（まあこれらはやりすぎだと思ってるが） - ： Name_Not_Found [sage] 2018/11/23(金) 06:29:45.11ID:???
-
自分がいく職場は気分でつけるところばかり
BEMの職場にいったら破綻してた
運用で人がチェンジするから学習が必要なのは無理っぽい - ： Name_Not_Found [sage] 2018/11/23(金) 06:52:47.99ID:???
- × 運用で人がチェンジするから学習が必要なのは無理っぽい
○ 学習してない人にチェンジするから学習が必要なのは無理っぽい
◎ 素人にチェンジするから学習が必要なのは無理っぽい - ： Name_Not_Found [sage] 2018/11/23(金) 08:29:03.92ID:???
-
俺は東京生まれHIPHOP育ち - ： Name_Not_Found [sage] 2018/11/23(金) 09:55:47.66ID:???
- 接頭語つける系は自分が分かりやすくてすき
- ： Name_Not_Found [sage] 2018/11/23(金) 10:19:17.44ID:???
-
さんざん日本語へたすぎるっていわれてるのに…日本語へたな上に頭まで固いとか老害かよ - ： Name_Not_Found [sage] 2018/11/23(金) 10:21:01.33ID:???
- 老害じゃなくて中学生だろう
さすがにこんなのが社会にいるとは思いたくないぞ
たまにいるけど - ： Name_Not_Found [sage] 2018/11/23(金) 10:23:59.64ID:???
- がをどう満たしてないの？
状態状態いってるけど全てのプロパティは見た目だぞ？
見た目と状態がある！って言ってるだけ - ： Name_Not_Found [sage] 2018/11/23(金) 10:47:59.74ID:???
-
「状態を表すクラス単独に見た目を書いてはいけない」
繰り返していってみ
どうも端折る傾向にあるからさ - ： Name_Not_Found [sage] 2018/11/23(金) 11:03:02.50ID:???
- CSS設計の各用語がわかりません
ttp://https://kuroeveryday.blogspot.com/2017/03/css-structure-and-rules.html
例えば FLOCSS だとこんなに種類があります
・Foundation
・Layout
・Object-Component
・Component
・Project
・Utillity
これらはどう違うのでしょうか？
どう使い分ければ良いのでしょうか？
またOOCSS、BEM、SMACSS、RSCSSでは
FLOCSSの一部しかないようですが、何故なくても大丈夫なのでしょうか？
まずは、違いを教えてください。 - ： Name_Not_Found [sage] 2018/11/23(金) 11:04:47.70ID:???
- 今話をしている「状態」というのは
ttp://https://qiita.com/mrd-takahashi/items/07dc3b4bad027daa2884
.item-nav__item--state_active {…}
こういうもののことですか？ - ： Name_Not_Found [sage] 2018/11/23(金) 11:05:56.49ID:???
-
へのレスお願いします。 - ： Name_Not_Found [sage] 2018/11/23(金) 11:40:17.90ID:???
-
なんでへのレスなのアンカーミス？
は状態＝見た目派
状態が見た目とは完全に違うものとして存在すると言ってるのはだよ - ： Name_Not_Found [sage] 2018/11/23(金) 11:43:32.09ID:???
-
はクラス単独じゃないじゃん…
見た目かいちゃいけなかったらcssできないじゃん - ： Name_Not_Found [sage] 2018/11/23(金) 12:18:23.21ID:???
-
アンカミスではない。話のレベルを数段階上に引き上げる
状態というのはなにか？
どのフレームワークにも状態という概念がある
これをお前に説明できるか？ - ： Name_Not_Found [sage] 2018/11/23(金) 12:19:00.99ID:???
-
見た目書いたらいけないなんて
一言も言っていない。
お前は馬鹿なのか？ - ： Name_Not_Found [sage] 2018/11/23(金) 12:27:19.46ID:???
-
これは今作った俺用のフレームワークだけど、これに状態という概念があるのか？
俺も知らなかったわ～そんなもの搭載したつもり一切ないのにな
ttp://http://jsfiddle.net/kqs0o4p1/ - ： Name_Not_Found [sage] 2018/11/23(金) 12:34:36.53ID:???
-
それはフレームワークじゃない。
ただのゴミカス - ： Name_Not_Found [sage] 2018/11/23(金) 12:35:41.78ID:???
- というか、有名フレームワークはどれも状態がある
どうしよう困った。なら状態という概念がないフレームワークを考え出してやろう
有名フレームワークにはどれも状態があるからなー！
（ちくしょう）
という考えで作り出されたものに価値はない - ： Name_Not_Found [sage] 2018/11/23(金) 12:38:57.11ID:???
- さての対比によると、状態というのはSMACSSで
そのまんま英語にした、Stateで表せされる。BEMではModifierだ
まあどれでもいいのだが、どのフレームワークも
単独で使っておらず、コンポーネントと組み合わせて
見た目が決まってるというのがわかる。
例えば、BEMだが、LargeというModifierは
menu__item--large のように、
menu__itemというBlock、Elementと組み合わせている
言い換えるとlargeだけではどのような見た目か決定することはない。
menu__itemのlargeなのだ - ： Name_Not_Found [sage] 2018/11/23(金) 13:14:25.06ID:???
- なんだ…老害のうえに自演キチガイかよ…話のレベルを上げる？そもそもの日本語のレベルまともにしてから出直せよ
- ： Name_Not_Found [sage] 2018/11/23(金) 13:18:20.26ID:???
- ま…まさかだけどonはダメだけどitem_display-onはokとか言い出すの？
まさか違うよね？いつから命名規則の話にすり替えられた？ - ： Name_Not_Found [sage] 2018/11/23(金) 14:42:33.48ID:???
- いったいなんのはなしをしているんだ…？
- ： Name_Not_Found [sage] 2018/11/23(金) 15:59:28.41ID:???
-
「どのフレームワークにも」
状態がないフレームワークはフレームワークではないとおっしゃるのですね
なるほど - ： Name_Not_Found [sage] 2018/11/23(金) 16:05:30.92ID:???
-
何故かフレームワークならそれは状態を表すからokという事らしい
フレームワークなんてそういうものなんだから、FWは別で基本的には～～みたいにしてさっさと手仕舞いすればよかったのに
頑固だから謎の俺ルールがどんどんでてきて収集つかなくなっている - ： Name_Not_Found [sage] 2018/11/23(金) 16:22:24.74ID:???
-
まぁもうネタばらしすると、
お前が論破され叩かれ続けるのは決まっていた
俺が誘導したんだけどな
cssはそもそも設計がクソすぎて、100%正解の記述なんてどこにもない。
そもそも論を言えばフロント周りは集客が出来てコンバーションが取れれば何でも良い
全部画像だろうがなんだろうがどうでもいい場面すらある
それを経験し、皆わかっていてどこかで線引して妥協しているのに、
お前は自分の100点だけが正しいと思い込んで他人を批判し続けた
1~99点、101～200点の人から叩かれて当たり前だ - ： Name_Not_Found [sage] 2018/11/23(金) 16:26:48.92ID:???
- こんな小さくて細けえことにうだうだ問答繰り返して気持ち悪い
- ： Name_Not_Found [sage] 2018/11/23(金) 18:50:42.93ID:???
- なんだただの自演か
- ： Name_Not_Found [] 2018/11/23(金) 18:58:45.07:OpqctT/9
- inputタグを折り返すにはどうすればいいんでしたっけ、それとも無理でしたっけ？
長いので2行以上に折り返したい（けど改行コードは入力してほしくない）入力欄を作るには、textareaでkeyupだかするたびにreplaceで改行コードを取り除くしかないですかね？ - ： Name_Not_Found [sage] 2018/11/23(金) 19:06:36.73ID:???
- <details>
<summary><ol><li>a</li><li>b</li></ol></summary>
<ul>
<li>c</li>
</ul>
</details>
が期待通りの出力になりません
なぜですか？ - ： Name_Not_Found [sage] 2018/11/23(金) 19:07:38.81ID:???
- つまり
1.a
2.b
をひとまとまりとして?マークがついて欲しいのにずれて表示されます - ： Name_Not_Found [sage] 2018/11/23(金) 19:08:21.20ID:???
- ▲←これを右に90度傾けたマークの表示位置が上手く行かないんですね
- ： Name_Not_Found [sage] 2018/11/23(金) 19:24:58.85ID:???
-
＞改行コードを入力してほしくない
これは難しい。ブラウザでなんとでも入呂できる
通常はそのままサニタイズだけしてDBに入力させる
その後、改行が多いようなら管理画面の表示では改行をなくすなどの処理をかませる - ： 735 [] 2018/11/23(金) 21:54:26.00:OpqctT/9
-
より正確に言うと身内向けで、うっかり改行を防ぎたくて…
(最終的にチェックされたり置換されたりはしますが、最後だとやり直しの手間が増えたり、予期せぬ置換が起こったりするので)
あるいは改行コードをアイコン的な感じで目に見えるようにできればいいのですが
editable化されたdivならともかく、ただのinputやtextareaでは難しいでしょうか
○文字目に改行コードがありますよって赤文字を出したりすることは簡単でしょうけれど
…あ、その位置を元にline-heightなどで計算してposition:absoluteでアイコンを重ねて表示すれば無理やり行けなくもない…のかな…？ - ： Name_Not_Found [sage] 2018/11/24(土) 06:01:55.20ID:???
- flex って１度使うと子孫要素は height 一切できなくなるの？
内側で地図やグラフのJSライブラリを使いたいから
height100% をずっと指定したいんだけど…
有名な chart.js も flex の内側だとつかえないし
使わずにすむなら使わないほうがいいのかな - ： Name_Not_Found [sage] 2018/11/24(土) 06:29:01.30ID:???
- flexboxは互換性考えたらゴミだっていってんのに
このスレやたらflex推すバカが居るからな
同じことができるならfloatやinline-block使っとけ
flex使わないといけないのは不特定多数の等間隔配置したいときだけ - ： Name_Not_Found [sage] 2018/11/24(土) 07:12:50.17ID:???
- >742
そうなんですね…
よくある
1カラムヘッダ
2カラムでサイドバー
をそれぞれ可変長でもってて
それ以外の領域にめいっぱいグラフを表示させるってどうすればいいですか？
header
----------
side | chart
可変要素に対して残りの高さや幅めいっぱい使うというのが flex-grow を使う以外にやり方が分からなくて… - ： Name_Not_Found [sage] 2018/11/24(土) 07:32:45.21ID:???
- flex使おうがJSならサイズとることはできるから
chart.js使うってことはJSかけるならJSでサイズセットしたほうがはやくね？ - ： Name_Not_Found [sage] 2018/11/24(土) 16:48:12.09ID:???
- 独自ドメインって個人レベルがお名前.comのようなサービスを介さないで
取得する事ってできるもんなんですか？ - ： Name_Not_Found [sage] 2018/11/24(土) 17:03:55.74ID:???
- 大企業レベルでも国レベルでも不可能
- ： Name_Not_Found [sage] 2018/11/24(土) 17:07:39.43ID:???
- 国はお名前.com介してないだろｗｗｗｗ
- ： Name_Not_Found [sage] 2018/11/24(土) 17:14:55.23ID:???
- 別の会社利用しているかもしれないが
同じようなもん - ： Name_Not_Found [sage] 2018/11/24(土) 18:57:53.30ID:???
-
jsはあまりなれてなくてchart.jsもテンプレのデータだけ入れ替えて使うぐらいで
設定変えるとか全くわからなくて半日かけてもうまくリサイズしてくれない…
あきらめて flex つかわずにレイアウトすることにします
ありがとうございました - ： Name_Not_Found [sage] 2018/11/24(土) 19:41:06.21ID:???
- こういうときこそflexならなにでもできる君こねーの
- ： Name_Not_Found [sage] 2018/11/24(土) 20:45:27.42ID:???
- まぁそういうものだからねw
自分が不利なときには絶対来ないw - ： Name_Not_Found [sage] 2018/11/24(土) 20:56:28.84ID:???
- flexならなんでもできる！！！
- ： Name_Not_Found [sage] 2018/11/24(土) 21:00:09.60ID:???
- flexって未だに互換性イマイチなの？
高さ合わせて横並びにする時、pading9999＋margin9999のハックなんてもう使いたくないよ - ： Name_Not_Found [sage] 2018/11/24(土) 21:01:53.90ID:???
- htol#niqやります！
- ： Name_Not_Found [sage] 2018/11/24(土) 21:25:01.35ID:???
- 画像の回り込みみたいのはfloatしかできないよね
それ以外はflex使うけど
CSSGridはIE問題があるから手出してない - ： Name_Not_Found [sage] 2018/11/24(土) 21:39:12.52ID:???
- そもそもそんな新聞みたいな段組でデザインすることが無い
もちろんそういう案件が来たら使うけどね - ： Name_Not_Found [sage] 2018/11/24(土) 21:45:20.88ID:???
- flexならなんでもできるよ
信じて使ってみ - ： Name_Not_Found [sage] 2018/11/24(土) 22:42:55.64ID:???
-
いや、出来るけど得手不得手が大きすぎる
画像の回り込みだけはfloat最強だろう - ： Name_Not_Found [sage] 2018/11/25(日) 01:10:09.37ID:???
-
互換性考えたらゴミというと、具体的にどういうことでしょうか？ - ： Name_Not_Found [sage] 2018/11/25(日) 01:59:50.94ID:???
- 実際がflexのせいで動かないっていってんじゃん
DOMのレイアウトだけならモダンブラウザはほぼ対応してるけど
JSライブラリの中にはまだまだflex使うと動かないものはあるってことだろ - ： Name_Not_Found [sage] 2018/11/25(日) 03:11:10.60ID:???
-
まだ古いIEやらを相手にしてる人も少数だがいるんだよ - ： Name_Not_Found [sage] 2018/11/25(日) 10:35:29.09ID:???
- 画像の回り込みデザインみかけなくなったな。
レスポンシブに弱いからか。 - ： Name_Not_Found [sage] 2018/11/25(日) 10:49:18.92ID:???
-
だと思う。モバイルで回り込みは見づらすぎるからな
最近はpc版もモバイルをそのまま横長にするだけってのも増えてきたし、
今後はもっと減っていくんじゃないか - ： Name_Not_Found [sage] 2018/11/25(日) 11:10:43.10ID:???
- flex最強
できないことはなにもない - ： Name_Not_Found [sage] 2018/11/25(日) 11:20:37.61ID:???
- css grid 最強
- ： Name_Not_Found [sage] 2018/11/25(日) 14:09:38.26ID:???
-
末尾要素を変な技使わないと左寄せできない
他にもいくつかあったが忘れた。
ケースバイケースで使い分けてるわ。
floatが苦手なんでしょ？ - ： Name_Not_Found [sage] 2018/11/25(日) 14:12:39.39ID:???
- どんなケースか忘れたが、flexは中身の要素の高さを認識できない時があった。
- ： Name_Not_Found [sage] 2018/11/25(日) 14:22:04.96ID:???
- なんでcssは何十年建ってもまともなレイアウトが出来ないんだよｗ
- ： Name_Not_Found [sage] 2018/11/25(日) 14:29:34.96ID:???
- 結局リッチクライアントを達成するにあたって昔ながらの枠組みを無理やり拡張しようとしたのが間違いだったということさ
- ： Name_Not_Found [sage] 2018/11/25(日) 16:11:44.79ID:???
- floatが苦手な奴がおるかよバーカ
- ： Name_Not_Found [] 2018/11/25(日) 16:25:40.07:HigpdOxS
- あいう
あいう
あいう
flexboxでdisplay.flexでこんな感じにしきつまって、これをサイトの幅に合わせたいんですがどうすればいいんですか？
widthでpx指定するとスマホとかノートpcではみ出しちゃいそうですし - ： Name_Not_Found [sage] 2018/11/25(日) 16:27:51.51ID:???
-
言ってる意味がよく分からんか
width:100%じゃあかんの - ： Name_Not_Found [sage] 2018/11/25(日) 20:28:25.93ID:???
- SSIでのHTMLファイルのインクルードがよろしくないらしいけど、今は何でインクルードするのが一番良いんですか？
- ： Name_Not_Found [sage] 2018/11/25(日) 20:40:19.84ID:???
- 作業者がHTMLプリプロセッサを使ってローカルでインクルード化します
- ： Name_Not_Found [sage] 2018/11/25(日) 22:13:31.80ID:???
-
php
もう誰も使ってない変な技術は使うのやめといたほうがいい - ： Name_Not_Found [sage] 2018/11/25(日) 23:13:38.07ID:???
- SSIがよろしくないのにPHPはよろしいの？
- ： Name_Not_Found [sage] 2018/11/25(日) 23:16:06.48ID:???
-
ここまで実質標準で世界中で使われているなら、デバッグも十分済んでるだろう
そう納得して使っている
まぁapacheのバックドアが数十年ほったらかしだったりするんだけどね～
ま～いっか～みたいな～ - ： Name_Not_Found [sage] 2018/11/25(日) 23:37:15.15ID:???
- いまは主流はapacheじゃないし
- ： Name_Not_Found [sage] 2018/11/26(月) 01:10:32.20ID:???
- nginxはまだ追い付いてないよ？
- ： Name_Not_Found [sage] 2018/11/26(月) 01:41:54.96ID:???
-
ヒューかっこいー - ： Name_Not_Found [sage] 2018/11/26(月) 08:38:56.78ID:???
- SSIで出来る事って限られてるからphpｙり悪用はされにくいとは思うけどな
- ： Name_Not_Found [sage] 2018/11/26(月) 21:21:42.05ID:???
- はびこんちぇっかーにまにへすとがあらへんってゆあれる。。。
jsonチェッカーで構文は合ってるみたいだしちゃんとhead内のそのへんに
<link rel="manifest" href="/manifest.json">
も入れてるんだけど記述する位置でも決まってたりするの？ - ： Name_Not_Found [sage] 2018/11/26(月) 21:34:16.80ID:???
- なんでこんな気持ち悪く書けるの
- ： Name_Not_Found [sage] 2018/11/26(月) 23:47:35.07ID:???
- はてなブログで
<details>
<summary><ol>
<li>aaa</li>
<li>bbb</li>
</ol></summary>
<ol>
<li>A1</li>
</ol>
</details>
と書くと、見出し部分がaaaとbbbのリストではなく、 ｢[詳細]｣ という文字列に勝手に置き換えられてしまいます
なぜですか？
はてなブログ以外なら普通にいけたんですが - ： Name_Not_Found [sage] 2018/11/27(火) 00:01:53.60ID:???
- はてブロに質問すりゃいいじゃん
- ： Name_Not_Found [sage] 2018/11/27(火) 00:41:03.48ID:???
- 無料のブログは広告やウィルスを貼れないように置換することがある
その見出しがなんで置換されるのかは分からん。だね - ： Name_Not_Found [sage] 2018/11/27(火) 01:34:37.33ID:???
-
そのタグの書き方がおかしいとか？
/manifest.json のパスがおかしいとか？
./ や、../ から始めるとか？ - ： Name_Not_Found [sage] 2018/11/27(火) 05:51:10.65ID:???
- HTMLじゃなくてマークダウンでしょ
- ： 782 [sage] 2018/11/27(火) 06:39:12.49ID:???
-
そこの記述チェッカーにかけて見たら引用符が間違ってたわ
サンクス - ： Name_Not_Found [sage] 2018/11/27(火) 10:37:57.35ID:???
- TVはもう4Kの次の8Kが話題になってる
8Kテレビは今の4倍の7680×4320ピクセルだってよ
これがwebにも取り入れられたら大変だわ
横幅7680ピクセルのデザインモックなんて作ってたら非効率過ぎて死ねるわな
それでいてスマホのサイズにもレスポンシブ対応ってなったら対応幅が広すぎだわ - ： Name_Not_Found [sage] 2018/11/27(火) 10:55:49.73ID:???
- 次はウェブサイトがギガ泥棒になるのか
- ： Name_Not_Found [sage] 2018/11/27(火) 11:20:54.98ID:???
- いちいち高解像度に対応してたら
写真素材も高解像度のしか使えないから
全部買い直しになるし金かかって仕方なくなりそう - ： Name_Not_Found [sage] 2018/11/27(火) 11:50:50.46ID:???
-
今はモバイルファースト、PC版は横幅広げてbodyにpadding、サイドバー付けるだけってとこが多いよ
横幅がなんぼになろうと対して変わらん - ： Name_Not_Found [sage] 2018/11/27(火) 14:05:45.29ID:???
-
8kの本懐はデジタルサイネージだよ - ： Name_Not_Found [sage] 2018/11/27(火) 17:36:43.34ID:???
-
直近は東京オリンピックのテレビ需要に合わせて普及をはかってるらしい
出演者向けにそれに合わせた化粧品も開発されているとかなんとか - ： Name_Not_Found [sage] 2018/12/01(土) 09:00:31.43ID:???
- <hr />って前後に改行が入りますけど、
前後に改行が入らない<hr />ってどうすればいいですか？ - ： Name_Not_Found [sage] 2018/12/01(土) 09:15:35.11ID:???
-
何のためにやるのか分からないけど、
あまり推奨できる書き方ではない
ttp://http://jsfiddle.net/gmcsrh5w/ - ： Name_Not_Found [sage] 2018/12/01(土) 09:51:49.20ID:???
- どうもです
- ： Name_Not_Found [sage] 2018/12/01(土) 10:03:09.56ID:???
- ttp://https://codepen.io/infologicmation/pen/dQaPYW
xという文字列に対する vertical-align: center;
が効いていません。
なぜでしょうか？
(xという文字(列)はここに表示したいのでposition属性はこのままにしておきたいです) - ： Name_Not_Found [sage] 2018/12/01(土) 10:03:43.93ID:???
- <ul>
<li><span class="samp">X</span>
<a>hello</a></li>
<li>bye</li>
</ul>
CSSは
li {
position: relative;
}
a {
font-size: 200%;
vertical-align: middle;
}
span {
position: absolute;
left: -35px;
width: 50px;
font-size: 80%;
vertical-align: bottom;
}
です - ： Name_Not_Found [sage] 2018/12/01(土) 10:36:58.28ID:???
-
そもそも
vertical-align: center;
が無いよ
あと右寄せとか勉強する時はborder入れとくと分かりやすいかもね
ttp://https://codepen.io/anon/pen/JexoyW - ： Name_Not_Found [sage] 2018/12/01(土) 10:39:52.43ID:???
- え？
vertical-align は center じゃなくて middle じゃないんですか？ - ： Name_Not_Found [sage] 2018/12/01(土) 10:44:59.75ID:???
-
質問者？回答者？どっちだ
＞xという文字列に対する vertical-align: center;が効いていません。
と最初に質問したのは
だよ
無けりゃそりゃ効かない - ： Name_Not_Found [sage] 2018/12/01(土) 11:48:07.20ID:???
-
気持ち悪いな
最初の質問て書き間違えただけだろう
それぐらい読み取ってやれよ - ： Name_Not_Found [sage] 2018/12/01(土) 12:17:03.92ID:???
- vertical-align: bottom;
↓
vertical-align: middle;
で終わり
ttp://https://codepen.io/anon/pen/XyObgV - ： Name_Not_Found [sage] 2018/12/01(土) 12:39:19.68ID:???
- ブラウザのデフォルトcssって切る事は出来ないのでしょうか？
reset.cssで打ち消すしか無いのでしょうか - ： Name_Not_Found [sage] 2018/12/01(土) 12:44:31.18ID:???
-
デフォルトで何も表示されなくなってほしいってこと？ - ： Name_Not_Found [] 2018/12/01(土) 13:40:25.37:rbLtVslJ
- フレックスボックス飽きた
何か面白いcssありませんか？ - ： Name_Not_Found [sage] 2018/12/01(土) 13:43:35.67ID:???
- cssに飽きたらprefetchとか試してみては
cssばかり触ってても得るものは少ないぞ - ： Name_Not_Found [sage] 2018/12/01(土) 14:14:57.57ID:???
-
css grid - ： Name_Not_Found [sage] 2018/12/01(土) 22:03:05.72ID:???
-
vertical-align: middle;
にしても全然効いていません - ： Name_Not_Found [sage] 2018/12/01(土) 22:04:42.25ID:???
-
ttp://https://codepen.io/anon/pen/wQNgmP
効いてるよ
xはBOXの真ん中にある - ： Name_Not_Found [sage] 2018/12/01(土) 22:05:16.40ID:???
- position: absolute;
を消すと垂直方向について中央にそろえれますが、position: absolute;は絶対に外したくないです。 - ： Name_Not_Found [sage] 2018/12/01(土) 22:06:10.96ID:???
- と言うかどこの真ん中に揃えたいの？
- ： Name_Not_Found [sage] 2018/12/01(土) 22:07:48.53ID:???
-
成る程
確かに｢その箱のサイズにおいては｣middleになっていますね
でも私がやりたいのは, li タグと揃える という意味での垂直方向についての中央揃えなのでちょっと違います
(つまり、中点・ と中心線を揃えたい) - ： Name_Not_Found [sage] 2018/12/01(土) 22:10:32.86ID:???
- サンプルコードにおいて
aタグの文字サイズを200％、vertical-align:middle にしているのはそのためなんです。
そうすることでli内の文字サイズに応じてliの箱のサイズが変わったり、liの中点・の位置が微妙に変わったりしますが
それでもこの中点・に揃うようにspanを垂直方向について中央揃えしたいのです。 - ： Name_Not_Found [sage] 2018/12/01(土) 22:11:33.17ID:???
- 例えば、サンプルコードにおいて
span タグに｢top: 12px;｣とすれば"その時は"上手く行きますが…これはその場しのぎなのでダメです - ： Name_Not_Found [sage] 2018/12/01(土) 22:26:44.76ID:???
- >>817
こう？
ttp://https://codepen.io/anon/pen/YRBNMN
liの点どっかいってワロタ - ： Name_Not_Found [sage] 2018/12/01(土) 22:44:33.35ID:???
-
確かに中点が消えてしまってること以外についてはまさしくそれです
その状態から中点を復活させることが出来たら最高なのですが… - ： Name_Not_Found [sage] 2018/12/01(土) 22:57:43.64ID:???
-
ttp://https://codepen.io/anon/pen/ZmweKY
こんなアホみたいなcssだとメンテするだけで人生おわりそうだ - ： Name_Not_Found [sage] 2018/12/01(土) 23:33:30.50ID:???
-
そんなその場しのぎの中点は不適切です
中点以外に○や■を使うことだってありますので。 - ： Name_Not_Found [sage] 2018/12/01(土) 23:51:56.80ID:???
-
どれかを諦めるしかないねぇ
display:flexを使わずにこれを組むならaとspanのheightかline-heightを決め打ちするしかない
中黒はdisplay:list-itemに付くものだからflexとの併用は不可能
後はdivかますかね
ttp://https://codepen.io/anon/pen/PxVmqv
ださｗ - ： Name_Not_Found [sage] 2018/12/02(日) 00:41:34.18ID:???
-
ありがとうございます。
現状がベターっぽいですね - ： Name_Not_Found [sage] 2018/12/02(日) 11:55:49.45ID:???
- バターだな
- ： Name_Not_Found [sage] 2018/12/02(日) 13:06:25.97ID:???
- htmlもCSSもJavaScriptもちゃんと整備したのになんでワイのサイトは中身がないんや？
- ： Name_Not_Found [sage] 2018/12/02(日) 13:19:46.46ID:???
- お前が内臓詰まってるのに中身がない男と言われるのと一緒。
- ： Name_Not_Found [sage] 2018/12/02(日) 14:08:47.15ID:???
- 内臓は全部換金したから詰まってへんのや
- ： Name_Not_Found [sage] 2018/12/02(日) 16:47:49.81ID:???
- 内臓が
- ： Name_Not_Found [sage] 2018/12/02(日) 17:52:28.86ID:???
- ないぞう
- ： Name_Not_Found [sage] 2018/12/02(日) 18:08:02.05ID:???
- そうですか。
- ： Name_Not_Found [sage] 2018/12/02(日) 18:10:26.69ID:???
- つまりまとめると
頑張っていこうって事？ - ： Name_Not_Found [sage] 2018/12/02(日) 18:19:35.24ID:???
- 少しでもいいから毎日続けるのが大事
毎日1ページ書けば一年後には365ページだ - ： Name_Not_Found [sage] 2018/12/02(日) 18:30:38.15ID:???
-
そりゃ鍋と包丁と食材だけ買っても
おいしいごはんにはならんのと同じじゃ - ： Name_Not_Found [sage] 2018/12/04(火) 13:26:42.69ID:???
- いやその場合、鍋と包丁とフライパンがあって食材がないんじゃ
- ： Name_Not_Found [sage] 2018/12/04(火) 15:54:59.93ID:???
- いや、食材もあるけどレシピがないから自分流で適当に作ったらものすごくまずくなったパターン
- ： Name_Not_Found [sage] 2018/12/04(火) 16:33:48.03ID:???
- 食器はあるんじゃ
- ： Name_Not_Found [sage] 2018/12/04(火) 17:21:03.60ID:???
- 料理の上手い嫁がいればいい
- ： Name_Not_Found [sage] 2018/12/04(火) 17:24:51.80ID:???
- 女は負債
- ： Name_Not_Found [sage] 2018/12/04(火) 17:39:17.92ID:???
- お酒はぬるめの燗がいい
- ： Name_Not_Found [sage] 2018/12/04(火) 21:23:56.09ID:???
- まとめると酒・ギャンブル・女を経験して人生勉強をつめば、サイトも中身がしっかりつまったいいものができる
- ： Name_Not_Found [sage] 2018/12/04(火) 21:35:24.10ID:???
-
悪徳通信教材のサイトを作ろう - ： Name_Not_Found [sage] 2018/12/04(火) 22:30:26.01ID:???
- たった3つのことをするだけで、
思ったことが自然に英語で口から出てくる
ようになるのです - ： Name_Not_Found [sage] 2018/12/04(火) 23:48:22.75ID:???
- 唐辛子を練り込んだ繊維の痩せるTシャツ
のサイトなら作ったことあるぞ - ： Name_Not_Found [sage] 2018/12/05(水) 00:03:09.26ID:???
- 痛そう
凡例：
レス番
100 (赤) → 2つ以上レスが付いている
100 (紫) → 1つ以上レスが付いている
名前
名無しさん (青) → sage のレス
名無しさん (緑) → age のレス
ID
ID:xxxxxxx (赤) → 発言が3つ以上のID
ID:xxxxxxx (青) → 発言が2つ以上のID
このページは2ch勢いランキングが作成したアーカイブです。削除についてはこちら。
ttp://placehold.jp/200x100.png"＞＜/div＞ 
ttp://placehold.jp/200x200.png"＞＜/div＞ 
ttps://i.imgur.com/NvwzobL.jpg 
ttps://i.imgur.com/GUXsbca.png 
ttps://www.google.co.jp/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png") no-repeat 0 0; 
ttps://i.imgur.com/Njb8qox.jpg 
ttps://hp-seed.jp/useful/img/pixta_30140996_M.jpg 
ttps://i.imgur.com/b5c6QqF.jpg 