CSS ডিসপ্লেই এট্রিবিউট
- পূর্বপাগল direction
- পরবর্তী পৃষ্ঠা empty-cells
বর্ণনা ও ব্যবহার
display প্রতিভূতি উপাদানটির প্রদর্শন বক্সের ধরন নির্ধারণ করে。
ব্যাখ্যা
এই প্রতিভূতি ব্যবহৃত হয় লেআউট তৈরির সময় উপাদানটির প্রদর্শন বক্সের ধরন নির্ধারণ করার জন্য।HTML ইত্যাদি ডকুমেন্ট ধরনের ক্ষেত্রে, display অসমর্থনযোগ্য হলে বিপদজনক, কারণ তা হলে এটি একটি প্রদর্শন স্তরকে ভুলভাবে ভেঙে দিতে পারে।XML-এর ক্ষেত্রে, XML-এর মধ্যে এই ধরনের স্তর নেই, সুতরাং display অত্যন্ত জরুরী।
মন্তব্য:CSS2-এর মধ্যে একটি মান আছে compact এবং marker, কিন্তু ব্যাপক সমর্থনের অভাবের কারণে, তা CSS2.1-এ সরিয়ে দেওয়া হয়েছে。
অন্যান্য দেখুন:
CSS শিক্ষাক্রমCSS স্থানান্তর
HTML DOM পরিচ্ছেদকdisplay প্রতিভূতি
উদাহরণ
প্যারাগ্রাফটির মধ্যে ইনলাইন ফ্রেম তৈরি করুন:
p.inline { display:inline; }
CSS সিনট্যাক্স
display: value;
প্রতিভূতি
মান | বর্ণনা |
---|---|
none | এই উপাদানটি প্রদর্শিত হবে না。 |
block | এই উপাদানটি ব্লক স্টাইল হিসাবে প্রদর্শিত হবে, উপাদানের আগে ও পরে লিন বিভক্তি থাকবে。 |
inline | ডিফল্ট।এই উপাদানটি ইনলাইন উপাদান হিসাবে প্রদর্শিত হবে, উপাদানের আগে ও পরে কোনও লিন বিভক্তি নেই。 |
inline-block | ইনলাইন ব্লক উপাদান।(CSS2.1-এ নতুন মান) |
list-item | এই উপাদান তালিকায় প্রদর্শিত হবে。 |
run-in | এই উপাদান উপরোক্ত কনটেক্স্ট অনুযায়ী ব্লক স্টাইল বা ইনলাইন স্টাইল হিসাবে প্রদর্শিত হবে。 |
compact | CSS-এর মধ্যে একটি নাম আছে compact, কিন্তু ব্যাপক সমর্থনের অভাবের কারণে, তা CSS2.1-এ সরিয়ে দেওয়া হয়েছে。 |
marker | CSS-এর মধ্যে marker এই মান আছে, কিন্তু ব্যাপকভাবে সমর্থনের অভাবের কারণে, তা CSS2.1-এ সরিয়ে দেওয়া হয়েছে。 |
table | এই তত্ত্বকীয় বস্তুটি একটি ব্লক টেবিল হিসাবে দেখানো হবে (অনুরূপ <table>) এবং টেবিলের উপরে ও নীচে নতুন লাইন আছে。 |
inline-table | এই তত্ত্বকীয় বস্তুটি একটি ইনলাইন টেবিল হিসাবে দেখানো হবে (অনুরূপ <table>) এবং টেবিলের উপরে ও নীচে নতুন লাইন নেই。 |
table-row-group | এই তত্ত্বকীয় বস্তুটি একটি সারি গোষ্ঠী হিসাবে দেখানো হবে (অনুরূপ <tbody>) |
table-header-group | এই তত্ত্বকীয় বস্তুটি একটি সারি গোষ্ঠী হিসাবে দেখানো হবে (অনুরূপ <thead>) |
table-footer-group | এই তত্ত্বকীয় বস্তুটি একটি সারি গোষ্ঠী হিসাবে দেখানো হবে (অনুরূপ <tfoot>) |
table-row | এই তত্ত্বকীয় বস্তুটি একটি টেবিল সারি হিসাবে দেখানো হবে (অনুরূপ <tr>) |
table-column-group | এই তত্ত্বকীয় বস্তুটি একটি কলম গোষ্ঠী হিসাবে দেখানো হবে (অনুরূপ <colgroup>) |
table-column | এই তত্ত্বকীয় বস্তুটি একটি সেল কলম হিসাবে দেখানো হবে (অনুরূপ <col>) |
table-cell | এই তত্ত্বকীয় বস্তুটি একটি টেবিল সেল হিসাবে দেখানো হবে (অনুরূপ <td> এবং <th>) |
table-caption | এই তত্ত্বকীয় বস্তুটি একটি টেবিল শিরোনাম হিসাবে দেখানো হবে (অনুরূপ <caption>) |
inherit | উপবিন্যাস হলো পিতৃতত্ত্বকের display প্রতিমানকে উত্তরাধিকার করা হবে。 |
প্রযুক্তিগত বিবরণ
ডিফল্ট মান: | inline |
---|---|
অনুগততা: | no |
সংস্করণ: | CSS1 |
JavaScript গণিত: | object.style.display="inline" |
TIY উদাহরণ
- কিভাবে একটি তত্ত্বকীয় বস্তুকে ইনলাইন বস্তু হিসাবে দেখানো যায়
- এই উদাহরণটি দেখিয়েছে কিভাবে একটি তত্ত্বকীয় বস্তুকে ইনলাইন বস্তু হিসাবে দেখানো যায়。
- কিভাবে একটি তত্ত্বকীয় বস্তুকে ব্লক বস্তু হিসাবে দেখানো যায়
- এই উদাহরণটি দেখিয়েছে কিভাবে একটি তত্ত্বকীয় বস্তুকে ব্লক বস্তু হিসাবে দেখানো যায়。
ব্রাউজার সমর্থন
টেবিলের সংখ্যাগুলি এই প্রতিমানটি যে প্রথম ব্রাউজারে সম্পূর্ণরূপে সমর্থন করে, তা উল্লেখ করা হয়েছে。
Chrome | IE / Edge | Firefox | Safari | Opera |
---|---|---|---|---|
4.0 | 8.0 | 3.0 | 3.1 | 7.0 |
মন্তব্য:যদি !DOCTYPE নির্দিষ্ট করা হয়, তবে ইন্টারনেট এক্সপ্লোরার 8 (এবং উচ্চতর সংস্করণ) "inline-table", "run-in", "table", "table-caption", "table-cell", "table-column", "table-column-group", "table-row", "table-row-group" এবং "inherit" এই প্রতিমানগুলির সমর্থন করে。
- পূর্বপাগল direction
- পরবর্তী পৃষ্ঠা empty-cells