CSS امکان ایجاد لیست‌های گلوله‌دار و شماره‌دار، طراحی لیست‌های گلوله‌دار با تصاویر و در صورت لزوم، حذف هر گونه علامت‌گذاری لیست گلوله‌ای را به طور کلی فراهم می‌کند.

سبک های لیست گلوله های CSS.

لیست-سبک-نوع

لیست-سبک-نوع:دیسک | دایره | مربع | اعشاری | رومی پایین | روم بالا | آلفای پایین | آلفای بالا | هیچ یک ؛

معنی:

دیسک - لیست گلوله ای به شکل یک دایره پر

حلقه - لیست گلوله‌ای به شکل یک دایره پر نشده

مربع - یک لیست گلوله ای به شکل مربع پر شده

اعشاری - لیست شماره دار با اعداد عربی (1،2،3، و غیره)

رومی بالا - فهرست شماره گذاری شده با اعداد رومی بزرگ (I، II، III، IV، و غیره)

رومی پایین - لیست شماره گذاری شده با استفاده از اعداد رومی کوچک (i،ii،iii،iv، و غیره)

آلفای بالا - لیست شماره گذاری شده با حروف بزرگ (A، B، C، و غیره)

آلفای کوچک - لیست شماره گذاری شده با حروف کوچک (a،b،c، و غیره)

هیچ - بدون نشانگر.

مثال:

• به بهترین ها ایمان داشته باش، انتظار بدترین ها را داشته باش.
• زندگی یک بیماری است، با عاقبت کشنده.
• هرگز نگو هرگز.

نتیجه:

مواردی وجود دارد که نمایش یک نشانگر در لیست باید حذف شود. برای این کار در کد CSS بنویسید

لیست-سبک-نوع:هیچ یک؛

مثال:

• به بهترین ها ایمان داشته باش، انتظار بدترین ها را داشته باش.
• هرگز نگو هرگز.

نتیجه:

شما می توانید نشانگرهای معمول در لیست را با تصاویر خود جایگزین کنید. این را می توان با استفاده از ویژگی list-style-image انجام داد.

لیست-سبک-تصویر

list-style-image: url(image.png);

مثال:

• به بهترین ها ایمان داشته باش، انتظار بدترین ها را داشته باش.
• زندگی یک بیماری است که عاقبت آن کشنده است.
• هرگز نگو هرگز.

نتیجه:

همچنین می توانید فاصله لیست گلوله شده را از متن تنظیم کنید. این را می توان با استفاده از ویژگی padding-left در انتخابگر li انجام داد.

مثال:

• به بهترین ها ایمان داشته باش، انتظار بدترین ها را داشته باش.
• زندگی یک بیماری است که عاقبت آن کشنده است.
• هرگز نگو هرگز.

نتیجه:

کار بعدی تغییر رنگ نشانگر بدون تغییر رنگ متن است. چه طور ممکنه؟ رنگ نشانگر را می توان با افزودن یک برچسب به تست تغییر داد .
به نظر می رسد این است:

متن

مثال:

• به بهترین ها ایمان داشته باش، انتظار بدترین ها را داشته باش.
• زندگی یک بیماری است که عاقبت آن کشنده است.
• هرگز نگو هرگز.

نتیجه:

اضافه شدن به مبحث کلی
اگر به دلایلی نیاز دارید که شماره گذاری لیست نشانگر را نه از صفر، بلکه مثلاً از 8 تنظیم کنید، می توانید این حرکت را انجام دهید.

مثال:

• به بهترین ها ایمان داشته باشید، انتظار بدترین ها را داشته باشید
• زندگی یک بیماری کشنده است
• هرگز نگو هرگز
• این تمام چیزی بود که می دانستم. نقطه 4

نتیجه:

این تاپیک به پایان رسیده است.

می‌توانید از فهرست‌های گلوله‌دار یا شماره‌دار برای سازماندهی متن یا نمایش یک فرآیند متوالی در آن استفاده کنید ارائه های پاورپوینت.

تغییر رنگ و سبک نشانگرها و درک محدودیت ها

شما می توانید رنگ، سبک یا اندازه گلوله ها یا اعداد را در ارائه پاورپوینت خود تغییر دهید و همچنین می توانید شماره ای را که می خواهید با آن شروع کنید تغییر دهید.

استایل های سفارشی را در چند اسلاید اعمال کنید

بهترین راهسبک های فهرست سفارشی را برای همه اسلایدهای یک ارائه اعمال کنید - اسلاید اصلی را تغییر دهید. هر تنظیمات لیستی که در اسلاید مستر انجام دهید ذخیره می شود و در همه اسلایدها اعمال می شود. همچنین می‌توانید یک یا چند طرح‌بندی اسلاید را ویرایش یا ایجاد کنید که شامل سبک‌های فهرست سفارشی است و آنها را به مکان‌هایی در ارائه خود اضافه کنید که می‌خواهید از سبک‌های فهرست خود استفاده کنید.

لیست محدودیت ها در پاورپوینت

شما نمی توانید کارهایی را با لیست های موجود در پاورپوینت انجام دهید که می توانید از آنها در سایر برنامه های Office مانند Word استفاده کنید. به عنوان مثال، پاورپوینت از ویژگی های زیر پشتیبانی نمی کند:

پرسش و پاسخ

برای دستورالعمل های دقیق روی عنوان بخش زیر کلیک کنید.

چرا صرف نظر از اینکه چند خط اضافه می کنم فقط یک نشانگر می بینم؟

مطمئن شوید که در حال استفاده هستید متنفیلد نشانگر یا اعداد است نه یک فیلد عناوین. که در متنهر بار که کلیدی را فشار می دهید، یک عدد یا نشانگر ENTER ظاهر می شود. وقتی CTRL+ENTER را فشار دهید، خطوط اضافی بدون گلوله (برای جزئیات یا یادداشت‌های روی یک خط گلوله‌دار یا شماره‌دار) دریافت می‌کنید.

در زمینه عناوینانتظار می رود متن یک عنوان یا عنوان به عنوان یک خط باشد. می‌توانید از اعداد یا گلوله‌ها استفاده کنید، اما تمام خطوط متن را به‌عنوان یک خط شمارش می‌کند و در نتیجه یک گلوله یا شماره ایجاد می‌شود.

چگونه هر بار که یک خط اضافه می شود ایجاد نشانگرها را لغو کنیم؟

برای توقف ایجاد گلوله و اعداد و بازگشت به متن، کلیک کنید نشانگرهایا شماره گذاریدوباره آن را غیرفعال کنید.

همچنین می توانید ENTER را فشار دهید و کلید BACKSPACE را فشار دهید تا یک نشانگر یا شماره حذف شود. سپس می توانید متن اضافه کنید یا Enter را فشار دهید تا خطوط خالی اضافی اضافه شود.

چگونه از چندین سطح نشانگر استفاده کنیم؟

برای ایجاد یک فهرست فرعی در یک لیست، مکان نما خود را در ابتدای خطی که می خواهید تورفتگی کنید، و سپس روی زبانه قرار دهید. خانهدر گروه پاراگرافروی دکمه کلیک کنید افزایش سطح لیست .

1 . کاهش سطح فهرست (تورفتگی)

2 . افزایش سطح فهرست (تورفتگی)

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

چگونه می توانم فاصله بین یک گلوله یا عدد و متن روی یک خط را کم یا زیاد کنم؟

برای افزایش یا کاهش فاصله بین یک گلوله یا عدد و متن روی یک خط، مکان نما را در ابتدای خط متن قرار دهید. برای مشاهده خط کش، روی زبانه چشم اندازدر گروه نمایش دهیدکادر را علامت بزنید خط كش. روی خط کش، روی زبانه کلیک کنید (مانند تصویر زیر) و نشانگر را بکشید تا فاصله بین گلوله یا عدد و متن مربوطه را تغییر دهید.

خط کش سه نشانگر مختلف را برای نشان دادن تورفتگی تعریف شده برای فیلد متن نمایش می دهد.

1 . تورفتگی خط اول - محل کاراکتر یا شماره گلوله واقعی را نشان می دهد. اگر پاراگراف با گلوله نباشد، این نشان دهنده موقعیت خط اول متن است.

2 . تورفتگی چپ - مقادیر نشانگرهای خط اول و تورفتگی را تنظیم می کند و فاصله نسبی آنها را حفظ می کند.

3 . برآمدگی - محل خطوط واقعی متن را نشان می دهد. اگر پاراگراف با گلوله نباشد، محل سطر دوم (و سطرهای بعدی) متن را نشان می دهد.

چگونه می توانم گلوله های پیش فرض را به نماد دیگری تغییر دهم؟

برای تغییر گلوله‌های پیش‌فرض در پاورپوینت در رایانه شخصی ویندوز، این مراحل را دنبال کنید:

هنگامی که یک اسلاید یا کادر متنی را برای گلوله ها وارد می کنید، گزینه های گلوله پیش فرض جدید ظاهر می شوند.

برای اطلاعات بیشتر در مورد کار با استادها، به تغییر اسلاید مستر مراجعه کنید.

برای نشان دادن از گلوله یا شماره گذاری استفاده کنید مقدار زیادمتن یا فرآیند متوالی در ارائه مایکروسافت پاورپوینت 2010.

از گلوله‌ها یا شماره‌گذاری برای نشان دادن تعداد زیادی متن یا فرآیندهای متوالی در ارائه مایکروسافت آفیس PowerPoint 2007 استفاده کنید.

اگر تا به حال سعی کرده اید سبک های CSS شماره خطوط (اعداد) را در لیست های مرتب شده تغییر دهید

، پس احتمالاً با مشکلاتی روبرو شده اید. دسترسی به سبک های این عناصر با استفاده از انتخابگرهای CSS غیرممکن است. اما اغلب طراحی رابط شامل تغییر رنگ، پس زمینه، اندازه و غیره است.

در اینجا ساده ترین مثال از یک لیست بدون استایل آورده شده است:

html

1. برای کاشت درخت
2. خانه بساز
3. پسر بزرگ کن

بیایید به چندین روش برای حل مشکل فوق نگاه کنیم.

به طور سنتی یک راه ناشیانه.

روش سنتی برای حل این مشکل مخفی کردن شماره خطوطی است که به طور خودکار توسط مرورگر اختصاص داده می شود. در این مورد از ویژگی list-style: none استفاده می شود. .

css

li( سبک لیست: هیچکدام؛ .num( رنگ: سفید؛ پس‌زمینه: #2980B9؛ نمایشگر: بلوک درون خطی؛ تراز متن: مرکز؛ حاشیه: 5 پیکسل 10 پیکسل؛ ارتفاع خط: 40 پیکسل؛ عرض: 40 پیکسل؛ ارتفاع: 40 پیکسل)

html

1. 1برای کاشت درخت
2. 2خانه بساز
3. 3پسر بزرگ کن

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

بیایید ببینیم چگونه می‌توانیم بدون مسدود کردن طرح‌بندی و استفاده از شبه عنصر::before و محتوای خصوصیات CSS، counter-increment، counter-reset به همان نتیجه برسیم.

روشی زیبا و صحیح

ابتدا کد و دمو را ارائه می دهیم و سپس متوجه می شویم که چیست.

css

ol( counter-reset: myCounter; ) li (list-style: هیچکدام؛) li:prefore ( counter-increment: myCounter; content:counter(myCounter)؛ رنگ: سفید؛ پس زمینه: #2980B9؛ نمایشگر: inline-block. text-align: margin: 5px 10px;

html

1. برای کاشت درخت
2. خانه بساز
3. پسر بزرگ کن

همانطور که می بینید، کد html تمیز و زیبا باقی می ماند. در این حالت، تمام استایل عناصر لیست به css منتقل می شود.

بیایید نقطه به نقطه نگاه کنیم:

• li::قبل از– یک شبه عنصر در داخل لیست ایجاد می کند که جای فرزند اول را می گیرد.
• counter-reset:myCounter;– شمارنده css myCounter را در داخل هر یک بازنشانی می کند
  .
  1. ضد افزایش: myCounter;– شمارنده css myCounter را برای هر شبه عنصر::before افزایش می دهد.
  2. content:counter(myCounter);– مقدار فعلی شمارنده myCounter را در داخل عنصر :: قبل از شبه چاپ می کند.

جزئیات بیشتر در مورد شمارنده های css را می توانید در اینجا بیابید

لیست های CSS- مجموعه ای از ویژگی های مسئول طراحی لیست ها. استفاده از لیست های HTML هنگام ایجاد نوارهای ناوبری وب سایت بسیار رایج است. آیتم های لیست مجموعه ای از عناصر بلوک را نشان می دهند.

با استفاده از ویژگی های استاندارد CSS می توانید تغییر دادن ظاهرنشانگر لیست, یک تصویر برای نشانگر اضافه کنید، و تغییر مکان نشانگر. ارتفاع بلوک نشانگر را می توان با ویژگی line-height تنظیم کرد.

طراحی لیست با استفاده از سبک های CSS

1. نوع نشانگر لیست list-style-type

ویژگی نوع نشانگر یا را تغییر می دهد نشانگر را حذف می کندبرای لیست های گلوله ای و شماره گذاری شده به ارث برده.

لیست-سبک-نوع
ارزش های:
دیسک	مقدار پیش فرض. یک دایره پر شده به عنوان یک نشانگر برای موارد لیست عمل می کند.
ارمنی	شماره گذاری سنتی ارمنی.
دایره	یک دایره باز به عنوان یک نشانگر عمل می کند.
cjk-ایدوگرافیک	شماره گذاری ایدئوگرافیک
اعشاری	1, 2, 3, 4, 5, …
اعشاری-پیشرو-صفر	01, 02, 03, 04, 05, …
گرجی	شماره گذاری سنتی گرجستان.
عبری	شماره گذاری سنتی عبری
هیراگانا	شماره گذاری ژاپنی: a، i، u، e، o، …
هیراگانا-ایروها	شماره گذاری ژاپنی: i، ro، ha، ni، ho، …
کاتاکانا	شماره گذاری ژاپنی: A، I، U، E، O، …
katakana-iroha	شماره گذاری ژاپنی: I، RO، HA، NI، HO، …
آلفای پایین تر	الف، ب، ج، د، ه، …
یونانی پایین	حروف کوچک الفبای یونانی.
لاتین پایین	الف، ب، ج، د، ه، …
رومی پایین	i، ii، iii، iv، v، …
هیچ یک	هیچ نشانگری وجود ندارد.
مربع	یک مربع پر یا پر نشده به عنوان یک نشانگر عمل می کند.
آلفای بالا	الف، ب، ج، د، ای، …
لاتین بالا	الف، ب، ج، د، ای، …
روم بالا	I، II، III، IV، V، …
اولیه	مقدار ویژگی را به مقدار پیش فرض تنظیم می کند.
به ارث می برند	مقدار ویژگی را از عنصر والد به ارث می برد.

نحو

Ul (نوع-سبک لیست: هیچکدام؛) ul (نوع-سبک-لیست: مربع؛) ol (نوع-سبک-لیست: هیچکدام؛) ol (نوع-سبک لیست: نوع آلفای پایین؛) برنج. 1. نمونه ای از طراحی لیست های گلوله ای و شماره گذاری شده

2. تصاویر برای لیست آیتم های لیست-سبک-تصویر

می توانید از تصاویر و پرهای گرادیان به عنوان نشانگر آیتم های لیست استفاده کنید. به ارث برده.

نحو

Ul (list-style-image: url("images/romb.png");) ul (list-style-image: linear-gradient(#FF7A2F 0, #FF7A2F 50%, #FFB214 50%)؛)
برنج. 2. یک لیست گلوله ای با استفاده از یک تصویر طراحی کنید
برنج. 3. یک لیست گلوله ای با استفاده از گرادیان طراحی کنید

3. فهرست-سبک-موقعیت

این ویژگی امکان قرار دادن نشانگر را در خارج یا داخل محتوای آیتم لیست فراهم می کند. به ارث برده.





مواد مرتبط:

1. نمایشگاهی از آثار کوزما پتروف-ودکین در موزه روسیه افتتاح شد
2. رنسانس و مدرنیته
3. دستورالعمل: چگونه می توان یک SZV-M را برای یک مؤسس بدون حقوق پر کرد؟
4. قومیت روانشناسی: روابط بین قومی مردمان کوچک داغستان