HTML/CSS のどんな質問にも必ず優しく答えるスレ 33

**Name_Not_Found** · 2025/05/30(金) 10:07:21.65

初心者ですがよろしくお願いします
cssのclassに関する質問です

例えば自分用のurl控えブックマーク集みたいなリンク集を作っている場合、リンク先のIPで記録した物があるとします

・<a href="IP/index.html
・<a href="IP/admin/setup_html
・<a href="IP/syslog.html

３つともIPの部分は同じです
リンク先のIPが変わった時、３つを個別に修正するのは手間なので、cssのclassを使ってIP部分だけをcssに登録し、IPが変わった時はcssを修正したら全てに反映するかなと思いやってみたのですが、どうやって記述するのか調べてもよくわかりませんでした
すみませんがよろしくお願いします

**Name_Not_Found** · 2025/05/30(金) 10:43:33.09

サイト埋め込んだXが表示されずに
Tweets by ○○○_info
とリンクテキスト表示だけになったのですが原因わかりますか？
サイトは変更してないので
Xの仕様が変わったのでしょうか？

**Name_Not_Found** · 2025/05/30(金) 12:27:55.94

>>100
属性セレクターは試した？
https://developer.mozilla.org/ja/docs/Web/CSS/Attribute_selectors

**Name_Not_Found** · 2025/05/30(金) 16:14:10.73

>>100
javascript案件？

**Name_Not_Found** · 2025/05/30(金) 16:21:29.75

> ３つを個別に修正するのは手間なので

それだけのためにスクリプトか何かを追加するぐらいなら、個人的にはエディタ使って
当該IP（ドメインじゃなくて？）を新しいものに一括置換だなぁ

**Name_Not_Found** · 2025/05/30(金) 23:12:35.71

まあ3つくらいの修正なら手動でやったても大した手間じゃねえだろだよなｗ

**Name_Not_Found** · 2025/05/31(土) 07:16:05.18

>>100
CSSで解決すべきことではないというのが答え
属性セレクタも属性の内容を書き換えるものではない
エディタで一括置換かスクリプトを使いましょう

**Name_Not_Found** · 2025/05/31(土) 16:47:27.26

ここが最新正規スレ？
どこで聞くべき質問か分からんからとりあえずここで聞く。
はてなブログでMathJaxを使用できるようにして、｢$m$｣と入力してレンダリングしようとしたら、数式として｢m｣と表示されるのではなく、そのまんま｢$m$｣と表示される。
これは、はてなブログの仕様のせいで、｢$m $｣と入力したら、所望の｢m｣が出力される、というところまでは解明できた。が、こんなその場しのぎの回避方法は嫌。
｢$m$｣だと駄目になってしまう問題を根源的に解決したい。
どうすればいいか、どこで聞くべか、よろしく。

**Name_Not_Found** · 2025/05/31(土) 18:24:43.35

ここら辺りで

+ JavaScript の質問用スレッド vol.126 +
https://mevius.5ch.net/test/read.cgi/hp/1439005423/
JavaScript ライブラリ総合質問所 vol.5
https://mevius.5ch.net/test/read.cgi/hp/1465399470/
Webサイト制作初心者用質問スレ part253
https://mevius.5ch.net/test/read.cgi/hp/1626528070/

尚、HTML編集モードとか見たまま編集モードでダメなら慣れる以外に解決方法は無い気が

**Name_Not_Found** · 2025/05/31(土) 19:12:18.66

>>107
以下もはてなブログでの例:
上手くレンダリングされない例→｢$距離空間$｣
普通にレンダリングされる例→｢$距離空$｣、｢$離空間$｣

全く意味分からん

**Name_Not_Found** · 2025/05/31(土) 19:31:37.90

追加：
レンダリングされない:｢$全射$｣
レンダリングされる:｢$顔射$｣

全く意味分からん

**Name_Not_Found** · 2025/06/01(日) 22:06:01.21

わからんけど文字コードの問題じゃないかな

**Name_Not_Found** · 2025/06/01(日) 22:16:26.31

Markdownと競合するとかなんとか

**Name_Not_Found** · 2025/06/02(月) 22:42:50.35

縁取り文字をこのように作ったけど、なぜか「ｗ」だけ尖ってしまいます。
フォントサイズとフォントタイプはこのまんまでどうすれば「ｗ」を尖らないようにできますか？

<style>
#waku{
background-color:#0000ff;
width:900px;height:200px;
position:relative;
}
#fuchi,#nuri{
position:absolute;
left:0px;top:0px;
font-size:50px;
font-weight:bold;
letter-spacing:20px;
}
#fuchi{
color:#ffffff;
-webkit-text-stroke: 20px #ffffff;
font-family:メイリオ;
}
#nuri{
color:#ff0000;
-webkit-text-stroke: 10px #ff0000;
font-family:メイリオ;
}
</style>

<div id="waku">
<div id="fuchi">てすとだよｗｗｗ</div>
<div id="nuri"> てすとだよｗｗｗ</div>
</div>

**Name_Not_Found** · 2025/06/03(火) 02:12:54.88

これはこれでカッコいい

**Name_Not_Found** · 2025/06/07(土) 08:52:36.20

文字と文字の間隔をletter-spacing:30pxで設定しましたが
divの中の文字列が折り返すときの文字（ようするにdivの中の一番右の列の文字）は
letter-spacing:0pxになるようにしたいんですけど、どうやればできますか？無理ですか？

**Name_Not_Found** · 2025/06/07(土) 09:57:22.51

divのmargin-rightにネガティブマージン-30px

**Name_Not_Found** · 2025/06/13(金) 14:44:45.43

CSSネストができるようになったのは便利ではあるんだが
スマホだとブラウザ側が対応してないのも少なくなくて結局Sassで継続かな

**Name_Not_Found** · 2025/06/15(日) 16:41:36.38

>>117
ほんそれ。凄い残念でずっと出来ずにいる

**Name_Not_Found** · 2025/06/15(日) 16:44:25.28

生成AIについて真っ先に飛びついて調べまくって毎日情報集めてたのに
飽きてしばらく情報集め止めてたら、いつの間にか世間に置いてかれてて悔しい、、
Claude CodeとかCursorとかなんだよ・・

ほんと熱を入れるタイミングって重要だよな　遅くてもダメだが早すぎてもダメ。

**Name_Not_Found** · 2025/06/15(日) 18:38:35.49

黒い画面こわいよーってAIに泣きついて励ましてもらいながらやってる

**Name_Not_Found** · 2025/06/17(火) 20:47:55.50

HTML/CSSもだが今からプログラムとか言語覚える意味があまりなくなってきたから
新人は覚えるモチベーションもうわかないんじゃない？　かといって基礎や全体像や手順ががわかってないとプロにはなれない

アナログでさんざん経験しておいてよかったわ

**Name_Not_Found** · 2025/06/17(火) 23:45:08.74

> HTML/CSSもだが今からプログラムとか言語覚える意味があまりなくなってきたから
そういうのは単に勉強したくない言い訳をAIにかぶせてるだけじゃね？ｗ
勉強に遅すぎるということはないんだけどな

**Name_Not_Found** · 2025/06/18(水) 00:28:24.76

例えるなら今はパソコンもマウスとGUIでクリックだけで操作できる
昔のようにコマンドだけでOS動かす知識を勉強しても将来あまり意味がない
そして世間はさらにPCからスマホへシフトしてしまった

かといって義務教育の算数が不要なわけではない。そろばんは不要

**Name_Not_Found** · 2025/06/18(水) 00:32:13.84

GASもVBAも全部やってもらえて覚える気失せた

**Name_Not_Found** · 2025/06/18(水) 00:41:10.68

>>119
ちょっと前まで英語しか対応してなかったのにねえ

**Name_Not_Found** · 2025/06/18(水) 00:48:30.11

バックエンドや機能の実装についてはAIが得意だが、
デザインカンプから正確なcssを組むのはたぶん一番対応遅くなりそうな気がする
ググったり教科書読んでもそのまま答えにならないほとんどが個別処理だし見た目が絡むと処理が複雑になるのとバックエンドほど金にならんから
テンプレみたいのを作るのは得意でもデザインからCSSを起こすのはまだまだ対応できまいて

**Name_Not_Found** · 2025/06/18(水) 00:59:12.04

こだわりのいらないサイトならまあ「スタイリッシュなやつで」とかでそれなりのモノは作ってくれるよね
あとは自力でやっててうまくいかないときにすぐ相談にのってくれるのが頼もしい

**Name_Not_Found** · 2025/06/19(木) 12:24:43.83

イラン　ハメネイ師の公式アカウント
@khamenei_ir

**Name_Not_Found** · 2025/06/20(金) 02:14:54.70

てかAIに書いてもらったコードを確認・検証してたら自然と身に付いていくと思うんだけどな
言うなれば勉強の仕方が効率化するだけのこと
ほんと各地で勉強出来ない系の人が水を得た魚のようにはしゃいでるな最近

**Name_Not_Found** · 2025/06/20(金) 06:22:05.07

右クリックはできるが文字をコピーしてもコピーできないサイトがある
サイトを保存してhtmlをメモ帖で開いて↑を無効化したいがhtml上のどの文だろう?

**Name_Not_Found** · 2025/06/20(金) 06:50:31.00

「いいエラー報告ですね！一歩前進した証拠です。この調子で進めましょう」
>>130
ソースコードをメモ帳で開いた時点で必要な部分をコピーすればいいのでは…なんで無効化？

**130** · 2025/06/20(金) 06:59:36.46

画像なども含めたページを見ながら必要な所をコピペしたいので

**Name_Not_Found** · 2025/06/20(金) 07:19:39.16

>>129
そんな簡単に事が運べば苦労は無いわけでｗ
で、実際アンタがそういう手法で身につけたという実例だと？

**Name_Not_Found** · 2025/06/20(金) 07:25:05.54

現状のAIは何から何までではなく補佐的なもので見るのが無難だな
例えば普段の生活で人と対面で会話しないような人間がAIと会話してるかといって
そいつが話し上手にはなるかといえばないのと同じだな

**Name_Not_Found** · 2025/06/20(金) 13:18:07.08

わからない部分を解説してもらったり
自分が書いたコード見せて評価と改善点出してもらったり
独習には限りなく向いている

**Name_Not_Found** · 2025/06/20(金) 14:02:03.43

>>132
開発者ツール使うのがてっとり早いと思う

**Name_Not_Found** · 2025/06/20(金) 17:10:17.37

AIは変な質問とか同じ質問してもやさしい

**Name_Not_Found** · 2025/06/21(土) 07:13:45.52

みんなさすが技術者だけあって真面目だな
でも俺はもうスペルも関数も正確に覚えることに意味がないと思い始めた
これから学ぶ新人達もそう感じる気がしてならない速さも正確さも知識量も結局AIには勝てないのに身につける意味あるのかと
そして思考する事自体があまりなくなりそうだ

**Name_Not_Found** · 2025/06/21(土) 07:18:08.77

メガテック企業見てるとそんな気がしてならない人がプログラム書く時代はもう終わったんじゃないかと

**Name_Not_Found** · 2025/06/21(土) 07:51:47.05

そんな完成した後の話はその時考えるとして
俺が一番嫌だと思ってるのは
今後提出したものをクライアントがAI使って採点してくることだよ
地獄だわ

**Name_Not_Found** · 2025/06/22(日) 09:30:47.28

もっと自信もちなよ…

**Name_Not_Found** · 2025/08/03(日) 22:32:48.02

<audio src="test.wav" autoplay></audio>

自動で音声再生されないけど、どうしてですか？
ブラウザはchrome最新バージョンです

**Name_Not_Found** · 2025/08/03(日) 22:50:50.88

>>142
これでも読んでみるといいかも

HTML Audio Autoplay で自動再生できません。
https://teratail.com/questions/265276
メディアおよびウェブ音声 API の自動再生ガイド - ウェブメディア技術 | MDN
https://developer.mozilla.org/ja/docs/Web/Media/Guides/Autoplay

**Name_Not_Found** · 2025/08/04(月) 18:23:33.72

>>143
なるほどね
ありがとうございます

**Name_Not_Found** · 2025/08/23(土) 22:59:14.01

すみません初歩的な質問なのですが

<p>text</p>の要素があるとして
pの半透明背景の背後に
「text」テキストを表示させる方法はありますでしょうか。
「text」テキスト自体には位置指定ができないみたいです。

これはHTMLやDOM、CRPの仕様で
ある要素の子のテキストノードや
z-index位置指定の無い子要素は
必ずその要素の背景の上に
描画されるという仕様なのでしょうか。

**Name_Not_Found** · 2025/08/24(日) 00:58:35.39

求めるものがよくわからんけど、pの上に半透明の擬似要素を絶対配置で置けばいいんでない？
https://jsfiddle.net/vcq0rx14/

テキストノードは直接スタイル操作の対象にはできない
要素の子というより属性みたいなものだと思ってる
子要素は親の上に表示されるのが基本

**Name_Not_Found** · 2025/08/24(日) 09:42:48.34

>>146
実装をする場合の
実例を伴うご解説ありがとうございます。

今まで気にしていなかった仕様が
ふと気になったので投稿しました。

要素の背景と要素内の子の描画の順番を
解説してある文献が見当たらなかったので
ここに投稿をしました。

ありがとうございます。

**Name_Not_Found** · 2025/08/29(金) 15:05:25.81

トップページをスマホ画面に対応させたら下のディレクトリも勝手にスマホ画面に対応するようになったのですが、これはどういう理屈ですか？

**Name_Not_Found** · 2025/08/29(金) 15:28:10.99

絶対単位じゃなく相対単位使ってるからじゃないの？
知らんけど

**Name_Not_Found** · 2025/08/30(土) 03:06:47.67

情報が少なすぎてエスパーする以外に答えようが無いわな

**Name_Not_Found** · 2025/08/31(日) 12:25:17.51

148ですが、自分のHPのURLを貼った方がいいですかね？

**Name_Not_Found** · 2025/08/31(日) 16:14:03.68

それでもいいけど、ここにHTMLとCSS貼ってくれた方がお互いに安心かも
https://jsfiddle.net/
レイアウトが崩れなければ、面倒だけど文字列や画像はダミーでいい

**Name_Not_Found** · 2025/08/31(日) 16:40:55.88

共通のCSSを使っているからとかいうオチだったりして……

**Name_Not_Found** · 2025/08/31(日) 23:11:33.06

viewportは（ベタ書きなら）それぞれ書かんといかんだろうし
いろいろ謎

**Name_Not_Found** · 2025/09/02(火) 07:02:14.85

トップページのcssを下のディレクトリでも読み込んでるんだろう

**148** · 2025/09/02(火) 20:07:31.04

>>152
ありがとうございます。新しくアカウント作ったんですが、ログインした状態でjsfiddleでSaveしてもエラーが出て共有できないので、HPを貼るって形でも大丈夫でしょうか...？

**Name_Not_Found** · 2025/09/03(水) 01:48:22.84

止めはしない

**Name_Not_Found** · 2025/09/03(水) 02:51:18.37

広告貼ってるならやめたほうがいい

上のフォルダにヘッダフッタCSS等のレイアウトに必要なファイルが置いてあって
下位フォルダはそれを見に行ってるだけだろ

**Name_Not_Found** · 2025/09/03(水) 02:53:35.62

だとしたら、ディレクトリ構造がわかるツリービューと下位フォルダのソース見ないとわからん
URL貼られても余計にわからん

**Name_Not_Found** · 2025/09/03(水) 14:21:38.58

>>156
ログインしてない状態でsaveしてもダメ？
saveした時点でURLが「https://jsfiddle.net/文字列/」に変わるから、それをココに貼り付ければいい（例：>>146）
ちなみにログインした状態ならURLは「https://jsfiddle.net/アカウント名/文字列/」になる

**148** · 2025/09/03(水) 20:22:21.40

>>160
はい、何故か"Cannot save this fiddle"と出てURLも変わりません.....
何がいけないんでしょうか；；
アクセスカウンターとか訪問者の解析ツールのコードを消せば良いんでしょうか？

**Name_Not_Found** · 2025/09/03(水) 20:48:59.37

短文を貼り付けて保存できるなら、貼り付けたものが長過ぎるとか
つーか、そういう余計なモノは要らない

> トップページをスマホ画面に対応させたら下のディレクトリも勝手に

そもそも、スマホ対応っていったい何をしたのか、どうやって作ってるサイトなのかサッパリだな
何かのサービスでも使ってんのかね？

**Name_Not_Found** · 2025/09/03(水) 22:21:49.61

今さらだけど「スマホ画面に対応」って、どういう意味で言ってんだろ？
レスポンシブ対応ってことで合ってんのかな？

**148** · 2025/09/03(水) 22:29:51.16

特にサービスとかは使ってないです！普通にHTMLとCSSで作ってます。
レスポンシブだかメディアクエリだかよく分からないですけどそれで合ってるはずです。
因みにHPのURLをここに貼ったらお互いにどのようなデメリットがありますか？
僕側のデメリットは身バレするとかその辺でしょうけど、ここの皆さんには何か不都合があるのでしょうか？

**Name_Not_Found** · 2025/09/03(水) 22:30:56.40

わしらはなんも不都合ないよ

**Name_Not_Found** · 2025/09/03(水) 22:35:26.04

貼っちゃえ！

**148** · 2025/09/03(水) 22:47:34.03

https://patriot.futene.net/
これです。宜しくお願いします

**148** · 2025/09/03(水) 23:41:09.29

連レスごめんなさい。
ダッシュボードの自己紹介もしくはブッキングのご依頼、が下のディレクトリです。
スマホで開くと数秒後に文字が大きくなります。

**Name_Not_Found** · 2025/09/04(木) 00:35:50.65

iPhoneではトップと同等には表示されなかったよ
下層ページにもviewportの記述入れないとダメやね

あと報酬は（同業の皆のためにも）もちっと上げといた方がいいんじゃないか
ノーギャラOKとかよくない

**Name_Not_Found** · 2025/09/04(木) 01:31:01.83

「下のディレクトリ」が勝手にスマホ対応になってるってのは、iPhoneの場合、viewportが正しく記述されていないと
ブラウザによって勝手に拡大される場合がある、ってヤツじゃね？

**Name_Not_Found** · 2025/09/04(木) 04:47:49.58

> iPhoneではトップと同等には表示されなかったよ
> 下層ページにもviewportの記述入れないとダメやね
このレベルで金取るのは人としてどうなのか？ｗ
コード見たけどなんか基本がわかってないままでコピペの切り貼りでやったくさいんだよな
YouTubeのWeb製作のハウツー動画でも見て基本からやり直した方が早い

**Name_Not_Found** · 2025/09/04(木) 05:27:45.72

スレタイも読めない馬鹿なのになんで偉そうなの？

**Name_Not_Found** · 2025/09/04(木) 07:46:35.71

この程度のサイトなら無料のホームページ作成でやれば簡単に済む案件
基本をやってない奴にどんなに優しく説明しても理解できるわけないし

**Name_Not_Found** · 2025/09/04(木) 07:48:13.35

> 今さらだけど「スマホ画面に対応」って、どういう意味で言ってんだろ？
> レスポンシブ対応ってことで合ってんのかな？
レスポンシブというワードすら知らないレベルだと
丁寧に解説したところで要点を理解して改善できるのか大いに疑問だ

**Name_Not_Found** · 2025/09/04(木) 10:15:31.24

そもそもは
どういう理屈で勝手にスマホ対応されたのか
てことだから
148がiphoneユーザーなら
>>170 が正解かもなんじゃね

**Name_Not_Found** · 2025/09/04(木) 12:55:29.01

>>173-174
そういう勘違いの妄想クソ野郎のお前は、ここに何しに来てんの？

**Name_Not_Found** · 2025/09/04(木) 13:17:36.73

>>171
彼の作曲やDJアクトの報酬の話さ

**Name_Not_Found** · 2025/09/04(木) 16:27:49.10

CSSをstyleに直書きでやってんのになんで他のページまで影響受けるのか？という問題なんでしょ

**Name_Not_Found** · 2025/09/04(木) 18:50:57.10

試しにトップのviewport指定を削除してみて、下層の表示がどうなるか確認してみりゃいいんじゃね？

**148** · 2025/09/07(日) 11:45:55.36

返信遅れてすみません。
僕はAndroidを使ってるんですよね…
下層ページにもviewportの記述を入れるというアドバイス、ありがとうございます。
試してみます

**Name_Not_Found** · 2025/09/27(土) 11:04:37.34

html、css、javascript
　
もうAIに聞けばほぼ解決してくれるよなあ

**Name_Not_Found** · 2025/09/27(土) 14:09:52.16

考えるのをやめて出力をコピペするだけになるとヤバいのよな（自戒）

**Name_Not_Found** · 2025/09/30(火) 00:20:21.16

油断した頃にクソコードを書いてくるのがAI

**Name_Not_Found** · 2025/10/02(木) 18:18:44.65

掲示板やSNSなどで一般人が文章を投稿する時、顔文字を改行によって切れなくすることは技術的に可能ですか？
自分のホームページならspanタグで囲えば大丈夫ですが、不特定多数のユーザーが投稿するサービスとなるとやっぱり無理でしょうか？
興味があるのでどなたか教えていただけると嬉しいです。

**Name_Not_Found** · 2025/10/02(木) 22:17:41.73

タグの類はサニタイズされるだろうし、基本的には無理だと思う
前後にスペース入れて一単語扱いを期待するぐらいかな…

**Name_Not_Found** · 2025/10/08(水) 07:05:50.63

例えばamazonのメニューバーを改変する場合

www.amazon.co.jp##[data-csa-c-content-id="nav_cs_amazonbasics"]
www.amazon.co.jp##[data-csa-c-content-id="nav_cs_audible"]
www.amazon.co.jp##[data-csa-c-content-id="nav_cs_automotive"]
www.amazon.co.jp##[data-csa-c-content-id="nav_cs_baby"]
www.amazon.co.jp##[data-csa-c-content-id="nav_cs_beauty"]
www.amazon.co.jp##[data-csa-c-content-id="nav_cs_books"]
といったように不要項目別で指定して除去可能です

これを一つの行でまとめられないでしょうか
:has-text(/xxx|yyy|zzz/)のような正規表現による羅列と、似た節約をしたいです

**Name_Not_Found** · 2025/10/08(水) 07:26:30.43

標準CSS表現ではないので、広告ブロッカースレへどうぞ

**Name_Not_Found** · 2025/10/08(水) 12:05:46.22

**Name_Not_Found** · 2025/10/08(水) 20:13:24.66

audioタグで再生回数を指定するやり方は？

**Name_Not_Found** · 2025/10/09(木) 04:23:25.02

JSでカウンタ制御
全体でカウントするならサーバ側に仕掛けが必要

**Name_Not_Found** · 2025/10/16(木) 18:22:47.24

https://watashi.xyz/js-hamburger-menu/#toc5
を見て、以下のことをAndroidスマホで確認しようとしています

jsをつかわずCSSとHTMLだけでハンバーガーメニューを表示し
メニューから#contactなどのページ内見出しジャンプなどのときにメニューは自動で消えてくれる

最初に貼った参考サイトの場合「実装方法3: オーバーレイと:target連携」を採用し
htmlとcss（別ファイル）に分け、ドックタイプなど少し足してchromeやkiwiで動作確認をしてみています
しかし出てきたハンバーガーメニューの中のリンクである#contactなどをタッチしてもメニューは消えてくれません

「そこじゃなくこのサイトのやり方なら動いたよ」だとか「自分の環境では意図した動作になるけどな」などなにかしら教えてください

**Name_Not_Found** · 2025/10/17(金) 08:59:23.63

あきらめて少しだけjavascript使ったようなものも考えてます（少しの機能補助が理想）
参考にしやすいスタンダードなやり方のサイトがあれば教えてください

**Name_Not_Found** · 2025/10/17(金) 10:20:44.80

:checkedや:targetを駆使してCSSだけでやるって手法は面白いし感心したけど、
そのサイト自身が言及しているように、実装が複雑になりすぎて実用性はあまりないね（途中で追うのやめた）

JSとCSSの併用で
・メニューの表示状態をCSSのクラスで定義する
・メニューの出し入れはクラスの付け外しで制御する
・メニュー内リンクのクリックで表示状態のクラスを外す
の方がシンプルだし応用がきくと思う

GeminiやChatGPTなら自分のコードの状態にあわせて解説してくれるからわかりやすいよ
解説の中でわからないことが出てきても都度訊けるし

**Name_Not_Found** · 2025/10/17(金) 11:10:11.16

>>193
ありがとう、openwrt化したルーター上にちょっとした自分用のページを作ってみようとしてました
javaスクリプト使わないほうが楽で見て自分にも理解できると考えてたけど甘かったw
AIに聞いたら修正案をくれたのでそれを試して無理なら、一般的js使用のケースを探そうと思います

**Name_Not_Found** · 2025/10/17(金) 11:35:11.49

メニューのオン／オフはcheckbox
中のメニュークリックで閉じるはJSでいつも作ってる

**Name_Not_Found** · 2025/10/19(日) 21:17:10.60

昔職業訓練で半年コース通ったけど、その程度やったくらいで即戦力希望の会社に応募しろとかアホかと思ったわ

**Name_Not_Found** · 2025/11/10(月) 14:43:09.77

まあ基本を1から教えるよりは半年でも勉強してれば即戦力に育つのは早かろうｗ

**Name_Not_Found** · 2025/11/17(月) 15:20:34.68

youtubeが数日前から関連動画のサムネイルなどが巨大化してしまい、
なんとかできないかと思って色々調べた結果Stylebotという拡張機能でCSSを適用させれば解決するかもということでした
ですがそういう物を書いたことがなく、AIに聞いてやってみたのですが効果がない状態です
もしわかる方がいらっしゃいましたら教えていただけませんでしょうか？
以前の数倍の大きさになっていて視覚的に気持ち悪くて困ってます

**198** · 2025/11/17(月) 15:28:27.43

関連動画のサムネイルってのは、再生中の動画の右側に表示されてるやつです
その部分に対して大きさの指定などをするってのはなんとなくはわかるんですが、その場所の特定などができず調べてもいまいちわからなかったんです

**Name_Not_Found** · 2025/11/17(月) 16:58:52.89

ここはWeb制作板です
CSSといってもブラウザの拡張機能によって記述方法が異なったりします

**Name_Not_Found** · 2025/11/19(水) 01:56:58.42

>>198
代替クライアント使うのが手っ取り早いんでない？
CSSやDOMのことを覚えるつもりなら基本からGo

**Name_Not_Found** · 2025/11/20(木) 19:48:20.33

そもそもウチの環境じゃ当該箇所が巨大化してないからなあ
スレ違い以前に不具合再現できないんじゃアドバイス出来ない

**Name_Not_Found** · 2025/11/21(金) 04:43:39.71

https://i.imgur.com/VwADpB2.png

左が元々の大きさ、右が巨大化した状態
何個かアカウント作ってたが、変わってたのと変わってないのがあった

**Name_Not_Found** · 2025/11/21(金) 12:52:51.90

こういう質問は最低ブラウザは何なのかOSのバージョンなど使用環境を書かないとようわからん
ログアウトしてみたりブラウザ側の拡張機能全部オフにしてみるとか
ブラウザを再インストールでまっさらな状態で見てみるとか

**Name_Not_Found** · 2025/11/21(金) 18:06:28.27

その現象は今のとこランダムになるみたいね。
同じアカウントでもブラウザ変えれば小さくなったり、同じブラウザでも違うアカウントだと大きさが違うようだし。
UIの変更テスト中でアカウントとブラウザを紐づけてランダムに対象にされてるんじゃないのかな？
一度ターゲットにされるとアカウントとブラウザの組み合わせ替えないと巨大化したままになるっぽい。

**Name_Not_Found** · 2025/11/22(土) 07:58:21.03

そうなんか？ウチは全然影響無いけど
拡張でEnhancer for YouTube入れとけば問題ないんかな？

**Name_Not_Found** · 2025/11/22(土) 08:22:18.97

>>206
Enhancer for YouTube入れてカスタムスクリプトで対策するか、StyleBotでCSS設定するとかすれば大丈夫だとは思う
youtube Row Fixerはダメだね

**Name_Not_Found** · 2025/11/22(土) 10:48:30.55

質問があり、お願いします。ページ内リンクに近い話ですが
特定のWebページの中断箇所を直接表示させたいと思っています。ただし、私のWebページではないので、
ページ内リンク等を仕込めません。

htmlリンクを押すと、上記動きができないものでしょうか？

**Name_Not_Found** · 2025/11/22(土) 11:03:00.95

関係者のWebページですか？
そうでないならモラル的な問題で含め止めた方がいいですよ
埋め込みコードが用意されているならともかく

**Name_Not_Found** · 2025/11/22(土) 11:05:17.65

アドバイスありがとうございます。関係先のWebページで問題ないのですが、そのページを見に行くことが多いので、思案してました。
なんとか出来ました。

**Name_Not_Found** · 2025/11/26(水) 16:28:06.59

以下のサイトをもっと高速化できるでしょうか？
ただし、Javascript無しでお願いします。

cssとhtmlはできるだけ簡素にしたつもりです。

mangaduke.com

**Name_Not_Found** · 2025/11/26(水) 23:00:53.07

サイトの宣伝にしか見えん……

**Name_Not_Found** · 2025/11/27(木) 00:02:06.26

そもそも名前からして違法サイトの可能性も・・・

**Name_Not_Found** · 2025/11/27(木) 05:54:45.23

よく:nth-of-type(n+2):nth-of-type(-n+3)で、2番目～3番目と一行にまとめつつ指定したりするのですが

:nth-last-of-type(-n+10)などの最後尾から指定する場合、飛ばすことは出来ないのでしょうか？
lastでも奇数偶数指定なら飛び石になりそう？ですけど、最後尾より2番目～10番目を一括除去したい、最後尾である1番目は残したいという願望です
よろしくお願いいたしますm(vv)m

**Name_Not_Found** · 2025/11/27(木) 14:39:31.70

>>214
:nth-last-of-type(n+2):nth-last-of-type(-n+10) とか
:not(:last-of-type) じゃダメなの？

**Name_Not_Found** · 2025/11/27(木) 17:01:55.21

:nth-last-of-typeを2連にすると、コード自体が受け付けないんですよね
ですからlastは文字通り最後尾から～までの1本通行なのかなあ？と愚考し、ネットで調べても回答な無く、こちらへ行き着きました

**Name_Not_Found** · 2025/11/27(木) 17:02:28.44

正答が無く

**216** · 2025/11/27(木) 18:16:18.31

自己解決しますたm9(^д^)

お騒がせしましたm(vv)m

**Name_Not_Found** · 2025/11/27(木) 18:19:11.96

普通に二連でいけるんじゃねって書こうとしたのに(´･ω･｀)

**Name_Not_Found** · 2025/11/27(木) 18:24:40.41

「:nth-of-type(n)」と
「:nth-child(n)」がいつもごっちゃになる

**Name_Not_Found** · 2025/11/27(木) 18:44:41.86

2連でいけますけど、サイト次第ではステルスがあるじゃないですか
私の例も1番目が何故か3番目になっており、それで4番目以降に指定すると通りましたっつー
私は敢えてchildを使わないので混同しないものの、順序指定だけは慣れませんねｗ
せめてコードの中にグレー表示し、これは数に入るけどサイト上では無効化されていますよという意思表示があってほしいものです
コードに記載がない状態で、どうやったら1が3などに変化するのか、未だ不可解ですわ
サイト次第では離れた数字へジャンプしている時もありますしm9(^д^)

**Name_Not_Found** · 2025/11/27(木) 21:21:04.46

> コード自体が受け付けない

> サイト次第ではステルスがあるじゃないですか

全体的にちょっと何言ってるか分からない

**Name_Not_Found** · 2025/11/27(木) 22:00:01.40

DOMいじられてるのか表示順だけ変えられてるのかはわからんけど、まあ他者サイトへの対応は板違いだわね

自前のサイトで表示されている要素だけを制御するなら、不可視のクラス定義しといて
:nth-last-child( n + 2 of .elem:not(.hidden)):nth-last-child(-n + 5 of .elem:not(.hidden))
でいけるか

**Name_Not_Found** · 2025/11/28(金) 01:10:08.08

どうでもいいけど
m9(^д^)
就職したら使うのやめろよ

**Name_Not_Found** · 2025/11/28(金) 06:57:49.98

m9（＾Д＾）なんて数年ぶりに見たなｗ

**Name_Not_Found** · 2025/11/28(金) 15:14:57.17

俺ら煽られてんだよ

**Name_Not_Found** · 2025/11/28(金) 16:27:32.48

顔文字で煽るなんて老人会出身かな？

**221** · 2025/11/28(金) 21:58:24.07

せっかくなので素人の雑感ですと
なかなかに悩ましいのが
:nth-of-typeを使用する際にdivで指定したらそのdivが何番目にあるかで、
classを指定するとその同一のclassが何個あるかとされ、
さらにdiv.classといったダブル指定じゃないと働かなかったりする場合もあります

厄介なのはclass指定でもdivのような数え方になっていたり、前回述べた「無いはずのカウント」が存在していたり色々
そこを毎回サイト別に探るのが悩ましいのですよね

より変則的なのはヤ〇ト運輸の荷物追跡サイトなどで、これは飛び石どころか数字がワープしやがるんですよｗ
5の次が4以下になったり、そういう物理的に起こりえない事態にはならないからマシですがｗ
サイト上もコード上も10未満のページが、:nth-of-typeでは(28)とかざら
間の大量のdivはどこへ行ったの？みたいなｗ

何らかの要因でそのタグが無効化されている場合、主にライトグレー表示となって解かり易いんですけどね
amazonのように過去使用していたclassをまとめて隔離したりするサイトもありますし
最近は緑色やscript系のよく分からんものまで増えましたが、サイト上へ直接干渉するコードではないのでスルー

8160行ある俺ティンのフィルタはなかなかなもんッスよ（´∀｀）

**Name_Not_Found** · 2025/11/28(金) 22:06:03.45

スルー検定

**Name_Not_Found** · 2025/11/29(土) 18:49:39.72

m(vv)m
↑いつもの