ডগ লয়েড: সুতরাং আমরা কাটিয়েছি about-- আমার গণিত সঠিক হলে, এবং আমি মনে করি ফিরে যান খুঁজছেন মনে আমরা কথা প্রায় 35 ভিডিও অতিবাহিত হয়তো সি বিভিন্ন দিক সম্পর্কে একটু বেশি, হয়তো একটু কম. আর আমরা আবরণ করা হয়নি সি সবকিছু, কিন্তু আমরা একটি বড় খণ্ড আচ্ছাদিত ভাষা, এটা গরিষ্ঠাংশ, অবশ্যই সাধারণ ব্যবহারের জন্য. এখন আমরা কথা বলতে যাচ্ছেন সম্পর্কে অন্য ভাষায়, এইচটিএমএল. আর আমরা আবরণ চলুন এটা শুধু একটা ভিডিওতে. 

কিন্তু এটা ঠিক হতে যাচ্ছে. এটা আসলে হয়ে যাচ্ছে কিছু আপনি ব্যবহার করতে যাচ্ছেন. এখন আপনি যে এক ভাষা মৌলিক, এটা আসলে বেশ সহজ অন্যদের শেখার শুরু. তাই আমরা শুরু করতে যাচ্ছেন ফিরে একটু পইঠা এবং মৌলিক টীকাটিপ্পনী এই ভাষাগুলির মধ্যে পার্থক্য এবং সাজানোর এটা করা ছেড়ে. সত্যিই মহান অনেক আছে ইন্টারনেট, সম্পদ যা আমরা আপনাকে বিধায়ক শুরু করতে যাচ্ছেন ইন্টারনেট, কারণ প্রতি তথ্য সুবিশাল সংগ্রহস্থলের. আর তাই এটি হবে আপনার মত না অগত্যা হতে আউট হারানো তথ্য হচ্ছে না একটি ভিডিও আচ্ছাদিত. আপনি এখনও পেতে সক্ষম হবেন সবকিছু আপনি প্রয়োজন এবং ব্যবহারের আপনি ইতিমধ্যে করেছি জ্ঞান সি বুঝতে দ্বারা নির্মিত আপ এই জন্য লার্নিং কার্ভ করতে আসলে অন্য ভাষায় অনেক জপান. আমি প্রতিজ্ঞা করছি. 

কিন্তু এর এক ভাষা সম্পর্কে কথা বলুন যে ভাষার ওয়েব জন্য সত্যিই মৌলিক এর এইচটিএমএল পাতা, যা. এইচটিএমএল হাইপারটেক্সট মার্কআপ ল্যাঙ্গুয়েজ. এইচটিএমএল একটি ভাষা কিন্তু এটা একটি প্রোগ্রামিং ভাষা. 

এইচটিএমএল ভেরিয়েবল নেই. এটা যুক্তি নেই বা ফাংশন বা ওই জাতীয় কিছু. আমরা কোনো কাজ করতে পারে না HTML এ কোনটাই প্রোগ্রামিং. কখনও কখনও আপনি শুনতে পাবেন মানুষ নিজেদের এইচটিএমএল প্রোগ্রামার, হিসাবে যা সম্পূর্ণভাবে সঠিক নয়. আমরা এইচটিএমএল প্রোগ্রাম লিখতে পারবেন না. 

এইচটিএমএল ঠিক লেখা পর্যন্ত চিহ্নিত করতে ব্যবহার করা হয়. এটি একটি মার্কআপ ভাষা বলা হচ্ছে. আর এই এই markup-- does-- কি আমরা HTML এবং এই tags-- ট্যাগ ব্যবহার এই অর্থগত markup-- একটি পৃষ্ঠার কাঠামো নির্ধারণ এবং প্লেইন টেক্সট উৎপন্নকারী ট্যাগ ব্যাখ্যা করা মধ্যে বিদ্যমান বিভিন্ন উপায়ে ব্রাউজার দ্বারা. এবং সম্ভবত এটি ব্যাখ্যা সেরা একটি দৃষ্টান্তের এই পথ. 

এখানে একটি খুব সহজ এইচটিএমএল পাতা, না একটি HTML প্রোগ্রাম, আবার একটি HTML পৃষ্ঠা. আর আমরা এটা একটি জানি এইচটিএমএল পাতা আমরা করেছি কারণ এইচটিএমএল ট্যাগ দিয়ে সবকিছু বেষ্টিত. সুতরাং এই একটি HTML ট্যাগ দেখে মনে হচ্ছে কি. এটি কোণ বন্ধনী মধ্যে মাত্র. আমরা বাঙালিরা অতিথিপরায়ন উপরের লক্ষ্য HTML এবং খুব নীচে, আমরা কি কাজ করেছি পরে দৃশ্যত অন্যান্য এইচটিএমএল অনেক, আমরা কোণ বন্ধনী স্ল্যাশ এইচটিএমএল আছে. সুতরাং যে সাজান সীমানা এইচটিএমএল কি এবং কি না তাদের মোকাবেলায় নয়. এবং অবশ্যই, সাধারনত, শুধু আপনি আপনার সি প্রোগ্রাম সব লিখেছে বিন্দু গ চিহ্নিত এক্সটেনশনগুলি সহ, আপনার HTML ফাইল সব ডট এইচটিএমএল এক্সটেনশন দিয়ে শেষ হবে. কিন্তু আরো আছে এখানে ঘটছে. আমরা শুধু এই এইচটিএমএল ট্যাগ নেই. আমরা দৃশ্যত এই আছে জিনিস একটি মাথা ট্যাগ বলা হয়. আচ্ছা, ঠিক আছে, যে কি? 

ভাল হয়ত এটা সেরা একটি শরীরের মাধ্যমে পার্থক্য, শরীরের ওয়েব পৃষ্ঠার বিষয়বস্তু হচ্ছে. তাই হয়তো মাথা ট্যাগ স্টাফ সংজ্ঞায়িত যে, ব্রাইজার উইণ্ডোয় সঠিক নয় কিন্তু একরকম গুরুত্বপূর্ণ আমাদের ওয়েবপৃষ্ঠাটি সঠিকভাবে অনুষ্ঠিত হচ্ছে. উদাহরণস্বরূপ, ভিতরে মাথা ট্যাগ আমরা শিরোনাম ট্যাগ আছে. 

তাই শিরোনাম হ্যালো দুনিয়া হচ্ছে, যে আসলে কি হতে যাচ্ছে Chrome এ ট্যাবে দেখায় বা সাফারি বা Firefox-- মধ্যে যাই হোক না কেন আপনি যে ব্রাউজারটি যে prefer-- কি শিরোনাম দেখা যাচ্ছে. এবং ট্যাব আগে এটা দেখাতে হবে আপনার সমগ্র ব্রাইজার উইণ্ডোয় আপ এবং আপনি শুধুমাত্র একটি পৃষ্ঠায় থাকতে পারে একটি সময়ে একটি ব্রাউজার উইন্ডোতে খুলুন. সুতরাং যে হতে যাচ্ছে ট্যাবে আমার পৃষ্ঠা আপ শিরোনাম অথবা ব্রাউজার উইন্ডো বার, হ্যালো দুনিয়া. আর তৎকালীন কন্টেন্ট আমার ওয়েবপৃষ্ঠাটি হ্যালো, দুনিয়া হতে হবে. সুতরাং আসুন কি কিছু কটাক্ষপাত করা যাক ভালো জিনিস অনুরূপ হতে পারে. এই একটি চমত্কার সহজ এইচটিএমএল পাতা. তাই আমি আমার এবং CS50 আইডিই এখানে আছি এবং আমি একটি সামান্য বিট জুম করেছি. আর আমি শুধু যাচ্ছি হ্যালো ডট এইচটিএমএল খুলুন এবং এই অনেক সুন্দর হয় যে আপনি প্রদর্শন আমরা আগে দেখেছি যে পাতা কন্টেন্ট. আমার সহজ এইচটিএমএল, মাথা ট্যাগ, শিরোনাম ট্যাগ, তাই শরীর, এবং. আমি পরিষ্কার হতে সংভৃত করেছি. 

আর আমি কি করতে তাহলে কি আমার আইডিই শুধু পৃষ্ঠা পূর্বরূপ. এবং সেখানে আমরা যেতে. আমার পাতার বিষয়বস্তু আপনি বিশ্বের হয় হ্যালো, আমি কিছু দেখছি না সেখানে মাথা ট্যাগ থেকে. এটা শরীরের শুধু কন্টেন্ট. বিশ্ব, হ্যালো. এবং আবার শরীর শুধু বলেন, বিশ্বের, হ্যালো. অন্যান্য অংশ অনুপস্থিত. 

সুতরাং যে সত্যিই এটা সব. এটি একটি খুব সহজ মৌলিক HTML পৃষ্ঠা. এখন আমি আমার এইচটিএমএল সংভৃত করেছি সত্যিই চমৎকার এবং সংগঠিত হতে কিন্তু আমি আসলে আছে না. আমি এটা প্রশংসনীয় কুশ্রী বানাতে পারে. এবং এই এখনও কাজ করবে. এই সঠিক একই ওয়েবপৃষ্ঠাটি হতে হবে. আমি শুধু পরিত্রাণ পরেছিলাম সাদা স্পেস সব. 

হিসাবে এটি সক্রিয় আউট, সাদা স্থান তথ্য. আর তাই আমরা থেকে তথ্য প্রেরণ করছেন যখন প্রেরকের সার্ভার থেকে, রিসিভার যাও ক্লায়েন্টের সাথে, তথ্য টাকা খরচ. আর তাই হোয়াইটস্পেস পরিত্রাণ আসলে একটি ভাল ধারণা আপনি কারো হন তাহলে যারা তোলে ওয়েব কন্টেন্ট অনেক আপ. যদি আপনি এটা একটা খারাপ ধারণা এই শেখার উপাদান কে কারো এবং আপনি করতে চান এটা সুন্দরভাবে আয়োজন করে. এই তুলনায় বিশ্লেষণ করতে অনেক সহজ হয়. কিন্তু এটা এই বৈশিষ্ট্যগুলি অভিন্ন. 

যে মত খাঁজ এবং স্টাফ আসলে HTML এ কোন ব্যাপার না. যে সমস্ত বিষয়গুলি খোলার ট্যাগ ও হয় সঠিক অনুক্রমে ট্যাগ বন্ধ. যদিও এখানে ঘটেছে, তা লক্ষ করুন. মার্কআপ আমাদের একটি উপায় দেয় অতিরিক্ত তথ্য যোগাযোগ আমরা লিখিত করেছি সে সম্পর্কে. হ্যালো, বিশ্ব অংশ ছিল শিরোনাম হিসেবে ব্যাখ্যা. আর, হ্যালো অংশ বিশ্বের ছিল কন্টেন্ট হিসেবে ব্যাখ্যা বা কি হওয়া উচিত আমার ওয়েব পাতায় দৃশ্যমান. 

এইসব বিভিন্ন 100 আছে ট্যাগ এবং বড় সম্পদ প্রচুর তাদের খুঁজে বার করতে অনলাইন. আমরা একটি সম্পর্কে কথা বলতে যাচ্ছেন এই ভিডিওতে কতেক, কিছু সত্যিই মৌলিক উপাদান. কিন্তু আমরা আলাপ যাচ্ছেন না এটা সব সম্পর্কে এটা কারণ তাই করতে সম্পূর্ণ হবে. 

আপনি যদিও, করতে পারেন আরেকটি বিষয়, বিকাশকারী সরঞ্জাম খুলুন হয়. আর যে স্থান থেকে প্রত্যাহার হলে HTTP- র উপর আমাদের ভিডিও, আমি খুলতে কিভাবে ব্যাখ্যা বিকাশকারী সরঞ্জাম আপ. ক্রোম ইন এটি সাধারণত F12 কী ডেভেলপার টুলবার খুলুন. তারপর পরিবর্তে নেটওয়ার্ক নির্বাচন ট্যাব, আপনি উপাদানসমূহ ট্যাব নির্বাচন করতে পারবেন. এবং যদি আপনি একটি ওয়েব লোড করা হলে, পাতা, আপনি আসলে হবে যে ওয়েব পৃষ্ঠা তৈরি করে যে এইচটিএমএল দেখতে. আর তাই আপনি এইচটিএমএল সম্পর্কে অনেক কিছু জানতে পারবেন আপনার প্রিয় ওয়েবসাইট এ খুঁজছেন দ্বারা এবং তারা গড়ে তুলতে কিভাবে দেখা যদি আপনি চান যে তাদের বিভিন্ন টুকরা. তাই হয়তো এই শীতল আছে প্যাটার্ন বা যে ভালো কিছু. কিভাবে তারা এইচটিএমএল সঙ্গে এটি করতে পারি? আচ্ছা আপনি শুধু আপনার ডেভেলপার পর্যন্ত খুলতে পারে যে উপাদান উপর সরঞ্জাম এবং বিলম্ব এবং এইচটিএমএল এটা তোলে ঠিক কি দেখতে. সুতরাং যে একটি সত্যিই এইচটিএমএল শিখতে ভালো উপায়, এবং আমি দৃঢ়ভাবে যে সুপারিশ আপনি এটা উভয় শিখতে না এইচটিএমএল এবং একটু জানতে বিকল্প কিছু সম্পর্কে বিট আপনার জন্য উপলব্ধ বিকাশকারী সরঞ্জাম, যা অবশ্যই হিসাবে উপকারে আসবে আপনি আরো নিবিড় ওয়েব করছেন শুরু প্রোগ্রামিং. 

সুতরাং আসুন একটি কটাক্ষপাত করা যাক সাধারণ এইচটিএমএল ট্যাগ এর দম্পতি. আর আমরা তিড়িং লাফ এবং কটাক্ষপাত করব এই ট্যাগও রেন্ডার হবে কি আমার IDE তে কিছু ফাইল এ খুঁজছেন দ্বারা হিসাবে. তাই এখানে তিনটি খুব মৌলিক ট্যাগ হয় টেক্সট চাক্ষুষ চেহারা tweaking. বি ট্যাগ, আমি ট্যাগ, এবং ইউ ট্যাগ নেই. যথাক্রমে তারা কি করবেন গাঢ় তাদের মধ্যে টেক্সট রেন্ডার, তির্যক, এবং নিম্নরেখাঙ্কিত. সুতরাং আসুন যে দেখাবে তা দেখতে দিন আমার আইডিই একটি প্রকৃত ওয়েব পেজে মত. 

তাই এখানে আমার IDE তে আমি একটি BIU ডট এইচটিএমএল ফাইল নামক. BIU ডট এইচটিএমএল ঠিক হচ্ছে বোল্ড, italics, নিম্নরেখাঙ্কিত. আমি এটি খুলুন করব. 

এবং আমরা যদি আমি যে এখানে দেখতে পাবেন এই টেক্সট আছে বি ট্যাগ গাঢ় হয়. এই টেক্সট আমি ট্যাগ ইটালিক হয়. এবং এই টেক্সট ইউ ট্যাগ আন্ডারলাইন করা হয়. কি এই মত চেহারা যাচ্ছে? ওয়েল আবার, সব আমি আছে এখানে ওভার যেতে হয় না করতে আমার ব্রাউজারে, আমার ফাইল ব্রাউজার, ক্লিক সম্পূর্ণ বিবরণের পূর্বরূপ দেখুন, এবং এই পর্যন্ত কি আসে যায়. 

বি মধ্যে টেক্সট ট্যাগ প্রকৃতপক্ষে এখন গাঢ় হয়. আমি মাঝে মধ্যে টেক্সট ট্যাগ প্রকৃতপক্ষে এখন তির্যক হয়. আর ইউ মধ্যে টেক্সট ট্যাগ প্রকৃতপক্ষে এখন আন্ডারলাইন করা হয়. সুতরাং যে বেশ ভাল. আমরা এখন টেক্সট করতে জানি একটু বেশি শৌখিন দেখুন অথবা নির্দিষ্ট কিছু করতে জোর আঁকা. এখানে সাধারণ ট্যাগ আরেকটি দম্পতি অনুচ্ছেদের ট্যাগ, পি, ও হেডার ট্যাগ, যা আমি HX হিসেবে এখানে অনুষ্ঠিত থাকেন. 

এই পি ট্যাগ, এই অনুচ্ছেদের ট্যাগ, অনুচ্ছেদ আপনার লেখা পর্যন্ত বিরতি. এটা শুধু যথেষ্ট নয় লিখুন এবং স্পেস ছেড়ে আঘাত, একটি কম্পিউটার শুধুমাত্র যাচ্ছে কারণ আপনাকে যা করতে হবে তা বলতে কি করতে এবং এটা সাদা উপেক্ষা অধিকাংশ অংশ জন্য স্থান. তাই আমরা ঠিক করে এন্টার পারবেন না এবং আমাদের কম্পিউটার আশা আমরা চাই যে ব্যাখ্যা করা একটি নতুন অনুচ্ছেদ শুরু করার. আমরা খুব স্পষ্টভাবে এই বলার আছে এই paragraph-- এক another-- হয় পি ট্যাগ একটি সেট প্রতিটি পরিক্ষেপ দ্বারা. 

আর আমরা এই অপশন আছে এইচ ট্যাগ, এই হেডার ট্যাগ জন্য. আমরা ছয় বিভিন্ন মাত্রা আছে হেডার, এক, দুই, তিন, যা চার, পাঁচ, ছয়, কার্যক্রমে বৃহত্তর এবং বৃহত্তর হেডার. তাঁরা ছোট পেতে এবং ছোট ছোট এবং ছোট. তাই আমরা একটি দ্বিতীয় একটি শীর্ষ স্তরের হেডার আছে স্তর হেডার, এবং তাই, এবং তাই. 

এর হয়তো কিছু কটাক্ষপাত করা যাক পি ট্যাগ এবং কিছু হেডার ট্যাগ একটি ওয়েব পৃষ্ঠাতে কর্ম. তাই এখানে আমার IDE তে আমি নামক একটি ফাইল আছে পিএইচ ডট এইচটিএমএল, পিএইচ হচ্ছে অনুচ্ছেদ এবং হেডার ট্যাগ. যে খুলুন. অনেক আছে এখানে ঘটছে আমি কিছু Lorem রেখেছি কারণ যন্ত্রপাতি, এখানে কিছু শুধু র্যান্ডম টেক্সট. তাই আমি একটি সামান্য বিট জুম আউট করব নেই, কারণ এত যাওয়া. কিন্তু আমি খুব এ আছে বিজ্ঞপ্তি আমি একটি H1, একটি স্তর এক আছে এখানে শীর্ষ হেডার ট্যাগ. তারপর আমি শুধু যা একটি অনুচ্ছেদ, আছে র্যান্ডম text-- চালিত একটি গুচ্ছ ipsum-- শুধু টেক্সট মান ভরাট ডিফল্ট. তাই আমি যে এর ভিতরে দুটি অনুচ্ছেদের আছে এক স্তর হেডার এবং তারপর নিচে নিচে আমি লাইন 24 এখানে একটি স্তর দুটি হেডার আছে, একটি দ্বিতীয় স্তর হেডার, এবং অন্য দুটি অনুচ্ছেদ. আচ্ছা এই কি কেমন আমি আমার প্রিভিউ এটি দেখতে হলে? দেখা যাক. 

সুতরাং যে লক্ষ্য এখানে প্রথম স্তর হেডার আসলে বেশ একটু বড় দ্বিতীয় স্তর হেডার তুলনায়. সুতরাং আমরা H1 ট্যাগ ব্যবহার করে. এবং পি ট্যাগ আমাদের অনুমতি যে লক্ষ্য অনুচ্ছেদের মধ্যে কিছু আউট বিরতি. আমরা যারা পি ট্যাগ পরিত্রাণ অর্জিত ছিল যদি এবং আসলে শুধু করা প্রবেশ বা রিটার্নস আমরা আশা কি মধ্যে would বিভিন্ন অনুচ্ছেদ হতে, তারা সব ঠিক একসাথে করিয়া দর্জা ভেজান হবে এবং এটা এই সুন্দর অনুচ্ছেদ হবে না উপরের এবং নীচের স্থান সঙ্গে বিচ্ছেদ. আর তাই যে কি অনুচ্ছেদের এর ট্যাগ এবং হেডার ট্যাগ সাধারণভাবে আঁকা করতে ব্যবহার করা হয় আমাদের ওয়েব পৃষ্ঠার অংশ মনোযোগ যে ভাবে. 

পরবর্তী আপ আমরা ব্যবহার করি যে কিছু ট্যাগ আছে আমাদের ওয়েব পেজে তালিকা নির্মাণ করতে. সুতরাং আমরা unordered আছে lists-- ULs-- যা শুধু আদেশ বুলেটযুক্ত তালিকা, numbered-- যা তালিকা OLs-- এবং ভেতরে হয় যারা এক থাকতে হবে , Li তালিকা আইটেম ইঙ্গিত কিভাবে সেট. আর তাই আমরা খোলা উল ট্যাগ আছে এবং আমরা এটি ভেতরে জিনিস করা. এবং তারপর আমরা সঙ্গে সম্পন্ন হলে যে, আমরা উল ট্যাগ বন্ধ করে দিতে পারেন. 

আর একইভাবে আমরা থাকতে পারে একটি আদেশ বা সংখ্যাযুক্ত তালিকা এবং যে এর ভিতরে তালিকায় আইটেম করা. তাই এর কটাক্ষপাত করা যাক তালিকায় একটি দম্পতি এ এবং কি তারা এবং CS50 আইডিই তে হিসেবে রেন্ডার. তাই আমি আমার আইডিই একটি এখানে আছে ফাইল নামক তালিকা এইচটিএমএল বিন্দু. একবার দেখা যাক. 

এবং এখানে লক্ষ্য করুন আমি একটি unordered আছে এটা যে পাঁচটি জিনিস সঙ্গে তালিকা. এবং তারপর আমি একটি আদেশ তালিকা আছে, এবং আমি ট্যাগ একটি সামান্য বিট পরিবর্তন করেছি, ঠিক আছে? আমি শুরু ছয় সমান বলেন করেছি. এটা একটি আদেশ তালিকা আমি সাথে দেখা যাচ্ছে আদ্যস্থল যেখানে সেট করতে পারেন আমি এটা one-- হবে ডিফল্টরূপে want-- দ্বারা শুধু এই তথাকথিত অ্যাট্রিবিউট যুক্ত আমার ওল ট্যাগ করতে. আর তাই এই তালিকা প্রস্তুত করা যাবে ছয় এ গণনা শুরু. যে সংখ্যাযুক্ত তালিকা সুতরাং উপাদান হওয়া উচিত ছয়, সাত, আট, নয়, দশ, পাঁচটি উপাদান আছে, কারণ তালিকার মধ্যে, এক উল্টোদিকে, দুই, তিন, চার, পাঁচ, যা আমি ওল বলেছিলেন যদি কেস হবে শুরু অ্যাট্রিবিউট উল্লেখ না. 

আপনি করতে পারেন তাই আমরা শুধু এই প্রিভিউ করব এখানে কি ঘটছে জন্য একটা ধারনা পাবেন. এবং সেখানে আমরা যেতে. আমার তালিকা নেই. প্রথম পাঁচটি উপাদান unordered বা বুলেটযুক্ত তালিকা. আগামী পাঁচ উপাদান একটি পৃথক আদেশ তালিকা ছয় থেকে শুরু. সুতরাং এটা কিভাবে আমরা যা করতে পারেন এইচটিএমএল ব্যবহার করে তালিকা তৈরি করুন. আরেকটি বিষয় আপনি পারে এইচটিএমএল এর সাথে কাজ করতে চান একটি টেবিল নির্মাণ করা হয় সারি এবং কলাম তথ্য একটি তথ্য উপস্থাপন বিশেষ ভাবে সংগঠিত. আমরা একটি থাকতে পারে এইচটিএমএল সাথে এই কাজের জন্য খোলা বন্ধনী প্রারম্ভে টেবিল সংজ্ঞা টেবিল. এবং তারপর যে টেবিলের ভিতরে আমরা সারি, TR-ট্যাগ একটি সেট থাকতে পারে প্রতিটি সারিতে ইঙ্গিত. এবং তারপর একটি td ট্যাগ TR-ট্যাগের ভিতরে যেতে একটি সারি মধ্যে একটি কলাম নির্দিষ্ট করতে. 

কেন এটা TD নামক এবং TC না হয়? ওয়েল, td টেবিলের তথ্য ঘোরা. সাধারণত আপনি নির্বাণ করছি সেখানে আপনার তথ্য. এটা TD এবং না যে সকল TC এর সুতরাং যে কেন. এটি একটি সামান্য বিট বিভ্রান্তিকর. 

সুতরাং আপনি টেবিল ট্যাগ আছে এবং আপনার টেবিল ট্যাগের ভিতরে আপনি সারি, টিআরএস একটি সংখ্যা আছে. এবং প্রতিটি সারির ভিতরে আপনি কলাম সংখ্যা জন্য TDS আপনি চান যে যে বিশেষ সারিতে. এর একটি খুব কটাক্ষপাত করা যাক এবং CS50 IDE তে ওভার সহজ টেবিল. 

তাই আমি এখানে একটি ফাইল আছে টেবিল ডট এইচটিএমএল বলা. এর কটাক্ষপাত আছে চলুন শুরু করা যাক কি যে ভালো দেখায়. অনেক আছে এখানে ঘটছে কিন্তু যদি আপনি বিজ্ঞপ্তি আমি একটা টেবিল খোলা আছে. আমি টেবিলের সাথে সংজ্ঞা শুরু করছি. এবং তারপর আমার প্রথম সারিতে আমি দৃশ্যত আছে চার কলাম, এক, দুই, তিন, চার. এবং তারপর আমি যে সারি সঙ্গে কাজ করছি. 

তারপর আমি অন্য সারি শুরু এবং দুই, চার, ছয়, আট কি. যে সারি শেষ. অন্য সারি, তিন, ছয়, নয়, 12 কি. এবং তারপর একটি শেষ সারির চার, আট, 12, এবং এটা যদিও একটু, 16 এখানে কেটে দিল. 

আমি যে সারি সমাপ্ত. আমি টেবিলের সমাপ্ত. এবং তারপর আমি আমার এইচটিএমএল সঙ্গে কাজ করছি. এই লিঙ্কটি দেখতে চান? ওয়েল, এটা দেখতে সত্যিই অনেক না. আমার মা আমার সঙ্গে তথ্য সংগঠিত করেছি একটি কিছুটা বেশি সংগঠিত ভাবে. কিন্তু তা এখানে সুপার প্রশংসনীয় নয়. আর আমরা মোকাবেলা করতে যাচ্ছেন আমরা সিএসএস সম্পর্কে কথা বলতে হলে যে. আমরা এই ধারণা পরিদর্শন করব আমরা একটি টেবিলের করতে কি হয়তো একটু একটু ভাল ফরম্যাট? কিন্তু আমি এখনও চার সারি আছে না, যা প্রতিটি চার কলাম আছে, একটি হল এবং সত্যিই এই পরিমাণ কি খুব সহজ চার গুণ দ্বারা টেবিল. 

আমরা সম্পর্কে আলোচনা করব আর মাত্র কয়েক ট্যাগ. এর সম্পর্কে কথা বলা যাক একটি HTML ফর্ম ধারণা. তাই আপনি যদি এই দেখা হতে পারে একটি ওয়েব পৃষ্ঠা লগিং প্রেক্ষাপটে. সাধারণত আপনি আপনার ব্যবহারকারীর নাম টাইপ করুন. আপনি যদি আপনার পাসওয়ার্ড টাইপ এবং আপনি যেতে ভাল. একটি ফর্ম যে শুরুতে হবে. 

উপর কুঁদন একটি দ্বিতীয় DIV. আমরা ইনপুট আছে যা ধরনের ফর্ম ভিতরে উপযুক্ত. এই উপাদান আছে আপনি আসলে, টাইপ করছি বা রেডিও বোতাম আপনি আছেন টিক্দান, বা চেক আপনি বন্ধ টিক্দান করছি যে বাক্সে. তাই এই ধরনের ভিতরে যেতে. তাঁরা মূলত গঠিত ফর্ম প্রতিটি সারিতে আপনার ফর্ম ভাল ফরম্যাট করা হয় তাহলে. তারপর এই ধারণা আছে সত্যিই না যা একটি div, কোন নির্দিষ্ট বিষয়শ্রেণীতে অন্তর্ভুক্ত মাপসই আমি করেছি বেশী ভালো ট্যাগ পূর্বে এরকম হয়েছে. এটি শুধু সাজানোর demarcates কিছু অবাধ division-- শুরুতে পৃষ্ঠার div--. কোন চাক্ষুষ বিভাজক আছে. কোন লাইন আছে. এটি একটি হিসাবে ফাটান না স্বয়ংক্রিয়ভাবে পৃথক খণ্ড. আপনি এটি আপনার শৈলী আছে চাই যে ভাবে যে কাজ করতে. 

এটি শুধু সাজানোর আমি একটি কথা বলছেন আমার ওয়েব পেজে স্থান টুকরা, এবং আমি শুধু কল করা যাচ্ছে না এটা আমার পৃষ্ঠার এই বিভাগ. আমরা ভিতরে স্টাফ করা যাবে divs এর, এবং আসলে, আমরা ওভার আগাইয়া যখন একটি দ্বিতীয় মধ্যে আইডিই, আমরা করব আমি নির্বাণ করছি দেখতে আমার একটি div ভিতরে গঠন. 

তাই আমি আমার আইডিই একটি এখানে আছে div ফর্ম ডট এইচটিএমএল ফাইল নামক. এর তা খুলুন. আমি ভালো বলেন যে লক্ষ্য, div নির্বিচারে ধরনের. রাইট? এটা সত্যিই কিছু মানে না. তাই আমি একটি অবাধ আছে আমার পৃষ্ঠার প্রথম বিভাগ. এবং তারপর পরিবর্তে আরেকটি div পরবর্তী লাইন আট নং থেকে শুরু আমি এই ফর্ম আছে. এবং ফর্ম ভিতরে আমি একটি আছে ইনপুট সংখ্যা, ফর্ম ক্ষেত্র. সুতরাং আমি যার নাম একটি ক্ষেত্র আছে ছাগু karigor.com সত্যিই কিছু মানে না, যা ডান এখন আমি যে দৃশ্যত টেক্সট, অন্য এক লাগে যে একটি রেডিও যে একটি পাসওয়ার্ড, অন্য লাগে বাটন, একটি চেক বক্স যে অন্য, এবং যে অন্য একটি Submit বাটনে. ওয়েল, এই কি আছে সব আসলে অনুরূপ? ওয়েল, এর কটাক্ষপাত করা যাক. আমরা আমাদের প্রিভিউ উইন্ডোতে এটি খুলুন করব. এই অবাধ যে লক্ষ্য করুন প্রথম আছে division-- এখানে কোন চাক্ষুষ বিচ্ছেদ. এটা সত্যিই ঠিক আছে, কিছু করতে না? 

এবং তারপর আমি আমার ফর্ম আছে. এবং আমি কোন বিশেষ ধরনের কাজ করেন নি. তাই আকারে শুধু এক তথ্য বড় সারিতে. আমি ভিন্নভাবে আমার ফর্ম ফরম্যাট ছিল তাহলে, আমি এটা লাইন দ্বারা পাতিপাতি থাকতে পারে. কিন্তু আমি কোন স্টাইলিং করা হয়নি. আবার, আমরা এখানে সিএসএস বিষয়ে কথা বলছি না. আমরা শুধু এইচটিএমএল সম্পর্কে কথা বলার চেষ্টা করছি. 

ওয়েল আমার টেক্সট আকারে আমি type-- পারেন মনে রাখবেন যে টাইপ লেখার ফর্ম তাই আমি আমার নাম রাখা যাবে. আর আমার পাসওয়ার্ড আমি আমার পাসওয়ার্ড টাইপ করতে পারেন. এবং যে ক্ষেত্রে কারণ , টাইপ পাসওয়ার্ডের হয় আপনি আমার পাসওয়ার্ড হচ্ছে কি না জানি না. এটা সমস্ত বিন্দুর এর. 

আমি একটি বাদ চয়ন করতে পারেন রেডিও বাটন বা একটি চেক বক্স বাদ. অথবা আমি আমার ফর্ম জমা দিতে পারে. এবং আমি কিছুই করতে পারে না, তাই আমি আমার ফর্ম জমা দেওয়ার সময়, পাতা শুধু রিফ্রেশ. কিন্তু আমি সম্ভবত কনফিগার পারে আমার অন্য কিছু করতে Submit বাটনে. আর আমরা দিয়ে কি করতে পারেন দেখতে পাবেন পিএইচপি তে ভবিষ্যতে ভিডিওতে যে. কিন্তু এই একটি খুব তৈরী সহজ ফর্ম যে আমরা ব্যবহারকারী যোগাযোগ আছে ব্যবহার করতে পারেন এবং আমাদের ওয়েবসাইট থেকে তথ্য জমা দিতে হবে. 

এক শেষ মন্তব্যটি আমরা আগে অন্য কিছু ট্যাগ উপর সরানো এই কটাক্ষপাত করা হয় ইনপুট ট্যাগ আরো এক সময়. আমি হাইলাইট করেছি বিজ্ঞপ্তি লাল ট্যাগ সমাপ্তিতে. আমরা এ পর্যন্ত দেখা করেছি প্রত্যেক অন্যান্য ট্যাগ আছে একটি শুরুতে এবং শেষ, একটি খোলা ছিল ট্যাগ এবং একটি ক্লোজিং ট্যাগ. 

কিন্তু একটি ইনপুট ট্যাগ না. যে যায় কোন লেখা নেই ইনপুট ট্যাগ মধ্যে. সমস্ত তথ্য আমরা বোঝাতে ইচ্ছুক করছি এর অংশ হিসাবে আপ আবদ্ধ হয় যে ইনপুট বৈশিষ্ট্যাবলী. আমরা ইনপুট নাম এক্স সমান আছে বিজ্ঞপ্তি. টাইপ করুন y সমান. যে সত্যিই সব তথ্য আমরা প্রয়োজন. 

এটি একটি স্বয়ংসম্পূর্ণ ক্লোজিং ট্যাগ বলা হয়. এটি একটি খোলা এবং একটি প্রয়োজন হয় না বন্ধ তথ্য সব কারণ ভিতরে অন্তর্ভুক্ত করা হয় ট্যাগ এবং তার বৈশিষ্ট্যাবলী. তাই মাঝে মাঝে আপনাকে খুব, এই দেখতে পাবেন. আপনি যদি একটি আছে, যাতে শুধু সচেতন হতে সম্পূর্ণভাবে স্বয়ংসম্পূর্ণ যে ট্যাগ, এটি প্রর্দশিত হবে এবং সাথে নিজেই প্রচেষ্টা Glosbe উপর খোলা কোণ বন্ধনী এবং স্ল্যাশ কোণ ডানদিকে বন্ধনী. আমরা যারা অন্য একটি দেখতে পাবেন এই মুহূর্তে ছবিটি ট্যাগ দিয়ে পাশাপাশি. 

আমরা ইমেজ সম্পর্কে আলাপ, আমরা হাইপারলিঙ্কস সম্পর্কে কথা বলার প্রয়োজন. আমরা চাই, তাহলে আমাদের ওয়েব পৃষ্ঠা হতে ইন্টারেক্টিভ এবং আমাদের কাছাকাছি স্থানান্তর, এটা পাবে চমৎকার হবে যারা এক ক্লিক করতে কি সাধারণত একটি ব্লু লিংক হয়েছে. এই আমরা গড়ে তুলতে আসলে কিভাবে আমাদের ওয়েব পৃষ্ঠায় একটি হাইপারলিংক. আর মজার ব্যাপার অন্য এইচটিএমএল ট্যাগ আছে একটি হাইপারলিংক নয়, যা লিঙ্কে বলা. একটি এখানে নোঙ্গর ঘোরা, এবং যে আমরা একটি হাইপারলিংক নির্দেশ কিভাবে. 

A href X উপায়ে যেতে সমান ওয়েবপৃষ্ঠাটি এক্স এবং সবকিছু একটি ট্যাগ খোলা মধ্যে এবং ঘনিষ্ঠ একটি ট্যাগ কি হতে যাচ্ছে না যে আন্ডারলাইন একটি লিঙ্ক যে দেখে মনে হচ্ছে নীল রঙের টেক্সট আমরা এর সাথে পরিচিত হন যে. যে নীচে আমরা একটি ইমেজ ট্যাগ, আছে যা একটি স্বয়ংসম্পূর্ণ প্রদর্শনের জন্য ট্যাগ বন্ধ হয় এক্স এ অবস্থিত একটি ইমেজ এবং আপনি পরিবর্তন করতে সক্ষম হতে পারেন নির্দিষ্ট করে যে চিত্র প্রস্থ ও উচ্চতা এবং অন্যান্য গুণের যে বিন্দু বিন্দু বিন্দু. 

এখানে খুব নীচে আমরা একটি খুব আকর্ষণীয় আছে ট্যাগ খুঁজছেন যে না একটি ক্লোজিং ট্যাগ আছে. এটা বিস্ময়বোধক বিন্দু DOCTYPE এইচটিএমএল এর. সুতরাং এইচটিএমএল থেকে প্রায় হয়েছে ওয়েব পেজ নির্মাণের জন্য 1990 সালে এই এবং এটা সিসিইউ সর্বস্বান্ত হচ্ছে তারপর থেকে বেশ পুনর্বিবেচনা. অতি সম্প্রতি 2014 সালে এটি একটি পুনর্বিবেচনা নিয়েছেন এখন বর্তমান যা HTML5 এর নামে কার্যত এইচটিএমএল মান সাজান. 

নির্দেশ করে যে আমাদের ওয়েব পেজ, HTML5 এর ব্যবহার করে লেখা হয় আমরা চলতে শুরু আর শেষ হয়না. এটা বাদ দেওয়া যেতে পারে কিন্তু কি যে মূলত মানে আপনি ট্যাগ কোনো ব্যবহার করতে পারবেন না হয় HTML5 এর ট্যাগ, যারা নতুন ট্যাগ যে হয়. তাই আমরা সবসময় চলতে শুরু আমরা HTML5 এর ব্যবহার করছেন. আর সব ট্যাগ আমরা স্বপ্ন করেছি পূর্বে HTML5 এর ট্যাগ করা হয়. কিন্তু এই যে নির্দেশ করবে HTML5 এর ট্যাগ উপস্থিত হতে হবে. আর তাই আমরা বিস্ময়বোধক আছে DOCTYPE এইচটিএমএল, যা খুব প্রারম্ভে হয় আমাদের HTML ফাইল, এবং তারপর পরে যে বিন্দু আমরা আসলে আমাদের এইচটিএমএল খোলা আছে ট্যাগ এবং সেখান থেকে এগিয়ে. 

গত এক, একটি মন্তব্য ট্যাগ যা খুব সামান্য আলাদা দেখায়. এটি কোণ সঙ্গে আরম্ভ বন্ধ বন্ধনী বিস্ময়বোধক ড্যাশ ড্যাশ কিন্তু কোন ক্লোজিং বন্ধনী. সেখানে ঐ দুটি উপাদানের মধ্যে ইন আপনার মন্তব্য লিখুন যেখানে হয়. আর এর ছবি কটাক্ষপাত করা যাক এবং মন্তব্য এবং CS50 IDE তে লিঙ্ক. 

তাই আমি একটি ফাইল নামক ইমেজ লিঙ্ক এখানে আছে আমি খুলতে যাচ্ছি যা ডট এইচটিএমএল. এবং আমি একটি দম্পতি পেয়েছেন বিজ্ঞপ্তি আমার এইচটিএমএল মন্তব্য এখানে মন্তব্য. তাই শুধু সি এবং অন্যান্য ভালো প্রোগ্রামিং ভাষা, শুধু একটি মার্কআপ ভাষা হচ্ছে দ্বারা এইচটিএমএল মন্তব্য আছে ক্ষমতা আছে. আর তাই আমি দৃশ্যত যাচ্ছি রিক Astley একটি ছবি লিখুন কোথাও এই div মধ্যে ট্যাগ, এই অবাধ বিভাগ. দৃশ্যত যে ফাইল রিক ডট কোন JPEG, এ অবস্থিত, যা আমরা ধরে ফিরে যান তাহলে একটি দ্বিতীয় জন্য আমার ফাইল বৃক্ষ, অস্তিত্ব রয়েছে এমন একটি ফাইল বর্তমান ডিরেক্টরির. সুতরাং যে ঠিক আছে. আমি তা উল্লেখ করতে পারেন. 

তারপর আমি অভ্যন্তরীণ লিংক থাকতে পারে. সুতরাং এখানে লাইন 11 লক্ষ্য আমার আল্লাহ হ্যালো ডট এইচটিএমএল হয়. সুতরাং যে শুধু ডট এইচটিএমএল হ্যালো বোঝায় যা বর্তমান ডিরেক্টরির মধ্যে উপস্থিত রয়েছে. আর আমি বহিরাগত থাকতে পারে মধ্যে HTTPS শুধু নির্দিষ্ট করে লিঙ্ক আমি বলছি না যে ইঙ্গিত আমার বর্তমান ডিরেক্টরির মধ্যে একটি ফাইল সম্পর্কে. আমি যে বিদ্যমান একটি ফাইল যে বিষয়ে কথা বলছি কোথাও আমি আছে, যা ইন্টারনেটে HTTP প্রোটোকলের ব্যবহার অনুরোধ করতে. 

সুতরাং আসুন কটাক্ষপাত করা যাক কি এই পৃষ্ঠার অনুরূপ হতে পারে এবং রিক একটি ছবি জন্য প্রস্তুত পেতে Astley আপনার পর্দায় দেখা করতে. তাই আমি এই প্রিভিউ করব. রিক Astley এ নেই এই অবাধ খুব উপরে বিভাগ আমি উপরের লাগাতে হবে. এবং তারপর নিচে নিচে আমি আমার লিঙ্ক আছে, তাই না? 

আমি হ্যালো ডট এইচটিএমএল একটি লিঙ্ক আছে. আর আমি যে ক্লিক করুন, আমি পেতে এই পৃষ্ঠার যাও চলে আমরা থেকে সঙ্গে খুব পরিচিত হন যে আমাদের প্রোগ্রাম খুব প্রারম্ভে. আমি আবার খোলা পাতা পপ, তাহলে আমি যদি পপ ইমেজ লিঙ্ক, আরো এক সময় খোলা আমি বাইরে যেতে পারেন CS50 এর ওয়েবসাইট থেকে. এবং সেখানে আমরা আমি করব see-- একটি সামান্য বিট জুম আউট এখানে আমরা এর CS50 এর ওয়েবসাইট সাজান দেখতে পাবেন আমাদের পৃষ্ঠার মাঝখানে এমবেডেড. তাই আমি একটি অভ্যন্তরীণ করতে সক্ষম ছিল একটি বাহ্যিক লিঙ্ক সেইসাথে লিঙ্ক. 

HTML এর সর্বশেষ নিয়ম যে আমরা এখানে আলোচনা করতে যাচ্ছেন আপনার এইচটিএমএল ভাল গঠন করা উচিত. সি ইন আমরা সম্পর্কে অনেক কথা বলত জিনিস বিভিন্ন সিনট্যাক্স. এইচটিএমএল এ সিনট্যাক্স সত্যিই ট্যাগ কাছাকাছি revolves. আপনি খুলতে প্রতি ট্যাগ বন্ধ করা প্রয়োজন. এবং সত্য, ভাষার ট্যাগ আপনি খুলুন বিপরীত ক্রম বন্ধ করা উচিত. 

তাই আপনি যদি একটি সাহসী ট্যাগ খুলতে হলে, একটি তির্যক ট্যাগ, এবং তারপর একটি নিম্নরেখা ট্যাগ একটি সব তিনটি করতে লেখার নির্দিষ্ট পরিচিতির সমষ্টি, আপনি বিপরীত অনুক্রমে তাদের বন্ধ করা উচিত. আপনি সাহসী খোলা, তাই যদি, ইটালিক, আপনি, নিম্নরেখা বোল্ড, আন্ডারলাইন, ইটালিক বন্ধ করতে চান. Encapsulation এই সাজানোর কি এইচটিএমএল চমৎকার এবং সংগঠিত রাখে. 

সি ভিন্ন, যদিও, সিনট্যাক্স ত্রুটি না আসলে সম্ভবত আপনার এইচটিএমএল পঙ্গু. আপনার HTML না ভাল হতে পারে গঠন কিন্তু এখনও কাজ করবে. আর তাই এই ত্রুটিগুলি দ্বারা স্লাইড সাজাতে পারেন. এটা সত্যিই সতর্ক করা আপনি আপ এর. কখনো কখনো তারা ব্যর্থ হবে কিন্তু কখনও কখনও আপনি এটি দিয়ে পার পেতে পারেন. 

এটা সত্যিই একটি হতে পারে কঠিন কাজ, যদিও, আপনি খোলা যখন ট্র্যাক রাখতে একটি ট্যাগ, আপনি যখন এটি বন্ধ, বিশেষ করে আপনার HTML হিসাবে ফাইল এবং বড় বড় পেতে. আপনি কিছু সাহায্য চাইবেন. আর অনলাইন আছে যাচাইকারী সরঞ্জাম যে আপনি আপনার ওয়েব কটাক্ষপাত আছে ব্যবহার করতে পারেন পাতা এবং এটা ভাল গঠন এইচটিএমএল কিনা দেখতে. আর আপনি অবশ্যই দেখাবে যারা কটাক্ষপাত এবং আপনি তাদের ব্যবহার করতে শুরু HTML এর কিছু কাজ করছেন শুরু, আপনি পেতে শুধু তাই, এইচটিএমএল লেখা সাংগঠনিক বিষয়ে কিছু ভাল অভ্যাস একটি ভাল উপায় আপনার HTML এবং ভাল শৈলী এবং এমনটা নিশ্চিত আপনি কিছু করছেন না যে একটি বাক্য গঠন ত্রুটি তৈরি করতে পারে আপনি একটি বিট হতে হবে রাস্তা নিচে একটি সমস্যা. 

আমি ডগ লয়েড আছি. এটি CS50.