درود مهمان گرامی!   ورود   )^(   ثبت نام زمان کنونی: ۱-۸-۱۳۹۳, ۱۱:۰۹ صبح


 

سرزمین بلاگ حامد اسکندری

ارسال پاسخ  ارسال موضوع 
 
امتیاز موضوع:
  • 0 رأی - میانگین امتیازات: 0
  • 1
  • 2
  • 3
  • 4
  • 5

حالت موضوعی | حالت خطی
دانلود مقاله در مورد آموزش html مربوط به رشته کامپیوتر
نویسنده پیام
مدیر بازنشسته تالار
مدیر بازنشسته
***
آفلاین
ارسال‌ها: 14,149
تاریخ عضویت: ۱۲ خرداد ۱۳۸۸
اعتبار: 89
سپاس ها 84
سپاس شده 461 بار در 410 ارسال
ارسال: #1
دانلود مقاله در مورد آموزش html مربوط به رشته کامپیوتر

آموزش html 
  
مقدمه ای بر HTML

يک فايل HTML چيست؟

HTML را "اچ تی ام ال" و يا اچتمل بخوانيد.

HTML برگرفته از حروف اول Hyper Text Markup Language ميباشد.

يک فايل HTML فايلی از نوع text ميباشد که متشکل از markup tag ها ميباشد.

مرورگر يا Browser از روی markup tag ها می فهمد که چگونه بايد صفحه را نمايش بدهد.

يک فايل HTML بايد دارای انشعاب htm و يا html باشد.

يک فايل HTML فايلی از نوع text ميباشد که با هر اديتور ساده ای قابل ايجاد است.

وظيفه اصلی تگ های اچتمل ( markup tags ) بيان چگونگی نمايش اطلاعات ميباشد.

ميخواهيد که يک فايل اچتمل بسازيد؟

اگر از ويندوز مايکروسافت استفاده ميکنيد، Notepad را باز کرده (Mac کارها از SimplaeText استفاده کنند. ) و متن زير را در آن تايپ کنيد:

<html>

<head>

<title>Title of page</title>

</head>

<body>

This is my first html page. <b>This text is bold</b>

</body>

</html>
 

سپس فايل را با نام مثلا test.html در درايو \:c ذخيره کنيد.

برای ديدن فايل اچتمل بالا در مرورگر يا Brower تان ( معمولا اينترنت اکسپلورر و يا نتسکيپ نويگيتور ) کافی است که از روی منوی File/Open file فايل بالا را از روی محل ذخيره شده بخوانيد. ( به آدرس فايل در قسمت Address توجه کنيد، مثلا c:\test.html)
يکی از مهمترين وظايف مرورگرها نمايش صفحات اچتی ام ال ميباشد، چه اين صفحات روی کامپيوتر شما ذخيره شده باشند و يا اينکه از اينترنت خوانده شوند. با کليک روی یک لينک فايلی شبيه فايل ذخيره شده توسط شما از روی وب سرور توسط مرورگرتان خوانده شده و سپس نمايش داده خواهد شد!!! ( به آدرس فايل در قسمت Address توجه کنيد. )

توضيح مثال بالا

اولين تگ مثال بالا تگ <html> ميباشد. از روی اين تگ، مرورگر نوع متن يعنی اچتمل بودنش را يافته و از روی <html/> انتهای متن اچتمل را ميبابد.

متن بين تگ <head> و تگ <head/> اطلاعات شناسنامه ای يا "Header information" متن اچتمل بوده و نمايش داده نخواهند شد. در اين مثال با کمک تگهای <title> و <title/> تيتر و يا Title صفحه که در اين مثال عبارت "Title of page" ميباشد در بالای مرورگر نمايش داده خواهد شد.

متن بين تگ <body> و انتهای آن يعنی تگ <body/> تنها اطلاعاتی است که توسط مرورگرنمايش داده خواهند شد.

متن بين تگ <b> و انتهای آن يعنی تگ <b/> بصورت Bold و يا توپر نمايش داده خواهند شد.

انشعاب فايل htm يا html ؟

اغلب مرورگرها هر دو نوع انشعاب را به خوبی ميشناسند ولی ترجيحا به هنگام ذخيره فايلهای اچتمل از html استفاده کنيد.( استفاده از انشعابهای سه حرفی مانند htm مربوط به قديم و سيستم عاملهائی چون DOS بودند.)

نکته ای در مورد اديتورهای اچتمل ( HTML Editors )
با وجوديکه با استفاده از اديتورهای اختصاصی اچتمل مانند FrontPage و يا Claris Home Page امکان نوشتن و طراحی صفحات اچتمل بصورت WYSIWYG يا "What You See Is What You Get" وجود دارد اما توصيه ميشود که از اديتورهای معمولی متن برای تهيه صفحات خود استفاده کرده، عملکرد تگها را شناخته و هيچگاه بدون اينکه بدانيد کاربرد يک تگ چيست آنرا بکار نبريد.

HTML & WWW

(در اين قسمت با مفاهيم وب، اينترنت، مرورگرها و استانداردهای وب آشنا خواهيد شد.)

منظور از وب چيست؟

وب شبکه ای است متشکل از تمامی کامپيوترهای دنيا، شبکه ای از شبکه ها.

اينترنت، وب، WWW ، web يا World Wide Web همگی يک چيزند.

تمامی کامپيوترهای وب ميتوانند با هم ارتباط داشته باشند.

کامپيوترهای موجود در وب با کمک استاندارد ارتباطی يا پروتوکل HTTP با هم ارتباط برقرار ميکنند .

نحوه کارکرد وب چگونه است؟

اطلاعات وب داخل فايلهائی به نام Web Pages و يا صفحات وب قرار دارند.

اين فايلها يا صفحات روی Web Server يا کامپيوترهای سرويس دهنده وب ذخيره شده اند.

برای ديدن صفحات وب از نرم افزاری به نام مرورگر و يا Web Browser استفاده ميشود.

دو مرورگر Internet Explorer و Netscape Navigator جزو معروفترين مرورگرها حساب ميشوند.

مرورگر Internet Explorer متعلق به شرکت مايکروسافت و مرورگر Netscape Navigator متعلق به شرکت نت اسکيپ ميباشد.

مرورگرها چگونه به خواندن صفحات وب ميپردازند؟

يک مرورگر با کمک يک Request درخواستی برای خواندن يک صفحه از وب سرور ميکند.

اين Request يا درخواست بر اساس استاندارد ارتباطی يا پروتوکل HTTP بوده و شامل آدرس صفحه مورد نظر ميباشد.

آدرس يک صفحه وب چيزی شبيه شما قادر به مشاهده لينک ها نمي باشيد . باید ابتدا در گروه ایران فروم عضو شوید برای عضویت سریع کلیک کنید. است. بخش //:http نوع پروتوکل و يا استاندارد ارتباطی را تعيين ميکند، شما قادر به مشاهده لينک ها نمي باشيد . باید ابتدا در گروه ایران فروم عضو شوید برای عضویت سریع کلیک کنید. نام دومين يا Domain است و faq.html نام صفحه ای است که بايد خوانده شود.

مرورگرها چگونه صفحات وب را نمايش ميدهند؟

چگونگی نمايش يک صفحه وب بصورت مستتر در آن وجود دارد.

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

وظيفه اصلی تگ های اچتمل ( HTML tags ) بيان چگونگی نمايش اطلاعات ميباشد.

يک تگ اچتمل چيزی شبيه <p> اين تگ پاراگراف است! </p> است.

چه کسانی استاندارد های وب را تعيين ميکند؟

تعيين استاندارد های وب ربطی به شرکتهای مايکروسافت و يا نت اسکيپ ندارد.

World Wide Web Consortium يا W3C متولی تعيين استانداردهای وب است.

HTML, CSS and XML از مهمترين استانداردهای تصويب شده وب ميباشند.

آخرين استاندارد HTML استاندارد XHTML 1.0 ميباشد .


عناصر ( Elements )


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

تگ های اچتمل (HTML Tags)

با کمک تگ های اچتمل عناصر و يا Elements ساخته ميشوند.

در زبان اچتمل حدود 80 عنصر تعريف شده است.

تگ های اچتمل بوسيله دو نويسه (char) > و < ساخته ميشوند.

تگ های اچتمل معمولا بصورت زوج ظاهر ميشوند، مانند <b>test</b>

تگ اول در يک زوج تگ مثلا <b> تگ شروع و تگ دوم مثلا <b/> تگ پايانی نام دارد.

متن بين تگ اول و تگ دوم در يک زوج تگ محتوای عنصر يا element content ناميده ميشود، مثلا "test"

تگ های اچتمل را ميتوانيد بوسيله حروف لاتين کوچک (lower case) و يا بزرگ (upper case) بنويسيد و case sensitive نيستند. برای مثال دو تگ <b> و <B> معادل هم هستند ولی شديدا توصيه ميشود که به خاطر سازگاری با XHTML از حروف کوچک استفاده شود.


عناصر اچتمل (HTML Elements)

مثال بخش مقدمه را در نظر بگيريد:

<html>

<head>

<title>Title of page</title>

</head>

<body>

This is my first html page. <b>This text is bold</b>

</body>

</html>
 

*** نمونه ای از يک عنصر اچتمل:

<b>This text is bold</b>
 

عنصر اچتمل بالا با تگ <b> شروع شده و با تگ <b/> پايان می يابد. محتوای اين عنصر عبارت "This text is bold" است. لازم به ذکر است که کاربرد تگ <b> نمايش توپر يا bold متون است.

*** مثال دوم يک عنصر اچتمل (معلوم الحال) :

<body>

This is my first homepage. <b>This text is bold</b>

</body>
 

عنصر اچتمل بالا با تگ <body> شروع شده و با تگ <body/> پايان می يابد. همانطور که ميبينيد گاهی يک عنصر حاوی يک يا چند تگ ديگر ميباشد.وظيفه تگ <body> تعيين بدنه اصلی يا body يک متن اچتمل است.لازم به يادآوری است که تنها اطلاعات بخش <body> يک فايل اچتمل در صفحه مرورگر نمايش داده خواهد شد.

 


شناسه های يک تگ (Tag Attributes)

تگ ها ميتوانند حاوی اطلاعات اضافی ديگر باشند، به اين اطلاعات شناسه يا Attribute ميگويند و وظيفه آنها بيان ديگر اطلاعات يک عنصر يا Element ميباشد. مثلا در مورد تگ <body> شناسه ای به نام bgcolor وجود دارد که رنگ زمينه متن (background) را تعيين ميکند برای نمونه اگر ميخواهيد که رنگ زمينه صفحه اچتملتان سياه باشد کافی است که به شکل زير عمل کنيد :

<body bgcolor="black">

در مثال زير تگ <body> دارای چهار شناسه مختلف با نامهای width، height ، align و border و مقادير center، 60، 100 و 0 ميباشد.

<table border="0" width="100" height="60" align="center" >
......
</table>

شناسه ها به صورت کلی "مقدار=نام" يا "name=value" نوشته ميشوند و هميشه به تگ شروع يک عنصر يا Element اضافه ميشوند و نهايتا اگر در يک عنصر يا Element شناسه ها قيد نشوند از مقادير قراردادی يا default آنها استفاده خواهد شد مثلا در تگ body اگر شناسه bgcolor نوشته نشود از رنگ سفيد برای زمينه صفحه استفاده خواهد شد.
مقدار يک شناسه را ميتوانيد داخل نويسه های " و يا ' بنويسيد و اختيار دست شما است فقط در مواردی که مقدار يک شناسه شامل نويسه " هم ميشود بايد از نويسه ' استفاده شود.


تگ های اصلی ( Basic Tags )

تگ ها ( tags ) اجزا تشکيل دهنده عناصر يا elements های اچتمل هستند و در اين فصل با عناصر و تگ های پايه و مهم:
< hr> , <br> , <h1> .... <h6> , <!-- comment --> , <p>
آشنا خواهيد شد . يکی از بهترين روش های يادگيری تگ های اچتمل ديدن مثالها و تغيير آنها ميباشد و با کمک اديتور اختصاصی ما و با استفاده از امکانات فارسی نويسی آن به صورت آنلاين ميتوانيد به مطالعه و يادگيری مثالها پرداخته، کدهای اچتمل را تغییر داده و با کليک روی دکمه "نمايش نتايج" به مشاهده نتايج بپردازيد.


سر تيترها (Headings)


سر تيترها با کمک تگ های <h1> تا <h6> تعيين ميشوند. <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>
 


پاراگرافها (Paragraphs)


پاراگرافها با کمک تگ <p> معرفی ميشوند.مرورگر به هنگام نمايش يک پاراگراف بصورت اتوماتيک يک سطر خالی قبل و بعد از آن اضافه خواهد کرد.

<p>This is a paragraph</p>

<p>This is another paragraph</p>
 


سطر جديد (Line Breaks)

برای رفتن سر سطر جديد از تگ <br> استفاده ميشود.در اينحالت يک پاراگراف جديد ايجاد نميشود. تگ <br> از نوع تگ های خالی بوده و دارای تگ انتهائی (مثلا <br/> ) نميباشد.


<p>This <br> is a para<br>graph with line breaks</p>
 


کامنت ها در اچتمل (Comments)

برای نوشتن شرح و توضيحات در مورد کدهای اچتمل بايد از تگ خاصی استفاده کنيد. برای اينکار بايد متن و شرحتان را درون علائم <-- و --!> قرار دهيد. مرور تگ های comment را در نظر نگرفته و محتوی آنها را نمايش نخواهد داد و فقط شرح و توضيحات برای برنامه نويس و ديگر افرادی که احتمالا در آينده با کد اچتمل کار خواهند کرد مفيد خواهد بود. (به محل نويسه "!" توجه کنيد! فقط يکی و آنهم در ابتدا)

<!-- This is a comment -->
 


چند نکته کاربردی:

توجه داشته باشيد که بدليل وجود مرورگرهای متفاوت (اکسپلورر، نت اسکيپ، ..) و به دليل تفاوت دقت نمايش صفحه نمايش کامپيوترها، صفحات اچتمل با اندکی تفاوت در حالتهای مختلف نمايش داده ميشوند و هميشه سعی کنيد که صفحاتتان را نه تنها با اکسپلورر که معروفترين مرورگر است بلکه با نت اسکيپ و حتی مرورگرهای کامپيوترهای مکينتاش چک کرده و همچنين در دقت های نمايش 800x600 و 1024X768 آن را امتحان کنيد.

از نظر فاصله و سطر بندی، متنی که در صفحه اديتورتان تايپ ميکنيد با چيزی که مرورگر نمايش خواهد داد متفاوت خواهد بود.هميشه به ياد داشته باشيد که فاصله های اضافی (space) و خطهای خالی متن در صفحه اديتور توسط مرورگر در نظر گرفته نشده و نمايش داده نخواهد شد.

برای نمايش بيش از يک فاصله خالی بايد از نويسها يا ترکيب کاراکتری خاصی (None Breaking Space) استفاده کنيد.


فاصله های اضافی بين کلمات در يک متن اچتمل توسط مرورگرها ديده نخواهد شد و در نمايش هميشه تبديل به يک فاصله (space) خواهد شد. در ضمن يک خط خالی در متن اديتور بصورت يک فاصله يا space نمايش داده خواهد شد.

برای ايجاد يک سطر جديد هيچگاه از يک تگ <p> خالی استفاده نکنيد و به جای آن از تگ <br> استفاده کنيد..

مرورگرها به هنگام نمايش بعضی عناصر بصورت اتوماتيک يک سطر خالی قبل و بعد از آن عنصر نمايش خواهند داد. برای نمونه اين گروه از عنصرها ميتوان از پاراگراف (<p>) و سرتيترها (<h..>) نام برد.

تگ <hr> يا Horizontal Roler سبب نمايش يک خط افقی خواهد شد و در واقع بخش های مختلف مطالب اين صفحات با کمک اين تگ از هم جدا شده اند.

 

شما قادر به مشاهده لينک ها نمي باشيد . باید ابتدا در گروه ایران فروم عضو شوید برای عضویت سریع کلیک کنید.

موضوع‌های مرتبط با این موضوع...
دانلود مقالات اختصاصی اقتصاد
دانلود مقاله روشهای تست و نگهداری کابل ها و سیستم های مربوطه
دانلود مقاله امنیت اطلاعات و SNORT‎
دانلود مقاله آشنایی با فناوری بلوری Blue-Ray
دانلود مقاله نابرابریهای طبقاتی و اجتماعی دانش آموزان در شهرستان اسلام آباد
دانلود مقاله در مورد رگولاتور برای رشته برق
دانلود مقاله اهداف و چرایی توسعه اقتصادی‎
دانلود مقاله پیرامون پورت USB
دانلود پروژه سیستم حسابداری دانشگاهها و موسسات آموزش عالی
دانلود پروژه تجزیه تحلیل صورت های مالی بانک صادرات‎


حتی روز" مرگم "هم با هم تفاهم نداریم
من سفید میپوشم
تو سیاه...
۲-۹-۱۳۸۹ ۰۸:۴۶ عصر
مشاهده‌ی وب‌سایت کاربر یافتن تمامی ارسال‌های این کاربر نقل قول این ارسال در یک پاسخ

ارسال پاسخ  ارسال موضوع 

کاربرانِ درحال بازدید از این موضوع: 1 مهمان
پرش به انجمن:


موضوع‌های مرتبط با این موضوع...
موضوع: نویسنده پاسخ: بازدید: آخرین ارسال
Star دانلود مقالات اختصاصی اقتصاد chakavak 6,091 122,595 ۱۷-۳-۱۳۹۳ ۰۳:۰۷ صبح
آخرین ارسال: chakavak
  دانلود مقاله روشهای تست و نگهداری کابل ها و سیستم های مربوطه Lorax 0 290 ۱۱-۳-۱۳۹۳ ۱۱:۲۳ عصر
آخرین ارسال: Lorax
  دانلود مقاله امنیت اطلاعات و SNORT‎ Lorax 0 287 ۱۱-۳-۱۳۹۳ ۱۰:۱۷ عصر
آخرین ارسال: Lorax
  دانلود مقاله آشنایی با فناوری بلوری Blue-Ray Lorax 0 283 ۱۱-۳-۱۳۹۳ ۰۸:۲۶ عصر
آخرین ارسال: Lorax
  دانلود مقاله نابرابریهای طبقاتی و اجتماعی دانش آموزان در شهرستان اسلام آباد Lorax 0 249 ۱۱-۳-۱۳۹۳ ۰۸:۲۰ عصر
آخرین ارسال: Lorax

درباره ایران فروم

تالار گفتگوی ایرانیان از سال 1387 هجری شمسی فعالیت خود را آغاز کرده و هم اکنون با بیش از 750.000 کاربر ثابت بزرگ ترین تالار گفتگوی فارسی زبان در جهان می باشد.

برای سفارش تبلیغات در ایران فروم کلیک کنید

جستجو در انجمن