این آموزش در تاریخ ۱۴۰۲/۰۶/۲۳ آپدیت شده است.
آموزش تگ q در HTML
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش تگ q در HTML با من همراه باشید.
Free-Learn
آنچه در این جلسه میخوانید :
تگ q در HTML
تگ q که از کلمه quotation گرفته شده ، تگی است که با استفاده از آن میتوان یک نقل قول کوتاه ( Short Quotation ) را در یک صفحه وب ایجاد کرد.
برای ایجاد نقل قول های بلند / طولانی سعی کنید از تگ blockquote استفاده نمایید.
Free-Learn
مثال از تگ q در HTML
در ادامه میتوانید یک مثال از این تگ را مشاهده نمایید.
مثال شماره ۱ : استفاده از تگ q ( بدون استایل )
|
1 2 3 4 5 6 7 |
<body> <p> Salam Khobi? Man Sadegh Hastam Modir Site Free-Learn <q>Free-Learn Is Educational Site</q> </p> </body> |
مثال شماره ۲ : استایل دادن به تگ q با استفاده از CSS
|
1 2 3 4 5 6 7 8 9 10 |
<style> q{ background-color:#00b185; padding:5px; color:#fff; border-radius:2px 20px; } </style> |
مثال شماره ۳ : استفاده از صفت cite ( برای مشخص کردن منبع نقل قول )
|
1 2 3 4 5 6 7 |
<body> <q cite="https://free-learn.ir"> من صادق هستم از شهر یاسوج، کارشناس نرم افزار کوچیک شما، هدفم اینه بتونم با سایتم به هرکسی از هرجایی کمکی کرده باشم. </q> </body> |
مثال شماره ۴ : ایجاد نقل قول بلند با استفاده از تگ blockquote
|
1 2 3 4 5 6 7 |
<body> <blockquote cite="https://en.wikipedia.org/wiki/Lionel_Messi"> ... </blockquote> </body> |
Free-Learn
پشتیبانی مرورگرها
در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از تگ q در HTML پشتیبانی میکنند یا خیر.
| نام مرورگر | Chrome | Firefox | Opera | Safari | Edge |
| پشتیبانی | بله | بله | بله | بله | بله |
Free-Learn
جدول صفات تگ q در HTML
در جدول زیر میتوانید صفات بهمراه مقادیری را که میتوان در این تگ استفاده کرد را مشاهده نمایید.
| نام صفت | مقدار | توضیح |
|---|---|---|
| cite | URL | آدرس URL منبع نقل قول را مشخص میکند |
Free-Learn
پشتیبانی از صفات و رویدادهای عمومی
تگ q از صفات عمومی و رویدادهای عمومی در HTML پشتیبانی می کند.
Free-Learn
نکات و توضیحات
- حالت نمایش تگ q بصورت اینلاینی یا ( Inline ) می باشد، این یعنی اگه مثلا یه متن کنارش بنویسیم ، هردو در کنار هم در یک خط قرار میگیرند.
- برای ایجاد نقل قول های بلند از تگ blockquote استفاده کنید.
- آدرسی که درون صفت cite قرار میگیرد در واقع منبع اون نقل قول هستش و در مرورگرها برای کاربران قابل مشاهده نمی باشد، ولی توسط موتورهای جستجوگر و مرورگرها قابل درک و پیگیری می باشد. ( از نظر سئو میتونه مفید باشه )
Free-Learn
دستورات CSS پیش فرض
معمولا مرورگرها تگ q را بصورت پیش فرض با دستورات CSS زیر نمایش میدهند.
|
1 2 3 4 5 6 7 8 9 10 11 |
q { display: inline; } q:before { content: open-quote; } q:after { content: close-quote; } |
