لوگو دویکس
ورود / ثبت نام
ویژگی CSS align-self

ویژگی CSS align-self

دسته بندی : آموزش CSS سطح مقاله : متوسط زمان مطالعه : 2 دقیقه آخرین بروز رسانی: 19 بهمن 1399

در این مقاله با ویژگی CSS align-self آشنا می شوید.

استفاده از align-self

اگر از ویژگی align-items در یک ظرف خاص Flexbox استفاده می کنید و می خواهید برخی از موارد را به طور متفاوتی تراز کنید ، می توانید با استفاده از ویژگی align-self برای یک یا چند مورد جداگانه ، تراز بندی ظرف را نادیده بگیرید:

.flexcontainer {
    display: -webkit-flex; /* Safari */
    -webkit-align-items: flex-start; /* Safari 7.0 and newer */
    display: flex;
    align-items: flex-start;
}

بررسی ویژگی CSS align-self

نیازهای نحوی ساده هستند. بعد از تعریف ویژگی ، باید یکی از مقادیر موجود موجود را اختصاص دهید:

align-self: ارزش؛

می توانید تمام مقادیر ویژگی موجود برای استفاده با CSS align-self را در جدول زیر پیدا کنید.

ارزش های املاک

DescriptionValue
پیش فرض وسایل را متناسب با ظرف می کشدstretch
موارد را در مرکز ظرف قرار می دهدcenter
موارد را در ابتدای ظرف قرار دهیدflex-start
موارد را در انتهای ظرف قرار دهیدflex-end
آیتم ها را در خط پایه ظرف قرار می دهدbaseline
مقدار پیش فرض ویژگی را برمی گرداند.initial
ویژگی را از عنصر اصلی به ارث می برد.inherit

توجه: درست مانند align-items ، align-self نمی تواند به صورت ارثی یا متحرک باشد.

پشتیبانی از مرورگر

این تگ در مرورگرهای : IE، safari ، firefox، cherom، opera  و Edge پشتیبانی می شود.

در دوره آموزش HTML و CSS بین المللی آکادمی دویکس به صورت رایگان ثبت نام کنید.

این مقاله چقدر براتون مفید بود؟

اولین امتیاز را ثبت کنید😊