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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

আমার নাম Daven Farnham হয়. এটি CS50. 

সুতরাং উদাহরণস্বরূপ, আমি ব্যবহার করতে পারেন বর্গ ইমেজ - না, তাই অনেক গুণাবলী আছে. আমার নাম Daven Farnham হয়. এই সি এস 650 হয়. আমি সিএসএস বলতে চাই. এই সিএসএস হয়.