حاشیه، گوشه‌ها و سایه در المنتور

حاشیه، گوشه گرد (ردیوس)، سایه کادر

در این مقاله قصد داریم که سه نکته بسیار مهم را ذکر کنیم. مواردی که می‌خواهیم درباره آن‌ها توضیح دهیم در طراحی سایت بسیار کاربرد دارند و سایت شما را تا حد زیادی زیباتر خواهند کرد. این سه نکته مهم در واقع حاشیه (Border)، گوشه گرد (Border Radius) و سایه (Box shadow) هستند.

قابل ذکر است که یادگیری نام‌های انکلیسی این فاکتورها برای یک طراح سایت بسیار ضروری به حساب می‌آید. بنابراین باید به آن‌ها توجه کنید و حتما نام انگلیشان را یاد بگیرید. حالا همانطور که گفتیم به خط یا کادر دور هر المانی Border می‌گوییم. گوشه گرد یا Border radius هم که به گوشه کادرها یک انحنای زیبا می‌دهد. در اکثر مواقع استفاده از این قابلیت طراحی شما را بسیار جذاب‌تر می‌کند. همچنین ما با استفاده از سایه یا Box shadow می‌توانیم به کادرها یا المان‌های خود بعد بدهیم و ظاهر آن‌ها را جذاب‌تر کنیم.

حاشیه یا Border در المنتور

مانند همیشه ابتدا به صفحه طراحی با المنتور بروید و یک ردیف ایجاد کنید. حالا برای اینکه بهتر متوجه شوید که حاشیه یا Border دقیقا چیست یک ردیف داخلی به ستون خود اضافه کنید. می‌توانید برای راحت‌تر شدن کار، یکی از ستون‌های ردیف داخلی را کلا حذف نمایید. سپس با استفاده از المان تصویر یک عکس به دلخواه خود اضافه کنید.

همانطور که می‌دانید از تب استایل در قسمت تنظیمات تصویر می‌توانید اندازه آن را تغییر دهید. سپس یک المان سربرگ در زیر عکس اضافه کنید. همچنین متن سربرگ را وسط چین نمایید و فونت دلخواه خود را تعیین کنید. دوباره یک المان ویرایشگر متن در زیر سربرگ اضافه کرده و متنی درون آن قرار دهید. متن این قسمت را هم مانند سربرگ وسط چین کرده و فونت آن را تغییر دهید. برای تکمیل طراحی خود می‌توانید یک دکمه هم در پایین کادر اضافه کنید.

حالا طراحی کادر شما تمام شد. اگر توجه کنید متوجه خواهید شد که کادرتان هیچ نظم و محدوده‌ای ندارد. به جهت بهتر شدن طراحی باید برای ردیف داخل خود یک حاشیه در نظر بگیرید. برای این کار به تنظیمات ردیف داخلی بروید و از تب استایل نوع کادر دور را انتخاب کند. همچنین در ادامه باید عرض و رنگ کادرتان را هم تعیین نمایید.

انحنا یا Border Radius در المنتور

همانطور که در جلسات قبل آموختید، اگر کمی به چهار طرف کادر خود پدینگ دهید، طراحی شما بهتر به نظر خواهد رسید. همچنین از طریق همین تب می‌توانید به گوشه‌های کادرتان انحنا یا Border radius دهید. برای این کار کافی است مقدار Radius که می‌خواهید را در قسمت انحنای مرز وارد کنید. قابل ذکر است که از طریق قسمت تنظیمات تصویر هم می‌توانید به گوشه‌های عکس خود انحنا دهید.

سایه یا Shadow در المنتور

حالا برای اعمال سایه به کادر خود باید خط حاشیه را به کلی حذف کنید. سپس از بخش حاشیه در قسمت تنظیمات به کادر خود سایه دهید. برای انجام این کار کافی است که بر روی گزینه سایه کادر کلیک کنید. البته حالت استادارد سایه اینگونه است که رنگ و شفافیت بسیار کمی دارد. همچنین تنظیمات افقی، عمودی وگسترده را بر روی عدد یک بگذارید و گزینه محو شدگی را بر روی عدد ده. این اعداد معمولا مقدار استاندارد سایه تلقی می‌شوند.

سخن پایانی

باید توجه داشته باشید که کل این آموزش‌ها نیاز به تمرین و تکرار مداوم دارند. شما بدون تمرین کردن هرگز یک طراح سایت حرفه‌ای نخواهد شد. امیدواریم که مطالب این مقاله برای شما مفید واقع شده باشد. می‌توانید سوالات و پیشنهادات خود را در قسمت دیدگاه‌های سایت ثبت کنید تا همکاران ما در اولین زمان ممکن به شما پاسخ دهند.