آموزش تگ blockquote در HTML

24 شهریور 1401
ارسال شده توسط
آموزش html css

آموزش تگ blockquote در HTML

دوست من سلام امیدوارم حالتون عالی و پر از انرژی باشید. توی این بخش از آموزش html css قراره که با آموزش تگ blockquote در HTML به صورت کامل آشنا بشید.

تگ blockquote در HTML

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

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

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

دو تا از مثال های تگ blockquote در HTML

در ادامه دوره آموزشی HTML CSS پروژه محور به دو تا از مثال های این تگ میپردازیم که شما عزیزان میتوانید با مظالعه آنها درک بهتری از این تگ داشته باشید.

مثال اول : استفاده از تگ blockquote برای نقل قول از سایت ویکی پدیا درباره لیونل مسی .

<body>
  <blockquote cite="https://en.wikipedia.org/wiki/Lionel_Messi">
     ...
  </blockquote> 
</body>

 

مثال دوم : سفارشی سازی نقل قول مثال اول با استفاده از کدهای دستوری CSS

blockquote{
   background-color:#f2f2f2;
   padding:5px 10px;
   border-right:3px solid #2196F3;
}

 

راستی اگر دنبال آموزش html css پروژه محور در تبریز هستید می توانید از دوره ی آموزش وردپرس پوش استفاده کنید. جهت مشاهده ی 28 ساعت ویدیو آموزشی با پشتیبانی مادام العمر روی این لینک کلیک کنید

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

در جدول زیر میتوانید مرورگرهای اینترنتی که از تگ blockquote در HTML پشتیبانی میکنند را مشاهده نمایید و بدانید که آیا از مروگر مورد استفاده شما هم پشتیبانی میکنند یا خیر…
پشتیبانی مرورگرها از تگ blockquote + وردپرس پوش

جدول صفات تگ blockquote در HTML

جدول زیر به شما کمک میکند تا صفات تگ blockquote را به همراه مقادیری را که میتوانیم در این تگ استفاده کنیم را مشاهده نماییدم.
جدول صفات تگ blockquote در HTML + وردپرس پوش

پشتیبانی تگ blockquote از صفات و رویدادهای عمومی

تگ blockquote قابلیت پشتیبانی از تمام صفات عمومی و رویدادهای عمومی در HTML دارد.

نکات و توضیحات

  • تگ دیگری تحت عنوان تگ <q> داریم که با استفاده از این تگ میتوانیم نقل قول کوتاهی را ایجاد کنیم، در نتیجه می بایست برای ایجاد نقل قول های بلند از تگ blockquote و برای ایجاد نقل قول های کوتاه از تگ <q> استفاده کنیم.
  • در داخل تگ blockquote صفتی به اسم Cite داریم که با استفاده از آن میتوانیم آدرس منبع یا سورس نقل قول را قرار دهیم. آدرسی که قرار میدهیم برای کاربران قابل نمایش نیست اما مرورگرها و موتورهای جستجوگر میتوانند آن را تفسیر و رهگیری کنند.

دستورات پیش فرض CSS

اغلب مرورگرها تگ blockquote را به شکل کد های CSS همچون دستورات زیر نمایش میدهند.

blockquote {
   display: block;
   margin-top: 1em;
   margin-bottom: 1em;
   margin-left: 40px;
   margin-right: 40px;
}
برای امتیاز به این نوشته کلیک کنید!
[کل: 0 میانگین: 0]

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

فرم درخواست پشتیبانی (فرم زیر پست ها)

برچسب ها:

دیدگاهتان را بنویسید