সাইন আপনি এইচটিএমএলে নতুন, এখানে এইচটিএমএল সহ সিএসএস কীভাবে ব্যবহার করতে হয় তার উদাহরণ ব্যবহারের জন্য তিনটি প্রস্তুত। আপনি এগুলিকে কেবল একটি ফাইলের মধ্যে রাখতে পারেন, এটি সংরক্ষণ করতে এবং এটি আপনার পছন্দসই ব্রাউজার দিয়ে খুলতে পারেন:
এটি সরাসরি আপনার ট্যাগ / উপাদানগুলিতে আপনার সিএসএস শৈলীতে এম্বেড করে। সাধারণত এটি খুব সুন্দর পদ্ধতির নয়, কারণ আপনার সর্বদা বিষয়বস্তু / এইচটিএমএল ডিজাইন থেকে আলাদা করা উচিত।
<?xml version='1.0' encoding='UTF-8'?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Hi, I'm bold!</title>
</head>
<body>
<p style="font-weight:bold;">Hi, I'm very bold!</p>
</body>
</html>
পরেরটি একটি আরও সাধারণ পদ্ধতির এবং আপনার নথিতে সমস্ত "পি" (অনুচ্ছেদের জন্য দাঁড়িয়ে আছে) ট্যাগগুলিতে কাজ করে এবং সংযোজন এগুলি বিশাল করে তোলে। BTW। গুগল তার অনুসন্ধানে এই পদ্ধতির ব্যবহার করে:
<?xml version='1.0' encoding='UTF-8'?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Hi, I'm bold!</title>
<style type="text/css">
p {
font-weight:bold;
font-size:26px;
}
</style>
</head>
<body>
<p>Hi, I'm very bold and HUGE!</p>
</body>
</html>
আপনি সম্ভবত প্রথম উদাহরণগুলি নিয়ে প্রায় কয়েক দিন সময় নিয়ে যাবেন, তবে এখানে শেষটি দেওয়া আছে। এতে আপনি শেষ পর্যন্ত একে অপরের থেকে সম্পূর্ণ পৃথক ডিজাইন (সিএসএস) এবং সামগ্রী (এইচটিএমএল) দুটি পৃথক পৃথক ফাইলে। স্ট্যাকওভারফ্লো এই পদ্ধতির গ্রহণ করে।
একটি ফাইলে আপনি সমস্ত সিএসএস রেখেছিলেন (এটিকে 'হ্যালো_ওয়ার্ল্ড। সিএস' বলুন):
p {
font-weight:bold;
font-size:26px;
}
অন্য একটি ফাইলে আপনার এইচটিএমএল লাগানো উচিত (একে 'হ্যালো_ওয়ার্ল্ড এইচটিএমএল বলুন):
<?xml version='1.0' encoding='UTF-8'?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Hi, I'm bold!</title>
<link rel="stylesheet" type="text/css" href="hello_world.css" />
</head>
<body>
<p>Hi, I'm very bold and HUGE!</p>
</body>
</html>
আশা করছি এটা কিছুটা সাহায্য করবে. আপনার দস্তাবেজে ঠিকানা নির্দিষ্ট উপাদানের এবং সমস্ত ট্যাগ করার জন্য আপনার নিজের সঙ্গে পরিচিত করা উচিত class
, id
এবং name
বৈশিষ্ট্যাবলী। আনন্দ কর!