فارسی کلاب
پورتال خبری و مجله اینترنتی آنلاین فارسی

تگ های قالب بندی متن در html (آموزش html) قسمت دوم

در جلسه قبل با سه تگ html‎ ،‎ head‎‎ ، body که ساختار اصلی یک صفحه وب را تشکیل می‎دهند آشنا شدیم.

در این جلسه می‎خواهیم تگهای مهم html و خصوصیاتشون رو بررسی کنیم.

معرفی تگهای HTML

برچسبهای قالب بندی متن

برچسب p (پاراگراف)

زبان html، وجود enter و فاصله (space) در متن را تشخیص نمی‎دهد. یکی از بهترین راه‎ها استفاده از تگ p است. با استفاده از تگ <p></p> می‎توانیم یک پاراگراف ایجاد کنیم. تگ p از خصوصیتهای عمومی پیروی می‎کند و خاصیت بلاکی (Block) دارد یعنی مرورگر با دیدن این تگ یک فضای خالی در بالا و پایین پاراگراف قرار می‎دهد.

خاصیت Align: با استفاده از خاصیت align می‎توان چینش متن را مشخص کرد.

مقدارهای خصوصیت align

 

خاصیت مقدار و نحوه عملکرد
left متن از سمت چپ تراز می‎شود. (چپ‎چین)
right متن از سمت راست تراز می‎شود. (راست‎چین)
center متن وسط چین می‎شود.
justify متن به اندازه ای که کل صفحه را پر کند کشیده می‎شود.

 

مثال:

خروجی:

من یک متن وسط چین هستم.

برچسب pre

درحالت عادی هنگام کدنویسی و نوشتن متن در صفحه، مرورگر کلیدهای Space و Enter را نادیده گرفته و متون را پست سرهم نمایش می‎دهد.

اگر بخواهید متن همانطور که تایپ می‎کنید نمایش داده شود، باید متن خود را داخل تگ pre قرار دهید:

خروجی:

زبان html
زبان پایه
طراحی صفحات وب
است

برچسب center

از این برچسب می‎توان برای وسط چین کردن همه عناصر استفاده کرد:

خروجی:

من یک متن وسط چین هستم

تگ‎های <i> و <b> و <u>

متنی که داخل برچسب <b></b> قرار دارد، از سایر متون در صفحه پررنگ تر نوشته می‎شود. (متن را Bold می‎کند).

تگ <i></i> برای کج کردن متن و تگ <u></u> برای زیرخط دار (underline) کردن متن استفاده می‎گردد.

مثال:

من یک متن Bold هستم
من یک متن Italic
من یک متن Underline هستم

برچسب‎های <sub> و <sup>

از این تگها برای ایجاد توان و اندیس استفاده می‎شود.
مثال:
نوشتن لگاریتم ۱۰ در مبنای ۵

 

خروجی:

log ۱۰ ۵

برچسب های عنوان <h1> تا <h6>

برچسب های < h5>,<h4>,<h3>,<h2>,<h1> و <h6> برای عنوان‎ها و تیترها در صفحه استفاده شده و اصطلاحا به آنها heading هم گفته می‎شود.

مثال:

خروجی

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

برچسب <font>

از این تگ برای تعیین فونت، رنگ و اندازه متن است. البته تگ font دیگر منسوخ شده و استفاده نمی‎شود.

خصوصیات برچسب font

خصوصیت عملکرد
face برای مشخص کردن نوع فونت بکار می‎رود. بعنوان مثال، face=”tahoma” نوع فونت را tahoma درنظر می‎گیرد.
color رنگ متن را تعیین می‎کند.
size سایز متن را برحسب پیکسل تعیین می‎کند.

مثال:

خروجی:

مجله اینترنتی فارسی کلاب

برچسب marquee

این برچسب برای متحرک سازی عناصر استفاده می‎شود.

خصوصیات برچسب marquee

خصوصیت عملکرد
width عرض محدوده را برحسب پیکسل و یا درصد مشخص می‎کند.
height ارتفاع محدوده را برحسب پیکسل و یا درصد مشخص می‎کند.
bgcolor رنگ پس زمینه محدوده را تعیین می‎کند.
behaior scroll عناصر از یک طرف محدوده وارد و از طرف دیگر خارج می‎شوند.
slide عناصر از یک طرف وارد و در طرف دیگر متوقف می‎شوند.
alternate عناصر در محدوده، حرکت رفت و برگشتی خواهند داشت.
loop تعداد دفعات تکرار حرکت را تعیین می‎کند. چنانچه بخواهید یک حلقه نامحدود ایجاد کنید باید یک مقدار منفی بدهید.
scrolldelay تأخیر زمانی را برحسب یک هزارم ثانیه تعیین می‎کند.
direction up حرکت عناصر را به سمت بالا هدایت می‎کند
right حرکت عناصر را به سمت راست هدایت می‎کند.
down حرکت عناصر را به سمت پایین هدایت می‎کند.
left حرکت عناصر را به سمت چپ هدایت می‎کند.
hspace فاصله محدوده از عناصر اطراف را بصورت افقی تعیین می‎کند.
vspace فاصله محدوده از عناصر اطراف را بصورت عمودی تعیین می‎کند.

 

مثال:

خروجی:

مجله اینترنتی فارسی کلاب

آدرس کوتاه مطلب

نظر بدهید

آدرس ایمیل شما منتشر نخواهد شد.