آیا به دنبال راهی برای ایجاد حاشیه گرادیانت در المنتور هستید؟ در این مقاله، به شما آموزش خواهیم داد تا با ساده ترین روش ممکن حاشیه گرادیانت را با استفاده از ویرایشگر المنتور ایجاد کنید. با استفاده از یک حاشیه گرادیانت در صفحات وبسایت خود می توانید زیبایی وبسایت خود را افزایش دهید. همچنین، با حاشیه گرادیانت برای بخش های مختلف می توانید وبسایت خود را منحصر به فرد کنید.
هیچ ابزارکی در المنتور برای ایجاد حاشیه گرادیانت در دسترس نیست. بنابراین باید از ویژگی (CSS) سفارشی استفاده کنید، تا حاشیه گرادیانت زیبا برای بخش های وبسایت خود ایجاد کنید. می توانید این حاشیه گرادیانت را در هر نقطه از وبسایت خود اضافه کنید. می توانید حاشیه را به یک دکمه اضافه کنید یا می توانید آن را برای هر بخش خاصی اضافه کنید. بنابراین بیایید ببینیم چگونه می توانید به راحتی یک حاشیه گرادیانت ایجاد کنید. (برای استفاده از این ویژگی باید از نسخه پرمیوم المنتور استفاده کنید.)
نکته : برای خرید افزونه المنتور پرو اینجا کلیک کنید.
نحوه ایجاد حاشیه گرادیانت در المنتور
صفحه ای را که در آن می خواهید حاشیه گرادیانت را اضافه کنید، با ویرایشگر المنتور باز کنید. اکنون روی آیکون “+” کلیک کنید تا بخش اضافه شود.
اکنون باید یک ستون برای بخش خود انتخاب کنید. در اینجا ما از بخش تک ستونی استفاده می کنیم. روی ستونی که برای استفاده انتخاب کرده اید کلیک کنید.
اکنون باید یک ابزارک اضافه کنید، تا یک حاشیه گرادیانت روی آن ابزارک ایجاد کنید. در اینجا ما یک ابزارک متنی را اضافه می کنیم.
اکنون مقداری متن را در ابزارک خود اضافه می کنیم و سپس از قسمت پیشرفته (Advanced) یک حاشیه به بخش اضافه می کنیم.
با استفاده از قسمت استایل (Style) می توانید رنگ متن را تغییر دهید و سبکی نیز به متن اضافه کنید. حالا برای ایجاد حاشیه گرادیانت از قسمت پیشرفته (advanced) به گزینه (CSS) سفارشی بروید. حالا کد زیر را در قسمت (CSS) سفارشی اضافه کنید تا یک حاشیه گرادیانت ایجاد شود.
selector {
border-left: 1px solid #AF24D1;
border-right: 1px solid #F0C3FB;
box-sizing: border-box;
background-position: 0 0, 0 100%;
background-repeat: no-repeat;
background-size: 100% 1px;
background-image: linear-gradient(to right, #FF1685 0%, #AF24D1 100%), linear-gradient(to right, #AF24D1 0%, #FF1685 100%);
}
می توانید قسمت رنگ را در کد بالا به دلخواه خود تغییر دهید. پس از افزودن این کد ، یک حاشیه گرادیان در بخش ابزارک متن شما ایجاد می شود. حاشیه باید مطابق با شکل زیر باشد: