آموزش CSS - صفت List

          mahdi 
            بازدید : 64
          پنجشنبه 26 مرداد 1391
           نظرات (0)
        

صفت List

از صفت List برای تغییر نشانه های لینک ها در صفحه اصلی سایت استفاده می شود . همانطور که دیده اید بعد از ایجاد لینک بوسیله تگهای ul.li پشت لینکها همیشه یک دایره به طور پیش فرض وجود دارد که شما می توانید آنها را بوسیله صفت List تغییر داده یا به طور کلی حذف کنید .
در HTML دو نوع لیست وجود دارد :
1. لیست هایی که به وسیله نشانه های مثل دایره ، مربع یا هر شکل دیگری نمایش داده می شود .
2. لیست هایی که به وسیله اعداد یا حروف الفبا نمایش داده می شود .

نکته: برای ایجاد لینکهای منظم از تگ OL و برای ایجاد لینکهای نامنظم از تگ Ul استفاده می کنیم . با یک مثال ساده بیشتر با این مفهوم آشنا می شوید.
دقت داشته باشید که کدهای اصلی در برنامه HTML نوشته می شود و فقط در این صفحه شما با صفت ها و خصوصیت های آنها آشنا می شوید .

ul.a {list-style-type: circle;}
ul.b {list-style-type: square;}

درباره آموزش CSS ,

ادامه مطلب ...

آموزش CSS - صفت Padding

          mahdi 
            بازدید : 56
          پنجشنبه 26 مرداد 1391
           نظرات (0)
        

صفت Padding

این صفت فضای بین کادرعنصر و محتوا را تعیین می کند .یک صفت تند نویس می باشد یعنی نیازی نیست حتما طرفین را با نوشتن به طور مثال padding-top مشخص کنید فقط کافیست همانند صفت margin اعداد خود را وارد کنید .
چند مثال میزنم تا بیشتر با این خاصیت آشنا بشوید .
lenght : اندازه حاشیه با یک مقدار ثابت تعیین می گردد.
% : اندازه حاشیه با درصدی از اندازه قالب تعیین می گردد.
اگر نخواهید از صفت تند نویس padding استفاده کنید می توانید دقیق مشخص نمایید که فاصله از چه طرفی اعمال شود به عنوان مثال فرض کنید می خواهید پاراگراف اول 20پیکسل از پاراگراف پایین یا دوم فاصله داشته باشد .
به این مثال توجه کنید هر 4 حالت را توضیح داده ام
از ویژگی float برای تعیین قرارگیری متن استفاده کرده ام .

.pic1
{
padding-bottom:50px;
}
.pic2
{
padding-left:50%;
float : left ;
}
.pic3
{
padding-right : 100px ;
}
.pic4
{
padding-top : 200px;
}

.left
{
float : left ;
}

درباره آموزش CSS ,

ادامه مطلب ...

آموزش CSS - صفت Margin

          mahdi 
            بازدید : 70
          چهارشنبه 25 مرداد 1391
           نظرات (0)
        

صفت Margin در CSS

این صفت یا خاصیت فضای اطراف عناصر را تعریف می کند . اگر مقدار منفی داشته باشد باعث روی هم افتادن حاشیه می شود. با این صفت می توان حاشیه بالا ، پایین ، راست و چپ را مستقل از جداکننده تغییر داد. صفتmargin نیز مانند بقیه صفتها یا خواص CSS دارای ویژگیهای دیگری می باشد که در ادامه به طور کامل برای شما توضیح میدهم اما خود Margin یک صفت تند نویس می باشد که می توانید تمام ویژگیها را یکجا وارد کنید .
به طور کلی صفت Margin سه مقدار را می پذیرد :
Auto : مرورگر به طور خودکار حاشیه گذاری می کند.
lenght : اندازه حاضیه با یک مقدار ثابت تعیین می گردد.
% : اندازه حاشیه با درصدی از اندازه قالب تعیین می گردد.
اگر نخواهید از صفت تند نویس margin استفاده کنید می توانید دقیق مشخص نمایید که فاصله از چه طرفی اعمال شود به عنوان مثال فرض کنید می خواهید پاراگراف اول 20پیکسل از پاراگراف پایین یا دوم فاصله داشته باشد .
به این مثال توجه کنید هر 4 حالت را توضیح داده ام

.margin1
{
margin-bottom:50px;
}
.margin2
{
margin-left:50%;
}
.margin3
{
margin-right:auto;
}
.margin4
{
margin-top:50px;
}

درباره آموزش CSS ,

ادامه مطلب ...

آموزش CSS - صفت Border

          mahdi 
            بازدید : 59
          چهارشنبه 25 مرداد 1391
           نظرات (0)
        

صفت Border

برای ایجاد کادر دور تصاویر و لبه های اطراف یک عنصر از صفت Borderاستفاده می شود . در HTML برای ساختن کادراز تگ table استفاده می شود ولی با Css می توانیم کادرهای زیبا برای هر عنصر ایجاد کنیم .
طبق آموزشهای قبل ابتدا خاصیت های صفت Border را معرفی میکنم و بعد هر کدام را با مثال برای شما توضیح میدهم .

border-color : تغییر رنگ خط ها
border-style : نوع شکل خطها را تعیین میکند
border-width : عرض و ضخامت خطها را تعیین میکند
border-top : برای قسمت بالای کادر کشیده شده یا تصویر یک خط در نظر می گیرد

border-bottom : برای قسمت پایین کادر کشیده شده یا تصویر یک خط در نظر می گیرد

border-right: برای قسمت راست کادر کشیده شده یا تصویر یک خط در نظر می گیرد

border-left : برای قسمت چپ کادر کشیده شده یا تصویر یک خط در نظر می گیرد

تمام خاصیت هایی که در بالا به آنها اشاره کردم می توانند دارای 3 خاصیت اول نیز باشند به این ترتیب که اگر بخواهید رنگ سمت راست یک کادر را تغییر بدهید می توانید از خاصیت

border-right-color

استفاده کنید یا اگر بخواهید عرض کادر بالای یک صفحه را ضخیم تر کنید از خاصیت

border-top-width

استفاده کنید.
صفت Border-color | border-style | border-width
از این خاصیت برای تغییر رنگ ، نوع خطور و ضخامت کادرهای کشیده شده استفاده می شود . شما می توانید رنگ مورد نظر خود را به صورت عددی ، هگزاد دیسمال یا نام رنگ وارد کنید . من برای اینکه دقیق متوجه بشوید نوع خط و ضخامت لبه های تصویر را نیز کمی درشت تر میکنم .

درباره آموزش CSS ,

ادامه مطلب ...

آموزش CSS - صفت FONT

          mahdi 
            بازدید : 64
          چهارشنبه 25 مرداد 1391
           نظرات (0)
        

صفت FONT

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

font-family :
fony-size :
font-style :
font-stretch :
font-variant :
font-weight :

صفت font-family
همانطور که میدانید مرورگرها از یک سری فونت استاندارد پشتیبانی می کننده یعنی شما در طراحی صفحات خودتان اگر از فونت نازنین استفاده کنید مرورگرها فونت شما را نشناخته و از فونت پیش فرض استفاده می کنند . برای اینکه متن های قالب شما از یک فونت در صفحه استفاده کنند از صفت font-family استفاده میکنیم .

درباره آموزش CSS ,

ادامه مطلب ...

صفحه قبل 1 2 3 صفحه بعد

تعداد صفحات : 3