آموزش و کتاب الکترونیکی

آموزش HTML – فصل اول – مقدماتی

آموزش HTML - فصل اول - مقدماتی آموزش و کتاب الکترونیکی
نوشته توسط مهدی بلوریان

به نام خدا

آموزش HTML - فصل اول - مقدماتی آموزش و کتاب الکترونیکی

نکته مهم : اگر طول مراحل آموزش از نام ها یه عنوان های خاص استفاده میشود ، اصلا نگران نباشید ، به مرور و مرحله به مرحله فرا خواهیم گرفت !

اسناد HTML :

تمامی اسناد HTML با یک اعلام نوع سند شروع میشوند که به مرورگر نوع سند را میگوید

تمامی اسناد HTML بعد از اعلام نوع سند HTML به تگ <HTML> شروع شده و در انتها نیز با <HTML/> به اتمام میرسد

به آن قسمتی از سند HTML به مورد مشاهده و توجه بازدید کننده وبسایت یا وبلاگ قرار میگیرد در بین دو تگ <BODY> و <BODY/> قرار میگیرد

<DOCTYPE html!>
<html>
<body>
My First Heading
<p>My first paragraph.</p>
<body/>
<html/>

سرفصل ها و عنوان ها :

در زبان HTML عنوان ها یا سرفصل ها را با تگ <H> مشخص میکنند که این تگ برای سایز های مختلف سرفصل ها از <H1> تا <H6> انتخاب میشوند

<H1>This is a Heading</H1>

<H2>This is a Heading</H2>
<H3>This is a Heading</H3>
<H4>This is a Heading</H4>
<H5>This is a Heading</H5>
<H6>This is a Heading</H6>

پاراگراف ها :

پاراگراف ها ، توضیحات متنی و مطلب مورد نظر را معمولا با تگ <P> و در انتهای ان <P/> استفاده میکنند

<P>This is a paragraph.</P>
<P>This is another paragraph.</P>

لینک ها :

برای لینک کردن (اتصال بین دو نقطه در صفحه و اتصال دو صفحه وب) در HTML نیز از تگ کاربردی و مهم <A> استفاده میشود

<a href=”http://www.1p30.com/”>Thisis a link</a>

ویزگی های (Attribute) تگ <a>

نحوه ی نمایش سایت لینک شده را برای مرورگر تایین میکنیم که این ویژگی  ، 4 نوع (مقدار) دارد   =   target

در تَب جدید target=_blank
در صفحه جاری(زیر مجموعه ای) target=_paren
 در صفحه اجرا شده باقی میماند (پیشفرض)    target=_self
صفحه جاری (توضح در قسمت بعدی)    target=_top
آدرس لینک مقصد   =   href

تصاویر :

ممکن است بپسندید :   دانلود رایگان کتاب آموزش HTML5 و CSS3 جدید

برای استفاده از تصاویر در در یک سند HTML یا همان صفحه وبسایت از تگ <IMG> استقاده میشود

<“img src=”1p30.jpg” alt=”1p30″ width=”104″ height=”142>

ویزگی های (Attribute) تگ <img>

 توضیحات مهم برای یک عکس (در سئویِ تصاویر بسیار کاربردی است)   =  alt

لینک مقصد را در این ویژگی از تگ باید قرار داد و برای استاندارد بودن بهتر است با//:Http درج شود   =   src

اختصاص دادن طول و عرض به یک تصویر از این ویزگی استفاده میشود   =    width و height

یک مثال کامل و کاربردی

<DOCTYPE html!>
<html>
<body>
My First Heading
<p>My first paragraph.</p>
<a href=”http://www.1p30.com/”>Thisis a link</a>
<“img src=”1p30.jpg” alt=”1p30″ width=”104″ height=”142>
<body/>
<html/>

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

مهدی بلوریان

دیدگاه بگذارید

avatar
  Subscribe  
Notify of