این آموزش در تاریخ ۱۴۰۰/۱۰/۱۵ آپدیت شده است.
آموزش شبه کلاس Target در CSS
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش شبه کلاس Target در CSS با من همراه باشید.
Free-Learn
آنچه در این جلسه میخوانید :
شبه کلاس Target در CSS
با استفاده از شبه کلاس ( یا هم انتخابگر ) target در CSS میتوان لنگر لینک هارو ( یا هم به انگلیسی Anchor Link ) را انتخاب و براشون استایل دلخواه تعریف کرد.
خب اگه آموزش HTML رو دنبال کرده باشید میدونید که ما میتونیم در یک صفحه لینک داخلی ( یا هم لینک درون صفحه ای یا هم لینک لنگر دار ) ایجاد نماییم، ( که کاربر بتونه به بخش های مختلف صفحه دسترسی پیدا کنه )
در نتیجه شبه کلاس Target دقیقا داره با همون قسمت لنگر کار میکنه، البته با لنگر فعال ( یعنی دقیقا لنگری که کاربر توش فرود اومده ) ( مثال رو حتما ببینید )
| نسخه | CSS3 |
|---|
Free-Learn
مثال از شبه کلاس Target در CSS
در ادامه میتوانید یک مثال از این انتخابگر / شبه کلاس را در زبان CSS مشاهده نمایید.
|
1 2 3 4 5 |
:target{ background-color:#e30730; color:#fff; padding:10px; } |
Free-Learn
پشتیبانی مرورگرها
در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از انتخابگر / شبه کلاس target در CSS پشتیبانی میکنند یا خیر.
| نام انتخابگر | Chrome | Firefox | Opera | Safari | Edge |
| target: | بله | بله | بله | بله | بله |
Free-Learn
شکل نوشتاری
نحوه نوشتن یا استفاده یا سینتَکس (Syntax) این انتخابگر / شبه کلاس در CSS بصورت زیر می باشد.
|
1 2 3 |
:target { دستورات سی اس اس در اینجا } |
Free-Learn
نکات و توضیحات
- با استفاده از ویژگی scroll-behavior در CSS میتونیم کاری کنیم که وقتی بروی لینک های درون صفحه کلیک میشه، اسکرول صفحه بصورت نرم / آروم انجام شود.
