نحوه قرار دادن موارد لیست به صورت افقی؟ نمونه هایی از طراحی شیک UL LI LI لیست CSS مطابقت برچسب HTML توصیف OL.

ما مکالمات ما را در مورد آغاز HTML ادامه خواهیم داد. در این مقاله من می خواهم در مورد چگونگی ایجاد پاراگراف ها، لیست ها و سرفصل ها در متن صحبت کنم. و همچنین در مورد برچسب های انفرادی
و

من به شدت به شما توصیه می کنم خود را با اولین درس در این مجموعه آشنا کنید، و همچنین با مقاله مقدماتی در مورد آغاز مطالعه HTML کسانی که هنوز با آنها آشنا نیستند.

در حال حاضر ما به بررسی برچسب ها ادامه خواهیم داد. فرض می کنم که خواننده قبلا با مواد مقالات فوق آشنا شده است.

همانطور که همیشه، طرح کار:

1. پاراگراف ها
2. ردیف ردیف
   
3. لیست ها و لیست ها
4. سرفصل
5. قوانین افقی

   ---

پاراگراف ها

متن تقریبا همیشه شامل پاراگراف ها است. پاراگراف عنصر متن است که فکر کامل را انجام می دهد.

در پاراگراف HTML، چگونه می توان از هدر محاکمه کرد، نشان داده شده است. نامه "P" از کلمه "پاراگراف" گرفته شده است، که "پاراگراف" نشان دهنده "پاراگراف" است.

یک مثال را در نظر بگیرید:

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

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

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

ردیف ردیف

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

باد پیاده روی سرگرم کننده است

و قایق سفارشی است

او خود را در امواج اجرا می کند
بر روی بادبان های بزرگ

این شعر Fragmet A.S. Pushkin به ما کمک کرد تا عمل برچسب را نشان دهیم
. من به طور خاص از دو خط از این چهارمین نوشته شده در یک خط از کد نوشته شده است تا نشان دهد که خطوط به خط جدید منتقل نمی شوند، زیرا ما انتقال خطوط را قرار می دهیم و به این دلیل که برچسب ها را قرار می دهیم
. این برچسب کاملا ساده است و به توضیحات مفصل نیاز ندارد، بنابراین ما در مورد آن بحث خواهیم کرد.

فهرست

و عناصر لیست ها

گاهی اوقات در متن شما باید چیزی را لیست کنید. برای این منظور، سه برچسب استفاده می شود: UL، OL، LI. تمام این برچسب های کانتینر، اما برچسب همیشه در یکی از ظروف قرار دارد و یا در خارج از آنها حساس نیست. کانتینر UL زمانی که ما برای نظم موقعیت های ذکر شده مهم نیست، اعمال می شود و ما نمی خواهیم بر نظم که در آن حرکت می کنیم تمرکز کنیم. و برچسب OL، برعکس، بر روی دنباله ای از عناصر تمرکز می کند، به طور خودکار هر خط را نابود می کند. یک مثال را در نظر بگیرید:

• فله


• گیره


• لاغر


• گیره

در صفحه مرورگر، این کد به نظر می رسد:

• فله
• گیره
• لاغر
• گیره

اگر ما به سادگی برچسب UL را در برچسب OL جایگزین کنیم، سپس یک لیست شماره دریافت می کنیم:

1. فله


2. گیره


3. لاغر


4. گیره

در حال حاضر به نظر می رسد این است:

1. فله
2. گیره
3. لاغر
4. گیره

هیچ کس ممنوعیت سرمایه گذاری یک لیست به دیگری، تشکیل لیست های توزیع شده با الاغ ها را ممنوع می کند:

ابزار:

• اره


• پیچ گوشتی
  
  
  
  1. سر راست
  
  
  2. صلیب
  
  
  
  


• مته

لازم است کمی با این لیست ها آزمایش کنید تا آنها را یاد بگیرند. نوع دیگری از لیست ها وجود دارد، اما به ندرت اعمال می شود، بنابراین در حال حاضر به آن نمی گویم. شاید در مقاله دیگری باشد

البته، به عنوان هر چیز دیگری، ظاهر این عناصر را می توان فراتر از شناخت با استفاده از CSS تغییر داد.

سرفصل

البته، پاراگراف ها در ساخت اسناد کمک می کنند. اما به منظور سر و صدا یک متن بزرگ به قطعات کوچکتر کوچکتر، شما می توانید به هر یک از آنها حق داشته باشید. هر قسمت ممکن است حتی قربانی شود، با سرصفحه های پایین تر آن، و غیره. به وظیفه هدر، برچسب ها را خدمت کنید جایی که "X" یک عدد از 1 تا 6 است، هدر سطح پایین تر است، بیشتر تعداد است. به این معناست که عنوان بالاترین سطح H1 نامیده می شود، و پایین ترین - H6. به طور پیش فرض، متن واقع شده در این سرفصل ها با فونت بزرگ با تحریکات نمایش داده می شود. این متن در کل رشته نمایش داده می شود، یعنی برچسب های HX بلوک هستند. برچسب H1 بزرگترین فونت است و برچسب H6 کوچکترین است. به عنوان یک قانون، در صفحه اول، حداکثر - دو برچسب از سطح بالا H1. با کاهش سطح، تعداد برچسب ها افزایش می یابد. اما به ندرت، به عنوان یک وب مستر می تواند متن را از بین ببرد تا او 5 یا 6 سطح سرفصل داشته باشد. حتی سطح چهارم به ندرت اعمال می شود.

صحبت کمتر، کار بیشتر!

عنصر

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

تگ

این اشاره به بلوک عناصر است، بنابراین تمام عرض های قابل دسترسی به آن را اشغال می کند، و اندازه ارتفاع به مقدار محتوا بستگی دارد.

امتیازات لیست های شماره گذاری شده با استفاده از برچسب تعیین می شود

• که علاوه بر متن، ممکن است شامل سایر عناصر HTML (لیست ها، تصاویر، سرفصل ها، پاراگراف ها و غیره) باشد. به طور پیش فرض، لیست های مشخص شده در یک صفحه وب به صورت یک لیست از یک دایره کوچک سیاه نمایش داده می شوند. مرورگرها هنگام نمایش عناصر لیست، یک لبه کوچک را از لبه سمت چپ اضافه می کنند.

  توجه داشته باشید:اگر k.

  اموال CSS اعمال می شود، سپس عناصر
  • این خواص را به ارث برده است.

    نکته:برای تغییر نوع نشانگر، از ویژگی CSS List-Style-Style یا Property List-image استفاده کنید، به شما این امکان را می دهد که نشانگرهای را بر روی تصاویر جایگزین کنید. از برچسب برای ایجاد لیست های شماره گذاری استفاده کنید

    .

    نحو

    ...
    • ...
    ...

    برچسب بسته شدن

    واجب.

    ویژگی های

    جمع و جور حفظ شده در HTML5 باعث کاهش اندام و فاصله بین ردیف ها می شود. نوع HTML5 را از نمایه نشانگر لیست تنظیم می کند.

    برای این مورد موجود است ویژگی های جهانی و مناسبت ها.

    سبک بندی به طور پیش فرض

    اکثر مرورگرها یک مورد را نمایش می دهند

    با مقادیر CSS زیر به طور پیش فرض:

    ul (نمایش: بلوک؛ نوع سبک نوع: دیسک؛ حاشیه بالا: 1em؛ حاشیه پایین: 1 em؛ حاشیه سمت چپ: 0؛ حاشیه راست: 0؛ Padding-left: 40px؛)

    تفاوت بین HTML 4.01 و HTML5

    ویژگی های جمع و جور و نوع در HTML5 پشتیبانی نمی شود.

    مثال استفاده:

    فهرست HTML نامحدود:

    مثال HTML:

    خودتان انرا آزمایش کنید
    • قهوه
    • چای
    • کاکائو

    مشخصات فنی

    مشخصات	وضع
    استاندارد HTML HTML (Whatwg)	استاندارد زنده
    HTML 4.01 (W3C)	توصیه
    HTML5 (W3C)	توصیه
    HTML 5.1 (W3C)	توصیه

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

    خودتان را امتحان کنید - مثالها

    نحوه ایجاد لیست با شماره های مختلف از 1 شروع می شود.

    لیست ها شماره گذاری شده و غیر شماره گذاری شده اند.

    لیست های شماره شده توسط کد نمایش داده می شود:

    لیست با اعداد
    1. پاراگراف 1
    2. نقطه 2
    3. نقطه 3

    لیست شماره های شماره گذاری شده توسط کد نمایش داده می شود:

    لیست با علامت ها یا نمادهای دیگر
    • پاراگراف 1
    • پاراگراف 1
    • پاراگراف 1

    هر آیتم هر لیست در برچسب Li قرار دارد. تمام موارد لیست در یک برچسب مشترک UL یا OL به پایان می رسد. سبک های این برچسب ها در ورق سبک تجویز می شود.

    برای هر برچسب، سبک های طراحی خاصی را اختصاص داده است. آنها نشانه های متن را نشان می دهند.

    برای یک لیست شماره، سبک های شماره گذاری برای هر مورد تجویز می شوند.

    اعداد استاندارد عربی با ارزش دهدهی توصیف می شوند.

    فهرست سبک نوع: دهدهی؛ / * عددهای عربی * /

    برای لیست مشخص شده، سبک شخصیت ها - مربع ها یا محافل نشان داده شده است.

    لیست سبک نوع: دایره؛ / * mugs * /
    فهرست سبک نوع: مربع؛ / * مربع * /

    هر آیتم منو می تواند یک تصویر اختصاص داده شود.

    لیست سبک-تصویر: URL ('مسیر به تصویر')؛

    معمولا در قالب ها، لیست شماره ها با شماره های ساده ساخته شده است، و نه شماره های سیاه و سفید و محافل. خسته کننده و بی نظیر است. بیایید آن را حل کنیم
    

    سبک های لیست ها کجا هستند که در قالب بیست وازدهم نوشته شده اند؟

    فایل سبک style.css را باز کنید. پیدا کردن یک بخش با عنوان / * عناصر متن * /

    کد استاندارد به نظر می رسد:

    چگونه یک لیست شماره را ترتیب دهید؟

    لیست شماره با استفاده از پس زمینه

    به این طراحی زیبا یک لیست شماره گذاری نگاه کنید.

    پسندیدن؟ بیایید تکرار کنیم

    سبک های OL را پیدا کنید. خواص جدید را به آن فشار دهید.

    OL (Padding: 0PX 0 0 20px؛ حاشیه: 0.5EM 0 1.571EM 1.9EM؛ رنگ: # 2E2E2E؛ لیست سبک: هیچ کدام؛ فونت: 15px / 17px Verdana، Arial، Helvetica، Sans-Serif؛ Z-index : 2؛ ضد بازنشانی: نقطه؛) OL Li (حاشیه پایین: 4px؛ خط ارتفاع: 1.6؛ رنگ: # 2E2E2E؛ موقعیت: نسبی؛) OL LI: قبل (حاشیه پایین: 4px؛ ضد افزایش: نقطه 1؛ ارتفاع خط: 1.6؛ ارتفاع: 24 پیکسل؛ حاشیه سمت چپ: -36 پیکسل؛ سمت چپ: 0 پیکسل؛ عرض: 24 پیکسل؛ حاشیه: 1 پیکربندی؛ سابقه: # BDC3C7؛ محتوای: شمارنده (نقطه)؛ متن ترانه: مرکز؛ موقعیت: مطلق؛ فونت وزن: BOLD؛)

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

    لیست سبک نوع: هیچکدام؛ - خروجی رقم استاندارد را غیرفعال می کند
    ضد بازنشانی: نقطه؛ - متغیر را برای شمارش شماره گذاری مشخص می کند
    موقعیت: نسبی؛ - تعداد آنها را در نزدیکی موارد خود قرار می دهد

    قبل از - شبه عنصر برای برچسب OL Li. این سبک های زیر را دارد:
    محتوا: شمارنده (نقطه)؛ - مقدار متغیر را نمایش می دهد
    ضد افزایش: نقطه 1؛ - شمارنده را در 1 افزایش می دهد
    موقعیت: مطلق؛
    سابقه و هدف: # BDC3C7؛ - پس زمینه برای اعداد (پس زمینه را می توان توسط رنگ یا آیکون زیبا تنظیم شده است
    حاشیه - دنیای خارجی
    Padding - Indents داخلی
    رنگ - عنصر رنگ متن
    پس زمینه - پس زمینه
    Text-align - تراز متن
    فونت وزن - ضخامت (اشباع) فونت

    در سبک های خود می توانید هر رنگ، هماهنگی، اندازه فونت و دندانه را مشخص کنید.

    لیست شماره با یک تصویر منحصر به فرد برای هر مورد

    در یک سایت زن لیست های بسیار جذاب وجود دارد.

    چگونه آن را اجرا می شود؟ بیایید به کد زیر نگاه کنیم:

    / * شماره اول * / OL Li: اولین فرزند (لیست سبک-تصویر: URL (مسیر به تصویر با رقم 1)؛) / * شماره دوم * / OL LI: Nth-Child (2n) (لیست سبک - تصویر: URL (مسیر به تصویر با رقم 2)؛) / * شماره سوم * / OL LI: Nth-Child (3N) (لیست سبک-تصویر: URL (مسیر به تصویر با رقم 3)؛) / * شماره چهارم * / OL Li: Nth-Child (4N) (لیست سبک-تصویر: URL (مسیر به تصویر با رقم 4)؛) / * بعدی، ما دقیقا فقط برای نقاط زیر امتیاز * /

    در کد چنین لیست شماره، شما باید تمام نقاط اقلام را فهرست کنید و برای هر یک از آنها یک آیکون منحصر به فرد را اختصاص دهید.

    اگر شما تا 20 آیتم شماره گذاری شده در مقالات در مقالات استفاده می کنید، باید 20 بار کلاس Nth-Child (A) را ثبت کنید. به طوری که دومی در سبک های آن یک فرزند شبه کلاسیک (20n) بود.

    سبک های دوخت را در فایل سبک هایی که طراحی لیست شماره (برچسب های OL Li) را توصیف می کنند را پیدا کنید.

    شبه کودک اول کودک را استخراج کنید. کپی و چسباندن آن یک بار، سپس این ویژگی را به Nth-Child (A) تغییر دهید و کپی کنید تا اعداد باید آیکون خود را داشته باشند. موارد لغزش

    برای هر شماره، اموال لیستی از تصویر را با آیکون منحصر به فرد خود بخوانید.

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

    چگونه می توان یک لیست مشخص شده (غیر اندازه گیری شده) را ترتیب داد؟

    صفحه نمایش Li Li لیستی با آیکون های متناوب

    من واقعا چنین لیست مشخصی را دوست داشتم

    ul (padding: 11px 0 5px 0؛) ul li (padding-left: 32px؛ حاشیه پایین: 10px؛ فونت: نرمال 15px verdana، sans-serif؛ رنگ: # 2E2E2E؛ خط ارتفاع: 1.6؛ مرز پایین: 1PX Dashed #CCC؛ Padding-Bott: 10px؛) UL Li: قبل از: مطلق؛ عرض: 27 پیکسل؛ ارتفاع: 24 پیکسل؛ حاشیه سمت چپ: -35 پیکسل؛ حاشیه بالا: -2px؛ سابقه و هدف: URL ("تصاویر / sprite. jpg ") 0px 2px بدون تکرار؛ لیست سبک نوع: دایره؛) ul li: nth-child (2n): قبل از: مطلق؛ عرض: 27 پیکسل؛ ارتفاع: 43 پیکسل؛ حاشیه سمت چپ: -35px؛ مارجین بالا : -2px؛ سابقه و هدف: URL ("images / sprite.jpg") 0px -17px بدون تکرار؛ لیست سبک نوع: دایره؛)

    شما می توانید، به جای سبک استاندارد سبک سبک، اختصاص "مسیر به آیکون" اموال - لیست سبک-تصویر: URL. اما پس از آن شما باید یک رکورد سمت چپ خارجی را از گرفتگی های سایت ثبت کنید - بدون آن، آیکون ها نمایش داده نخواهند شد، فراتر از منطقه محتوا قرار می گیرند.

    یک تناوب را می توان به آزمایش اختصاص داد:

    ul li (images / radio.png)؛ حاشیه چپ: 30px؛)

    جایگزینی آیکون ها را می توان توسط مالکیت Nth-Child (AN) تعیین کرد. مثال استفاده از شبه عنصر پیش از آن است.

    کد یک فرزند شبه کلاسیک (2n) ثبت شده است. مقدار آن - 2. معلوم می شود که شناسه دیگر مطابق با هر مورد دیگر است. اگر به جای 2n 2n + 1 بنویسید، نماد دیگر باید آیتم های عجیب و غریب را انجام دهد.

    برای هر آیتم لیست، شما می توانید برجسته تر را تنظیم کنید. در مثال بالا، اقلام توسط نقطه نقطه تاکید شده است.

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

    چگونه برای نمایش چند لیست با طرح های مختلف در صفحه؟

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

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

    در اینجا، به عنوان مثال، یک گزینه طراحی زیبا:

    در HTML شما لیست را مانند این را ثبت می کنید:

    محتوا
    1. پاراگراف 1
    2. نقطه 2
    3. نقطه 3

    در CSS شما سبکهای مانند این را خوردید:

    OL # SOD (PADDING: 0PX 20PX 10PX 51PX؛ حاشیه: 0.5EM 0 0 EEM 1EM؛ رنگ: # 2E2E2E؛ لیست نوع سبک: هیچ؛ سابقه و هدف: # F1F4F5؛ Border-LEEP - بلوک؛) OL # SOD LI () OL # SOD LI: قبل (فونت وزن: عادی! مهم)

    سبک جدید متفاوت از طراحی اصلی OL برچسب است: پس زمینه، سبک نمایش، خط به سمت چپ محتوای.

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

    این روش ها قابل اجرا هستند و در طراحی آیتم های منو، عناصر و سایر عناصر سایت دیگر.
    

    چگونه برای ایجاد لینک های آرماتور در لیست محتوا؟

    چگونه آنها را در کد HTML ثبت نام کنید؟ یک قطعه کد یک لینک لنگر را طراحی کرده و یک قطعه دیگر کد در کنار مکان قرار دارد که در آن شما باید هنگام کلیک بر روی لینک کلیک کنید.

    محتوا
    1. عنوان 1
    2. عنوان 2
    3. عنوان 3

    و در متن مقاله شما باید این را بنویسید:

    عنوان 1 ... عنوان 2 ... عنوان 3 ...

    شاید وب مستعمره های با تجربه تر من را اصلاح کنند. من فقط توصیه می کنم آنچه را که سعی کردم خودم را انجام دهم.

    اگر سوالی دارید، خوشحال خواهم شد که آنها را در نظرات ببینم.

    Ageev Veronica.

    شاید شما نیز علاقه مند به:

    سلام، وب سایت خوانندگان وبلاگ عزیز. امروز، در چارچوب این دسته، من می خواهم در مورد انواع لیست های HTML صحبت کنم که می تواند بر اساس برچسب های ویژه طراحی شده UL، OL، LI و DL ایجاد شود. با استفاده از جفت UL و LI، لیست های برچسب دار با استفاده از OL و LI - شماره گذاری شده اند، و با کمک عناصر DL، DT و DD، لیست به اصطلاح تعریف ایجاد شده است. ما همچنین اصول کوتاهی را برای ایجاد ساختارهای توزیع شده در نظر می گیریم.

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

    لیست های مشخص شده بر اساس برچسب ها ul و li

    برچسب UL برای ایجاد لیست برچسب ها استفاده می شود و برای ایجاد شماره - OL. این برچسب ها عبارتند از جفت و بلوک، درست همانطور که عنصر لی است.

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

    بیایید ببینیم، به عنوان مثال، یک نسخه برچسب دار است که ممکن است به نظر برسد:

    • خط اول
    • دومین
    • آخرین عنصر

    در داخل تگ های باز و بسته بندی، UL، تنها عناصر LI را می توان نصب کرد، و هر گونه محتوا (متن، تصاویر، هدر ها، پاراگراف ها، پیوندها، و حتی لیست های دیگر را می توان در داخل این عناصر قرار داد.

    کسانی که. UL فقط برای سازماندهی لیست مشخص شده (نه دستور داده شده)، و آنچه که در صفحه وب در داخل آن مشاهده می کنید، با استفاده از محتویات عناصر LI اجرا می شود.

    برای UL، شما می توانید دیدگاه مارکر را تغییر دهید، تجویز مقادیر مختلف آن را برای ویژگی "نوع". اگر "نوع" (مدیریت ظاهر مارکرها) برای عنصر UL مشخص نشده است، نمای مارکر پیش فرض نمایش داده خواهد شد (دیسک - نقاشی شده در رنگ متن دایره):

    1. - کرم دایره (به طور پیش فرض)؛
       • - دایره نقاشی نشده؛
         • - مربع

    در نمونه ها، ویژگی نوع، ما در عنصر UL تجویز شد، با استفاده از این نوع نشانگرها برای همه موارد. اما ویژگی "Type" را می توان برای هر برچسب LI فرد تجویز کرد، نوع خود را از نشانگر خود را برای این مورد تنظیم کنید.

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

    

    1. نشانگر دیسک
    2. نشانگر به صورت یک دیسک نقاشی نشده است
    3. مربع

    لیست های Numesed در HTML بر اساس برچسب OL

    برای ایجاد یک لیست شماره، برچسب های OL استفاده می شود، که در آن عناصر Li دوباره قرار می گیرند. OL و LI، همانطور که قبلا ذکر کردم، بلوک ها هستند (به عنوان مثال، به دنبال تمام مکان های موجود در عرض قرار می گیرند) و در داخل OL هیچ چیز دیگری جز عناصر Li قرار نمی گیرد.

    به نظر می رسد که OL و UL برچسب های خدماتی هستند که فقط برای نشان دادن مرورگر مورد نیاز هستند، کدام نوع لیستی که ما شکل می گیریم (برچسب یا شماره گذاری شده). در مورد شماره یک - به سمت چپ هر مورد ما نشانگر نیست، اما نقطه و نقطه پشت آن:

    

    1. خط اول
    2. نقطه دوم
    3. رشته سوم

    همانطور که قبلا کمی بالاتر ذکر کردم، عناصر UL، OL و LI توانایی استفاده از ویژگی نوع را دارند. این اجازه می دهد تا شما را به پیکربندی نوع مارکر یا تنظیم، چه اعداد یا حروف شماره های شماره گذاری شده است. برای یک لیست شماره، پارامترهای این ویژگی ممکن است مقادیر زیر را دریافت کنند:

    1. - شماره گیری توسط شماره های متعارف عربی انجام می شود (همان گزینه به طور پیش فرض استفاده می شود، اگر هیچ صفت "نوع" وجود ندارد)؛
       1. - حروف بزرگ به عنوان شماره؛
          1. - حروف کوچک؛
             1. - ارقام رومی سرمایه؛
                1. - شماره های رومی کوچک

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

                   

                   1. با تعداد اعداد بزرگ رومی
                   2. شماره گذاری با حروف کوچک لاتین
                   3. شماره کوچک رومی

                   هنگام ایجاد لیست های شماره گذاری، همچنین دارای توانایی شروع شماره از یک واحد، اما از شماره مشخص شده در ویژگی مشخصه است. مثلا:

                   1. اولین عنصر که تعداد آن در alt attribute ol start \u003d "23" است
                   2. آیتم بعدی، با یک عدد در هر واحد بزرگ
                   3. یکی دیگر دیگر

                   برای OL، شما همچنین می توانید یک شماره جدید را از هر مقدار شروع کنید، از هر آیتم شروع کنید، در ویژگی ارزش در آیتم باز LI با شماره مورد نظر صحبت کنید. مثلا:

                   1. اولین نقطه با شماره یک
                   2. این عنصر شماره مشخص شده در ویژگی value \u003d "32" را دریافت خواهد کرد
                   3. نقطه با تعداد زیادی

                   ثبت نام از ظاهر لیست در CSS (جداول سبک)

                   اما، به عنوان یک قاعده، در حال حاضر ظاهر نشانگرها از طریق ویژگی نوع داده نمی شود، اما برای آن خواص مربوطه تجویز می شود.

                   در اینجا من به سادگی نمونه ای از نشانگرهای مختلف را برای لیست های غیر شماره گذاری می کنم، ظاهر آن از طریق یک فایل جداگانه با جداول سبک Cascading تنظیم می شود.

                   • نقطه اول
                   • دومین
                   • آخر

                   اما درباره ما در مقالات بعدی صحبت می کنیم. به این ترتیب ظاهر مارکر برای UL در این وبلاگ تنظیم شده است. تصاویر به عنوان نشانگر استفاده می شود: برای آیتم های معمولی از لیست غیر شماره گیری -، برای موارد توزیع نشده از غیر اندازه گیری شده -.

                   لیست های ویژه و زیرمجموعه در کد HTML

                   سومین و آخرین دیدگاه "لیست های تعریف" نامیده می شود و آنها با استفاده از سه برچسب - DL، DT و DD تنظیم می شوند. DL مرورگر را گزارش می دهد که فهرست تعاریف را دنبال می کند.

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

                   اولین دوره

                   شرح

                   دومین دوره

                   شرح او

                   

                   اگر به مثال فوق نگاه کنید، حذف کنید که عنصر DD (شرح اصطلاح) (40 پیکسل) نسبت به عنصر DT (اصطلاح خود) تغییر می کند.

                   به طور کلی، DL، DT و DD برچسب های بلوک هستند، و در داخل عنصر DT، شما فقط می توانید محتوا را با برچسب های خط قرار دهید (به نظر می رسد که در داخل DT غیر ممکن است استفاده از عناصر بلوک عناوین و پاراگراف ها غیر ممکن باشد. و در برچسب های DD، شما می توانید هر عنصر و حروف کوچک و بلوک را وارد کنید.

                   فهرست توزیع شده HTML توسط مشابه با ساده ایجاد شده است، اما در داخل لیست اصلی، بخشی از اقلام یک بار دیگر در باز کردن و بسته شدن برچسب UL یا OL است.

                   لطفا توجه داشته باشید که یک لیتر از آن آیتم که در آن آیتم پیوست شده ایجاد می شود، تنها پس از کل کد لیست پیوست شده ساخته می شود (برای صفحه نمایش مناسب آن در صفحه وب بسیار مهم است). لیست پیوست شده ممکن است چیزی شبیه به این باشد:

                   

                   1. اولین نقطه اصلی شماره
                   2. نقطه دوم
                      • اولین عنصر از توزیع شده
                      • دومین
                      • سومین و آخرین نقطه مشخص شده
                   3. عنصر سوم شماره گذاری شده است

                   موفق باشی! به جلسات مبهم در وب سایت وب سایت وبلاگ

                   ممکن است علاقه مند باشید

                   نحوه قرار دادن لینک HTML و تصویر (عکس) - IMG و برچسب ها انتخاب، گزینه، Textarea، Label، FieldSet، Legend - تگ های HTML اشکال لیست کشویی و زمینه متن
                   اشکال HTML برای سایت - برچسب ها فرم، ورودی و انتخاب، گزینه، textarea، label و دیگران برای ایجاد آیتم های WebForm
                   همانطور که رنگ ها در کد HTML و CSS تنظیم می شوند، انتخاب سایه های RGB در جداول، صدور Yandex و سایر برنامه ها
                   قراردادن و شیء - تگ های HTML برای نمایش محتوای رسانه ای (ویدئو، فلش، صوتی) در صفحات وب
                   برچسب ها و ویژگی های H1-H6 سرصفحه، خط افقی HR، خلاصه RR و پاراگراف P با توجه به HTML 4.01
                   جداول در HTML - برچسب ها جدول، TR و TD، و همچنین Colspan، Cellpanding، Cellspacing و Rowspan برای ایجاد آنها
                   زبان نشانه گذاری HTML Hypertext و نحوه دیدن لیست همه برچسب ها در Validator W3C چیست؟
                   برچسب های فونت (صورت، اندازه، رنگ)، قالب بندی متن پیش بینی شده در HTML خالص (بدون استفاده از CSS)
                   Iframe و Frame - چه چیزی است و بهترین استفاده از فریم ها در HTML
                   img - تگ HTML برای قرار دادن تصاویر (src)، تراز کردن و ساده سازی آن با متن (align)، و همچنین وظایف پس زمینه (پس زمینه)

                   تگ های HTML

                   معنی و کاربرد

                   لیست اعداد (مرتب شده) برای مواردی که در یک نظم قطعی دنبال می شوند طراحی شده است. لیست شماره ها با برچسب شروع می شود

                   (اختصار از انگلیسی فهرست مرتبشده. - فهرست مرتبشده). هر عنصر لیست با برچسب شروع می شود
                   1. (مورد لیست).

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

                      صفت			اپرا		iExplorer	حاشیه، غیرمتمرکز.
                      شروع، نوع	آره	آره	آره	آره	آره	آره
                      معکوس	آره	آره	آره	آره	نه	نه

                      ویژگی های

                      صفت	مقدار	شرح
                      فشرده - جمع و جور.	فشرده - جمع و جور.	در HTML5 پشتیبانی نمی شود. نشان می دهد که لیست باید کمتر از اندازه معمول باشد (ارتفاع خط: 80٪). از CSS به جای این ویژگی استفاده کنید.
                      	معکوس	نشان می دهد که سفارش در یک لیست شماره (مرتب شده) باید از نزولی پیروی کند. ویژگی توسط اینترنت اکسپلورر و مرورگرهای EDGE پشتیبانی نمی شود.
                      شروع کن	عدد	مقدار اولیه لیست شماره (دستور داده شده) را مشخص می کند. مقادیر باید عدد صحیح باشند، مجاز به استفاده از مقادیر منفی است. هنگام استفاده از حروف (type \u003d "a" و type \u003d "a")، شماره مشخص شده در مقدار ویژگی، شماره سریال نامه ای از حروف الفبا است. به عنوان مثال، شروع \u003d "4" به نامه متناسب خواهد بود "D" و لیست با آن آغاز خواهد شد. هنگام استفاده از مقدار شروع \u003d "27"، شمارنده بازنشانی می شود، در حالی که این لیست دو رقمی می شود ("27" \u003d "AA"، "28" \u003d "AB"، "29" \u003d "AC" ...) .
                      نوع	1 (به طور پیش فرض) a (بزرگ) a (حروف کوچک) من (رومی بزرگ) من (رومی کوچک)	نوع مارکر را تعیین می کند که در ساخت یک لیست شماره (دستورالعمل) استفاده می شود.

                      مثال استفاده

                      1. نقطه اول نقطه دوم
                      2. نقطه سوم

                      به صفحه نگاه کنید، به ترتیب:

                      1. نقطه اول
                      2. مورد دوم
                      3. نقطه سوم

                      اگر می خواهید لیست را از یک شماره خاص شروع کنید (نه از 1)، باید ویژگی شروع را برای برچسب مشخص کنید

                      .

                      مثلا:

                      یکی دیگر از ویژگی های جالب نوع است، که به شما این امکان را می دهد که شماره الفبایی ("A" - بزرگ، "A" را تنظیم کنید)، یا شماره شماره های رومی ("I" - در مورد بالا، "I" - در ثبت نام پایین تر).

                      یک مثال را در نظر بگیرید که تمام مقادیر ویژگی های نوع ممکن ارائه شده است (متفاوت از مقدار پیش فرض):

                      >
                      1. نقطه اول نقطه دوم
                      2. نقطه سوم
                      >
                      1. نقطه اول نقطه دوم
                      2. نقطه سوم
                      >
                      1. نقطه اول نقطه دوم
                      2. نقطه سوم
                      >
                      1. نقطه اول نقطه دوم
                      2. نقطه سوم

                      من توجه شما را جلب می کنم که مجاز به تولید لیست های شماره گذاری شده (سفارش شده) در لیست های شماره دیگر (در داخل لیست لیست

                      3. ):
                         1. نقطه اول
                            1. نقطه اول نقطه دوم
                            2. نقطه سوم
                            نقطه دوم
                            3. نقطه سوم

                            به صفحه نگاه کنید، به ترتیب.