---
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 &lt;foo&gt;&lt;/foo&gt; 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">&lt;p&gt;Bu bir paragraf.&lt;/p&gt;
&lt;p class="classy"&gt;İşte sihir burada!&lt;/p&gt;
&lt;div&gt;Burası yeşil olacak &lt;/div&gt;</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>