問題タブ [pseudo-element]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
2 に答える
301 参照

javascript - javascriptはDOMに表示されていないオブジェクトを選択できますか?

これは本当に簡単な質問です:)

ここで、JavaScript が DOM の一部ではないオブジェクトを選択できるかどうか疑問に思っています... CSS によって作成された:afterまたはコンテンツを選択するようなものですか?:before

たとえば... divがあり、ボックスを作成する場合

これらの要素がどのように作成されるかを理解するのはまだ困難ですが、それらは画面上に要素を描画できますが、DOM の一部ではないため、それらとやり取りすることはできないということですか?

乾杯

0 投票する
1 に答える
3506 参照

html - '要素で:before疑似要素を使用する-それは可能ですか?

ラップアラウンド:beforeされた要素で疑似要素を使用できるかどうかを確認することに興味がありますか?<a href<button>

現在、Firefoxは要素の後ろに細い青い線を表示しています。<button>これは、要素が。で囲まれているため<a hrefです。

行内でインラインスタイルを使用すると<a href、行が消えます。

ただし、<button>複数のページに要素があるので、可能であればCSSを使用してそれらをターゲットにします(特に、サイトで'<a hrefをラップしているすべての要素にクラスを追加したくありません)。これは、疑似要素が役立つと<button>思っていたところですが、機能していないようです。:before

これは<button>、Firefoxでのの表示方法です。に適用される青いデフォルトのテキスト装飾を参照してください<a href。右側にのみ表示される理由は、のクラスが要素margin-left:5pxに適用されているためです。<button>

ここに画像の説明を入力してください

jsfiddleにあるボタンの基本バージョンは次のとおりです(わずかな外観の違いは無視してください):http://jsfiddle.net/Vtjue/2/

何か案は?

0 投票する
25 に答える
778922 参照

javascript - javascript(またはjQuery)を使用して::beforeや::afterなどのCSS疑似要素を選択して操作する

::beforejQueryを使用してand ::after(および1つのセミコロンを持つ古いバージョン)などのCSS疑似要素を選択/操作する方法はありますか?

たとえば、私のスタイルシートには次のルールがあります。

バニラJSまたはjQueryを使用して「foo」を「bar」に変更するにはどうすればよいですか?

0 投票する
3 に答える
13430 参照

css - css の :before 疑似要素にパディングを追加する

:before 擬似要素とコンテンツが実際に始まる場所の間にパディングを追加する方法を知っている人はいますか?

最初の li だけに箇条書きを入れて、強い要素が含まれている場合に限りたいと思います。

私はそれを正しく使用しました:

皆さんありがとう!

0 投票する
2 に答える
218 参照

css - Chrome で CSS3 コンテンツ属性のちらつきを修正する方法はありますか?

このタイプのスタイリングを使用するページを作成しました。

liほとんどの場合、最後の要素を除いて 、要素の前に「/」が必要です。

問題は、Chrome では (私が知る限り)、"/" が存在しないはずなのに、時々ちらつくことがあります。一瞬現れて消えます。

他の誰かがこれを見たり、回避したりしましたか?

0 投票する
3 に答える
32394 参照

html - CSS :after 疑似要素に、要素の外側にコンテンツを追加させることはできますか?

隣接するリンク間の HTML エンティティを使用して、リンクのパンくずリストをフォーマットしたい&raquo;ので、次のようになります。

ホーム»私たちについて»沿革» このページ

CSS にルールを追加しました。

しかし、これはリンクの外側ではなく、リンクの内側にエンティティを追加しています-つまり、私はこれを取得しています:

ホーム » 私たちについて »沿革 »このページ

CSS:after疑似要素の動作を誤解していますか? ドキュメントは、要素のコンテナの内部に追加するのではなく、指定された要素のに指定されたコンテンツを追加することを暗示しているようです。何か案は?

0 投票する
9 に答える
608349 参照

css - CSS:not(:last-child):セレクターの後

次のようなスタイルの要素のリストがあります。

One | Two | Three | Four | Five |代わりに出力One | Two | Three | Four | Five

最後の要素を除くすべてをCSSで選択する方法を知っている人はいますか?

ここ:not()でセレクターの定義を見ることができます

0 投票する
3 に答える
1777 参照

css - Firebugでの疑似要素のCSSスタイルの操作

疑似要素のCSSを操作し:beforeたり:after、Firebugを使用したりすることはできますか?これらはブラウザによって内部的に処理される特定の要素であることは知っていますが、Firebugはより低レベルのアクセス権を持っているので(おそらく)、これらを操作する機能もあるかもしれません。

0 投票する
1 に答える
16329 参照

css - ChromeでのCSS:first-child:beforeの奇妙な動作

Chrome 10w/でかなり奇妙なことが見られます:first-child:before

このHTMLで

そしてこのCSS

<li>Four</li>Win XPSP3のChrome10.0.648.204でアスタリスクを付けてレンダリングする理由を誰かが説明できますか?http://jsfiddle.net/MxtHm/を参照してください

しかし、CSSをに変更すると

<li>Four</li>アスタリスクなしでレンダリングします。http://jsfiddle.net/SGRej/を参照してください

Safari5.0.4とFirefox3.6.16は、両方の例を同じようにレンダリングします。私はMeyerの本とCSS仕様の両方を調べて、運がなくても説明を探しましたが、CSSバリデーターはCSSについて不平を言っていません。

非常に奇妙なことは、Chromeで要素を検査すると、がルールli:first-child:beforeをオーバーライドしていることを示していることです。li:before

JSFiddleはXHTML1.0Strict DOCTYPEを使用していますが、これはHTML5DOCTYPEでも見られます。

ありがとう。

2011-04-28編集:これは、他の同様の疑似要素関連の問題とともに、Chrome11.0.696.57で修正されたようです。

0 投票する
1 に答える
3778 参照

javascript - Javascriptは疑似要素を見つけます

だから私はCSSセレクターエンジンに取り組んできました.疑似要素(::before、::after、::selection、::first-lineなど)をサポートしたいと考えています。Slick、Sizzle、および他のいくつかの人気のあるエンジンがそれらをサポートしているように見えますが、それらのコードを調べたところ、コードが見つかりませんでした (今では当然ですが、それほど難しくはありませんでした)。彼らがどのようにそれを行うか、または私がそれを行うことができる方法を知っている人はいますか?