Revision 565373 of CSS

Revision slug: CSS
Revision title: CSS
Revision id: 565373
তৈরি হয়েছেঃ Apr 23, 2014, 12:33:55 AM
তৈরিকারীঃ badsha_eee
Is current revision? না
মন্তব্য

ট্যাগ:

Revision Content

Cascading Style Sheets, CSS, মূলত stylesheet সংক্রান্ত ভাষা যা একটি HTML or XML দিয়ে (অনেক ধরনের XML ভাষা সহ যেমন SVG অথবা XHTML) লেখা নথির উপস্থাপনায় বাবহারিত হয়ে থাকে । CSS গঠনকৃত উপাদান গুলো পর্দায় , কাগজে, বক্তব্য বা অন্য কোন মাধ্যমে কিভাবে উপস্থাপিত হবে তা ব্যাখ্যা করে থাকে।

CSS মুক্ত ওয়েবের একটি কেন্দ্রীয় ভাষা এবং এর প্রমিত W3C specification আছে। ধাপে ধাপে বিকশিত হবার কারণে, CSS1 বর্তমানে অপ্রচলিত , CSS2.1 একটি পরামর্শ স্বরূপ হয়ে গিয়েছে এবং CSS3, এখন ছোট ছোট মডিউলে বিভক্ত, যা প্রমিত রূপ লাভের দিকে অগ্রসর হচ্ছে।

সিএসএস রেফারেন্স
ওয়েব ডেভেলপারদের জন্য সিএসএস এর প্রতিটি প্রোপার্টি এবং ধারণা আলোচনা করা হয়েছে আমাদের বিশাল রেফারেন্সে।
সিএসএস টিউটোরিয়াল
সম্পূর্ণ নতুনদের জন্য ধারাবাহিক পরিচিতি। এতে সকল প্রয়োজনীয় বিষয়াদি উপস্থাপন করা হয়েছে।
সিএসএস ডেমো

একটি ডেমোর সংগ্রহ যা সর্বশেষ সিএসএস প্রযুক্তির ক্ষমতা প্রদর্শন করে: সৃজনশীলতা বাড়ানোর জন্য দারুন!

ডকুমেন্টেশন এবং টিউটোরিয়াল

সিএসএস এর মৌলিক ধারনা: এখানে সিনট্যাক্স ও ভাষার ধরন এবং স্পেসিফিসিটি, ইনহেরিট্যান্স, বক্স মডেল, মার্জিন কোলাপসিং, স্ট্যাকিং, ব্লক-ফরম্যাটিং এর ধারনা, বা প্রাথমিক, কম্পিউটকৃত, ব্যবহারকৃত ও আসল মানের সাথে পরিচিত করা হয়েছে। সিএসএস শর্টহ্যান্ড প্রপার্টি সমূহও এখানে বর্ণনা করা হয়েছে।
সিএসএস ডেভেলপার গাইড: আপনার কন্টেন্টকে আরও আকর্ষণীয় করে দেখানোর জন্য যেসব সিএসএস কৌশল সমূহ আপনার অবশ্যই শেখা দরকার, এখানে সেগুলো বর্ণনা করা হয়েছে।
সাধারন সিএসএস জিজ্ঞাসা: সিএসএস নিয়ে সাধারণত জিজ্ঞাসিত প্রশ্ন ও তার উত্তর এই নিবন্ধে দেয়া হয়েছে।

সিএসএস এর জন্য টুল সমূহ

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

খবর

সিএসএস টেক্সট-ডেকোরেশন লেভেল ৩ Candidate Recommandation অবস্থায় পৌছেছে। এর অর্থ হচ্ছে text-decoration-* ও text-emphasis-* প্রপার্টি দুটো খুব দ্রুত ব্যবহারোপযোগী হবে। আমাদের অনেক পরিচিত {{cssxref("text-shadow")}}ও এখানে বর্ণনা করা হয়েছে। (১লা আগস্ট, ২০১৩)
Gecko's now support {{cssxref("background-origin")}}: local. It will be available from Firefox 25 (and already is in Nightly). (July 25th, 2013)
Pointer Events reached the Candidate Recommandation status, meaning that the CSS property touch-action, currently only implemented in IE10 (with the -ms- prefix), is no more experimental. (May 6th, 2013)
Gecko's support of flexible boxes has been adapted to match a recent specification clarification: from Firefox 23 {{cssxref("::before")}} and {{cssxref("::after")}} will be flex items, and as such can be repositioned using {{cssxref("order")}} and {{cssxref("align-self")}}. (May 3rd, 2013)

Revision Source

<p><span class="seoSummary"><strong>Cascading Style Sheets</strong>,&nbsp; <strong>CSS</strong>, মূলত&nbsp; <a href="https://developer.mozilla.org/en-US/docs/DOM/stylesheet">stylesheet</a> সংক্রান্ত ভাষা&nbsp; যা একটি <a href="https://developer.mozilla.org/en-US/docs/HTML" title="The HyperText Mark-up Language">HTML</a></span> or <a href="https://developer.mozilla.org/en-US/docs/XML" title="en-US/docs/XML">XML</a> দিয়ে (অনেক ধরনের XML ভাষা সহ যেমন&nbsp; <a href="https://developer.mozilla.org/en-US/docs/SVG" title="en-US/docs/SVG">SVG</a> অথবা <a href="https://developer.mozilla.org/en-US/docs/XHTML" title="en-US/docs/XHTML">XHTML</a>) লেখা নথির উপস্থাপনায় বাবহারিত হয়ে থাকে ।<span class="seoSummary"> CSS </span>গঠনকৃত উপাদান গুলো পর্দায় , কাগজে, <span class="short_text" id="result_box" lang="bn"><span class="hps alt-edited">বক্তব্য বা অন্য কোন মাধ্যমে&nbsp;</span></span> কিভাবে <span class="short_text" id="result_box" lang="bn"><span class="hps alt-edited">উপস্থাপিত হবে তা ব্যাখ্যা করে থাকে।</span></span></p>
<p>CSS মুক্ত ওয়েবের একটি কেন্দ্রীয় ভাষা এবং এর <span class="short_text" id="result_box" lang="bn"><span class="hps">প্রমিত</span></span>&nbsp; <a class="external external-icon" href="https://w3.org/Style/CSS/#specs">W3C specification</a>&nbsp; আছে। ধাপে ধাপে <span class="short_text" id="result_box" lang="bn"><span class="hps alt-edited">বিকশিত হবার কারণে</span></span>, CSS1 বর্তমানে অপ্রচলিত , CSS2.1 একটি পরামর্শ স্বরূপ হয়ে গিয়েছে এবং <a href="https://developer.mozilla.org/en-US/docs/CSS/CSS3" title="CSS3">CSS3</a>, <span class="short_text" id="result_box" lang="bn"><span class="hps">এখন</span> <span class="hps">ছোট</span> <span class="short_text" id="result_box" lang="bn"><span class="hps">ছোট</span></span> <span class="hps alt-edited">মডিউলে</span> <span class="hps">বিভক্ত</span></span>, যা প্রমিত রূপ লাভের দিকে অগ্রসর হচ্ছে।</p>
<section id="sect1">
 <ul class="card-grid">
  <li><span>সিএসএস রেফারেন্স</span>
   <p>ওয়েব ডেভেলপারদের জন্য সিএসএস এর প্রতিটি প্রোপার্টি এবং ধারণা আলোচনা করা হয়েছে আমাদের <a href="https://developer.mozilla.org/en-US/docs/CSS/CSS_Reference" title="en-US/docs/CSS/CSS_Reference">বিশাল রেফারেন্সে</a>।</p>
  </li>
  <li><span>সিএসএস টিউটোরিয়াল</span>
   <p>সম্পূর্ণ নতুনদের জন্য <a href="https://developer.mozilla.org/en-US/docs/CSS/Getting_Started" title="en-US/docs/CSS/Getting_Started">ধারাবাহিক পরিচিতি</a>। এতে সকল প্রয়োজনীয় বিষয়াদি উপস্থাপন করা হয়েছে।</p>
  </li>
  <li><strong>সিএসএস ডেমো</strong><br />
   <p>একটি <a href="https://developer.mozilla.org/en-US/demos/tag/tech:css3" title="https://developer.mozilla.org/en-US/demos/tag/tech:css3">ডেমোর সংগ্রহ</a> যা সর্বশেষ সিএসএস প্রযুক্তির ক্ষমতা প্রদর্শন করে: সৃজনশীলতা বাড়ানোর জন্য দারুন!</p>
  </li>
 </ul>
 <div class="row topicpage-table">
  <div class="section">
   <h2 class="Documentation" id="Documentation" name="Documentation">ডকুমেন্টেশন এবং টিউটোরিয়াল</h2>
   <dl>
    <dt>
     সিএসএস এর মৌলিক ধারনা</dt>
    <dd>
     এখানে <a href="/en-US/docs/CSS/Syntax" title="/en-US/docs/CSS/Syntax">সিনট্যাক্স ও ভাষার ধরন</a> এবং <a href="/en-US/docs/CSS/Specificity" title="Specificity">স্পেসিফিসিটি</a>, <a href="/en-US/docs/CSS/inheritance" title="inheritance">ইনহেরিট্যান্স</a>, <a href="/en-US/docs/CSS/box_model" title="Box model">বক্স মডেল</a>, <a href="/en-US/docs/CSS/margin_collapsing" title="Margin collapsing">মার্জিন কোলাপসিং</a>, <a href="/en-US/docs/CSS/Understanding_z-index/The_stacking_context" title="The stacking context">স্ট্যাকিং</a>, <a href="/en-US/docs/CSS/block_formatting_context" title="block formatting context">ব্লক-ফরম্যাটিং</a> এর ধারনা, বা <a href="/en-US/docs/CSS/initial_value" title="initial value">প্রাথমিক</a>, <a href="/en-US/docs/CSS/computed_value" title="computed value">কম্পিউটকৃত</a>, <a href="/en-US/docs/CSS/used_value" title="used value">ব্যবহারকৃত </a>ও <a href="/en-US/docs/CSS/actual_value" title="actual value">আসল</a> মানের সাথে পরিচিত করা হয়েছে। <a href="/en-US/docs/CSS/Shorthand_properties" title="CSS/Shorthand_properties">সিএসএস শর্টহ্যান্ড প্রপার্টি সমূহও</a> এখানে বর্ণনা করা হয়েছে।</dd>
    <dt>
     <a href="/en-US/docs/Web/Guide/CSS" title="/en-US/docs/Web/Guide/CSS">সিএসএস ডেভেলপার গাইড</a></dt>
    <dd>
     আপনার কন্টেন্টকে আরও আকর্ষণীয় করে দেখানোর জন্য যেসব সিএসএস কৌশল সমূহ আপনার অবশ্যই শেখা দরকার, এখানে সেগুলো বর্ণনা করা হয়েছে।</dd>
    <dt>
     <a href="/en-US/docs/Web/CSS/Common_CSS_Questions">সাধারন সিএসএস জিজ্ঞাসা</a></dt>
    <dd>
     সিএসএস নিয়ে সাধারণত জিজ্ঞাসিত প্রশ্ন ও তার উত্তর এই নিবন্ধে দেয়া হয়েছে।</dd>
   </dl>
   <h2 class="Tools" id="Tools" name="Tools">সিএসএস এর জন্য টুল সমূহ</h2>
   <ul>
    <li><a class="external" href="https://jigsaw.w3.org/css-validator/">W3C এর সিএসএস ভ্যালিডেশন সেবা</a> পরীক্ষা করে দেখে যে যেই সিএসএস টি দেয়া হয়েছে, সেটি ঠিকঠাক আছে কি না বা সিএসএস এর মধ্যে কোন ভুল আছে কি না। এটি একটি অমূল্য ডিবাগিং টুল।</li>
    <li>ফায়ারফক্সের <a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/1843">ফায়ারবাগ এক্সটেনশন</a><span class="external">, ডেভেলপারদের কাছে একটি জনপ্রিয় এক্সটেনশন বা টুল। এটি ব্যবহার করে আপনি একটি পাতার এইচটিএমএল, সিএসএস ও জাভাস্ক্রিপ্ট ব্রাউজারের মধ্যেই অনেক সহজে সম্পাদনা করতে পারবেন।</span></li>
    <li><span class="external">ফায়ারফক্সের </span><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/60">ওয়েব ডেভেলপার এক্সটেনশন</a>ও লাইভ সাইট সম্পাদনা করার সুবিধা দেয়। এটা সিম্পল কিন্তু ফায়ারবাগের চেয়ে একটু কম সুবিধা দেয়।</li>
    <li>ফায়ারফক্সের <a class="external link-https" href="https://addons.mozilla.org/en-US/firefox/addon/179">এডিট সিএসএস এক্সটেনশন</a> সাইডবারে সিএসএস এডিট করার সুবিধা প্রদান করে।</li>
   </ul>
  </div>
  <div class="section">
   <h2 class="Related_Topics" id="News" name="News">খবর</h2>
   <ul>
    <li><a href="https://www.w3.org/TR/css-text-decor-3/" title="https://www.w3.org/TR/css-text-decor-3/">সিএসএস টেক্সট-ডেকোরেশন লেভেল ৩</a> <em>Candidate Recommandation</em> অবস্থায় পৌছেছে। এর অর্থ হচ্ছে <code>text-decoration-*</code> ও <code>text-emphasis-*</code> প্রপার্টি দুটো খুব দ্রুত ব্যবহারোপযোগী হবে। আমাদের অনেক পরিচিত {{cssxref("text-shadow")}}ও এখানে বর্ণনা করা হয়েছে। (১লা আগস্ট<em>, ২০১৩)</em></li>
    <li>Gecko's now support {{cssxref("background-origin")}}<code>: local</code>. It will be available from Firefox 25 (and already is in Nightly). <em>(July 25th, 2013)</em></li>
    <li><a href="https://www.w3.org/TR/pointerevents/" title="https://www.w3.org/TR/pointerevents/">Pointer Events</a> reached the <em>Candidate Recommandation</em> status, meaning that the CSS property <code>touch-action</code>, currently only implemented in IE10 (with the <code>-ms-</code> prefix), is no more experimental. <em>(May 6th, 2013)</em></li>
    <li>Gecko's support of <a href="/en-US/docs/CSS/Tutorials/Using_CSS_flexible_boxes" title="/en-US/docs/CSS/Tutorials/Using_CSS_flexible_boxes"><em>flexible boxes</em></a> has been adapted to match a recent specification clarification: from Firefox 23 {{cssxref("::before")}} and {{cssxref("::after")}} will be flex items, and as such can be repositioned using {{cssxref("order")}} and {{cssxref("align-self")}}. <em>(May 3rd, 2013)</em></li>
   </ul>
   <h2 class="Related_Topics" id="Related_Topics" name="Related_Topics">Related Topics</h2>
   <ul>
    <li>Mozilla Learn <a href="/en-US/learn/css" title="https://developer.mozilla.org/en-US/learn/css">CSS resources</a>.</li>
    <li>Open Web languages on which CSS is often applied: <a href="/en-US/docs/HTML" title="en-US/docs/HTML">HTML</a>, <a href="/en-US/docs/SVG" title="SVG">SVG</a>, <a href="/en-US/docs/XHTML" title="en-US/docs/XHTML">XHTML</a>, <a href="/en-US/docs/XML" title="en-US/docs/XML">XML</a>.</li>
    <li>Mozilla technologies which make extensive use of CSS: <a href="/en-US/docs/XUL" title="en-US/docs/XUL">XUL</a>, Firefox and Thunderbird <a href="/en-US/docs/Extensions" title="en-US/docs/Extensions">extensions</a> and <a href="/en-US/docs/Themes" title="en-US/docs/Themes">themes</a>.</li>
   </ul>
  </div>
 </div>
</section>
<p>{{CommunityBox("Web layout", "dev-tech-layout", "mozilla.dev.tech.layout", "", "Stack Overflow|https://stackoverflow.com/questions/tagged/css|HTML topics|Visit Stack Overflow, a collaboratively built and maintained Q&amp;A site. See if you can find an answer; if not, you can ask your question there.||CSS-Discuss|https://www.css-discuss.org/|CSS-Discuss mailing list|Join the css-discuss mailing list, which is dedicated to discussing practical, real-world use of CSS.")}}</p>

আগের রিভিসনে ফিরে যান