border-style
با استفاده از استایل ما می توانیم برای اجزای یک صفحه کادر ایجاد کنیم. با استفاده از پارامتر border-style می توانیم مشخص کنیم که آیا می خواهیم کادر داشته باشیم یا نه، و اگر می خواهیم نوع کادری را که می خواهیم ایجاد کنیم مشخص کنیم. در اینجا می توانید برخی از مقادیری را که می توانیم برای border-style استفاده کنیم را ببینید:
- none
با استفاده از این مقدار تعیین می کنیم که نمی خواهیم کادر داشته باشیم. در صورتی که مقداری غیر از none تعیین شود کادر خواهیم داشت.
- solid
This DIV have a solid border
- dashed
This DIV have a dashed border
- dotted
This DIV have a dotted border
- double
This DIV have a double border
- groove
This DIV have a groove border
- hidden
- inset
This DIV have a inset border
- outset
This DIV have a outset border
- ridge
This DIV have a ridge border
همانطور که می بینید عرض این کادرها بیش از آن چیزی است که ما نیاز داریم چون ما برای این کادرها عرضی مشخص نکردیم. اگر بخواهیم عرض این کادرها به اندازه مشخصی باشد باید از پارامتر width که قبلاً با آن آشنا شدیم استفاده کنیم. به مثال زیر توجه کنید:
نتیجه به این صورت خواهد بود:
با سلام . اینبار به درخواست یکی دیگر از بازدید کنندگان سایت کد تبلیغات متنی را برای شما آماده کردم.
این کد در چهار رنگ میباشد و با سی اس اس کد نویسی شده است امید وارم لذت ببرید برای دانلود و اموزش ادامه مطلب را کلیک کنید....
لینک دانلود اصلاح شد
سایت CSS-Tricks در فوتر خود از یک افکت جالب برای آیکون های موجود در آن استفاده کرده که با قرار گرفتن موس روی آنها به شکل زیبایی رنگ و طرحشان عوض میشود! در این مطلب قصد دارم تا نوع ساده ای از این افکت را به شما آموزش دهم که با استفاده از CSS3 میتوان آن را ایجاد کرد.
از این افکت می توانید در زیباتر کردن آیکون های سایت، تصاویر و… استفاده کنید. امیدوارم قسمت پنجم این مجموعه مقالات نیز برای شما مفید باشد. برای خواندن آموزش به ادامه مطلب مراجعه کنید.
امروز کد و استایلی رو برای شما آماده کرده ام که امروزه افراد زیادی به دنبال این کد هستند.
این کد افکتی روی عکس شما ایجاد مکنه (دوحالت) که عکس شما با درصد وضوح مثلا ۷۰درصد نشان داده میشه و وقتی موس بر روی آن میرود به مقدار کاملا واضح میشود
آموزش زیبا کردن تصاویر موجود در وبلاگ و یا وبسایت به کمک CSS| به ادامه مطلب مراجعه نمایید...