سلکتور های css بخش ششم

سلکتور های css بخش ششم | سلکتور after:: | کلاس های کاذب | before::

سلکتور های css بخش ششم را برای استفاده شما کاربران گرامی سایت آموزی تدارک دیدم.

سلکتور های css بخش ششم

در این بخش سه مورد دیگر از سلکتورهای مهم css را آموزش می دهیم.

سلکتور های css بخش ششم | سلکتور after:: | کلاس های کاذب | before::

سلکتور های css بخش ششم | سلکتور after:: | کلاس های کاذب | before::

انتخابگر ( X[href^=”http”] Selector ) :

در این سلکتور شما را باز هم با یک عبارت باقاعده دیگر آشنا می کنم.

علامت هش (^) به شروع شدن اشاره می کنه.

سلکتور مورد نظر آن دسته از تگ های a که تنها مسیر اونها با http شروع میشه رو انتخاب میکنه.

به عنوان مثال اگر سندمون دارای تگ a با پروتکل های متفاوت  http و https باشه فقط اونایی که اولشون با https شروع میشه انتخاب میشن و تغییرات مورد نظر روی اونها انجام میشه.

در بخش های قبلی یکسری از کلاس های کاذب ( Pseudo-class ) ها رو براتون تدریس کردم.

در این بخش دو تا از المنت های کاذب به نام های after و before رو براتون توضیح میدم.

( انتخابگر یا سلکتور after:: ) یا ( المنت کاذب after:: )

سلکتور های css بخش ششم | سلکتور after:: | کلاس های کاذب | before::

این سلکتور در حقیقت به ما این امکان رو می ده که از طریق کد css به سند html خودمون محتوا اضافه کنیم.

البته این محتوا در زمان استفاده از المنت کاذب after:: بعد از تگ مورد نظر قرار میگیره به مثال زیر توجه کنید:

img::after { content: “من محتوایی هستم که بعد از تگ img می آیم.”; }

( انتخابگر یا سلکتور before:: ) یا ( المنت کاذب before::)

این سلکتور هم ما این امکان رو می ده که از طریق کد css به سند html خودمون محتوا اضافه کنیم.

البته این محتوا در زمان استفاده از المنت کاذب before:: قبل از تگ مورد نظر قرار میگیره به مثال زیر توجه کنید:

img::before { content: “من محتوایی هستم که قبل از تگ img می آیم.”; }

تفاوت مهم المنت های کاذب after:: و before::

المنت کاذب after:: محتوا را به بعد از تگ مورد نظر اضافه می کند.

المنت کاذب before:: محتوا را به قبل از تگ مورد نظر اضافه می کند.

سلکتور های css بخش ششم | سلکتور after:: | کلاس های کاذب | before:: – اختصاصی سایت آموزی

توسط | ۱۳۹۷/۴/۲۳ ،۲۳:۰۶:۳۶ +۰۰:۰۰ تیر ۲۳ام, ۱۳۹۷|css دسته بندی ها|برچسب ها: , , , , , |بدون دیدگاه

در باره نویسنده :

ثبت ديدگاه

یک × 4 =