خیلی از دوستان عزیز با CSS3 ساید آشنایی داشته باشند و اطلاع داشته باشند که CSS3 امکانات خیلی زیادی را در اختیار کاربر می گذارد . با CSS3 می توان به راحتی افکت قرار داد در اطراف نوشته ها و می توان طرح بندی صفحه را بهبود داد.
در این مقاله می خواهیم شما را با ساخت حاشیه های زیبا با کمک CSS3 آشنا کنیم و می توانید خیلی راخت به کمک CSS3 ظاهر زیبا تری به عکس هایی که در نوشته های خود قرار می دهید بدهید . در ادامه مطلب می توانید با ما همراه باشید.


گرد کردن حاشیه ها :
شما می توانید به راحتی با CSS3 حاشیه را گرد کرده .با استفاده از این کد که در زیر برای شما قرار داده ایم می توانید ب راحتی گوشه ها را گرد کرده و می توانید اندازه و رنگ را نیز تغییر دهید.

.border_rounded {
background-color: #ddccb5;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border: 2px solid #897048;
padding: 10px;
width: 310px;
}

گرادینت در حاشیه:
حاشیه های گرادینت می تواند نگاهی موثر باشد به حاشیه ها و زیبایی قابل توجهی داشته باشد  . این کد کمی پیچیده تر می باشد چون شما نیاز به تعریف هر یک از رنگ ها در گرادیان می باشد. کد CSS3 در زیر:

.border_gradient {
border: 8px solid #000;
-moz-border-bottom-colors:#897048 #917953 #a18a66 #b6a488 #c5b59b
#d4c5ae #e2d6c4 #eae1d2;
-moz-border-top-colors:  #897048 #917953 #a18a66 #b6a488 #c5b59b
 #d4c5ae #e2d6c4 #eae1d2;
-moz-border-left-colors: #897048 #917953 #a18a66 #b6a488 #c5b59b
 #d4c5ae #e2d6c4 #eae1d2;
-moz-border-right-colors:#897048 #917953 #a18a66 #b6a488 #c5b59b
#d4c5ae #e2d6c4 #eae1d2;
padding: 5px 5px 5px 15px;
width: 300px;
}

جعبه سایه دار :
تا الان افزودن سایه به عناصر صفحه یک کار دشوار یا غیر ممکن بود ولی با CSS3 شما می توانید به راحتی می توانید به عناصر سایه دهید و یک جلوه خاص در سایتتان ایجاد کنید.

.border_shadow {
-webkit-box-shadow: 10px 10px 5px #888;
padding: 5px 5px 5px 15px;
width: 300px;
}

حاشیه با تصویر:
شاید شما دوست داشته باشید برای حاشیه متن ها و یا تصاویر خود در صفحه از یک حاشیه متفاوت و یا عکس استفاده کنید . که با تکه کد زیر می توانید به راحتی یک عکس برای متن و یا … قرار دهید .

.border_image {
-webkit-border-image: url(border.png) 27 27 27 27 round round;
}

در نتیجه :
این قابلیت را در CSS3 را می توان انقلاب حاشیه نام برد چرا که به شما این امکان را می دهند که در کم ترین زمان بهترین کار ها را انجام دهید و دیگر نیاز به استفاده از فتوشاپ نباشد . با این قابلیت شما می توانید جذابیت های بصری سایت خود را بسیار افزایش دهید . با ما همراه باشید تا مقالات بیشتری در باره CSS3 در سایت قرار دهیم.