ڈوگ لایڈ: تو ہم خرچ about-- میری ریاضی درست ہے تو، اور مجھے لگتا ہے کہ back-- تلاش کر لگتا ہے ہم بات کے بارے میں 35 ویڈیوز خرچ شاید سی کے مختلف پہلوؤں کے بارے میں ایک چھوٹا سا زیادہ، شاید تھوڑا کم. اور ہم کا احاطہ نہیں کیا C میں سب کچھ، لیکن ہم کا ایک بڑا حصہ کا احاطہ کرتا ہے زبان، اس کی وسیع اکثریت، یقینی طور پر عام استعمال کے لئے. اب ہم بات کرنے کے لئے جا رہے ہیں کے بارے میں ایک زبان، ایچ ٹی ایم ایل. اور ہم کا احاطہ کرنے کے لئے جا رہے ہیں یہ صرف ایک ویڈیو میں. 

لیکن یہ ٹھیک ہونے جا رہا ہے. یہ اصل میں بننے جا رہی ہے آپ کو کچھ استعمال کرنے کے لئے جا رہے ہیں. اب آپ ہے کہ ایک زبان کے بنیادی اصولوں، یہ واقعی بہت آسان ہے دوسروں سیکھنا شروع کرنے. تو ہم شروع کرنے کے لئے جا رہے ہیں تھوڑا سا پیچھے ہٹ کرنے کے لئے اور بنیادی ٹیکہ ان زبانوں کے درمیان اختلافات اور اس طرح کی اس کے لئے آپ کو چھوڑ کر. واقعی عظیم کی ایک بہت نہیں ہے انٹرنیٹ، پر وسائل جس ہم آپ کو ہدایت شروع کرنے کے لئے جا رہے ہیں انٹرنیٹ کی وجہ سے کی سمت میں معلومات کا ایک وسیع ذخیرہ. اور اس طرح یہ کروں گا اگر آپ کو پسند نہیں ہے ضروری ہو باہر کھو معلومات نہ ہونے کی طرف سے ایک ویڈیو میں احاطہ کرتا ہے. اگر آپ اب بھی حاصل کرنے کے قابل ہو جائے گا سب کچھ آپ کی ضرورت ہے اور استعمال آپ نے پہلے ہی ہے علم سی کو سمجھنے کی طرف سے تعمیر ان کے لئے سیکھنے وکر بنانے کے لئے اصل میں دوسری زبانوں میں ایک بہت چاپلوسی. میں وعدہ کرتا ہوں. 

لیکن ایک زبان کے بارے میں بات کرتے ہیں کہ ہر ویب کے لئے بہت بنیادی ہے ایچ ٹی ایم ایل جس کے صفحے،. ایچ ٹی ایم ایل ہائپر ٹیکسٹ مارکاپ زبان ہے. ایچ ٹی ایم ایل ایک زبان ہے لیکن یہ ہے نہیں ایک پروگرامنگ زبان. 

ایچ ٹی ایم ایل متغیر نہیں ہے. یہ منطق نہیں ہے یا کام کرتا ہے یا اس طرح کچھ بھی. ہم کسی بھی نہیں کر سکتے ہیں ایچ ٹی ایم ایل میں SE فی پروگرامنگ. کبھی کبھی آپ کو سن لیں گے لوگ خود کی وضاحت ایچ ٹی ایم ایل پروگرامرز، جس مکمل طور پر درست نہیں ہے. ہم ایچ ٹی ایم ایل کے پروگرام نہیں لکھ سکتا. 

ایچ ٹی ایم ایل صرف متن کو نشان زد کرنے کے لئے استعمال کیا جاتا ہے. یہ ایک مارکاپ زبان کہا جاتا ہے. اور یہ اس markup-- does-- کیا ہم ایچ ٹی ایم ایل اور ان tags-- ٹیگز استعمال یہ semantically markup-- ایک ایسے صفحے کی ساخت کی وضاحت کرتا ہے اور سادہ متن کا سبب بنتا ہے ٹیگز تشریح کی جائے کے درمیان موجود مختلف طریقوں سے براؤزر کی طرف سے. اور شاید اس کی وضاحت کے لئے بہترین ہے ایک مثال کے اس کی طرف سے جس طرح. 

یہاں ایک بہت سادہ HTML پیج، نہیں ہے ایک HTML پروگرام، ایک بار پھر، ایک HTML صفحے. اور ہم نے اسے ایک پتہ ایچ ٹی ایم ایل پیجہم ہے کیونکہ HTML ٹیگ کے ساتھ ہر چیز سے جکڑے ہوئے. تو یہ ایک HTML ٹیگ کی طرح لگتا ہے. یہ زاویہ بریکٹ کے درمیان ہے. اور ہم نے سب سے اوپر محسوس ایچ ٹی ایم ایل اور بہت نچلے حصے میں، ہم کیا کیا ہے کے بعد بظاہر دوسرے ایچ ٹی ایم ایل کی ایک بہت، ہم زاویہ بریکٹ سلیش HTML ہے. تو اس طرح کی حد ہے ایچ ٹی ایم ایل ہے اور کیا نہیں ہے کے درمیان. اور ظاہر کی، روایتی، صرف آپ کو اپنے C پروگراموں کے تمام کے طور پر لکھا ڈاٹ سی ملانے کے ساتھ، اپنے HTML فائلوں کی تمام ڈاٹ ایچ ٹی ایم ایل ملانے کے ساتھ ختم ہو جائے گی. لیکن یہاں کیا چل رہا ہے. ہم صرف ان HTML ٹیگ نہیں ہے. ہم بظاہر یہ ہے چیز ایک سر ٹیگ بلایا. ویسے، ٹھیک ہے، وہ کیا ہے؟ 

ویسے شاید یہ سب سے بہتر ہے ایک جسم کی راہ کی طرف سے ممتاز، جسم ویب صفحہ کے مواد سے کیا جا رہا. تو شاید سر ٹیگ چیزیں وضاحت کہ، براؤزر ونڈو میں مناسب نہیں ہے لیکن کسی نہ کسی طرح اہم ہے ہماری ویب صفحہ درست طریقے سے مہیا کی جا رہی. مثال کے طور پر، اندر کی سر ٹیگ ہم عنوان ٹیگز ہے. 

تو عنوان ہیلو دنیا ہونے، کہ اصل میں کیا ہو رہا ہے کروم میں ٹیب میں ظاہر ہوتا ہے یا سفاری یا Firefox-- میں جو براؤزر آپ ہے prefer-- کیا عنوان میں ظاہر کرنے کے لئے جا رہا ہے. اور ٹیبز پہلے اسے ظاہر کرے گا اپنے پورے براؤزر ونڈو میں اور آپ کو صرف ایک صفحے ہو سکتا ہے ایک وقت میں ایک براؤزر ونڈو میں کھولیں. تو ہے کہ ہونے جا رہا ہے ٹیب میں اپنے صفحے کے عنوان یا براؤزر ونڈو بار، ہیلو دنیا. اور اس کے بعد مواد میرے ویب صفحہ ہیلو، دنیا ہو جائے گا. تو کیا کچھ پر ایک نظر ڈالیں اس طرح چیز کی طرح نظر ہو سکتا ہے. یہ ایک بہت سادہ HTML صفحہ ہے. تو میں نے اپنے CS50 IDE میں یہاں ہوں اور میں نے تھوڑا سا میں یکبر ہے. اور میں صرف کرنے جا رہا ہوں ہیلو ڈاٹ ایچ ٹی ایم ایل کو کھولنے اور یہ بہت زیادہ ہے کہ آپ کو دکھائے ہم نے پہلے دیکھا کہ صفحے کے مواد. میرا سادہ ایچ ٹی ایم ایل، سر ٹیگز، عنوان ٹیگز، اسی طرح جسم، اور. میں صاف ہو جائے کرنے پوٹ دار ہے. 

اور میں ایسا کر سکتے ہیں تو کیا میری IDE صرف صفحے جائزہ ہے. اور ہم وہاں جا. اپنے صفحے کے مواد، دنیا ہے ہیلو، اور میں کچھ بھی نہیں دیکھ رہا ہوں وہاں سر ٹیگز سے. یہ جسم کے صرف مواد ہے. دنیا، ہیلو. اور پھر جسم صرف کہا، دنیا، ہیلو. دیگر حصہ غائب ہے. 

تو ہے کہ واقعی یہ سب ہے. یہ ایک بہت سادہ بنیادی HTML صفحہ ہے. اب میں اپنے HTML پوٹ دار ہے ، بہت اچھا اور منظم کیا جائے لیکن میں واقعی کی ضرورت نہیں ہے. میں نے یہ بہت بدسورت نظر کر سکتے ہیں. اور یہ اب بھی کام کریں گے. یہ بالکل وہی ویب صفحے ہو جائے گا. میں صرف چھٹکارا ملتا ہے سفید جگہ کے تمام. 

یہ باہر کر دیتا ہے کے طور پر، سفید جگہ اعداد و شمار ہے. اور اس طرح ہم سے اعداد و شمار بھیج رہے ہیں جب بھیجنے والے سرور سے، رسیور کو کلائنٹ کو، ڈیٹا پیسہ خرچ. اور اس طرح سفید فاصلہ کے چھٹکارا حاصل اصل میں ایک اچھا خیال ہے آپ کوئی ہو تو جو کام کرتا ہے ویب کے مواد کی ایک بہت. تم تو یہ ایک برا خیال ہے یہ چیزیں سیکھنے ہے جو کوئی اور آپ کو حاصل کرنا چاہتے ہیں یہ اچھی طرح سے منظم. یہ اس سے تجزیہ کرنے کے لئے بہت آسان ہے. لیکن یہ فعل ایک جیسی ہے. 

اس طرح پوٹ کاری اور چیزیں اصل میں ایچ ٹی ایم ایل میں کوئی فرق نہیں پڑتا. فرق پڑتا ہے کہ تمام افتتاحی ٹیگ ہے صحیح ترتیب میں ٹیگ بند. اگرچہ، یہاں کیا ہوا نوٹس. مارکاپ ہمارے لئے ایک راستہ فراہم کرتا ہے اضافی معلومات بات چیت ہم نے لکھا ہے کے بارے میں. ہیلو، ورلڈ حصہ تھا عنوان کے طور پر تشریح. اور، ہیلو حصہ دنیا تھی مواد کے طور پر تشریح یا کیا ہونا چاہئے میری ویب صفحے پر دکھائی دے. 

ان مختلف کے 100 سے زیادہ ہیں ٹیگ اور عظیم وسائل کے بہت سے انہیں تلاش کرنے کے آن لائن. ہم نے ایک کے بارے میں بات کرنے کے لئے جا رہے ہیں اس ویڈیو میں ان میں سے چند، کچھ واقعی بنیادی چیزیں. لیکن ہم بات نہیں کر رہے ہیں اس کے بارے میں اس کی وجہ سے ایسا کرنے کے لئے جامع ہو جائے گا. 

آپ اگرچہ، کر سکتے ہیں ایک اور بات، ڈیولپر آلات کھول ہے. اور تم سے یاد تو HTTP پر ہمارے ویڈیو، میں کھولنے کے لئے کس طرح کی وضاحت ڈیولپر آلات. کروم میں یہ عام طور پر F12 چابی ہے ڈویلپر ٹول بار کو کھولنے کے لئے. تو بجائے نیٹ ورک کو منتخب کرنے کے ٹیب، آپ عناصر ٹیب منتخب کر سکتے ہیں. اور آپ کو ایک ویب لوڈ کرتے ہیں تو صفحے، آپ اصل میں کروں گا کہ ویب صفحے تخلیق کرتا ہے کہ ایچ ٹی ایم ایل دیکھیں. اور اس طرح آپ ایچ ٹی ایم ایل کے بارے میں ایک بہت کچھ سیکھ سکتے آپ کی پسندیدہ ویب سائٹ کو دیکھ کر اور وہ تعمیر کے لئے کس طرح دیکھ کر آپ کو پسند ہے کہ ان کے مختلف ٹکڑوں. تو شاید یہ ٹھنڈا ہے پیٹرن یا اس طرح کچھ. وہ کس طرح ایچ ٹی ایم ایل کے ساتھ اس بنا سکتے ہیں؟ ویسے آپ کو صرف آپ کی ڈیولپر کھول سکتے ہیں اس عنصر سے زیادہ آلات اور ہور اور HTML یہ بناتا ہے بالکل وہی جو دیکھنے. تو یہ ایک واقعی ہے ایچ ٹی ایم ایل میں جاننے کے لئے اچھا طریقہ، اور مجھے پختہ مشورہ ہے کہ آپ یہ دونوں سیکھنے کے لیے کیا ایچ ٹی ایم ایل اور یہ بھی ایک چھوٹا سا سیکھنے کے لئے اختیارات میں سے کچھ کے بارے میں تھوڑا سا میں آپ کے لئے دستیاب ڈویلپر کے اوزار، جس یقینی طور پر ہاتھ میں آئے گی آپ کو زیادہ تیز ویب کر شروع پروگرامنگ. 

تو ایک پر ایک نظر ڈالیں عام HTML ٹیگ کے جوڑے. اور ہم کود اور پر ایک نظر لے لیں گے ان ٹیگز بھی فراہم کرے گا کیا میرے IDE میں کچھ فائلوں میں دیکھ کر کے طور پر. تو یہاں کے لئے تین بنیادی ٹیگز ہیں متن کی بصری ظہور tweaking کی. بی ٹیگ، میں ٹیگ، اور یو ٹیگ نہیں ہے. اور بالترتیب وہ کیا کرتے ہیں جلی حروف میں ان کے درمیان متن رینڈر، ترچھے حروف، اور ذکر. تو ہے کہ نظر آئے گا دیکھتے ہیں کیا میرے IDE میں اصل ویب صفحے پر کی طرح. 

تو یہاں اپنی IDE میں ہے BIU ڈاٹ ایچ ٹی ایم ایل فائل کہا جاتا. BIU ڈاٹ ایچ ٹی ایم ایل صرف کیا جا رہا ہے جرات مندانہ، ترچھے حروف، ذکر. میں نے اس کو کھولنے گے. 

اور ہم نے یہاں دیکھ کر کہ یہ متن ہے بی ٹیگ جرات مندانہ ہے. یہ متن میں ٹیگ ترچھا ہے. اور اس متن یو ٹیگ زور دیا ہے. کیا اس طرح نظر آئے جا رہا ہے؟ ویسے ایک بار پھر، سب میں ہے یہاں جانا ہے کرنا اپنے براؤزر میں، میری فائل براؤزر، کلک کا مشاہدہ کریں، اور اس کو آتا ہے. 

بی کے درمیان میں متن ٹیگز یقینا اب جرات مندانہ ہے. میں درمیان میں متن ٹیگز یقینا اب ترچھا ہے. اور یو کے درمیان میں متن ٹیگز یقینا اب زور دیا ہے. تاکہ بہت اچھا ہے. اب ہم متن بنانے کے کس طرح جانتے ہیں ایک چھوٹا سا زیادہ پسند نظر یا بعض چیزوں پر زور دیا اپنی طرف متوجہ. یہاں عام کرنے کے ایک جوڑے کی ہیں پیراگراف ٹیگ، P، اور ہیڈر ٹیگ، جس میں HX کے طور پر یہاں پیش کی گئی ہے. 

یہ P ٹیگ، ان پیراگراف ٹیگ، پیراگراف میں اپنے متن کو توڑنے. یہ صرف کرنے کے لئے کافی نہیں ہے درج اور خالی جگہوں کو چھوڑ کر مارا، صرف ایک کمپیوٹر جا رہی ہے کیونکہ تمہیں صرف اتنا کرنا یہ بتانے کے کیا کرنا ہے اور یہ سفید نظر انداز سب سے زیادہ حصہ کے لئے جگہ. تو ہم صرف درج کریں مارا نہیں کر سکتے ہیں اور ہمارے کمپیوٹر کی توقع ہم چاہتے ہیں کہ تشریح کرنے ایک نئے پیراگراف شروع کرنے کے لئے. ہم بہت واضح طور پر اس کا کہنا ہے کہ اس paragraph-- ایک another-- ہے P ٹیگز کا ایک سیٹ میں ایک احاطہ کی طرف سے. 

اور ہم بھی یہ اختیارات ہیں H ٹیگز، ان ہیڈر ٹیگ کے لئے. ہم چھ مختلف سطحوں ہے ہیڈر کے، ایک، دو، تین، ہیں جس میں چار، پانچ، چھ، آہستہ آہستہ بڑے اور بڑے ہیڈر. اور وہ چھوٹا ہو جاؤ اور چھوٹے اور چھوٹے اور چھوٹے. تو ہم ایک دوسرے ایک سب سے اوپر کی سطح کو منتخب ہیڈر ہے سطح ہیڈر، اور اسی طرح، اور اسی طرح کی. 

شاید کچھ پر ایک نظر ڈالیں P ٹیگ اور کچھ ہیڈر ٹیگ ایک ویب کے صفحے پر کارروائی میں. تو یہاں اپنی IDE میں نامی ایک فائل ہے پییچ ڈاٹ ایچ ٹی ایم ایل، پییچ ہونے پیرا اور ہیڈر ٹیگ. کہ کھولو. ایک بہت کچھ یہاں ہو رہا ہے میں کچھ Lorem ڈال دیا ہے کیونکہ مارکیٹنگ، یہاں میں کچھ صرف بے ترتیب متن. تو میں تھوڑا سا باہر زوم کریں گے کیونکہ وہاں اتنا پر جا. لیکن میں بہت میں ہے کہ محسوس کریں ، میں ایک H1، ایک سطح سے ایک ہے یہاں سب سے اوپر ہیڈر ٹیگ. پھر میں نے صرف ہے جس میں ایک پیراگراف، ہے بے ترتیب text-- فخر کا ایک گروپ ipsum-- صرف متن میں معیاری بھرنے فطری. تو میں نے اس کے اندر دو پیرا ہے سطح ایک ہیڈر اور پھر نیچے ذیل میں لائن 24 پر ایک سطح دو ہیڈر ہے، ایک دوسری سطح ہیڈر، اور ایک اور دو پیرا. ویسے اس طرح کیا لگتی ہے میں نے اپنے پیش نظارہ میں دیکھ تو کیا ہوگا؟ دیکھتے ہیں. 

تو ہے کہ محسوس کریں یہاں سب سے پہلے کی سطح کو منتخب ہیڈر اصل میں بہت تھوڑا سا بڑا ہے دوسری سطح ہیڈر مقابلے میں. تو ہم H1 ٹیگز استعمال. اور P ٹیگ ہمیں اجازت دیتے ہیں کہ محسوس پیراگراف میں چیزوں کو باہر کو توڑنے کے لئے. ہم ان P ٹیگز چھٹکارا ہو گیا تھا تو اور اصل میں صرف ڈال داخل یا واپسی ہم امید کے درمیان میں کریں گے مختلف پیرا ہو، وہ سب صرف ایک دوسرے کے ساتھ زور گے اور یہ اچھا پیراگراف نہیں پڑے گا اوپر اور نیچے کی جگہ کے ساتھ علیحدگی. اور تو ہے کہ کیا پیراگراف ہے ٹیگ اور ہیڈر ٹیگ عام طور پر اپنی طرف متوجہ کرنے کے لئے کیا استعمال کیا جاتا ہے ہماری ویب کے صفحے کے حصے پر توجہ اس طرح میں. 

اگلا، دوسرا اپ ہم استعمال کرتے ہیں کہ کچھ ٹیگز ہیں ہماری ویب کے صفحے کی فہرست پر تعمیر کرنے کے لئے. تو ہم بے ترتیب ہے فہرستوں ULs-- جس میں صرف ہیں حکم دیا شق فہرستوں، numbered-- ہیں جس کی فہرست OLs-- اور کے اندر یا تو ان میں سے ایک ہم نے حاصل کرنے کی ضرورت ، لائٹ انفینٹری کی فہرست میں اشیاء کی نشاندہی کرنے کے لئے کس طرح کے سیٹ. اور اس طرح ہم کھلی الحق ٹیگ اور ہم اس کے اندر اشیاء ڈال دیا. اور پھر ہم کے ساتھ کیا کر رہے ہیں جب کہ، ہم الحق ٹیگ کو بند کر سکتے ہیں. 

اور اسی طرح ہم کر سکتے ہیں ایک حکم دیا یا نمبر والی فہرست اور اس کے اندر کی فہرست میں اشیاء ڈال دیا. تو ایک نظر ڈالیں فہرستوں کی ایک جوڑے پر اور جو کچھ وہ کریں گے CS50 IDE پر رینڈر. تو میں نے اپنے IDE ایک میں یہاں ہے فائل کہا جاتا فہرستوں ایچ ٹی ایم ایل ڈاٹ. چلو ایک نظر ڈالیں. 

اور یہاں نوٹس میں ایک بے ترتیب ہے اس میں پانچ چیزوں سے فہرست. اور پھر میں نے ایک حکم دیا کی فہرست ہے، اور میں ٹیگ تھوڑا سا تبدیل کر دیا ہے، ٹھیک ہے؟ میں شروع چھ برابر کہا ہے. یہ ایک حکم دیا کی فہرست میں اس کے ساتھ باہر کر دیتا ہے نقطہ اغاز جہاں مقرر کر سکتے ہیں میں نے اس one-- ہو جائے گا ڈیفالٹ کی طرف سے want-- کی طرف سے صرف اس نام نہاد وصف انہوں نے مزید کہا میرے دفتری ٹیگ. اور اس طرح یہ فہرست گا چھ بجے گنتی شروع. کہ نمبر والی فہرست کے اس کے عناصر ہونا چاہئے چھ، سات، آٹھ، نو، دس، پانچ عناصر موجود ہیں کیونکہ فہرست میں، ایک کی مخالفت، دو، تین، چار، پانچ، جس میں دفتری کہا تھا تو ایسی صورت ہو گی شروع وصف کی وضاحت کے بغیر. 

آپ کر سکتے ہیں تاکہ ہم اس کا جائزہ لیں گے یہاں کیا ہو رہا ہے کے لئے ایک احساس حاصل. اور ہم وہاں جا. میری فہرست ہے. پہلے پانچ عناصر ہیں بے ترتیب یا شق فہرستوں. اور اگلے پانچ عناصر ایک علیحدہ حکم دیا کی فہرست ہے چھ سے شروع ہونے والے. تو ہے کہ ہم کس طرح کر سکتے ہیں ایچ ٹی ایم ایل کا استعمال کرتے ہوئے فہرست بنانے کے. ایک اور چیز آپ شاید HTML کے ساتھ کیا کرنا چاہتے ہیں کی ایک میز تعمیر کیا جاتا ہے قطار اور کالم کے بارے میں معلومات ایک کے بارے میں معلومات پیش کرنے کے لئے خاص طور پر جس طرح سے منظم. ہم کر سکتے ہیں ایچ ٹی ایم ایل کے ساتھ ایسا کرنے کے لئے اوپن بریکٹ شروع میز تعریف ٹیبل. اور پھر اس کے ٹیبل کے اندر ہم قطار، TR ٹیگ کی ایک سیٹ ہو سکتا ہے ہر صف اس بات کی نشاندہی کرنے کے لئے. اور پھر ٹیڈی ٹیگ TR ٹیگ کے اندر جانا ایک صف کے اندر اندر ایک کالم کی وضاحت کرنے. 

یہ کیوں ٹیڈی بلایا اور ترکان نہیں کر رہا؟ ویسے، ٹیڈی میز کے اعداد و شمار کے لئے کھڑا ہے. عام طور پر آپ ڈال رہے ہیں وہاں آپ کی معلومات. اس ٹیڈی اور ترکان ہے یہی وجہ ہے کہ. یہ تھوڑا سا مبہم ہے. 

تو آپ کو میز ٹیگ ہے اور آپ کی میز ٹیگ کے اندر آپ کو قطار، TRS کی ایک بڑی تعداد ہے. اور ہر صف کے اندر آپ کو کرنا پڑے کالموں کی تعداد کے لئے ٹیڈیایس آپ کرنا چاہتے ہیں کہ کہ خاص طور پر قطار میں. ایک بہت پر ایک نظر ڈالیں CS50 IDE میں ختم سادہ ٹیبل. 

تو میں یہاں ایک فائل ہے ٹیبل ڈاٹ ایچ ٹی ایم ایل بلایا. کی پر ایک نظر کرتے ہیں کیا اس کی طرح لگتا ہے. ایک بہت کچھ یہاں پر جا رہا ہے لیکن اگر آپ کو نوٹس میں ایک میز کھلی ہے. میں میز کے ساتھ تعریف شروع کر رہا ہوں. اور پھر میری پہلی صف میں بظاہر چار کالم، ایک، دو، تین، چار. اور پھر میں اس صف کے ساتھ کیا کر رہا ہوں. 

پھر میں نے ایک اور صف شروع اور دو، چار، چھ، آٹھ کرتے. اس صف ختم. ایک صف، تین، چھ، نو، 12 ہے. اور پھر ایک آخری صف، چار، آٹھ، 12، اور یہ ہے، اگرچہ ایک چھوٹا سا، 16 یہاں کاٹ. 

میں اس صف ختم. میں نے میز ختم. اور پھر میں نے اپنے HTML کے ساتھ کیا کر رہا ہوں. کیا اس طرح لگتی ہے؟ ٹھیک ہے، یہ دیکھنے کے لئے واقعی زیادہ نہیں ہے. میں واضح طور پر میری معلومات کا اعلان کیا ہے ایک کسی حد تک زیادہ منظم انداز میں. لیکن یہ یہاں سپر خوبصورت نہیں ہے. اور ہم ساتھ نمٹنے کے لئے جا رہے ہیں ہم سی ایس ایس کے بارے میں بات ہے کہ جب. ہم اس خیال نظرثانی کریں گے ہم ایک table-- بنانے کے لئے کیا کرتے ہیں شاید تھوڑا سا بہتر یہ فارمیٹ؟ لیکن میں اب بھی چار قطاروں ہے، جن میں سے ہر چار کالم ہے، ایک ہے اور واقعی میں اس کے مترادف ہے بہت آسان چار ضرب کی طرف سے ٹیبل. 

ہم کے بارے میں بات کریں گے صرف چند ٹیگ. کے بارے میں بات کرتے ہیں ایک HTML فارم کے تصور. تو تم میں اس کو دیکھا ہے ہو سکتا ہے ایک ویب کے صفحے میں لاگ ان کے سیاق و سباق. عام طور پر آپ کے صارف کے نام میں ٹائپ کریں. آپ اپنے پاس ورڈ میں ٹائپ کریں اور آپ کو جانے کے لئے اچھے ہیں. کہ ایک فارم کا آغاز ہو جائے گا. 

ختم اچٹیں ایک دوسرے div میں. ہم نے بھی آدانوں ہے جس قسم کے فارم کے اندر فٹ. ان عناصر ہیں کہ آپ اصل میں، میں ٹائپ کر رہے ہیں یا ریڈیو بٹن تم ٹک ٹک، یا چیک آپ کو ٹک ٹک کر رہے ہیں کہ خانوں. تو ان فارم کے اندر جانے. اور وہ بنیادی طور پر مشتمل ہے فارم سے ہر ایک صف آپ کے فارم اچھی طرح سے فارمیٹ ہے. اس کے بعد یہ تصور موجود ہے واقعی نہیں کرتا ہے جس میں ایک div، کسی خاص زمرے میں فٹ میں نے والوں کی طرح کرنے کے لئے پہلے کر دیا گیا. یہ صرف کی طرح demarcates کچھ صوابدیدی division-- کا آغاز صفحے کے div--. کوئی بصری وقفے ہے. کوئی لائن نہیں ہے. یہ ایک کے طور پر مقرر نہیں ہے خود کار طریقے سے علیحدہ حصہ. آپ اس سٹائل کے لئے پڑے گا اس طرح ایسا کرنے کے لئے. 

یہ صرف کی طرح میں نے ایک چاہتے ہیں کا کہنا ہے کہ میری ویب کے صفحے پر جگہ کا ٹکڑا، اور میں صرف فون کرنے جا رہا ہوں یہ اپنے صفحے کے اس تقسیم. ہم اندر چیزیں ڈال کر سکتے ہیں divs کے کی، اور حقیقت میں، ہم اوپر سے سر جب ایک سیکنڈ میں IDE، ہم کریں گے میں ڈال رہا ہوں کہ دیکھیں میرا ایک div کے اندر تشکیل. 

تو میں نے اپنے IDE ایک میں یہاں ہے div کی شکل ڈاٹ ایچ ٹی ایم ایل فائل کہا جاتا. چلو اس کا کھول دو. جیسے میں نے کہا کہ نوٹس، div کی صوابدیدی کی طرح ہے. ٹھیک ہے؟ یہ واقعی کوئی مطلب نہیں ہے. تو میں نے ایک صوابدیدی ہے اپنے صفحے کے پہلے ڈویژن. اور پھر بجائے دوسرے DIV بعد میں، لائن آٹھ پر شروع، میں نے اس فارم ہے. اور فارم کے اندر میں ہے آدانوں کی تعداد، فارم کے شعبوں. لہذا میں نے جس کا نام ہے ایک فیلڈ ہے A-- واقعی کوئی مطلب نہیں ہے جس حق now-- کہ بظاہر متن، ایک لیتا ہے ایک ریڈیو ہے کہ ایک پاس ورڈ، ایک لیتا ہے بٹن، ایک چیک باکس ہے کہ ایک، اور ہے کہ ایک جمع کرائیں بٹن. ویسے، یہ کیا ہوتا ہے تمام اصل کی طرح نظر آتے ہیں؟ ٹھیک ہے، ایک نظر ڈالیں. ہمارے پیش نظارہ ونڈو میں اسے کھولو گے. اس صوابدیدی کہ نوٹس سب سے پہلے وہاں ہے division-- یہاں کوئی بصری علیحدگی. یہ واقعی حق، کچھ نہیں کیا؟ 

اور پھر میں نے اپنے فارم ہے. اور مجھے کوئی خاص فارمیٹنگ نہیں کیا. تو فارم میں سے ایک ہے معلومات کے بڑے صف. میں مختلف طریقے سے اپنے فارم فارمیٹ تھا تو، میں نے اس لائن کی طرف سے لائن کی طرف سے لائن ہو سکتا ہے. لیکن میں کسی بھی اسٹائل نہیں کیا. ایک بار پھر، ہم یہاں سی ایس ایس کے بارے میں بات نہیں کر رہے ہیں. ہم صرف HTML کے بارے میں بات کر رہے ہیں. 

ویسے میری متن فارم میں ٹائپ کر سکتے ہیں یاد رکھیں کہ متن کے فارم تو میرے نام کے ڈال کر سکتے ہیں. اور میرے پاس ورڈ میں اپنا پاس ورڈ ٹائپ کر سکتے ہیں. اور اس کھیت کیونکہ ، قسم پاس ورڈ کی طرف سے ہے آپ میرا پاسورڈ ہے کیا نہیں جانتے. یہ تمام نقطوں ہے. 

میں نے بھی ایک درج کرنا منتخب کر سکتے ہیں ریڈیو بٹن یا ایک چیک باکس سے نشان لگائیں. یا میں اپنے فارم جمع کر سکتے ہیں. اور میں کچھ نہیں کیا، تو میں نے اپنے فارم جمع کرتے وقت، صفحے کو صرف تازہ کرتا. لیکن میں شاید تشکیل کر سکتے ہیں میرے کچھ اور کرنا بٹن جمع کرائیں. اور ہم کے ساتھ کیا کر سکتے ہیں دیکھ لیں گے پی ایچ پی پر ایک مستقبل ویڈیو میں. لیکن یہ ایک بہت بناتا ہے سادہ سا فارم پر ہے کہ ہم صارفین کو بات چیت کرنے کے لئے استعمال کر سکتے ہیں اور ہماری ویب سائٹ پر معلومات جمع. 

ایک آخری تبصرہ ہم پہلے کسی دوسرے ٹیگ پر منتقل اس پر ایک نظر لینے کے لئے ہیں ان پٹ ٹیگ ایک بار. میں پر روشنی ڈالی ہے کہ نوٹس سرخ رنگ میں ٹیگ کی انتہا. ہم نے اب تک دیکھا ہے ہر دوسرے ٹیگ ہے ایک شروع اور ختم، ایک افتتاحی تھا ٹیگ اور ایک اختتامی ٹیگ. 

لیکن ایک ان پٹ ٹیگ نہیں ہے. جاتا ہے کہ کوئی متن موجود نہیں ہے ان پٹ کے ٹیگز کے درمیان میں. معلومات کے تمام ہم تبلیغ کرنے کے لئے ارادہ کر رہے ہیں کا حصہ کے طور پر پابند ہے اس کی ان پٹ کی صفات. ہم ان پٹ کا نام X برابر ہے نوٹس. قسم Y برابر. یہ واقعی تمام معلومات کی ہمیں ضرورت ہے. 

یہ ایک خود اختتامی ٹیگ کہا جاتا ہے. یہ ایک کھولنے اور ایک کی ضرورت نہیں ہے بند کی تمام معلومات کی وجہ سے اندر موجود ہے ٹیگ اور اس کی صفات. تو کبھی کبھی تم بھی، یہ دیکھ لیں گے. آپ کو ایک ہے تو تاکہ صرف آگاہ ہونا مکمل طور پر خود موجود ہے کہ ٹیگ، یہ کھولتا ہے اور کے ساتھ خود کو بند کر دیتا ہے بائیں پر کھلے زاویہ بریکٹ اور سلیش زاویہ دائیں بریکٹ. ہم نے ان میں سے ایک کو دیکھ لیں گے اب تصویر کے ٹیگز کے ساتھ کے طور پر اچھی طرح سے. 

ہم تصاویر کے بارے میں بات کرنے سے پہلے، ہم بالا روابط کے بارے میں بات کرنے کی ضرورت ہے. ہم چاہتے ہیں تو ہماری ویب صفحے کے لئے انٹرایکٹو اور ہمارے ارد گرد منتقل، اس کے قابل ہو جائے اچھا ہو گا ان میں سے ایک پر کلک کریں کیا عام طور پر ایک نیلے لنک دیا گیا ہے. یہ ہم تعمیر کس طرح اصل میں ہے ہماری ویب کے صفحے میں ایک بالا ربط. اور دلچسپ بات یہ کافی دوسرے HTML ٹیگ نہیں ہے ایک بالا ربط نہیں ہے، لنک بلایا. یہاں لنگر کے لئے کھڑا ہے، اور کہ ہم ایک بالا ربط کی طرف اشارہ ہے کہ کس طرح ہے. 

ایک href ایکس کا مطلب پر جائیں برابر ویب کے صفحے ایکس اور سب کچھ ایک ٹیگ کھولنے کے درمیان اور قریبی ایک ٹیگ کیا ہونے جا رہا ہے کر رہا ہے کہ پر زور دیا ایک لنک کی طرح لگ رہا ہے کہ نیلے متن ہم سے واقف ہیں. اس کے نیچے ہم ایک تصویر ٹیگ، ہے جس ایک خود کی نمائش کے لئے ٹیگ بند ہو رہا ہے ایکس میں واقع ایک تصویر اور آپ کو تبدیل کرنے کے قابل ہو سکتا ہے وضاحت کی طرف سے اس تصویر چوڑائی اور اونچائی اور دیگر صفات میں کہ ڈاٹ ڈاٹ ڈاٹ وہاں. 

یہاں بہت نچلے حصے میں ہم نے ایک بہت دلچسپ ہے ٹیگ تلاش کہ نہیں ایک اختتامی ٹیگ. یہ فجائیہ نقطہ DOCTYPE HTML ہے. تو HTML سے مروج ہے ویب صفحات کی تعمیر کے لئے ابتدائی 1990s، اور اسے جھیلا چلا گیا ہے اس کے بعد سے کئی کیلیے. سب سے زیادہ حال ہی میں 2014 میں یہ ایک نظر ثانی ہوا اب موجودہ ہے جس HTML5 بلایا وستت HTML معیار کی طرح. 

ظاہر ہوتا ہے کہ ہماری ویب صفحات، HTML5 استعمال لکھا جاتا ہے ہم نے شروع کس طرح یہ ہے. یہ لپ کیا جا سکتا ہے لیکن کیا ہے کہ بنیادی طور پر ذرائع آپ کو ٹیگ کے کسی بھی استعمال نہیں کر سکتے ہیں HTML5 ٹیگ، ان نئے ٹیگز ہیں کہ. تو ہم نے ہمیشہ سے شروع ہم HTML5 استعمال کر رہے ہیں. اور تمام ٹیگ کے بارے میں ہم بات کی ہے پہلے HTML5 ٹیگ نہیں ہیں. لیکن یہ ہے کہ اس بات کی نشاندہی کرے گا HTML5 ٹیگ موجود ہوں گے. اور اس طرح ہم فجائیہ ہے DOCTYPE HTML، جس کے آغاز میں ہے ہمارے HTML فائل، اور پھر اس کے بعد اس نقطہ ہم اصل میں ہمارے HTML کھلی ہے ٹیگ اور وہاں سے آگے بڑھنے. 

گزشتہ ایک، ایک تبصرہ ٹیگ ہے جس میں بہت تھوڑا سا مختلف لگ رہا ہے. یہ زاویہ کے ساتھ شروع ہوتا ہے بریکٹ فجائیہ ڈیش ڈیش لیکن کوئی اختتامی بریکٹ. وہاں ان دونوں عناصر کے درمیان میں آپ اپنے تبصرے لکھیں کہاں ہے. اور کی تصاویر پر ایک نظر ڈالیں اور تبصرے اور CS50 IDE میں روابط. 

تو میں نے ایک فائل کہا جاتا تصویر کے لنک یہاں ہے میں کھولنے کے لئے جا رہا ہوں جس ڈاٹ ایچ ٹی ایم ایل. اور میں نے ایک جوڑے کے مل گیا ہے نوٹس اپنے HTML تبصرے میں یہاں تبصرہ. تو صرف سی اور دیگر کی طرح پروگرامنگ زبانوں، صرف ایک مارکاپ زبان ہونے کی وجہ سے ایچ ٹی ایم ایل تبصرے حاصل کرنے کی صلاحیت ہے. اور اس میں بظاہر جا رہا ہوں Rick Astley کی کی ایک تصویر کی جگہ کہیں اس div کے درمیان ٹیگ، اس صوابدیدی ڈویژن. بظاہر اس فائل ہے رک ڈاٹ JPEG، میں واقع ہے جس ہم سے زیادہ واپس سر تو ایک سیکنڈ کے لئے میری فائل درخت، میں موجود ہے کہ ایک فائل ہے موجودہ ڈائریکٹری. تو یہ ٹھیک ہے. میں نے اس کے حوالہ کر سکتے ہیں. 

پھر میں اندرونی لنکس ہو سکتا ہے. تو یہاں 11 لائن پر نوٹس میرے href کی ہیلو ڈاٹ ایچ ٹی ایم ایل. تو یہ صرف ایچ ٹی ایم ایل ڈاٹ ہیلو سے مراد جس میں موجودہ ڈائریکٹری میں موجود. اور میں بھی بیرونی کر سکتے ہیں HTTPS صرف وضاحت کی طرف لنکس میں بات نہیں کر رہا ہوں اس بات کی نشاندہی کرنے کے لئے اپنے موجودہ ڈائریکٹری میں ایک فائل کے بارے میں. میں موجود ہے کہ ایک فائل کے بارے میں بات کر رہا ہوں کہیں میں ہے جو انٹرنیٹ، پر HTTP پروٹوکول کا استعمال کرتے ہوئے درخواست کرنے کے لئے. 

تو میں ایک نظر ڈالیں جو اس صفحے کی طرح نظر ہو سکتا ہے اور رک کی ایک تصویر کے لئے تیار ہو جاؤ Astley میں آپ کی سکرین پر ظاہر کرنے کے لئے. تو میں نے اس کا جائزہ لیں گے. Rick Astley کی میں نہیں ہے اس صوابدیدی میں سب سے اوپر ڈویژن میں سب سے اوپر پر ڈال دیا. اور پھر نیچے ذیل میں میرے روابط ہیں، ٹھیک ہے؟ 

میں نے ہیلو ڈاٹ ایچ ٹی ایم ایل کے لئے ایک لنک ہے. اور میں اس پر کلک کریں تو، میں حاصل اس صفحے پر منتقل کر دیا ہم سے کے ساتھ بہت واقف ہیں ہمارے پروگرام کے آغاز. میں ایک بار پھر کھلے اس صفحے پاپ تو میں تو پاپ تصویر کے لنک، ایک بار کھولنے میں بھی بیرونی جا سکتے ہیں CS50 کی ویب سائٹ پر. اور وہاں ہم میں کروں گا دیکھتے تھوڑا سا باہر زوم یہاں ہم CS50 کی ویب سائٹ طرح دیکھ لیں گے ہمارے صفحے کے وسط میں سرایت. تو میں نے ایک اندرونی بنانے کے لئے کے قابل تھا ایک بیرونی لنک کے طور پر اچھی طرح سے منسلک. 

ایچ ٹی ایم ایل کے ساتھ گزشتہ قاعدہ ہے کہ ہم یہاں کے بارے میں بات کرنے کے لئے جا رہے ہیں اپنے HTML اچھی طرح سے قائم کیا جانا چاہئے ہے. C میں ہم نے کے بارے میں ایک بہت بات کی چیزوں میں مختلف نحو. HTML میں نحو واقعی ٹیگ کے گرد گھومتا ہے. آپ کو کھولنے ہر ٹیگ بند کر دیا جائے کرنے کی ضرورت ہے. اور حقیقت میں، ہر ٹیگ آپ کو کھولنے معکوس ترتیب میں بند کر دیا جائے چاہئے. 

تو آپ کو ایک جرات مندانہ ٹیگ کھولنے، ایک ترچھا ٹیگ، اور پھر ایک خط کشیدہ ٹیگ ایک تینوں کرنا متن کی مخصوص سیٹ، آپ معکوس ترتیب میں انہیں بند ہونا چاہئے. آپ کو جرات مندانہ کھولی تو، ترچھے، آپ، کو اجاگر جرات مندانہ، خط کشیدہ، ترچھا بند کرنا چاہتے ہیں. encapsulation کے اس طرح کیا ہے ایچ ٹی ایم ایل اچھا اور منظم رکھتا ہے. 

سی کے برعکس، اگرچہ، نحو کی غلطیوں کے نہیں اصل میں ممکنہ طور پر آپ ایچ ٹی ایم ایل پنگ. اپنے HTML ٹھیک نہیں ہو سکتا قائم لیکن اب بھی کام کریں گے. اور اس طرح یہ غلطیاں کی طرف سے سلائڈ کی ترتیب کر سکتے ہیں. یہ واقعی میں چوکس رہنے کی آپ پر منحصر ہے. کبھی کبھی وہ ناکام ہو جائے گی لیکن کبھی کبھی آپ کو اس کے ساتھ دور حاصل کر سکتے ہیں. 

یہ ایک بہت ہو سکتا ہے مشکل کام ہے، اگرچہ، آپ کھولی جب ٹریک رکھنے کے لئے ایک ٹیگ، آپ اسے بند کر دیا جب، خاص طور پر آپ کے طور پر ایچ ٹی ایم ایل فائلوں بڑا اور بڑا ہو. آپ کی کچھ مدد چاہتے ہیں کریں گے. اور آن لائن ہیں جوازدہندہ اوزار کہ آپ آپ کی ویب پر ایک نظر ہے کرنے کے لئے استعمال کر سکتے ہیں صفحہ اور یہ اچھی طرح سے قائم ایچ ٹی ایم ایل ہے تو دیکھنے کے. اور آپ کو یقینی چاہئے ان پر ایک نظر ڈالیں اور آپ کے طور پر ان کا استعمال کرنے کے لئے شروع HTML کے ساتھ کچھ کام کر شروع، آپ کو ملتا ہے تو، ایچ ٹی ایم ایل لکھنا منظم کے بارے میں کچھ اچھی آدتےن ایک اچھا طریقہ میں آپ کی ایچ ٹی ایم ایل اور اچھے انداز اور بات کو یقینی بنانے آپ کو کچھ بھی نہیں کر رہے ہیں کہ ایک نحوی خامی پیدا کر سکتا ہے کہ آپ کا تھوڑا سا وجہ سے کرے گا سڑک کے نیچے ایک مسئلہ. 

میں ڈوگ لایڈ ہوں. یہ CS50 ہے.