آموزش زبان های برنامه نویسی

آموزش زبان های برنامه نویسی

آموزش انواع زبان های برنامه نویسی
آموزش زبان های برنامه نویسی

آموزش زبان های برنامه نویسی

آموزش انواع زبان های برنامه نویسی

جلسه پنجم آشنایی با خواص ها در اچ تی ام ال (HTML Attributes)


جلسه پنجم  آشنایی با خواص ها در اچ تی ام ال (HTML Attributes)



خواص ها (Attributes ) ها اطلاعات بیشتری در مورد عناصر Html در اختیار ما قرار می دهند.

 

خواص های Html
  •         عناصر Html می توانند خواص داشته باشند
  •         خواص ها اطلاعات بیشتری در مورد عناصر Html در اختیار ما قرار می دهند.
  •         خواص ها همیشه بصورت مشخص در ابتدای تگ ها هستند.
  •         خواص ها همیشه بصورت جفتی می آیند مانند: name="value"
خواص زبان یا lang :

زبان یک سند را می توان در تگ  <html> تغریف کرد.

و زبان سند به وسیله خواص lang تعریف می شود.

تعریف زبان دریک سند میتواند برای مرورگر ها و موتور های جستوجو مهم باشد.

مثال


<!DOCTYPE html>
<html lang="en-US">
<body>

<h1>My First Heading</h1>

<p>My first paragraph.</p>

</body>
</html>


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


حرف دوم مشخص کننده گویش (US) است.


خواص عنوان یا title:


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


در مثال زیر به تگ <p>  یه خواص عنوان با عبارت " About projeraygan.blogfa.com "  تعریف کرده ایم.




<p title="About projeraygan.blogfa.com">
About projeraygan.blogfa.com is a web developer's site.
It provides tutorials and references covering
many aspects of web programming,
including HTML, CSS, JavaScript, XML, SQL, PHP, ASP, etc.
</p>


هر وقت موس را بروی پاراگراف حرکت دهید و نگه دارید عبارت تایتل ظاهر می شود.


خواص href یا خاصیت ها لینک


لینک ها در Html با تگ <a> مشخص شده و با خاصیت href  آدرس اینترنتی آن مشخص می شود.


مثال : 


<a href="http://www.projeraygan.blogfa.com ">This is a link</a>


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


خاصیت Size


عکس ها با تگ <img> تعیین می شوند.


و آدرس منبع و اصلی عکس هم به وسیله خاصیت  (src) تعیین می شود.


و خاصیت ها  (width)  و (height)  تعیین کننده سایز یا اندازه عکس هستند.


اندازه عکس به وسیله پیکسل تعیین می شوند


به طور مثال  width="104" یعنی عرض عکس 104 پیکسل باشد.


در جلسه های بعدی در مورد تگ عکس بیشتر توضیح خواهیم داد.


خاصیت alt


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


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


مقدار این خاصیت قابلیت نمایش توسط مرور گر ها را دارد.


و به وسیله این خاصیب  و با استفاده از بعضی برنامه ها افراد نابینا می توانند بدانند


که شما چه عکس یا چیزی را در این بخش قرار داده اید.


مثال



<img src="projeraygan.blogfa.com.jpg" alt="projeraygan.blogfa.com " width="104" height="142">


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


در Html5 استفاده از حرووف کوچک الزامی نیست.


خاصیت عنوان را شما می توانید بصورت حروف کوچک یا بزرگ بنویسید مانند Title  یا TITELE


البته ما توصیه کنیم که در Html4 و XHTML از حروف کوچک استفاده کنید


چون داری قانون سخت گیرانه تری هستند.


البته استفاده از حروف کوچک رایجتر است چون نوشتن آن استان است و


ما هم در تمامی مثال های این کتاب از حروف کوچک استفاده می کنیم.


پیشنهاد ما : همیشه از دابل کوتیشن در مقدار خاصیت ها استفاده کنید.


در استاندارد Html5 استفاده از دابل کوتیشن در مقدار خاصیت ها الزامی نیست.


مثال قبلی رو بصورت زیر هم میتونیم بنویسیم بدون کوتیشن


<a href=http://www.projeraygan.blogfa.com >



البته ما توصیه کنیم که در Html4 و XHTML از دابل کوتیشن استفاده کنید


چون داری قانون سخت گیرانه تری هستند.


گاهی وقت ها لازم است که شما از دابل کوتیشن استفاده کنید و گرنه ممکن است


نتیجه خوبی به دلیل فضای خالی بین نوشته ها مشاهده نکنید.


مثال :

<p title=About projeraygan.blogfa.com >


در مثال بالا فقط بخش اول کار یعنی About   را نشان میدهد وقسمت دوم را نشان نمی دهد.


استفاده از دابل کوتیشن رایج است ولی اگر آن را حذف کنیم ممکن است با خطا مواجه شویم.


ما توصیه میکنیم که همیشه از دابل کوتیشن در مقدار خاصیت ها استفاده نمایید


تک کوتیشن یا دابل کوتیشن؟


استفاده از دابل کوتیشن در Html رایجتر است هرچند که ممکن است که تک کوتیشن


هم مورد استفاده قرار بگیرد


در اکثر جاها که به خاصیت ها یک مقدار می دهند آن را با دابل کوتیشن مشخص می کنند.


یا شاید لازم باشد که از تک کوتیشن استفاده کنند.


مثال

<p title='Siros "ShotGun" Babakhani'>


یا برعکس


<p title="Siros 'ShotGun' Babakhani">



 

خلاصه این جلسه:


·         همه تگ های Html می توانند که خاصیت داشته باشند.


·         خاصیت تایتل در تگ های Html به اطلاعات داده شده tool-tip   اضافه میکند.


·         و خاصیت href  در لینک ها می توانست که آدرس را به ما  نشان دهد.


·         و خاصیت ها width   و  height اطلاعاتی در مورد اندازه عکس ها یا اشیا  به ما می دهند.


·         و خاصیت alt هم میتواند در مواقعی که عکسی نشان داده نمی شود متنی به جای آن نشان داده شود.


·         و در این مجموعه آموزش ها ما همیشه از حروف کوچک در نام تگ ها استفاده میکنیم


·         و همیشه در مقدر خاصیت ها هم از دابل کوتیشن استفاده می کنیم.




درس قبلی



نحوه دانلود یک متن با استفاده از Asp.net



نحوه دانلود یک متن با استفاده از Asp.net



البته اولش باید از این یوزینگ استفاده کنیم

using System.Text;


StringBuilder sb = new StringBuilder();

                         string output = "siroos, si, babakhani,ba";

                         sb.Append(output);

                         sb.Append("\r\n");

 

                         string text = sb.ToString();

 

                         Response.Clear();

                         Response.ClearHeaders();

 

                         Response.AddHeader("Content-Length", text.Length.ToString());

                         Response.ContentType = "text/plain";

                         Response.ContentEncoding = System.Text.Encoding.UTF8;

        Response.AppendHeader("content-disposition", "attachment;filename=\"output.txt\"");

 

                         Response.Write(text);

                         Response.End();


که با استفاده از دستورات و قطعه کد های بالا امکان دانلود یک متن را در زبان برنامه نویسی Asp.net برای شما فراهم میکند و شما می توانید آن را بصورت یک فایل متنی Txt در کامپیوتر خود ذخیره نمایید.


نکته : تکه کد بالا فقط توانایی دانلود و ذخیره متن انگلیسی را دارد با استفاده از کد زیر شما میتوانید متن ها فارسی را هم در فایل متنی خود قرار دهید و آن را قابل دانلود برای کارهای خاصی نمایید.



دانلود یک فایل متنی فارسی با استفاده از Asp.net با زبان برنامه نویسی #C


ابتدا یوزینگ زیر را اضافه میکنیم.

using System.IO;

 

بعد تیکه کد زیر را به برنامه اضافه مکنیم تا امکان دانلود فراهم شود.


StringWriter oStringWriter = new StringWriter();

        oStringWriter.WriteLine("siroos babakhani in tamrin/nخیلی ممنونم از اینکه این فایل را برای دانلود انتخاب کردید  /n in tamrni anajm shod");

        Response.ContentType = "text/plain";

 

        Response.AddHeader("content-disposition", "attachment;filename=" + string.Format("txtfiles.txt"));

        Response.Clear();

 

        using (StreamWriter writer = new StreamWriter(Response.OutputStream, Encoding.UTF8))

        {

            writer.Write(oStringWriter.ToString());

        }

        Response.End();

با استفاده از تکه کد بالا امکان دانلود متن فارسی را در برنامه می توانید اضافه کنید.







نحوه ذخیره کردن متن در فایل Json


 نحوه کار با jSon


ذخیره یک فایل متنی در Json


برای کار با فایل json ابتدا آن فرمت  و متن مورد نظر را با استفاده از تابع زیر تبدیل میکنیم


public static string ToJSON(this object obj)

        {

            JavaScriptSerializer Serializer = new JavaScriptSerializer();

            return Serializer.Serialize(obj);

        }

        public static string ToJSON(this object obj, int recursionDepth)

        {

            JavaScriptSerializer serializer = new JavaScriptSerializer();

            serializer.RecursionLimit = recursionDepth;

            return serializer.Serialize(obj);

        }


از دو تابع بالا برای تبدیل دیتا ها به فایل جی سان استفاده میکنیم


و نهایتا با استفاده از کدهای زیر آن را در مسیر مشخصی ذخیره میکنیم


 

  var json=Context.District_FCH(null, null, Convert.ToInt32(drpRegionId.SelectedValue));

                    string jjs = ToJSON(json);

                    System.IO.File.WriteAllText(@"c:\path.txt", jjs);




که خط اولی دیتاهای موجود را با استفاده از استورپروسیژر از دیتابیس میخونه 

و در خط دومی آن را به نوع جی سان و استرینگ تبدیل میکنه

و در خط سوم آن را به عنوان یک فایل در حافظه ذخیره میکند.



جلسه چهارم آشنایی با عناصر (HTML Elements)


جلسه چهارم  آشنایی با عناصر   (HTML Elements)

 

سندهای Html به وسیله عناصر  Html ساخته شده اند.

عناصر Html به وسیله تگ های شروع و تگ های پایان و محتویات آنها نوشته می شوند.

مانند  <نام تگ > محتویات <نام تگ/>

همه ی عناصر Html  با یک تگ شروع و با یک تگی پایان می گیرند.


مثال

<p>My first paragraph.</p>

 

تگ شروع

محتویات عناصر

تگ پابان

<h1>

My First Heading

</h1>

<p>

My first paragraph.

</p>

<br>

 

 


نکته: برخی از تگ های Html تگ پایانی ندارند یا با هیچ تگی بسته نمی شوند.


عناصر تودرتو در Html


عناصر Html می توانند که تودرتو تعریف شوند یعنی در داخل یک تگ تگ های دیگری را تعریف کرد

تمامی سند های Html شامل تگ های تودرتو هستند

در مثال زیر 4 تا عنصر Html و جود داره

<!DOCTYPE html>
<html>

<body>
  <h1>My First Heading</h1>
  <p>My first paragraph.</p>
</body>

</html>

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


تگ <html> کل سند رو در برمگیره و اینکه کل سند Html را مشخص میکند

و با تگ <html>شروع می شه و با تگ </html> بسته میشود

و دیگر عناصر Html تگ <body> هستش

تگ <body> بدنه سند و یا اصل سند را مشخص می کند

و این تگ هم با <body>و با تگ </body> بسته میشود.

و تگ های بعدی <h1>و <p> هستند.

تگ <h1>  برای مشخص کردن عنوان صفحه

و این تگ هم با <h1> شروع می شود و نهایتن با تگ </h1> بسته میشود. و محتویات آن شامل  My First Heading. است.

 

همیشه تگ ها را ببندید


بعضی از عناصر html توی مرورگر به درستی نمایش داده می شوند حتی اگر هم آن تگ را نبندید.


مثال

<html>

<body>
  <p>This is a paragraph
  <p>This is a paragraph 
</body>


</html>

مثال بالا توی همه ی مرورگر ها به درستی کار میکند چون بسته بودن تگ ها را به صورت اختیاری در نظر میگیرد.

هرگز شما این کار را نکنید. چون ممکن است خطا های غیر منتظره ای رخ دهد که پیدا کردن خطا در زمانی که پروژه بزرگ است سخت شود.


عناصر تکی Html


تگ هایی که هیچ گونه محتویاتی درون آنها نیست عناصر تک تگی می نامند.

تگ <br> نمونه ای از یک عنصر تک تگی است که نیازی به بسته شدن ندار و این تگ باعث ایجاد یه سطر جدید می شود.

عناصر تک تگی را می توان درون خود تگ آن را بست مثل <br />

در Html5 نیازی نیست که تگ های تکی را ببندیم. مگر اینکه شما خیلی سختگیر باشید و یا شاید شما بخواهید کد خود را برای XML خواناتر کنید.ولی ما توصیه میکنیم که تمامی عناصر Html را ببندید

نکته Html  : استفده از حروف کوچک در تگ ها

تگ های Html حساس به حروف کوچک و بزرگ نیستند. تگ  <P> بزرگ مثل تگ  <p>کوچک است مثل هم اند

دراستاندارد Html5 نیازی به استفاده از حروف کوچیک نیست و شما می توانید از حروف بزرگ یا کوچک استفاده کنید.اما ما توصیه می کنیم در Html4 و Xhtml از حروف کوچک برای تگ ها استفاده کنید.

و در اکثر وب سایت ها نام تگ هه را از حروف کوچک استفاده میکنند و ما هم توصیه میکنیم که از حروف کوچک استفاده کنید.




درس بعدی

درس قبلی


جلسه سوم مثال های عمومی از Html (HTML Basic Examples)


جلسه سوم  مثال های عمومی از Html (HTML Basic Examples)


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

همه سند های Html  باید با تعریف  <!DOCTYPE html>  شروع شوند

و همچنین سند های Html  باید با تگ <html>  شروع شوند  و با تگ  </html>پایان بپزیرند.

و همچنین بخش قابل مشاهده از سند Html  باید بین تگ <body> و  </body> قرار بگیرند.


مثال:

<!DOCTYPE html>
<html>
<body>

<h1>My First Heading</h1>

<p>My first paragraph.</p>

</body>
</html>

عنوان یا تایتل ها در Html


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

به این ترتیب که <h1> با فونت بزرگ و هرچقدر به <h6>  نزدیکتر میشویم فونت ها کوچک می شوند.


مثال


<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>


پاراگراف ها در Html


در Html برای استفاده از پاراگراف ها از تگ ها  <P> استفاده می شود.

مثال:

 

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


لینک ها در Html


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


مثال:

<img src="picture.jpg" alt="Projeraygan.blogfa.com" width="104" height="142">

 


نکته : شما در مورد ویژگی ها یا attributes  در جلسه های بعدی بیشتر یاد میگیرید.




درس بعدی


درس قبلی



آموزش Html جلسه دوم ویرایشگر های Html(HTML Editors)


آموزش Html جلسه دوم ویرایشگر های Html(HTML Editors)


کدهای Html  را معمولا در محیط NotePad یا ویرایشگرهای قوی تر مثل NotPad++ می نویسند.

و همچنین می توانید از ویرایشگر های حرفه ای تری هم استفاده کنید.

مانند

  • Adobe Dreamweaver
  • Microsoft Expression Web
  • CoffeeCup HTML Editor

هرچند که ما بهتون پیشنهاد میکنیم برای یادگیری Html  از NotPad++   استفاده کنید. و بعد از اینکه کدها را نوشتید با فرمت html آن را ذخیره کنید تا شبیه یک صفحه اینترنتی شود.

هرچند که ما معتقدیم که ویرایشگر هر چقدر ساده تر باشه بهترین راه برای یادگیری است.

در زیر چهار روش برای ساخت اولین وب سایت با NotPad را برای شما آموزش می دهیم.


مرحله اول:


میحط Notpad  را در ویندوز سون یا قدیمی تر باز کنید.

برای باز کردن میحیط NotPad  بر روی Start (گوشه چپ صفحه نمایش) کلیک کنید و سپس منوی All Program را باز کنید و سپس برروی Accessories کلیک نمایید و از منوی باز شده بر روی Notepad کلیک کنید تا باز شود.

برای باز کردن محیط Notpad  در ویندوز 8

برای باز کردن میحیط NotPad  بر روی Start (گوشه چپ صفحه نمایش) کلیک کنید و سپس عبارت Notpad  را تایپ نمایید.


مرحله دوم:


کدهای Html خود را در میحیط NotPad   وارد نمایید.

مثلا میتونید کدهای زیر را در محیط آن کپی نمایید

<!DOCTYPE html>
<html>
<body>

<h1>My First Heading</h1>

<p>My first paragraph.</p>

</body>

</html>



مرحله سوم :


صفحه Html را ذخیره کنید

آن را بروی کامپیوتر خود ذخیره کنید برای این کار میتوانید از منوی فایل  Save as را انتخاب کنید.

هنگامی که آن را ذخیره می کنید پسوند فایل را .htm یا .html انتخاب کنید. تفاوتی بین این دو وجود نداره و هردوشون یک کار را برای شما انجام میدهند.


مرحله چهارم:


نمایش صفحه Htmlدر مرورگر

بر روی فایل html  دابل کلیک نمایید و بعد از دابل کلیک صفحه ای شبیه زیر مشاهده میکنید.








آموزش Html جلسه اول مقدمه(HTML Introduction)


آموزش Html جلسه اول مقدمه(HTML Introduction)


من سیروس باباخانی هستم که در این بخش با آموزش Html در خدمت شما دوستان می باشم

 امیدوارم بتونم دانش اندکم رو به نحوه درستی در اختیار شما دوستان قرار بدم.


نکته : کسی که برنامه نویسی تحت وب انجام میده باید زبان برنامه نویسی Html که پایه زبان برنامه نویسی تحت وب است رو بلد باشه.


Html چیست؟


HTML یک زبان نشانه گذاری برای توصیف اسناد وب (صفحات وب) است.

  • Html  مخفف  Hyper Text Markup Language.
  • زبان نشانه گذاری مجموعه ای از برچسب های نشانه گذاری است.
  • اسناد Html  شامل مجموعه ای از تگ ها هستند که به وسیله آنها خواص صفحه تعیین میشود.

یک مثال از Html


<!DOCTYPE html>
<html>
<body>

<h1>My First Heading</h1>

<p>My first paragraph.</p>

</body>

</html>

حال به توضیح این کد می پردازیم

DOCTYPE  مشخص میکنه که نوع سند از چه چیزی هستش

و محتویات سند های Html در بین تگ های <html>ر </html> قرا میگیرند

و متن ها و اسناد و تگ های هم بین تگ  <body> و </ body> قرار میگیره

و تگ  <h1>  </h1>  برای عنوان و تایتل صفحه به کار میرود

و تگ <p> و </p> هم برای ایجاد یک پاراگراف به کار می رود.

تگ های Html

تگ های Html  در بین دو براکت قرار میگیرند مثل مثال زیر

<نام تگ > محتویات <\نام تگ >

تگ های Html  معمولا به صورت جفت می آیند به طور مثال <p></p>

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

تگ پایانی شبیه تگ شروع است با این تفاوت که قبلش یه اسلش قرار می گیره

 نکته :تگ اولی رو معمولا بهش مگن تگ شروع کننده و تگ دومی رو هم بهش میگن تگ خاتمه تگی که میبنده کل تگ رو


مرور گر ها:



اهداف یک مرور گر (Chrome, IE, Firefox, Safari)  خواندن اسناد Html و نمایش آنهاست.

مرورگر ها تگ های Html  را نشان نمی دهند فقط با آستفاده از آن نحوه نمایش صفحه را مشخص میکنند.

ساختار صفحه Html

در زیر تصویر ساختار Html  را نشان میدهیم

 

<html>

 

 

<body>

 

<h1>Th is is a heading</h1>

 

 

<p>This is a paragraph.</p>

 

 

<p>This is another paragraph.</p>

 

 

</body>

 

</html>

 


نسخه های Html


از روزهای اولیه ای که دنیای وب به وجود آمد ،  نسخه های HTML بسیاری وجود داشته است:

 

نسخه

سال

HTML

1991

HTML+

1993

HTML 2.0

1995

HTML 3.2

1997

HTML 4.01

1999

XHTML

2000

HTML5

2012


تعریف  <!DOCTYPE


تعریف  <!DOCTYPE>  به یک مرورگر کمک میکنه تا صفحه را به درستی نمایش دهد.

اسناد مختلفی بر روی وب وجود دارند. و یک مررورگر تنها می تواند صفحات Html  را  که نوع و ورژن آن را می شناسد به درستی نمایش دهد.

اشکال مشترک تعریف <!DOCTYPE


در Html5  بصورت زیر است

<!DOCTYPE html>

در Html4  بصورت زیر است

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

و در Xhtml بصورت زیر است

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


تمامی آموزش ها و مثال ها این مجموعه  با استفاده از Html5 است.



درس بعدی