آموزش Html Css
3.17K subscribers
1 photo
86 videos
4 files
24 links
ابر زَس | زیرساخت پایدار ابری ☁️
@xaascloud

اموزش htmlcss
html css
#htmlcss
#html
#css

Admin : @nikoo_mohammad
تبلیغات
@progadv
Download Telegram
:where(header, main, footer) p:hover {
color: red;
cursor: pointer;
}

قبلا به این شکل انجام میدادیم

header p:hover,
main p:hover,
footer p:hover {
color: red;
cursor: pointer;
}



خب دوستان توی css دو تا روش جدید معرفی شده که میتونید باشون چندتا المنت رو انتخاب کنید

اون توابع ()where: و ()is: هستن

- با این توابع می‌تونیم به صورت گروهی و یکجا چندین المنت رو انتخاب کنیم. کاری که قبلاً امکان‌پذیر نبود و باید المنت‌ها رو تک تک انتخاب می‌کردیم

- این ۲ تابع کارایی مشابهی دارن. اما باید بدونیم که المنت‌هایی که با where انتخاب می‌کنیم، پایین‌ترین میزان Specificity رو دارن. اما Specificity توی is بستگی به المنت‌هایی داره که انتخاب می‌کنیم

- این دو تابع نسبتاً جدید هستن و بنابراین پشتیبانی مرورگرها اهمیت داره:
https://developer.mozilla.org/en-US/docs/Web/CSS/:where


اینکه حالا Specificity چیه رو خدمتون در پست های بعدی میگم



#css

ID Channel : @htmlcss_channel
This media is not supported in your browser
VIEW IN TELEGRAM
<< انعکاس تصاویر با استفاده از ویژگی CSS Box-Reflect >>

⚡️ به شما امکان می دهد محتویات یک عنصر را در یک جهت خاص (بالا، پایین، راست، چپ) منعکس کنید .

💥 پارامتر دوم مسئول آفست است. و جالب‌تر این است که می‌توانیم با استفاده از پارامتر سوم، یک گرادیان را به عنوان افکت محو اضافه کنیم .

-webkit-box-reflect: below 0px offset  linear-gradient(180deg , rgba(#fff, 0 ) 0%  , rgba(#fff, 0 ) 100%  );


#css