1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
|
---
title: 'CSS :not() Seçicisi'
slug: 'Web/CSS/:not'
tags:
- ':not() seçicisi'
- CSS
- CSS Pseudo-class
- Web
translation_of: 'Web/CSS/:not'
---
<div>{{CSSRef}}</div>
<h2 id="Özet">Özet</h2>
<p>Olumsuzluk CSS <a href="/en-US/docs/Web/CSS/Pseudo-classes">pseudo-class</a> seçicisi, <code>:not(X)</code>, seçilmek istenen öğelerde bulunması istenmeyen sınıfları, kimlik değerleri vb CSS seçicilerini tanımlamak için kullanılır. Girdi olarak <var>X</var> yerine girilen tanımlamalara sahip olmayan öğeleri sayfa içerisinde uygular.</p>
<p>Fakat X ifadesi içerisinde başka olumsuzluk özelliği barındırmamalıdır.</p>
<div class="note"><strong>Notlar:</strong>
<ul>
<li>Gereksiz seçiciler bu pseudo-class seçicisi ile yazılabilir. <code>Örneğin <strong>:not(*)</strong></code> ifadesi "hiçbir şey olmayan" tüm elemanlarla eşleşmesi gerektiği için boş gelir ve bu seçicideki kurallar asla uygulanamaz.</li>
<li>It is possible to rewrite other rules. E.g., <code>foo:not(bar)</code> will match the same element as the simpler <code>foo</code>. Nevertheless the <a href="/en-US/docs/Web/CSS/Specificity">specificity</a> of the first one is higher.</li>
<li><code>:not(foo)</code> ifadesi<strong> </strong><strong>{{HTMLElement("html")}} ve {{HTMLElement("body")}} </strong>içerisindeki <foo></foo> olmayan bütün elementleri seçer.<strong> </strong><strong> .</strong></li>
<li>This selector only applies to one element; you cannot use it to exclude all ancestors. For instance, <code>body :not(table) a</code> will still apply to links inside of a table, since {{HTMLElement("tr")}} will match with the <code>:not()</code> part of the selector.</li>
</ul>
</div>
<h2 id="Syntax">Syntax</h2>
<pre class="syntaxbox">{{csssyntax}}</pre>
<h2 id="Örnek">Örnek</h2>
<h3 id="HTML">HTML</h3>
<pre class="brush: html"><p>Bu bir paragraf.</p>
<p class="classy">İşte sihir burada!</p>
<div>Burası yeşil olacak </div></pre>
<h3 id="CSS">CSS</h3>
<pre class="brush: css">.classy { text-shadow: 1px 1px 2px gold; }
p:not(.classy) { color: red; }
body :not(p) { color: green; }</pre>
<h3 id="Sonuç">Sonuç</h3>
<p>{{EmbedLiveSample('Example','100%',160)}}</p>
<h2 id="Özelleştirmeler">Özelleştirmeler</h2>
<table class="standard-table">
<thead>
<tr>
<th scope="col">Özelleştirme</th>
<th scope="col">Durum</th>
<th scope="col">Açıklama</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{SpecName('CSS4 Selectors', '#negation', ':not()')}}</td>
<td>{{Spec2('CSS4 Selectors')}}</td>
<td>Çeşitli karışık seçiciler için ifadeyi genişletir.</td>
</tr>
<tr>
<td>{{SpecName('CSS3 Selectors', '#negation', ':not()')}}</td>
<td>{{Spec2('CSS3 Selectors')}}</td>
<td>Standart Tanımlama.</td>
</tr>
</tbody>
</table>
<h2 id="Browser_compatibility">Browser compatibility</h2>
<p>{{CompatibilityTable}}</p>
<div id="compat-desktop">
<table class="compat-table">
<tbody>
<tr>
<th>Özellik</th>
<th>Chrome</th>
<th>Edge</th>
<th>Firefox (Gecko)</th>
<th>Internet Explorer</th>
<th>Opera</th>
<th>Safari</th>
</tr>
<tr>
<td>Temel Özellikler</td>
<td>1.0</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatGeckoDesktop("1")}}</td>
<td>9.0</td>
<td>9.5</td>
<td>3.2</td>
</tr>
<tr>
<td>Gelişmiş Çzellikler</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
</tr>
</tbody>
</table>
</div>
<div id="compat-mobile">
<table class="compat-table">
<tbody>
<tr>
<th>Özellik</th>
<th>Android</th>
<th>Edge</th>
<th>Firefox Mobile (Gecko)</th>
<th>IE Mobile</th>
<th>Opera Mobile</th>
<th>Safari Mobile</th>
</tr>
<tr>
<td>Temel Özellikler</td>
<td>2.1</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatGeckoMobile("1")}}</td>
<td>9.0</td>
<td>10.0</td>
<td>3.2</td>
</tr>
<tr>
<td>Gelişmiş Çzellikler</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
</tr>
</tbody>
</table>
</div>
|
