زمان جاری : پنجشنبه 09 تیر 1401 - 2:06 بعد از ظهر
نام کاربری : پسورد : یا عضویت | رمز عبور را فراموش کردم




تابلو اعلانات
elanat

ارسال پاسخ
تعداد بازدید 260
نویسنده پیام
saharrahin آفلاین


ارسال‌ها : 10
عضویت: 24 /1 /1394

تشکر شده : 3
لیست UL و LI در سی اس اس

در این بخش از آموزش css ، تنظیم لیست ها را آموزش میدهیم.

ویژگی هایی که برای یک لیست در css وجود دارد به ما این امکان را میدهد که List را در 3 حالت زیر نمایش دهیم.

تنظیم لیست یه صورت مرتب
تنظیم لیست به صورت نامرتب
تنظیم تصویر برای نشانگر لیست

در HTML دو نوع ار انواع لیست وجود دارد

unordered lists آیتم های لیست با یک نشانگرد گرد شکل مشکی ، نمایش داده میشوند
ordered lists آیتم های لیست با اعداد یا حروف ، نشانه گذاری میشوند.

Css این انعطاف پپذیری را به شما میدهد که نشانگر آیتم های لیست خود را به یک تصویر مدل دهید،که برای زیبایی طراحی سایت شما موثر میباشد.
با ویژگی list-style-type شما میتوانید marker لیست خود را به شکل مورد نظر خود تغییر دهید، این ویژگی شامل مقادیر زیر میباشد.

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

ol.c {list-style-type: upper-roman;}
ol.d {list-style-type: lower-alpha;}

با ویژگی list-style-image شما میتوانید تصویر مورد نظر خود را برای نشانگر لیست تنظیم نمایید.

ul
{
list-style-image: url(\'sqpurple.gif\');
}


این ویژگی ممکن است در تمام مرورگرها پشتیبانی نشود . در مثال زیر راه حل قطعی برای پشتیبانی تمام مرورگرها را میبینید.


ul
{
list-style-type: none;
padding: 0px;
margin: 0px;
}
ul li
{
background-image: url(sqpurple.gif);
background-repeat: no-repeat;
background-position: 0px 5px;
padding-left: 14px;
}

برای اینکه تمام این ویژگی ها را در یک خط اعمال کنید از مثال زیر میتوانید استفاده کنید ، که به ترتیب 1 list-style-image -3 list-style-position -2 list-style-type مقداردهی میشوند.

ul
{
list-style: square url(\"sqpurple.gif\");
}


امضای کاربر : تور استانبول گیت فروشگاهی تور ترکیه تور اروپا درب ضد سرقت درب اتوماتیک شیشه ای فویل لید لیوان پنیر بسته بندی لبنیات
پنجشنبه 25 تیر 1394 - 11:01
نقل قول این ارسال در پاسخ گزارش این ارسال به یک مدیر
تشکر شده: 1 کاربر از saharrahin به خاطر این مطلب مفید تشکر کرده اند: sahar708 &
nesbo آفلاین



ارسال‌ها : 148
عضویت: 29 /12 /1393
محل زندگی: ardabil
سن: 13
شناسه یاهو: siyamak.yousefi
تشکرها : 19
تشکر شده : 42
پاسخ : 1 RE لیست UL و LI در سی اس اس
با سلام
من این کد دوم را توی قالبم گذاشتم ولی کار نکرد
البته عکسشم من عوض کردمن یعنی از سیتسم خود قرار دادم
حالا اصلا نمی آد
چرا؟

امضای کاربر :



اگر خواهان زیادی داری ؛ حتما معنایش این نیست که ارزشمندی............. شاید ارزان قیمتی!!!

یکشنبه 04 مرداد 1394 - 13:13
نقل قول این ارسال در پاسخ گزارش این ارسال به یک مدیر
novin1 آفلاین



ارسال‌ها : 1
عضویت: 25 /6 /1394


پاسخ : 2 RE لیست UL و LI در سی اس اس
ممنون از مطلبی گذاشتید
ثبت شرکت

امضای کاربر : ثبت شرکت
پنجشنبه 09 مهر 1394 - 11:36
نقل قول این ارسال در پاسخ گزارش این ارسال به یک مدیر
ارسال پاسخ



برای ارسال پاسخ ابتدا باید لوگین یا ثبت نام کنید.


پرش به انجمن :