جلسه هشتم آموزش html – فرمتهای متن

آموزش اچ تی ام ال
۱۷ دی
0

به نام خدا

در این جلسه میخواهیم فرمتهای bold – italic و underline را که مربوط به متون هستن،آموزش بدیم

برای دادن این فرمتها به متون داخل سندهای html باید از تگ های مربوط به هر کدوم استفاده کنیم.

تگ <b> برای bold کاربرد دارد. به این صورت که ابتدا <b> و سپس متن مورد نظر و در انتهای <b/> را می نویسیم.

تگ <i> نیز برای ایتالیک کردن متن (همان مورب کردن متن) کاربرد دارد و همانند بالا استفاده خواهد شد.

برای زیرخط دار کردن متون نیز از تگ <u> استفاده میکنیم. که این تگ نیز مانند دو تگ بالا باید استفاده شوند.

به کد های زیر توجه کنید:

<!DOCTYPE html>
<html>
<head>
<title>جلسه هشتم آموزش اچ تی ام ال سایت آنزیم - فرمتهای متن</title>
</head>
<body>
<b>نوشته ی ضخیم</b>
</br>
<i>نوشته ی مورب یا ایتالیک</i>
</br>
<u>نوشته ی زیرخط دار</u>
</br>
<b><u><i>نوشته ای که تمام موارد بالا در آن لحاظ شده است</i></u></b>
</body>
</html>

کدهای بالا را در یک نوت پد وارد کرده و همانطور که در جلسه ی اول آموزش دادیم آن را به صورت یک سند html ذخیره کنید تا نتیجه ی کار رو ببینین

نکته: از تگ </br> زمانی استفاده میکنیم که بخواهیم دو متن را از هم به فاصله ی یک خط جدا کنیم.

فایل آماده ی این جلسه هم در زیر جهت دانلود آماده شده است

 

اولین جلسه آموزش html – آشنایی با html

آموزش اچ تی ام ال
۰۱ دی
2+

با سلام

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

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

خب اول از همه باید یک سری اطلاعاتی از html در اختیارتون قرار بدم.

زبان html یک زبان ساده ولی همه کاره است… یعنی از این زبان فقط برای صفحات وب استفاده میشه، ولی این صفحاتی که با html آماده میشه میتونه حتی توی برنامه های اندروید هم استفاده بشه… همین نرم افزارهایی که همه ی ما توی گوشیهای اندرویدیمون داریم.

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

شما چیزی که برای آموزش html نیاز دارین.. ابتدا یک نرم افزار بسیار بسیار سنگین به اسم notepad می باشد! 🙂

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

یک سند html باید حاوی تگ های  <html> (بهش میگیم اچ تی ام ال باز) و <html/> (بهش میگیم اچ تی ام ال بسته) باشه… حالا برای زیبایی کار بعضیا میان ابتدای سند یعنی بالای بالای صفحه <!DOCTYPE html> رو مینویسن…

این زیاد اجباری نیست… فقط یه رسمه…

در واقع این دو تگ <html> و <html/> به یک صفحه ی معمولی که در notepad بازش کردین میفهمونه که این سند یک سند html هست.

در سند اچ تی ام ال دو تگ اجباری دیگه هم داریم….
یکی <head> و <head/> هستش و دیگری <body> و <body/>

تگ head اون قسمتی از سند هست که به مرورگر میفهمونه که عنوان صفحه چیه… البته یه سری اطلاعات دیگه هم توش قرار میگیره که به مرور میگیم خدمتتون.

تگ  body همونطور که از معنی کلمه اش هم پیداست…در واقع همون بدنه ی اصلی صفحه وب هست که همه ی اطلاعات توش قرار میگیره و به نمایش در میاد

برای اینکه بخواین به صفحه مون عنوان یا تایتل بدیم هم تگ <title> و <title/> رو در داخل تگ head استفاده مکنیم..

خب ابتدا با notepad یک صفحه باز کنین

این کد رو به همین صورت توش قرار بدین

<!DOCTYPE html>
<html>
<head>
<title>اولین جلسه کلاسهای آموزش اچ تی ام ال آنزیم</title>
</head>
<body>
بدنه ی اصلی صفحه وب
</body>
</html>

و کلید ترکیبی کنترل+S رو برای ذخیره شدنش بزنین…

اما صبر کنین… برای ذخیره شدنش عجله نکنین

موقع ذخیره شدن بعد زدن کنترل+S در پنجره ای که باز میشه در پایین صفحه  گزینه ی جلوی  Encoding رو به utf-8 تغییر بدین و سپس در قسمت file name نام نوشته شده رو پاک کنید و نام index.html رو تایپ کنین و سند رو هرجایی که دوست دارین (ترجیحا داخل یک فولدر جداگانه) ذخیره اش کنین.

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

فایلتون باید مثل فایلی که من آماده کردم باشه…میتونین فایل وبی رو که من نوشتم رو از باکس پایین صفحه دانلود کنین…

خب برای جلسه ی اول زیاد حرف زدم… 🙂

تا جلسه ی بعد خدا یار و نگهدارتون