از ویژگی border-image-width برای کوچک یا بزرگ کردن اندازه تکه تصویرهایی که توسط ویژگی border-image-slice برای حاشیه تصویری تعیین شده اند, استفاده می شود. این ویژگی به مرورگر می گوید که هر سمت حاشیه تصویری قرار است به چه اندازه عرض داشته باشد تا مرورگر بتواند حاشیه تصویری را به اندازه متناسب درآورد. به ناحیه […]
border-image-slice
ویژگی border-image-slice تصویری که قرار است به عنوان حاشیه از آن استفاده شود را به نه قسمت تقسیم می کند. که قسمت ها شامل چهار گوشه, چهار لبه و یک قسمت مرکز می باشند. این ویژگی عمل تقسیم کردن تصویر را بر اساس چهار مقداری که برایش تعیین می شود انجام می دهد, بطوریکه هر […]
border-image-source
از ویژگی border-image-source برای تعیین تصویری که به عنوان یک لایه پس زمینه اضافه به جای حاشیه ای که توسط ویژگی border-style مشخص می شود, استفاده می شود. اگر مقدار این ویژگی برابر با none باشد و یا تصویر قابل نمایش نباشد, استایل های مربوط به حاشیه اصلی (border) بر روی عنصر اعمال می شوند. […]
border-image
از ویژگی border-image برای تعریف یک حاشیه تصویری به جای حاشیه ای که برای یک عنصر توسط ویژگی border-style تعیین می شود, استفاده می شود. همینطور با استفاده از این ویژگی می توان یک لایه اضافی پس زمینه برای عنصر تعریف کرد. این ویژگی از نوع ویژگی های مختصر نویسی می باشد که با استفاده […]
background-size
از ویژگی background-size برای تعیین اندازه تصویر پس زمینه عنصر استفاده می شود. این ویژگی می تواند یک جفت مقدار درصدی و یا طولی بگیرد. همینطور کلمات کلیدی cover و contain را قبول می کند و در نهایت مقدار auto را هم می توان برای این ویژگی در نظر گرفت. background-size: 300px 200px; /* […]
background-origin
ویژگی background-origin تعیین می کند که شروع ترسیم پس زمینه عنصر در کدام ناحیه باشد. مقادیر متفاوت برای این ویژگی زمانی که با ویژگی هایی مثل background-repeat و background-clip ترکیب می شود باعث نتایج متفاوت می شود. اگر ویژگی background-attachment برای یک عنصر مقدار fixed داشته باشد ویژگی background-origin برای آن عنصر نادیده گرفته می […]
background-position
اگر برای یک عنصر پس زمینه ای تعریف شود ویژگی background-position مکان آن پس زمینه را برای آن عنصر (بعد از هرگونه تغییر اندازه پس زمینه) با توجه به ناحیه مشخص شده برای ترسیم پس زمینه تعیین می کند. این ویژگی کلمات کلیدی مثل top, bottom,right,left و center را می پذیرد. همچنین می توان مقدار […]
outline-offset
از ویژگی outline-offset برای تنظیم فاصله outline با مرزهای عنصر استفاده می شود. بصورت پیشفرض outline دور عنصر و بعد از حاشیه آن ترسیم می شود بطوری که فاصله ای بین آنها وجود ندارد اما با استفاده از ویژگی outline-offset می توان بین آنها فاصله بوجود آورد. این فاصله رنگی نخواهد داشت و شیشه ای […]
background-clip
ویژگی background-clip تعیین می کند که پس زمینه عنصر در کدام ناحیه و یا ناحیه ها ترسیم شود. هر عنصر از لحاظ مدل قسمت بندی دارای چهار ناحیه است که این نواحی شامل ناحیه محتوا (content-box), ناحیه فاصله داخلی (padding-box) و ناحیه حاشیه (border-box) و در نهایت ناحیه فاصله خارجی یا (margin-box) هستند. در حالت […]
mix-blend-mode
از ویژگی mix-blend-mode برای مشخص کردن حالت blend-mode در مورد آمیختن یک عنصر با محتوای پشت سر آن (backdrop) استفاده می شود. اول چند مفهوم را با استفاده از تصویر زیر بررسی می کنیم: source عنصر مورد نظر ما می باشد که می خواهیم ویژگی mix-blend-mode را بر روی آن اعمال کنیم. destination عنصر و […]