سبد (0)

تبلیغات

عناصر پایه ای در HTML

از اینکه احیاناً در مثال ها از تگ هایی که شما نیاموخته اید استفاده می شود نگران نباشید.

در فصل های بعد آنها را خواهید آموخت.


عنوان ها (Heading)

Wiki

 عنوان ها در HTML به وسیله تگ های <h1> تا <h6> تعریف می شوند.

مثال (عناصر پایه ای در HTML)

<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>
خودتان امتحان کنید »

پاراگراف (Paragraph)

Wiki

پارگراف ها در HTML به وسیله تگ <p> تعریف می شوند.

مثال (عناصر پایه ای در HTML)

<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
خودتان امتحان کنید »

لینک ها (Link)

Wiki

لینک ها در HTML به وسیله تگ <a> تعریف می شود.

مثال (عناصر پایه ای در HTML)

<a href="http://www.beyamooz.com">This is a link</a>
خودتان امتحان کنید »

توجه: آدرس لینک، در خصوصیت href مشخص می شود.

(در فصل های بعدی این خودآموز راجع به خصوصیت های عناصر، بیشتر خواهید آموخت.)


تصاویر (Image)

Wiki

تصاویر در HTML به وسیله تگ <img> تعریف می شود.

مثال (عناصر پایه ای در HTML)

<img src="/beyamooz_logo.png" width="104" height="142" alt="beyamooz.com" />
خودتان امتحان کنید »

توجه: نام و سایز عکس به وسیله خصوصیت ها مشخص می شود.


آموزش تصویری مطلب بالا (فیلم آموزش HTML)

 درس شماره 3 (عناصر پایه ای در HTML زمان فیلم:  08:00

  خرید و دانلود مستقیم فیلم آموزش HTML - حجم دانلود 766 مگابایت (کلیک کنید +)

دیدگاه‌ها  

+9 # سحر 1396-04-19 12:48
توضیحاتتون و اموزشاتون کامل و عالیه ازتویپرسش و پاسخها هم کلی میشه یاد گرفت.حس کردم تشکر کردن کمترین کاریه که میتونم انجام بدم . پاینده باشین
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+7 # محمد امینی 1395-04-23 21:59
سلام، چطور می تونم فیلم آموزش HTML رو خرید کنم؟
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+5 # امیر پهلوان صادق 1395-04-24 17:33
سلام، برای خرید فیلم آموزش HTML مراحل زیر را طی نمایید:
1- ابتدا عضو سایت شده و روی لینک زیر کلیک نمایید:
http://beyamooz.com/product/web-design/%D9%81%DB%8C%D9%84%D9%85-%D8%A2%D9%85%D9%88%D8%B2%D8%B4-html
2- در لینک بالا روی دکمه "اضافه کردن به سبد خرید" کلیک کنید.
3- حالا از سمت چپ و بالای سایت روی "رفتن به سبد خرید" کلیک کنید و در صفحه باز شده روی دکمه "تکمیل" کلیک کنید.
4- سه مرحله "خریدار" / "نحوه تحویل" / "تأیید سفارش" را با کلید روی دکمه "بعدی" طی کنید.
5- در نهایت بعد از تأیید سفارش به درگاه بانک ملت متصل خواهید شد. با وارد کردن اطلاعات کارت بانکی خود اقدام به پرداخت هزینه فاکتور نمایید.
6- بلافاصله بعد از پرداخت هزینه، ایمیلی حاوی لینک دانلود فیلم آموزش HTML برای شما ارسال خواهد شد.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+5 # امیرreza 1395-03-26 17:52
وقتی من یک عکس رو لینکی میکنم دیگه عکسش نمیاد
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+5 # امیر پهلوان صادق 1395-03-28 11:57
سلام، اگر عکس نمایش داده نمی شه مطمئنا ویژگی src یا همان آدرس عکس را اشتباه تنظیم کرده اید. لطفا یکبار دیگر ویژگی src عکس را با دقت تنظیم کنید.
همان طور که در مثال زیر می بینید، ما بنر سایت بیاموز رو به عنوان لینک استفاده کرده ایم:
< a href="http://ww w.beyamooz.com/ " title="با يک کليک بياموز">
<img src="/images/be yamooz_logo.png " alt="با يک کليک بياموز" width="336px" height="69px" />
</a >
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+2 # امیرreza 1395-03-26 17:48
سلام خسته نباشید
1- میخواستم ببینم alt که برای توضیح به کار میره به چه دردی میخوره؟
2- چجوری میشه عکس رو لینکی کرد؟ ینی اگه عکسو بزنی لینک باز شه؟
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+3 # امیر پهلوان صادق 1395-03-28 12:01
سلام
1- ویژگی alt در عنصر img به ما کمک می کنه تا اگر در لود عکس مشکلی پیش اومد، متنی که برای ویژگی alt تنظم کردید، نمایش داده بشه.
2- لطفا به مثال کامنت بالا توجه کنید.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+4 # malih niku 1394-06-21 11:19
سلام و خسته نباشید.....gif, .jpg,.png چه فرقی با هم دارند؟هرکدام برای چه عکسی و چه کاری؟چون همیشه فقط یکی از این ها جواب میده و اگر اون یکی رو بزنی Xمیشه
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+8 # شهربانو دوستی 1394-06-21 13:05
JPG و PNG و نهايتا GIF فرمت های رايجي هستند که اکثر اوقات با آن‌ها روبرو مي‌شويم و البته هريک از اين سه فرمت نقاط ضعف و قوتي نيز دارند. اکثر مرورگرها، مشکلي با نمايش سه فرمت يادشده ندارند و برخي از اين فرمت‌ها براي استفاده‌هايي خاص، برتر از سايرينند.
به عنوان قانوني نانوشته، هنگامي که به تصاوير متحرک نياز داريد بهتر است از GIF استفاده کنيد. فشرده‌سازي JPG فايل هايي با حجم کمتر توليد مي‌کند که البته اين حجم پايين به قيمت افت کيفيت تمام خواهد شد. PNG نيز فرمتي بهينه براي حفظ کيفيت تصوير در مواقعي است که حجم فايل براي شما اهميتي ندارد.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+3 # malih niku 1394-06-22 10:21
ولی من مثلا عکسی دارم که وقتی ازش properties میگیرم نوشته jpg ولی وقتی تو صفحه ی وب مثلا میام براش gifیا png استفاده میکنم نشون نمیده؟
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+1 # امیر پهلوان صادق 1394-06-22 11:16
تذکر مهم:
زمان تنظیم ویژگی src در تگ img، باید توجه داشته باشید که هم نام و هم فرمت عکس را بدرستی تنظیم کنید وگرنه عکس نمایش داده نمی شود.
بعنوان مثال اگر عکس شما Test.jpg باشد، خصوصیت src باید بصورت زیر تنظیم شود:<img src="/Test.jpg" />
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+3 # malih niku 1394-06-23 09:31
تشکر
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+4 # Tara22 1394-06-15 03:05
سلام. میشه لطفا جندتا سایت برای آبلود کردن عکس معرفی کنید؟
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+2 # شهربانو دوستی 1394-06-15 12:27
با سلام
http://8pic.ir/
www.picofile.com
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+3 # malih niku 1394-05-06 15:01
سلام ..این قسمت عکس من فهمیدم چه طور عکسی رو از سایتی بر روی سایت خودم بزارم ولی اصلا نمی دونم الان یک عکسی فرضا توmy pc>pictures>p22 445678_184 دارم چه طوری بزارمش؟
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+2 # احسان عباسی 1394-05-06 17:57
سلام
ابتدا یک پوشه ایجاد کنید و سند اچ تی ام ال خودتون را وارد این پوشه کنید. عکس مورد نظر را هم وارد این پوشه کنید و به صورت زیر عمل کنید:
<img src="/نام عکس مورد نظر به همراه پسوند ">
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+2 # aida 1394-05-04 13:47
سلام..ممنون از اطلاعات گرانقدرتون..در قسمت img من خودم اومدم از ادرس عکستون استفاده کردم ولی عکس رو نشون نمیده و فقط یه مربع که کنارش علامت عکسه نشون میده!اینجوری نوشتم:


This is a heading
This is a paragraph.
so right
soso right beyamooz.com
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+2 # احسان عباسی 1394-05-04 21:55
اگر از یک آدرس عکس کامل آپلود شده استفاده کنید مشکلی پیش نخواهد آمد.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
0 # malih niku 1394-04-29 13:42
من قسمت img رو خیلی دقیق نفهمیدم ...واینکه چرا من وقتی alt وwidthوheight رو حذف کردمهیچ تغیری نکرد و عکس رو نشون داد...اون چیزی که داخا کوتیشن srcنوشتین رو نمی فهمم ؟یعنی اگه خودم بخوام عکس رو عوض کنم چی کار باید کنم؟
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+4 # احسان عباسی 1394-04-29 14:05
خصوصیت alt توضیحی در مورد عکس است و اگر نباشد هم مشکلی پیش نخواهد آمد. همچنین اگر width و height را هم حذف کنید باز عکس در اندازه ی واقعی خودش نمایش پیدا می کند و مشکلی پیش نمیاد. چیزی که به طور کلی در imgها مهم است همان src است. src در واقع مخفف کلمه ی source است. و آدرس عکس را مشخص می کند. اگر بخواهید خودتان عکس را عوض کنید، باید یک عکس را آپلود کنید و آدرس آن را در قسمت src قرار دهید.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+1 # malih niku 1394-04-31 13:03
بازم متوجه نشدم چه طور میشه عکس رو عوض کنم؟و اگر اون ها تاثیری ندارن پس اصلا چرا بزاریمشون؟
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+1 # احسان عباسی 1394-04-31 16:26
همان طور که گفتم، اگر بخواهید عکس را عوض کنید، باید در سایت های آپلود عکس، یک عکس را آپلود کنید و آدرسی که این سایت به شما می دهد را در اینجا قرار دهید:
<img src="/آدرس عکس شما در اینجا قرار می گیرد" >

در مورد خصوصیت های width و height عرض کردم که: اگر width و height را حذف کنید، عکس در اندازه ی واقعی خودش نمایش پیدا می کند.
با تعریف این دو خصوصیت، عکس در عرض و ارتفاع دلخواه شما نمایش می یابد نه در اندازه ی واقعی خودش.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+2 # malih niku 1394-04-29 12:52
پاراگراف با عنوان در کل فرقی نداره که؟اگه جابه جا بنویسیم چه مشکلی پیش میاد؟
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
0 # احسان عباسی 1394-04-29 13:27
یکی از فرق های این دو در اندزه ی فونت آنها است. اندازه ی فونت یک عنوان بیشتر است و ضخیم تر هم هست.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+2 # malih niku 1394-04-29 12:45
چرا من برا عنوان ها بیشتر از 6 میزدم خطا نمی گرفت .مثلا میزدمh9
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+3 # احسان عباسی 1394-04-29 13:19
با درست ننوشتن یک تگ، خطا ایجاد نمی شود، و فقط این تگ وظیفه ی خود را به درستی انجام نمی دهد.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+7 # beyamooz dooset dara 1394-01-30 16:37
سلام از سایت خوبتون تشکر می کنم
یک سوال من می خوام به جای استفاده ازویرایشگر note pad از Microsoft SharePoint Designer 2013 استفاده کنم برای راحتی کد نویسی اما مشکلی که دارم اینکه وقتی روی new blank site می زنی فیلد ها را نمی دونم چی بگدارم که وارد محیط برنامه بشم اخه front page که اینطوری نبود لطف کنید راهنمایی بفرمایید متشکرم ارادتمند شما parsa میشه جوابم زود بدید البته ببخشید
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+1 # امیر پهلوان صادق 1394-01-31 12:41
سلام
لطفاً سوالاتتون مربوط به بحث آموزشی باشه ...!
با عرض معذرت اما از این جملتون که گفتید "به جای استفاده ازویرایشگر note pad ازMicrosoft SharePoint Designer 2013" واقعاً متعجب شدم. این دو تا از زمین تا آسمون با هم فرق دارن ...!
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+18 # اصغری 1393-09-29 22:40
خیلی عالیه واقعا ممنون
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+14 # turboline71 1393-09-19 20:53
تو همه ضمینه های کامپیوتر چه سخت افزاری چه نرم افزاری مهارت فوق العاده داشتم به جز طراحی وب اونم شانس اوردم با یه جستو جو با سایتتون آشنا شدم واقعا خیلی جالبه موفق و سر افراز باشید :v
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+27 # saharsdp 1393-07-30 02:10
اگر میدونستم سایت شما وجود داره اون همه هزینه بابت کلاس آموزش html نمیدادم :(
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+19 # سعید دادفر 1393-01-24 18:59
سلام من از سایت شما راضی هستم امیدوارم موفق باشید با تشکر . سعید دادفر :roll:
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+4 # علی اکبر امینی 1392-12-14 23:42
سلام
باید عکس رو از کجا اضافه کنیم؟
میتونیم از سیستم اضافه کینم؟؟
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+3 # سید محمد صالح 1394-02-22 05:19
سلام اگه می خوای عکس از سیستمت بزاری اول باید عکس مورد نظرتو توی اینترنت آپلود کنی بد آدرس اینترنتیشو در قسمت ایمج سرس اچ تی ام ال کپی کنی
یا علی
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن

آموزش صوتی HTML

بستن
مدرس:
سوال و جواب:

ابزاری که در پیش روی دارید یکی از ابزارهای بسیار کاربردی سایت بیاموز در زمینه آموزش است، این ابزار برای سهولت یادگیری شما کاربران محترم طراحی شده است.

فقط کافی است روی عنوان پاراگراف مورد نظرتان کلیک کنید تا پخش صدا آغاز شود ...!

تمامی محصولات و خدمات این وبسایت، حسب مورد دارای مجوزهای لازم از مراجع مربوطه می‌باشند و فعالیت‌های این سایت تابع قوانین و مقررات جمهوری اسلامی ایران است.
logo-samandehi مجوز نشر دیجیتال از وزرات فرهنگ و ارشاد اسلامی پرداخت آنلاین -  بانک ملت معرفی بیاموز در شبکه سه پرداخت آنلاین - بانک اقتصاد نوین پرداخت آنلاین - بانک سامان
 
دوره های آموزشی راه اندازی کسب و کارهای اینترنتی
تبلیغات اینترنتی