تگ های نقل قول (Quotation) و استناد در HTML
تگ های نقل قول و استناد در HTML
در این آموزش ، عناصر <blockquote> ، <q> ، <abbr> ، <address> ، <cite> و <bdo> را در HTML آموزش خواهیم داد.
در ادامه، بخش زیر یک نمونه نقل قول را نمایش می دهد.
تگ <blockquote> برای نقل قول ها
تگ blockquote یک متنی که از یک منبع دیگر نقل قول شده است را مشخص می کند که این منبع توسط ویژگی cite تعریف می شود.. مرورگر ها معمولا برای عناصر <blockquote> تورفتگی ایجاد میکنند.
این تگ یک عنصر block level یا بلاکی است و درصورتی که یک نقل قول طولانی و بلاکی داشته باشیم می توانیم از این تگ استفاده نماییم .
تگ blockquote
تگی است که ما با استفاده از آن میتوانیم یک نقل قول از یک منبع خارجی (از یک سایت یا منابع دیگر) را ایجاد نماییم.
مثال:
1 2 3 4 5 |
<p>Here is a quote from WWF's website:</p> <blockquote cite="http://www.worldwildlife.org/who/index.html"> For 50 years, WWF has been protecting the future of nature. The world's leading conservation organization, WWF works in 100 countries and is supported by |
نتیجه:
سفارشی سازی نقل قول با استفاده از دستورات CSS
برای سفارشی سازی نقل قول ابتدا کد زیر را وارد کرده و در ادامه کدی که در بالا آموزش داده شد را وارد می کنیم.
1 2 3 4 5 6 7 |
<style> blockquote{ background-color: #f2f2f2; padding: 5px 10px; border-left: 3px solid #2196F3; } </style> |
نتیجه:
تگ <q> برای نقل قول های کوتاه
تگ <q> در HTML یک نقل قول کوتاه را تعریف میکند.
ما تگ دیگری به اسم q داریم که با استفاده از آن میتوان یک نقل قول کوتاه ایجاد کرد ، بنابراین برای ایجاد نقل قول های بلند سعی کنید از تگ blockquote و برای ایجاد نقل قول های کوتاه از تگ q استفاده نمایید.
مرورگر ها معمولا اطراف متنی که داخل عنصر <q> قرار میگیرد، علامت کوتیشن (نقل قول) قرار میدهند. (” “)
مثال:
1 |
<p>WWF's goal is to: <q>Build a future where people live in harmony with nature.</q></p> |
نتیجه:
تگ <abbr> برای اختصارات در HTML
تگ abbr
که مخفف کلمه Abbreviation می باشد تگی است که با استفاده از آن میتوان یک علامت اختصاری یا بطور کلی میتوانیم مخفف کلمات را ایجاد نماییم.تگ <abbr> برای نشان دادن نام اختصاری یا مخفف یک کلمه یا عبارت طولانی، مانند www ، HTML ، HTTP،ASAP،ATM و … استفاده می شود. در بعضی مرورگرها محتوای نوشته شده بین تگ های <abbr> با خط نقطه چین در زیر متن نمایش داده می شود.
علامت گذاری اختصارات می تواند اطلاعات مفیدی را به مرورگرها ، سیستم های ترجمه و موتورهای جستجو بدهد.
1 |
<p>The <abbr title="World Health Organization">WHO</abbr> was founded in 1948.</p> |
نتیجه:
ماوس را روی این WHO که کوتاه شده کلمه World Health Organization میباشد برای چند لحظه نگه دارید.
تگ <address> برای اطلاعات تماس در HTML
تگ <address> در HTML اطلاعات تماس نویسنده،مالک یک سند یا مقاله را تعریف می کند.
اطلاعات تماس می تواند یک آدرس ایمیل ، آدرس اینترنتی ، آدرس فیزیکی ، شماره تلفن ، دسته رسانه های اجتماعی و …باشد.
اطلاعاتی که درون این تگ قرار میگیرد به بازدیدکنندگان سایت کمک میکند تا به راحتی بتوانند با صاحب وبسایت یا صاحب یک سند یا مقاله ارتباط برقرار کنند.
متن موجود در عنصر <address> معمولاً به صورت ایتالیک(مورب) ترجمه می شود و مرورگرها همیشه قبل و بعد از عنصر <address> خطی را اضافه می کنند.
تگ <address> از نظر سئو حائز اهمیت میباشد شما با استفاده از تگ <address> قادر خواهید بود که یک پیام قوی به موتورهای جستجو در مورد محل کسب و کارتان ارائه کنید .
1 2 3 4 5 6 7 |
<address> Written by John Doe.<br> Visit us at:<br> Example.com<br> Box 564, Disneyland<br> USA </address> |
نتیجه:
تگ <cite> برای عنوان کار در HTML
تگ <cite> در HTML از کلمه ( Citation ) گرفته شده است، در لغت به معنی ( استناد یا نقل ) می باشد.
تگ <cite> عنوان یک اثر خلاقانه (مانند کتاب ، شعر ، آهنگ ، فیلم ، نقاشی ، مجسمه سازی و غیره) را مشخص می کند.
1 |
<p><cite>The Scream</cite> by Edward Munch. Painted in 1893.</p> |
نتیجه:
تگ <bdo> برای لغو دو جهته در HTML
تگ <bdo> مخفف کلمه ( Bi-Directional Override ) میباشد به معنی (لغو دو طرفه) میباشد.
تگ <bdo> میتواند مسیر/جهت یک متن را برعکس کند یعنی به زبان ساده با استفاده ازاین تگ میتوانیم متنمان را برعکس کنیم.
تگ <bdo> در برعکس کردن حروف در یک متن در یک صفحه وب کمک می نماید.
مثال:
بطور مثال به متن زیر که در تگ bdo بکار میرود توجه نمایید:
This text will be written from right to left
1 |
<bdo dir="rtl">This text will be written from right to left</bdo> |
نتیجه:
خلاصه مطالب:نقل قول ها و استناد در HTML
Tag | شرح |
---|---|
<abbr> | مخفف را تعریف میکند |
<address> | اطلاعات تماس نویسنده،صاحب سند را تعیین می کند |
<bdo> | جهت متن را مشخص می کند |
<blockquote> | قسمتی را تعریف می کند که از منبع دیگری نقل قول شده است |
<cite> | عنوان یک اثر را مشخص می کند |
<q> | یک نقل قول کوتاه خطی را تعریف می کند |