タグ付けされた質問 「css-selectors」

セレクターは、ドキュメントツリーの要素と照合するパターンです。CSSルールでは、パターンに一致する要素のスタイルを定義するために使用されます。

10
jQueryを使用して空のテキスト入力を選択する
jQueryを使用して空のテキストボックスを識別するにはどうすればよいですか？可能であればセレクタを使ってやりたいです。また、実際のコードではこれを使用したいので、すべてのテキスト入力を選択したくないので、idを選択する必要があります。 次の2つのコード例では、最初のコード例は、ユーザーがテキストボックス「txt2」に入力した値を正確に表示しています。2番目の例は、空のテキストボックスがあることを示していますが、入力しても、空と見なされます。どうしてこれなの？ これはセレクターだけを使用して実行できますか？ このコードは、テキストボックス「txt2」の値を報告します。 <html> <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript"> $(function() { $('#cmdSubmit').click(function() { alert($('[id=txt2]').val()); }); }); </script> </head> <body> <form> <input type="text" name="txt1" id="txt1" value="123" /><br /> <input type="text" name="txt2" id="txt2" value="" /><br /> <input type="text" name="txt3" id="txt3" value="abc" /><br /> <input type="submit" name="cmdSubmit" id='cmdSubmit' value="Send" /><br /> …
6
document.querySelectorAllが実際の配列ではなくStaticNodeListを返すのはなぜですか？
私document.querySelectorAll(...).map(...)はFirefox 3.6でさえも実行できないだけでなく、答えを見つけることができないというバグを抱えています。そのため、このブログからの質問をSOにクロスポストすると思いました。 http://blowery.org/2008/08/29/yay-for-queryselectorall-boo-for-staticnodelist/ アレイを取得できない技術的な理由を知っている人はいますか？または、なぜStaticNodeListは、あなたが使用できるようにアレイから継承していないmap、concatなど、？ （ところで、必要な機能が1つだけの場合は、次のようなことを行うことができNodeList.prototype.map = Array.prototype.map;ますが、この機能が（意図的に？）そもそもなぜブロックされているのですか？）
2
要素のすべての子にスタイルを適用するにはどうすればよいですか
の要素がありclass='myTestClass'ます。この要素のすべての子にcssスタイルを適用するにはどうすればよいですか？子の要素にのみスタイルを適用したいと思います。その孫ではありません。 使用できます .myTestClass > div { margin: 0 20px; } これはすべてのdiv子供に有効ですが、すべての子供に有効なソリューションが必要です。使えると思ったのです*が .myTestClass > * { margin: 0 20px; } 動作しません。 編集 .myTestClass > *セレクタは、Firefox 26にルールを適用しない、及び放火犯に係るマージンのために他のルールが存在しません。そして、に置き換える*と機能しdivます。
102 css  css-selectors 
2
CSS入力タイプセレクター-「or」または「not」構文を使用できますか？
それらがプログラミングに存在する場合）、 次の入力を含むHTMLフォームがある場合： <input type="text" /> <input type="password" /> <input type="checkbox" /> type="text"またはであるすべての入力にスタイルを適用したいtype="password"。 あるいは、すべての入力のwhereで解決しますtype != "checkbox"。 私はこれをしなければならないようです： input[type='text'], input[type='password'] { // my css } 行う方法はありません： input[type='text',type='password'] { // my css } または input[type!='checkbox'] { // my css } 私は周りを見回しましたが、単一のCSSセレクターでこれを行う方法はないようです。 もちろん大したことではありませんが、私は好奇心旺盛な猫です。 何か案は？
101 html  css  css-selectors 
5
アンパサンド（＆）とタイプセレクターを使用して親を結合するSass
Sassでのネストに問題があります。次のHTMLがあるとします。 <p href="#" class="item">Text</p> <p href="#" class="item">Text</p> <a href="#" class="item">Link</a> スタイルを次のようにネストしようとすると、コンパイルエラーが発生します。 .item { color: black; a& { color:blue; } } 同じ要素の一部である場合、親セレクターの前にタイプセレクターを参照するにはどうすればよいですか？
2
CSS属性セレクターがhrefを機能しない
別の色と画像のリンクを変更するには、CSSで属性セレクターを使用する必要がありますが、機能しません。 私はこのhtmlを持っています： <a href="/manual.pdf">A PDF File</a> そしてこのCSS： a { display: block; height: 25px; padding-left: 25px; color:#333; font: bold 15px Tahoma; text-decoration: none; } a[href='.pdf'] { background: red; } 背景が赤くないのはなぜですか？
5
CSSセレクターでアスタリスク（*）は何をしますか？
私はこのCSSコードを見つけて実行し、ページのすべての要素の概要を示しました。 誰かがCSSでアスタリスク*が何をしているのか説明できますか？ <style> * { outline: 2px dotted red } * * { outline: 2px dotted green } * * * { outline: 2px dotted orange } * * * * { outline: 2px dotted blue } * * * * * { outline: 1px solid red } * * …
5
* * CSSセレクターは何をしますか？
最近* *、CSSに出会いました。 サイト参照- サイトリンク。 *CSSスタイルシートでの1つの使用法では、インターネットとスタックオーバーフローには例が殺到していますが* *、CSSで2つのシンボルを使用するかどうかはわかりません。 グーグルで検索しましたが、1つで*すべての要素が選択されるため、これに関する関連情報は見つかりませんでしたが、サイトで2回使用された理由がわかりません。これに欠けている部分は何ですか？なぜこのハックが使用されますか（ハックの場合）？
9
CSSでは、複数のクラスのコンマとスペースは何を意味しますか？
これは私が理解できない例です： .container_12 .grid_6, .container_16 .grid_8 { width: 460px; } その私には思えるwidth: 460px上記の全てのクラスに適用されます。しかし、なぜいくつかのクラスはコンマ（,）で区切られ、一部はスペースで区切られているのでしょうか。 width: 460pxCSSファイルで言及されている方法でクラスを組み合わせる要素にのみ適用されると思います。たとえば、には適用されます<div class='container_12 grid_6'>が、には適用されません<div class='container_12'>。この仮定は正しいですか？
2
IDにピリオドを含むCSSセレクター
HTML仕様では、IDにピリオド（。）を使用できます。 <img id="some.id" /> ただし、CSS IDセレクタールールを使用しても正しく一致しません。 #some.id { color: #f00; } IDセレクタのCSS仕様では、このケースについては触れられていません。タグ名とクラスセレクターの組み合わせを使用していると思いますか？たとえば、CSSルールは、のようなクラス名を持つa.classNameすべてのアンカータグ（<a>）に適用されます。className<a class="className"></a> ピリオドを含むIDでHTML要素を参照する外部CSSファイルルールを作成することは可能ですか？ CSS仕様ではCSSの「識別子」にピリオドが有効な文字として含まれていないと規定されているため、私はそうは思いません。これは、HTML仕様とCSS仕様の間の根本的な不一致ですか？別のタイプのCSS選択を使用する唯一の選択肢はありますか？これを確認または否定するより賢い人はいますか？ （単純化するために、HTMLのid属性からピリオドを削除しますが、これはシステム生成のIDであるため、この場合は変更することができません。）
6
：first-childが期待どおりに機能しない
私が最初に選択しようとしているh1内部のA divと呼ばれるクラスではdetail_container。h1this内の最初の要素である場合は機能しますが、このdiv後に来る場合ulは機能しません。 <style type="text/css"> .detail_container h1:first-child { color:blue; } </style> </head> <body> <div class="detail_container"> <ul> <li></li> <li></li> </ul> <h1>First H1</h1> <h1>Second H1</h1> </div> </body> </html> 私が持っているCSS h1は、これがどこにあっても最初に選択するという印象を受けましたdiv。どうすれば機能させることができますか？
8
最初の子として要素を挿入する方法は？
ボタンをクリックするたびにjqueryを使用して最初の要素としてdivを追加したい <div id='parent-div'> <!--insert element as a first child here ...--> <div class='child-div'>some text</div> <div class='child-div'>some text</div> <div class='child-div'>some text</div> </div>
4
別のdiv内の最初のdivを選択するために使用できるCSSセレクター
私のようなものがあります： <div id="content> <h1>Welcome to Motor City Deli!</h1> <div style=" font-size: 1.2em; font-weight: bolder;">Sep 19, 2010</div> <div > ... </div> そのdiv内の日付のフォント色を設定できるように、2番目のdiv（「content」div内の最初のdiv）のcssセレクターは何ですか？
5
jQueryを使用して最初の親DIVを選択する方法
var classes = $(this).attr('class').split(' '); // this gets the current element classes var classes = $(this).parent().attr('class').split(' '); // this gets the parent classes. 上記の状況の親は、アンコールです。 $（this）の最初の親DIVを取得したい場合、コードはどのようになりますか？ var classes = $(this).div:parent().attr('class').split(' '); // just a quick try. *基本的に、$（this）の最初の親DIVのクラスを取得します。 どうも
10
querySelectorは直接の子を検索します
私はjqueryのような関数を持っています： function(elem) { return $('> someselector', elem); }; 問題は、どうすれば同じことができるのquerySelector()ですか？ 問題は、>セレクターでquerySelector()親を明示的に指定する必要があることです。回避策はありますか？
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.