این آموزش در تاریخ ۱۴۰۲/۰۶/۲۳ آپدیت شده است.
آموزش تگ blockquote در HTML
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش تگ blockquote در HTML با من همراه باشید.
Free-Learn
آنچه در این جلسه میخوانید :
تگ blockquote در HTML
تگ blockquote تگی است که ما با استفاده از آن میتوانیم یک نقل قول از یک منبع خارجی ( از یک سایت یا منابع دیگر ) را ایجاد نماییم.
بطور کلی بدانید برای ایجاد نقل قول ها در یک صفحه ی وب میتوان از تگ blockquote استفاده نمود که مرورگرها بطور خودکار یک [ تورفتگی ] قبل از محتوای نقل قول ایجاد میکنند.
این تگ بصورت عادی هیچ ظاهر یا استایل خاصی نداره، ولی خب به راحتی میتونیم از CSS برای استایل دادن بهش استفاده کنیم. ( مثال شماره ۲ کمی پایین تر )
Free-Learn
مثال از تگ blockquote در HTML
در ادامه میتوانید یک مثال از این تگ را مشاهده نمایید.
مثال شماره ۱ : مثلا من از سایت ویکی پدیا درباره لیونل مسی نقل قول آوردم.
|
1 2 3 4 5 6 7 |
<body> <blockquote cite="https://en.wikipedia.org/wiki/Lionel_Messi"> ... </blockquote> </body> |
مثال شماره ۲ : سفارشی کردن نقل قول با استفاده از دستورات CSS
|
1 2 3 4 5 6 7 8 9 |
<style> blockquote{ background-color:#f2f2f2; padding:5px 10px; border-right:3px solid #2196F3; } </style> |
Free-Learn
پشتیبانی مرورگرها
در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از تگ blockquote در HTML پشتیبانی میکنند یا خیر.
| نام مرورگر | Chrome | Firefox | Opera | Safari | Edge |
| پشتیبانی | بله | بله | بله | بله | بله |
Free-Learn
جدول صفات تگ blockquote در HTML
در جدول زیر میتوانید صفات بهمراه مقادیری را که میتوان در این تگ استفاده کرد را مشاهده نمایید.
| نام صفت | مقدار | توضیح |
|---|---|---|
| cite | URL | برای مشخص کردن آدرس URL منبع نقل قول |
Free-Learn
پشتیبانی از صفات و رویدادهای عمومی
تگ blockquote از صفات عمومی و رویدادهای عمومی در HTML پشتیبانی می کند.
Free-Learn
نکات و توضیحات
- یه تگ دیگه به اسم تگ q داریم که با استفاده از آن میتوان یک نقل قول کوتاه ایجاد کرد ، بنابراین برای ایجاد نقل قول های بلند از تگ blockquote و برای ایجاد نقل قول های کوتاه از تگ q استفاده نمایید.
- با استفاده از صفت Cite در این تگ میتوان آدرس منبع یا سورس نقل قول را ایجاد کرد. ( این آدرس در مرورگرها به کاربر نمایش داده نمی شود ولی برای مرورگرها و موتورهای جستجوگر قابل تفسیر و رهگیری می باشد )
Free-Learn
دستورات CSS پیش فرض
معمولا مرورگرها تگ blockquote را بصورت پیش فرض با دستورات CSS زیر نمایش میدهند.
|
1 2 3 4 5 6 7 |
blockquote { display: block; margin-top: 1em; margin-bottom: 1em; margin-left: 40px; margin-right: 40px; } |
