بلوکوت چیست؟

اگر شما تا به حال در لیستی از عناصر HTML نگاه کرده اید، ممکن است خودتان را از "چه شکلی است؟" عنصر blockquote یک تگ تگ HTML است که برای تعریف نقل قول های طولانی استفاده می شود. در اینجا تعریف این عنصر با توجه به مشخصات W3C HTML5 است:

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

نحوه استفاده از بلوكوتون در صفحات وب

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

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

بنابراین اجازه دهید نگاهی به چگونگی استفاده از برچسب تکه تکه برای تعریف نقل قول های طولانی، مانند این گزیده از "The Jabberwocky" توسط لوئیس کارول:

'Twas brillig و slithey toves
خندید و خندید:
همه mimsy بود borogoves،
و mome raths outgrabe.

(توسط لوئیس کارول)

مثال استفاده از برچسب مسابقه

تگ blockquote یک تگ semantitic است که به مرورگر یا عامل کاربر می گوید که مطالب یک نقل قول بلند است. به این ترتیب، شما نباید متن را که در داخل تگ مسابقه نقل قول نیست قرار دهید، نگذارید. توجه داشته باشید که "نقل قول" اغلب کلمات واقعی است که کسی گفته است یا متن از یک منبع خارج (مانند متن لوئیس کارول در این مقاله)، اما این نیز می تواند مفهوم پلاکت است که قبلا آن را پوشش داده ایم.

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

اکثر مرورگرهای وب، برخی از تند (حدود 5 فاصله) را به هر دو طرف یک بلوک متن اضافه می کنند تا آن را از متن اطراف خود برجسته کند. برخی از مرورگرهای بسیار قدیمی حتی ممکن است متن نقل قول را به صورت کج جا بزنند.

به خاطر داشته باشید که این به سادگی ظاهر پیش فرض عنصر blockquote است. با استفاده از CSS، شما کنترل کاملی بر نحوه نمایش مسابقه خود دارید. شما می توانید بکشید یا حتی حذف کنید، رنگ های پس زمینه اضافه کنید یا اندازه متن را افزایش دهید تا از نقل قول بیشتر بشنوید. شما می توانید این نقل قول را به یک طرف صفحه بفشارید و متن دیگر را در اطراف آن قرار دهید، که به طور معمول سبک بصری مورد استفاده برای pulquotes در مجلات چاپ شده است. شما بر روی ظاهر مسنجر با CSS کنترل می کنید، چیزی که ما کمی کوتاه تر بحث خواهیم کرد. در حال حاضر، بیایید ادامه به دنبال چگونگی اضافه کردن نقل قول خود را به نشانه HTML خود را.

برای اضافه کردن تگ بلوکوتون به متن خود، به سادگی متنی که نقل قول با جفت برچسب زیر است -

مثلا:

'Twas brillig و slithey toves

خندید و خندید:

همه mimsy بود borogoves،

و mome raths outgrabe.

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

از Blockquote به متن عقب استفاده نکنید

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

این متن متناقض است.

بعد، شما می توانید آن کلاس را با سبک CSS هدف قرار دهید

.indented {
padding: 0 10px؛
}

این باعث می شود تا 10 پیکسل به هر دو طرف پاراگراف اضافه شود.

مقاله اصلی جنیفر کریینین. ویرایش شده توسط Jeremy Girard در تاریخ 5/8/17.