شبه کلاس only-of-type: در CSS

:only-of-type Pseudo-class

شبه کلاس only-of-type: در CSS هر عنصری که تنها فرزند والد از نوع خود باشد را هدف می گیرد.

css

/* را که تنها عنصر از نوع خود باشد را انتخاب می کند <p> هر عنصر  */
p:only-of-type {
  background-color: lightgreen;
}

نکته: عنصری که از این شبه کلاس استفاده می کند باید دارای والد باشد.

در مثال زیر نحوه عملکرد این شبه کلاس را میبینیم:

html

<main>
    <div> من اولین'div' هستم </div>
    <p>من تنها 'p' در میان خویشاوندان هستم</p>
    <div>من دومین 'p' هستم</div>
    <div>من سومین 'p' هستم.
        <i>من تنها 'i' در میان فرزندان هستم</i>
        <em>من اولین 'em' .هستم</em>
        <em>من دومین 'em' هستم.</em>
    </div>
</main>

css

body { 
    text-align: right;
    direction: rtl; 
    font-family: tahoma;
}
main :only-of-type {
    color: red;
}

مشاهده و ویرایش کد در حالت تمام صفحه

پشتیبانی مرورگرها
تمام مرورگرها از این شبه کلاس در CSS پشتیبانی می کنند.