সিএসএস
🌈সিএসএস কি?
📋সিএসএস হলো প্যাডিং নির্দিষ্ট করার পদ্ধতি।
⚒️সিএসএস প্যাডিং নির্দিষ্ট করতে ব্যবহৃত হয়।
সিএসএস সমূহ
সিএসএস এবং সেগুলোর ব্যবহারের তালিকা
- ➡️ padding - প্যাডিংয়ের বৈশিষ্ট্য নির্ধারণ করা
- ➡️ padding-left - বাম প্যাডিং নির্ধারণ করা
- ➡️ padding-right - ডান প্যাডিং নির্ধারণ করা
- ➡️ padding-top - উপরের প্যাডিং নির্ধারণ করা
- ➡️ padding-bottom - নিচের প্যাডিং নির্ধারণ করা
- ➡️ padding-inline - ইনলাইন দিকের প্যাডিংয়ের বৈশিষ্ট্য নির্ধারণ করা
- ➡️ padding-block - ব্লক দিকের প্যাডিংয়ের বৈশিষ্ট্য নির্ধারণ করা
padding - প্যাডিংয়ের বৈশিষ্ট্য নির্ধারণ করার উদাহরণ।
css
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
div {
border: 1px solid red;
padding: 20px;
}
</style>
</head>
<body>
<div>
<h1>প্রোগ্রামিং শিখুন</h1>
<p>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>
</div>
</body>
</html>padding-left - বাম প্যাডিং নির্ধারণ করার উদাহরণ।
css
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
div {
border: 1px solid red;
padding-left: 100px;
}
</style>
</head>
<body>
<div>
<h1>প্রোগ্রামিং শিখুন</h1>
<p>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>
</div>
</body>
</html>padding-right - ডান প্যাডিং নির্ধারণ করার উদাহরণ।
css
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
div {
border: 1px solid red;
padding-right: 20px;
}
</style>
</head>
<body>
<div>
<h1>প্রোগ্রামিং শিখুন</h1>
<p>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>
</div>
</body>
</html>padding-top - উপরের প্যাডিং নির্ধারণ করার উদাহরণ।
css
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
div {
border: 1px solid red;
padding-top: 100px;
}
</style>
</head>
<body>
<div>
<h1>প্রোগ্রামিং শিখুন</h1>
<p>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>
</div>
</body>
</html>padding-bottom - নিচের প্যাডিং নির্ধারণ করার উদাহরণ।
css
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
div {
border: 1px solid red;
padding-bottom: 100px;
}
</style>
</head>
<body>
<div>
<h1>প্রোগ্রামিং শিখুন</h1>
<p>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>
</div>
</body>
</html>padding-inline - ইনলাইন দিকের প্যাডিংয়ের বৈশিষ্ট্য নির্ধারণ করার উদাহরণ।
css
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
div {
border: 1px solid red;
padding-inline: 100px;
}
</style>
</head>
<body>
<div>
<h1>প্রোগ্রামিং শিখুন</h1>
<p>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>
</div>
</body>
</html>padding-block - ব্লক দিকের প্যাডিংয়ের বৈশিষ্ট্য নির্ধারণ করার উদাহরণ।
css
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
div {
border: 1px solid red;
padding-block: 100px;
}
</style>
</head>
<body>
<div>
<h1>প্রোগ্রামিং শিখুন</h1>
<p>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>
</div>
</body>
</html>সিএসএস সম্পর্কিত বিস্তারিত তথ্য
কার্যকর কোডিং উদাহরণ এবং সেগুলোর রেফারেন্স লিংক
| নাম | বিবরণ |
|---|---|
| padding | প্যাডিংয়ের বৈশিষ্ট্য নির্ধারণ করতে ব্যবহৃত হয়। |
| padding-left | বাম প্যাডিং নির্ধারণ করতে ব্যবহৃত হয়। |
| padding-right | ডান প্যাডিং নির্ধারণ করতে ব্যবহৃত হয়। |
| padding-top | উপরের প্যাডিং নির্ধারণ করতে ব্যবহৃত হয়। |
| padding-bottom | নিচের প্যাডিং নির্ধারণ করতে ব্যবহৃত হয়। |
| padding-inline | ইনলাইন দিকের প্যাডিংয়ের বৈশিষ্ট্য নির্ধারণ করতে ব্যবহৃত হয়। |
| padding-block | ব্লক দিকের প্যাডিংয়ের বৈশিষ্ট্য নির্ধারণ করতে ব্যবহৃত হয়। |