انتخاب رنگ سبز انتخاب رنگ آبی انتخاب رنگ قرمز

ستون در CSS

ستون های چندگانه در CSS

با استفاده از CSS3 ، شما میتوانید برای متن چند ستون مانند روزنامه ها درست کنید !
در این درس شما با مقادیر CSS Column آشنا می شوید :



پشتیبانی مرورگر ها
پشتیبانی مرورگر ها از CSS3 Border

اینترنت اکسپلورر از این ویژگی پشتیبانی نمی کند .
فایرفاکس برای این ویژگی نیاز به پیشوند -moz- دارد .
کروم و سافاری برای این ویژگی نیاز به پیشوند -webkit- دارند.
ایجاد ستون های چندگانه با CSS3

متغیر column-count تعیین میکند که نوشته باید به چند قسمت تقسیم شود .
نمونه
Internet ExplorerFirefoxChromeSafariOpera
div
{
-moz-column-count:3; /* Firefox */
-webkit-column-count:3; /* Safari and Chrome */
column-count:3;
}
تعیین فاصله بین ستون ها با column-gap

با استفاده از column-gap میتوانید بین ستون ها فاصله ایجاد کنید :

نمونه
Internet ExplorerFirefoxChromeSafariOpera
div
{
-moz-column-gap:40px; /* Firefox */
-webkit-column-gap:40px; /* Safari and Chrome */
column-gap:40px;
}
قوانین ستون های CSS

مقدار column-rule عرض ، حالت و رنگ بین ستون ها را معین می کند .

نمونه
Internet ExplorerFirefoxChromeSafariOpera
div
{
-moz-column-rule:3px outset #ff00ff; /* Firefox */
-webkit-column-rule:3px outset #ff00ff; /* Safari and Chrome */
column-rule:3px outset #ff00ff;
}
شرح دادن ویژگی های فوق

برای دیدن صفحه مخصوص هر یک از ویژگی های فوق روی نام آن ها کلیک کنید :

وی بی ایران در Facebook

صفحه رسمی وی بی ایران در فیس بوک قصد دارد تا بهترین مطالب را به Stream شما ارسال کند . اگر میخواهید :
  • استایل های جدید
  • هک های جدید
  • مقاله های محبوب
  • خبر های جدید ویبولتین
  • و ..
برای شما ارسال شود ، هم اکنون پیج ما را لایک کنید .
برای ورود به صفحه رسمی وی بی ایران روی آیکن فیس بوک کلیک کنید .