آموزش کامل HTML و HTML5: تگ های قالب بندی متن(۳)

آموزش کامل HTML و HTML5: تگ های قالب بندی متن(3)Reviewed by محمدرضا on Jan 17Rating: 5.0

سلام دوستان عزیز

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

دوستان توجه داشته باشید اگر تگ های قالب بندی متن رو بخوبی یاد بگیرید خیالتون راحت میشه چرا که این تگ های کمی زیاد هستند و ما هم سعی کردیم تا اونجا که ممکنه تگ های کم کاربرد و منسوخ شده در HTML5 رو به شما آموزش ندیم هر چند این کار درست نیست و باید تمام تگ ها را یاد بگیرید اما در آینده به شما می گوییم چگونه با دیگر تگ های کم کاربرد آشنایی پیدا کنید فعلا تمام تمرکز خودتان را بر روی تگ هایی که آموزش داده میشود بگذارید و به خوبی آن ها را تمرین و تکرار کنید مطمئن باشید در پایان این آموزش ها نتیجه ی بسیار خوبی را خواهید گرفت.

تگ <blink>: این تگ متن مورد نظر را در مرورگر بصورت چشمک زن نمایش می دهد ما به این نکته توجه کنید که این تگ تنها در مرورگر هایی نظیر کروم و موزیلا و یا اپرا بخوبی خروجی می دهد و در مرورگر اینترنت اکسپلور مایکروسافت توانایی خروجی دادن نیست و اگر کاربری با این مرورگر به سایت شما وارد شود متن را بصورت ساده مشاهده خواهد کرد.

<blink>Fabtheme : HTML Tutorial</blink>

 تگ <marquee> : از این تگ برای به حرکت درآوردن متن ها و تصاویر در صفحه ی وب استفاده می شود. این تگ دارای صفات زیر می باشد:

<p><marquee>Fabtheme : HTML Tutorial</marquee></p>

Width : از این صفت برای مشخص کردن محدوده ای که این تگ محتویات خود را در آن به نمایش می گذارد استفاده می شود. در حالت پیش فرض هم عرض این تگ عرض کل صفحه ی وب است.

<p><marquee width="300px">Fabtheme : HTML Tutorial</marquee></p>

Height : این صفت برای ارتفاع محدوده ی ای که تگ محتویاتش را در خروجی به نمایش می گذارد است. در حالت پیش فرض هم این صفت مقداری را دارد که ارتفاع محتویات تگ است.

<p><marquee height="200px">Fabtheme : HTML Tutorial</marquee></p>

Bgcolor : این صفت رنگ پس زمینه ی محدوده ی محتویات تگ را مشخص می کند و مقادیر آن همان روش های مقدار دهی رنگ در HTML است.

<p><marquee bgcolor="#88ff36">Fabtheme : HTML Tutorial</marquee></p>

Behavior: این صفت نحوه ی نمایش محتویات تگ را مشخص میکند و مقادیر زیر را دریافت می کند:

  • Scroll : محتوا از یک طرف وارد محدوده ی تگ می شوند و از طرف دیگر خارج می شوند.
  • Slide: محتوا از یک طرف وارد محدوده ی تگ می شوند و در طرف دیگر می ایستند.
  • Alternate: متن یک حرکت رفت و برگشت در محدوده تگ خواهد داشت.
<p><marquee behavior="slide">Fabtheme : HTML Tutorial</marquee></p>

Direction : جهت حرکت محتوای تگ را مشخص می کند و مقادیر زیر را می پذیرد.

  • Up : حرکت به سمت بالا
  • Down : حرکت به سمت پایین
  • Right : حرکت به سمت راست
  • Left : حرکت به سمت چپ
<p><marquee direction="right">Fabtheme : HTML Tutorial</marquee></p>

این تگ دارای صفات دیگری هم نظیر Scrollamount ، Scrolldelay ، Loop ، hspace ، vspace ، truespeed ها هستند که آن ها را به خودتان می سپارم تا به دنبالش بروید.

اگر هم برای هر کدام سوالی برایتان پیش آمد در بخش نظرات سوال کنید.

تگ <q>: از این تگ برای ایجاد نقل قول های کوتاه استفاده می شود و متن درون این تگ در خروجی درون دابل کوتیشن(” … “) قرار می گیرد.

<p>Fabtheme : <q>فاب تم مرجع قالب ها و افزونه های فارسی وردپرس</q></p>

نتیجه کد در مرورگر:

تگ <blockquote>: از این تگ برای نقل قول های بلند در صفحه ی وب استفاده می شود. مرورگرها با مشاهده ی این کد محتویات آن را از چهار طرف فاصله می دهند.

<p>Fabtheme : <blockquote>فاب تم مرجع قالب ها و افزونه های فارسی وردپرس</blockquote></p>

نتیجه کد در مرورگر:

خب دوستان تا این جا تگ های قالب بندی مهم را فرا گرفتید فقط کافیست آن ها را کمی تمرین کنید تا برایتان جا بیفتد در جلسات آینده به مباحث دیگری از زبان HTML می پردازیم

اگرچه هنوز تگ های دیگری در این رابطه وجود دارند که کاربرد آن ها محدود تر از مباحث گفته شده است که آن ها را به عهده ی خودتان میگذاریم.

برای منبع از سایت رو برو استفاده کنید: http://www.w3schools.com/html

تمرین رو فراموش نکنید.

موفق باشید…

Html Html5 آموزش طراحی رابط کاربری

درباره محمدرضا

دیدگاه خود را بیان کنید