CSS

  • Revision slug: CSS
  • Revision title: CSS
  • Revision id: 515173
  • Created:
  • Creator: Maliha81
  • Is current revision? হ্যাঁ
  • Comment

Revision Content

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

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

সিএসএস রেফারেন্স

ওয়েব ডেভেলপারদের জন্য সিএসএস এর প্রতিটি প্রোপার্টি এবং ধারণা আলোচনা করা হয়েছে আমাদের বিশাল রেফারেন্সে

সিএসএস টিউটোরিয়াল

সম্পূর্ণ নতুনদের জন্য ধারাবাহিক পরিচিতি। এতে সকল প্রয়োজনীয় বিষয়াদি উপস্থাপন করা হয়েছে।

সিএসএস ডেমো

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

সিএসএস সংক্রান্ত ডকুমেন্টেশন এবং টিউটোরিয়াল

সিএসএস মৌলিক ধারণা
Describes the syntax of the language and introduces fundamentals like specificity and inheritance, the box model and margin collapsing, stacking and block-formatting contexts, or the initial, computed, used and actual values. Entities like CSS shorthand properties are also defined.
দ্রুত কার্যকর (এফিশিয়েন্ট) সিএসএস লেখা
Explains how style sheet engines perform selector matching and describes rules for writing more efficient CSS.
CSS transforms
Presents the 2D operations that can be applied to each element in order to rotate, skew, translate it.
CSS transitions
Explains how to change the aspect of an element using a smooth animation between the initial and final state.
CSS animations
Describes how to define animations of an element but also how to detect in Javascript if the browser supports it.
CSS gradients
Explains how to define gradients, images composed of smooth variations of colors.
CSS multi-column layouts
Presents how to make multi-column page settings using the CSS Level 3 multi-column layout.
সিএসএস একাধিক ব্যাকগ্রাউন্ড
Describes how to define several backgrounds on the same element.
ব্যাকগ্রাউন্ড ইমেজ স্কেল করা
Shows how to control background images when the image and the container are not the same size.
সিএসএস মিডিয়া কোয়েরি
Presents how to select style sheets based on details of the rendering device, like its viewport size, its resolution or if it has a touchscreen.
CSS counters
Explains how to use automatic counters and numbering, essentially used as list counters.
ফন্ট ও টাইপোগ্রাফি
Informs about managing your fonts using {{ cssxref("@font-face") }} and the WOFF font format.
CSS flexible boxes
Describes how to use flexible boxes to design layouts.
Consistent List Indentation
Trying to change the indentation of lists with CSS is trickier than it looks, but only because CSS-conformant browsers took different paths to default indentation. Find out how to get them all in line.
Using dynamic styling information
How to obtain information on and manipulate styling via the DOM.

View All...

কমিউনিটি থেকে সাহায্য

আপনার CSS-সংক্রান্ত সাহায্য লাগবে এবং নথিপত্রে তা খুঁজে পাচ্ছেন না?

  • খুঁজুন common CSS questions  CSS জনিত সমস্যা সমাধানের জন্য প্রয়োজনীয় সঙ্কেত দেখুন।
  •  Stack Overflow  তে যান, একটি সহযোগীতায় নির্মিত এবং পরিচালিত প্রশ্নোত্তর সাইট  এবং আপনি আপনার প্রশ্নের উত্তর খুঁঁজুন। যদি খুঁজে না পান তাহলে আপনি আপনার প্রশ্নটি এখানে করতে পারবেন।
  • স্থাপনা কৌশল সংক্রান্ত ফোরামের সাথে সলা-পরামর্শ করুন, যা আছে  CSS and HTM L: {{ DiscussionList("dev-tech-css", "mozilla.dev.tech.layout") }}
    • মোজিলা আই আর সি এর  #css চ্যানেলে আপনার প্রশ্ন করুন।
    • আপনার প্রশ্ন  CSS-Discuss site and list  এর উপরে করুন।

Don't forget about the netiquette...

ডেভেলপমেন্টে সাহায্যকারী টুল

  •  W3C CSS Validation Service প্রদেয় css টি বৈধ কিনা তা পরীক্ষা করে। এটি একটি অমূল্য ডিবাগিং টুল।
  • ফায়ারফক্সের Firebug extension, একটি জনপ্রিয় এক্সটেনশন যা কিনা দৃশ্যমান একটি ওয়েব সাইটের  CSS কে তাৎক্ষণিক ভাবে সম্পাদনা করতে দেয়। Very practical to test some changes, though this extension does much more.
  • Firefox' Web Developer extension also allows to watch and edit live CSS on watched sites. Simpler than Firebug, though less powerful.
  • Firefox' EditCSS extension allows editing CSS in the sidebar.

View All...

 

Revision Source

<p><span class="seoSummary"><strong>Cascading Style Sheets</strong>,&nbsp; <strong>CSS</strong>, মূলত&nbsp; <a href="/en-US/docs/DOM/stylesheet">stylesheet</a> সংক্রান্ত ভাষা&nbsp; যা একটি <a href="/en-US/docs/HTML" title="The HyperText Mark-up Language">HTML</a></span> or <a href="/en-US/docs/XML" title="en-US/docs/XML">XML</a> দিয়ে (অনেক ধরনের XML ভাষা সহ যেমন&nbsp; <a href="/en-US/docs/SVG" title="en-US/docs/SVG">SVG</a> অথবা <a href="/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" href="http://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="/en-US/docs/CSS/CSS3" title="CSS3">CSS3</a>, <span class="short_text" id="result_box" lang="bn" tabindex="-1"><span class="hps">এখন</span> <span class="hps">ছোট</span> <span class="short_text" id="result_box" lang="bn" tabindex="-1"><span class="hps">ছোট</span></span> <span class="hps alt-edited">মডিউলে</span> <span class="hps">বিভক্ত</span></span>, যা প্রমিত রূপ লাভের দিকে অগ্রসর হচ্ছে।</p>
<div style="margin:auto;text-align:center;">
 <div class="callout-box action-driven">
  <div>
   সিএসএস রেফারেন্স</div>
  <p>ওয়েব ডেভেলপারদের জন্য সিএসএস এর প্রতিটি প্রোপার্টি এবং ধারণা আলোচনা করা হয়েছে আমাদের <a href="/en-US/docs/CSS/CSS_Reference" title="en-US/docs/CSS/CSS_Reference">বিশাল রেফারেন্সে</a>।</p>
 </div>
 <div class="callout-box action-driven">
  <div>
   সিএসএস টিউটোরিয়াল</div>
  <p>সম্পূর্ণ নতুনদের জন্য <a href="/en-US/docs/CSS/Getting_Started" title="en-US/docs/CSS/Getting_Started">ধারাবাহিক পরিচিতি</a>। এতে সকল প্রয়োজনীয় বিষয়াদি উপস্থাপন করা হয়েছে।</p>
 </div>
 <div class="callout-box action-driven">
  <div>
   সিএসএস ডেমো</div>
  <p>একটি <a href="/en-US/demos/tag/tech:css3" title="https://developer.mozilla.org/en-US/demos/tag/tech:css3">ডেমোর সংগ্রহ</a> যা সর্বশেষ সিএসএস প্রযুক্তির ক্ষমতা প্রদর্শন করে: সৃজনশীলতা বাড়ানোর জন্য দারুন!</p>
 </div>
</div>
<div class="row topicpage-table">
 <div class="section">
  <h2 class="Documentation" id="Documentation" name="Documentation">সিএসএস সংক্রান্ত ডকুমেন্টেশন এবং টিউটোরিয়াল</h2>
  <dl>
   <dt>
    সিএসএস মৌলিক ধারণা</dt>
   <dd>
    Describes the <a href="/en-US/docs/CSS/Syntax" title="/en-US/docs/CSS/Syntax">syntax of the language</a> and introduces fundamentals like <a href="/en-US/docs/CSS/Specificity" title="Specificity">specificity</a> and <a href="/en-US/docs/CSS/inheritance" title="inheritance">inheritance</a>, the <a href="/en-US/docs/CSS/box_model" title="Box model">box model</a> and <a href="/en-US/docs/CSS/margin_collapsing" title="Margin collapsing">margin collapsing</a>, <a href="/en-US/docs/CSS/Understanding_z-index/The_stacking_context" title="The stacking context">stacking</a> and <a href="/en-US/docs/CSS/block_formatting_context" title="block formatting context">block-formatting</a> contexts, or the <a href="/en-US/docs/CSS/initial_value" title="initial value">initial</a>, <a href="/en-US/docs/CSS/computed_value" title="computed value">computed</a>, <a href="/en-US/docs/CSS/used_value" title="used value">used</a> and <a href="/en-US/docs/CSS/actual_value" title="actual value">actual</a> values. Entities like <a href="/en-US/docs/CSS/Shorthand_properties" title="CSS/Shorthand_properties">CSS shorthand properties</a> are also defined.</dd>
   <dt>
    <a href="/en-US/docs/CSS/Writing_Efficient_CSS" title="CSS/Writing_Efficient_CSS">দ্রুত কার্যকর (এফিশিয়েন্ট) সিএসএস লেখা</a></dt>
   <dd>
    Explains how style sheet engines perform selector matching and describes rules for writing more efficient CSS.</dd>
   <dt>
    <a href="/en-US/docs/CSS/Tutorials/Using_CSS_transforms" title="How to use CSS3 Transforms (2D and 3D)">CSS transforms</a></dt>
   <dd>
    Presents the 2D operations that can be applied to each element in order to rotate, skew, translate it.</dd>
   <dt>
    <a href="/en-US/docs/CSS/Tutorials/Using_CSS_transitions" title="How to use a CSS transition">CSS transitions</a></dt>
   <dd>
    Explains how to change the aspect of an element using a smooth animation between the initial and final state.</dd>
   <dt>
    <a href="/en-US/docs/CSS/Tutorials/Using_CSS_animations" title="How to use a CSS animation">CSS animations</a></dt>
   <dd>
    Describes how to define animations of an element but also how to <a href="/en-US/docs/CSS/CSS_animations/Detecting_CSS_animation_support" title="https://developer.mozilla.org/en-US/docs/CSS/CSS_animations/Detecting_CSS_animation_support">detect</a> in Javascript if the browser supports it.</dd>
   <dt>
    <a href="/en-US/docs/CSS/Using_CSS_gradients" title="How to use CSS3 Gradients">CSS gradients</a></dt>
   <dd>
    Explains how to define gradients, images composed of smooth variations of colors.</dd>
   <dt>
    <a href="/en-US/docs/CSS/Using_CSS_multi-column_layouts" title="How to use CSS3 Multicol layout">CSS multi-column layouts</a></dt>
   <dd>
    Presents how to make multi-column page settings using the CSS Level 3 multi-column layout.</dd>
   <dt>
    <a href="/en-US/docs/CSS/Multiple_backgrounds" title="How to use the CSS3 multiple background feature">সিএসএস একাধিক ব্যাকগ্রাউন্ড</a></dt>
   <dd>
    Describes how to define several backgrounds on the same element.</dd>
   <dt>
    <a href="/en-US/docs/CSS/Scaling_background_images" title="CSS/Scaling_background_images">ব্যাকগ্রাউন্ড ইমেজ স্কেল করা</a></dt>
   <dd>
    Shows how to control background images when the image and the container are not the same size.</dd>
   <dt>
    <a class="internal" href="/en-US/docs/CSS/Media_queries" title="How to use CSS3 Media Queries">সিএসএস মিডিয়া কোয়েরি</a></dt>
   <dd>
    Presents how to select style sheets based on details of the rendering device, like its viewport size, its resolution or if it has a touchscreen.</dd>
   <dt>
    <a href="/en-US/docs/CSS_Counters" title="CSS Counters">CSS counters</a></dt>
   <dd>
    Explains how to use automatic counters and numbering, essentially used as list counters.</dd>
   <dt>
    ফন্ট ও টাইপোগ্রাফি</dt>
   <dd>
    Informs about managing your <a href="/en-US/docs/CSS/font" title="font">fonts</a> using {{ cssxref("@font-face") }} and the <a href="/en-US/docs/WOFF" title="About_WOFF">WOFF font</a> format.</dd>
   <dt>
    <a href="/en-US/docs/CSS/Using_CSS_flexible_boxes" title="Using CSS flexible boxes">CSS flexible boxes</a></dt>
   <dd>
    Describes how to use flexible boxes to design layouts.</dd>
   <dt>
    <a href="/en-US/docs/Consistent_List_Indentation" title="Consistent_List_Indentation">Consistent List Indentation</a></dt>
   <dd>
    Trying to change the indentation of lists with CSS is trickier than it looks, but only because CSS-conformant browsers took different paths to default indentation. Find out how to get them all in line.</dd>
   <dt>
    <a href="/en-US/docs/DOM/Using_dynamic_styling_information" title="DOM/Using_dynamic_styling_information">Using dynamic styling information</a></dt>
   <dd>
    How to obtain information on and manipulate styling via the DOM.</dd>
  </dl>
  <p><span class="alllinks"><a href="/en-US/docs/tag/CSS" title="/en-US/docs/tag/CSS">View All...</a></span></p>
 </div>
 <div class="section">
  <h2 class="Community" id="Community" name="Community">কমিউনিটি থেকে সাহায্য</h2>
  <p>আপনার CSS-সংক্রান্ত সাহায্য লাগবে এবং নথিপত্রে তা খুঁজে পাচ্ছেন না?</p>
  <ul>
   <li>খুঁজুন <a href="/en-US/docs/CSS/Common_CSS_Questions" title="en-US/docs/CSS/Common_CSS_Questions">common CSS questions</a>&nbsp; CSS জনিত সমস্যা সমাধানের জন্য প্রয়োজনীয় <span class="short_text" id="result_box" lang="bn" tabindex="-1"><span class="hps alt-edited">সঙ্কেত দেখুন।</span></span></li>
   <li>&nbsp;<a href="http://stackoverflow.com/questions/tagged/css" title="http://stackoverflow.com/questions/tagged/css">Stack Overflow</a>&nbsp; তে যান, একটি <span class="short_text" id="result_box" lang="bn" tabindex="-1"><span class="hps alt-edited">সহযোগীতায়</span> <span class="hps">নির্মিত</span></span> এবং পরিচালিত প্রশ্নোত্তর সাইট&nbsp; এবং আপনি আপনার প্রশ্নের উত্তর খুঁঁজুন। যদি খুঁজে না পান তাহলে আপনি আপনার প্রশ্নটি এখানে করতে পারবেন।</li>
   <li>স্থাপনা কৌশল সংক্রান্ত ফোরামের সাথে সলা-পরামর্শ করুন, যা আছে&nbsp; CSS and HTM L: {{ DiscussionList("dev-tech-css", "mozilla.dev.tech.layout") }}
    <ul>
     <li>মোজিলা আই আর সি এর&nbsp; <a class="link-irc" href="irc://irc.mozilla.org/css">#css</a> চ্যানেলে আপনার প্রশ্ন করুন।</li>
     <li>আপনার প্রশ্ন&nbsp; <a class="external" href="http://www.css-discuss.org/">CSS-Discuss site and list&nbsp; </a>এর উপরে করুন।</li>
    </ul>
   </li>
  </ul>
  <p><span class="alllinks"><a class="external" href="http://www.catb.org/~esr/faqs/smart-questions.html" title="http://www.catb.org/~esr/faqs/smart-questions.html">Don't forget about the <em>netiquette</em>...</a></span></p>
  <h2 class="Tools" id="Tools" name="Tools">ডেভেলপমেন্টে সাহায্যকারী টুল</h2>
  <ul>
   <li><span class="external">&nbsp;</span><a class="external" href="http://jigsaw.w3.org/css-validator/">W3C CSS Validation Service</a> প্রদেয় css টি বৈধ কিনা তা পরীক্ষা করে। <span class="short_text" id="result_box" lang="bn"><span class="hps">এটি</span> <span class="hps">একটি অমূল্য</span> <span class="hps">ডিবাগিং</span> <span class="hps">টুল। </span></span></li>
   <li>ফায়ারফক্সের <a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/1843">Firebug extension</a><span class="external">, একটি জনপ্রিয় এক্সটেনশন যা কিনা দৃশ্যমান একটি ওয়েব সাইটের&nbsp;</span> CSS কে তাৎক্ষণিক ভাবে <span class="short_text" id="result_box" lang="bn"><span class="hps alt-edited">সম্পাদনা করতে দেয়।</span></span> Very practical to test some changes, though this extension does much more.</li>
   <li><span class="external">Firefox' </span><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/60">Web Developer extension</a> also allows to watch and edit live CSS on watched sites. Simpler than Firebug, though less powerful.</li>
   <li>Firefox' <a class="external link-https" href="https://addons.mozilla.org/en-US/firefox/addon/179">EditCSS extension</a> allows editing CSS in the sidebar.</li>
  </ul>
  <p><span class="alllinks"><a href="/en-US/docs/tag/CSS:Tools" title="/en-US/docs/tag/CSS:Tools">View All...</a></span></p>
  <h2 class="Related_Topics" id="Related_Topics" name="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>
<p>&nbsp;</p>
Revert to this revision