آموزش HTML و CSS آموزش after:: و before:: در CSS | پاسخ وردپرس |

مطالب پیشنهادی برای شما مهمان عزیز

بنام خدا سلام ,

درخدمت شما کابران عزیز هستم  با یکی دیگه از آموزشهای وب سایت
پاسخ وردپرس با آموزش آموزش after:: و before:: در CSS

آموزش after:: و before:: در CSS

این دو انتخابگر از نوع pseudo element می باشند که در نگاه اول و در تعریف اولیه می توان گفت این امکان
را به ما می دهند تا از طریق CSS بتوانیم محتوا وارد صفحه کنیم بدون اینکه نیازی به انجام تغییری در HTML باشد.

آموزش after:: و before:: در CSS

در دنیای مرورگرها امروزه به جایی رسیده ایم که می توان از این دو عنصر در صورت نیاز استفاده کرد.
توجه داشته باشید که در مرورگرهای عزیز IE هم, از IE8 به بالا این دو عنصر پشتیبانی می شوند.
برای اطلاعات بیشتر در مورد پشتیبانی مرورگرها به این سایت سر بزنید.

وارد کردن محتوی از طریق CSS

نگاهی به گذشته  در css2

فرض کنید عنصری با کلاس element در HTML وجود دارد. کاربرد این عناصر در ساده ترین حالت به طریق زیر است.

کد HTML

کدCSS

نتیجه 

آموزش after:: و before:: در CSS

 

یک مثال دیگه

ما می توانیم متن یا تصاویر را در contentاموال تقریبا به طریقی که می خواهیم، ​​سبک کنیم.

کد HTML

کدCSS

نتیجه 

آموزش after:: و before:: در CSS

راهنما

این مثال با استفاده ::after، در رابطه با attr()بیان CSS و یک data-descr ویژگی داده های سفارشی ، برای ایجاد راهنمای ابزار. هیچ جاوا اسکریپتی لازم نیست!

کد HTML

کدCSS

نتیجه 

آموزش after:: و before:: در CSS

: یا ::؟

همه مرورگرها هر دو روش نوشتن را پشتیبانی می کنند اما IE8 فقط : را پشتیبانی می کند پس بهترین روش برای نوشتن در حال حاضر به قرار زیر است.

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

توجه: این عناصر واقعی نیستند پس از قرار دادن محتوایی که برایتان اهمیت دارد و ضروری است در این عناصر خودداری کنید. به عنوان مثال محتوایی که می خواهید موتورهای جستجو ببینند در این عناصر قرار ندهید.

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

بیشتر بخوانید :
آموزش غیرفعال کردن آپدیت خودکار وردپرس

اگه این آموزش برای شما مفیدبود به دوستان خود توی شبکه های اجتماعی به اشتراک بزارید .
تایکی دیگه از آموزش های وب سایت پاسخ وردپرس خدا نگهدارشما

راستی! برای دریافت مطالب جدید در کانال تلگرام یا پیج اینستاگرام یا پیج یوتیوب پاسخ وردپرس عضو شوید.

یک برنامه نویس آزاد که علاقه زیادی به اشتراک گذاری اطلاعات خود با دیگران داردم. همیشه به وردپرس فکر می کنم و عاشق وردپرس هستم. من یک web developer هستم و هدف من آسان کردن ورود سایر دوستان به این شغل جذاب هست. زبان برنامه نویسی محبوب من PHP هست.

لینک کپی شد!

نظر شما در این‌باره چیست؟

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *