خانه » آموزش html و css » کاربرد befor و after در css
13 مهر 1400

کاربرد befor و after در css

کاربرد befor و after در css در دید اول برای وارد کردن محتوا به فایل html می باشد البته بدون اینکه تغییری در فایل html ایجاد کنیم. و باید توجه کنیم که این دو انتخابگر در مرورگرهای IE نیز استفاده می شوند.

اولین مورد استفاده وارد کردن محتوا از طریق css

المنتی با کلاس element در HTML در نظر گرفته شده است. کاربرد این عناصر در ساده ترین حالت به شکل زیر است.

کاربرد befor و after در css

 

کاربرد befor و after در css

توجه کنید که در مثال بالا فاصله ای بین borderو عناصر after:: و before:: بوجود آمده, بله آن فاصله padding مربوط به عنصر اصلی می باشد, پس این به این معناست که مکان این دو عنصر در حالت پیشفرض دقیقا کنار قسمت محتوی یک عنصر می باشد. برای دیدن این دو عنصر در DOM می توانید از ابزار Developer گوگل کروم استفاده کنید. اگر عنصری دارای after:: یا before: باشد با زدن مثلث کوچک کنار عنصر اصلی می توان آنها به صورت زیر را مشاهده کرد.

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

شهریار سلطانی

عضو هیات علمی در رشته مهندسی نرم افزار کانپیوتر و مدرس برنامه نویسی وب

دیدگاهتان را بنویسید

preloader