কম্পিউটার

CSS ব্যবহার করে ইনলাইন প্রদর্শন করুন


ব্লকের বিপরীতে, ইনলাইন উপাদানগুলি একই লাইনে শুরু হয় এবং শুধুমাত্র বরাদ্দকৃত প্রস্থ নেয়। ডিসপ্লে বাস্তবায়নের জন্য এখন একটি উদাহরণ দেখা যাক:CSS -

-এ ইনলাইন প্রপার্টির মান

উদাহরণ

আসুন এখন একটি উদাহরণ দেখি -

<!DOCTYPE html>
<html>
<head>
<style>
span {
   background-color: orange;
   color: white;
}
p.demo {
   display: none;
}
span.demo1 {
   display: inline;
}
</style>
</head>
<body>
<h1>Match Details</h1>
<div>
Match will begin at <p class="demo">9AM</p> 10AM on 20th December.
</div>
<div>
Match will end at <span class="demo1">5PM</span> on 20th December.
</div>
</body>
</html>

আউটপুট

CSS ব্যবহার করে ইনলাইন প্রদর্শন করুন

উদাহরণ

আসুন এখন আরেকটি উদাহরণ দেখি -

<!DOCTYPE html>
<html>
<head>
<style>
span#demo {
   background-color:orange;
   color: white;
   display:inline;
}
</style>
</head>
<body>
<h1>Match Details</h1>
<div>
Match will begin at <span id="demo">9AM</span> on 20th December.
</div>
</body>
</html>

আউটপুট

CSS ব্যবহার করে ইনলাইন প্রদর্শন করুন


  1. CSS ব্যবহার করে প্রপার্টি প্রদর্শন করুন

  2. RGBA ব্যবহার করে CSS স্বচ্ছতা

  3. CSS ব্যবহার করে ইমেজ স্প্রাইট থেকে একটি আইকন প্রদর্শন করুন

  4. CSS-এ ডেটা-অ্যাট্রিবিউট (ডেটা-*) ব্যবহার করা