diff options
Diffstat (limited to 'files/bn/web/guide')
-rw-r--r-- | files/bn/web/guide/api/dom/index.html | 21 | ||||
-rw-r--r-- | files/bn/web/guide/api/index.html | 25 | ||||
-rw-r--r-- | files/bn/web/guide/api/webrtc/index.html | 39 | ||||
-rw-r--r-- | files/bn/web/guide/events/index.html | 37 | ||||
-rw-r--r-- | files/bn/web/guide/html/canvas_tutorial/index.html | 47 | ||||
-rw-r--r-- | files/bn/web/guide/html/content_editable/index.html | 44 | ||||
-rw-r--r-- | files/bn/web/guide/html/forms/index.html | 342 | ||||
-rw-r--r-- | files/bn/web/guide/index.html | 20 | ||||
-rw-r--r-- | files/bn/web/guide/performance/index.html | 9 | ||||
-rw-r--r-- | files/bn/web/guide/গ্রাফিক্স/index.html | 53 |
10 files changed, 637 insertions, 0 deletions
diff --git a/files/bn/web/guide/api/dom/index.html b/files/bn/web/guide/api/dom/index.html new file mode 100644 index 0000000000..d5171efe4e --- /dev/null +++ b/files/bn/web/guide/api/dom/index.html @@ -0,0 +1,21 @@ +--- +title: DOM developer guide +slug: Web/Guide/API/DOM +tags: + - API + - DOM + - Guide + - NeedsTranslation + - TopicStub +translation_of: Web/API/Document_Object_Model +--- +<p>{{draft}}</p> +<p>The <a href="/docs/DOM">Document Object Model</a> is an API for <a href="/en-US/docs/HTML">HTML</a> and <a href="/en-US/docs/XML">XML</a> documents. It provides a structural representation of the document, enabling the developer to modify its content and visual presentation. Essentially, it connects web pages to scripts or programming languages.</p> +<p>All of the properties, methods, and events available to the web developer for manipulating and creating web pages are organized into <a href="/en-US/docs/Gecko_DOM_Reference">objects</a> (e.g., the document object that represents the document itself, the table object that represents a HTML table element, and so forth). Those objects are accessible via scripting languages in most recent web browsers.</p> +<p>The DOM is most often used in conjunction with <a href="/en-US/docs/JavaScript">JavaScript</a>. However, the DOM was designed to be independent of any particular programming language, making the structural representation of the document available from <a href="/en-US/docs/DOM/DOM_Reference" title="/en-US/docs/DOM/DOM_Reference">a single, consistent API</a>. Though we focus on JavaScript throughout this site, implementations of the DOM can be built for <a href="http://www.w3.org/DOM/Bindings">any language</a>.</p> +<p>The <a href="http://www.w3.org/">World Wide Web Consortium</a> establishes a <a href="http://www.w3.org/DOM/">standard for the DOM</a>, called the W3C DOM. It should, now that the most important browsers correctly implement it, enable powerful cross-browser applications.</p> +<h2 id="Why_is_the_DOM_support_in_Mozilla_important.3F" name="Why_is_the_DOM_support_in_Mozilla_important.3F">Why is the DOM important?</h2> +<p>"Dynamic HTML" (<a href="/en-US/docs/DHTML">DHTML</a>) is a term used by some vendors to describe the combination of HTML, style sheets and scripts that allows documents to be animated. The W3C DOM Working Group is working hard to make sure interoperable and language-neutral solutions are agreed upon (see also the <a href="http://www.w3.org/DOM/faq.html">W3C FAQ</a>).</p> +<p>As Mozilla claims the title of "Web Application Platform", support for the DOM is one of the most requested features, and a necessary one if Mozilla wants to be a viable alternative to the other browsers. The user interface of Mozilla (also Firefox and Thunderbird) is built using <a href="/en-US/docs/XUL" title="/en-US/docs/XUL">XUL</a>, using the DOM to <a href="/en-US/docs/Dynamically_modifying_XUL-based_user_interface">manipulate its own UI</a>.</p> +<h2 id="More_about_the_DOM">More about the DOM</h2> +<p>{{LandingPageListSubpages}}</p> diff --git a/files/bn/web/guide/api/index.html b/files/bn/web/guide/api/index.html new file mode 100644 index 0000000000..743350c37b --- /dev/null +++ b/files/bn/web/guide/api/index.html @@ -0,0 +1,25 @@ +--- +title: Guide to Web APIs +slug: Web/Guide/API +tags: + - API + - Guide + - Landing + - NeedsTranslation + - TopicStub + - Web +translation_of: Web/Guide/API +--- +<p>এখানে আপনি ওয়েব ডেভেলপমেন্ট আর্কিটেকচার যেসকল এপিআই এর ভিত্তিপ্রস্তরের উপর দাঁড়িয়ে আছে, তার সম্পর্কে ধারণা পেতে কিছু আর্টিকেলের লিংক এখানে পাবেন।</p> +<h2 id="Web_APIs_from_A_to_Z">Web APIs from A to Z</h2> + +<p>{{ListGroups}}</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li><a href="/en-US/docs/Web/API">Web API interface reference</a> (an index of all of the interfaces comprising all of these APIs)</li> + <li><a href="/en-US/docs/Web/API/Document_Object_Model">Document Object Model</a> (DOM)</li> + <li><a href="/en-US/docs/Web/Events">Web API event reference</a></li> + <li><a href="/en-US/docs/Learn">Learning web development</a></li> +</ul> diff --git a/files/bn/web/guide/api/webrtc/index.html b/files/bn/web/guide/api/webrtc/index.html new file mode 100644 index 0000000000..c4dbedf65c --- /dev/null +++ b/files/bn/web/guide/api/webrtc/index.html @@ -0,0 +1,39 @@ +--- +title: ওয়েব আরটিসি (WebRTC) +slug: Web/Guide/API/WebRTC +tags: + - এপিআই + - ওয়েব আরটিসি + - পরিচিতি + - ল্যান্ডিং +translation_of: Web/API/WebRTC_API +--- +<p><strong>WebRTC</strong> (যেখানে RTC এর পূর্ণরুপ Real-Time Communications) হল একটি প্রযুক্তি যা একাধিক ব্রাউজারের মধ্যে ব্রাউজার-ব্রাউজার অডিও/ভিডিও স্ট্রিমিং কিংবা ডাটা শেয়ারিং সুবিধা প্রদান করে থাকে। WebRTC এর সাহায্যে কোনরূপ প্লাগ-ইন বা এক্সটেনশন ব্যবহার ছাড়াই স্ট্যান্ডার্ড ওয়েব এপিআই এর সাহায্যে টেলিকনফারেন্সিং কিংবা ডাটা শেয়ারিং সম্ভব।</p> + +<p>WebRTC এর অংশগুলোকে জাভাস্ক্রিপ্ট এপিআই এর সাহায্য ব্যবহার করা যায়: Network Stream API একটি অডিও/ভিডিও স্ট্রিম নির্দেশ করে, PeerConnection API এর সাহায্য দুই বা ততোধিক ব্রাউজারের মধ্যে সংযোগ স্থাপন করা যায়, এবং DataChannel API এর সাহায্য অডিও/ভিডিও ব্যতীত অন্যান্য ধরণের ডাটা আদানপ্রদান করা যায় - যা গেমিং, চ্যাট কিংবা ফাইল ট্রান্সফারের জন্য অসাধারণ!</p> + +<div class="note"> +<p><span style="color: #000000;"><strong>উল্লেখ্য:</strong> এই ডকুমেন্টেশন <a href="/bn-BD/docs/Web/API/WebRTC_API">নতুন যায়গায়</a> চলে যাচ্ছে। </span></p> +</div> + +<h2 id="গাইড">গাইড</h2> + +<dl> + <dt><a href="/bn-BD/docs/WebRTC/Peer-to-peer_communications_with_WebRTC" title="/bn-BD/docs/WebRTC/Peer-to-peer_communications_with_WebRTC">WebRTC এর সাহায্যে পিয়ার-টু-পিয়ার যোগাযোগ</a></dt> + <dd>ওয়েবআরটিসি এপিআই এর সাহায্যে পিয়ার টু পিয়ার যোগাযোগ করা।</dd> + <dt><a href="/bn-BD/docs/Web/Guide/API/WebRTC/WebRTC_architecture" title="/bn-BD/docs/Web/Guide/API/WebRTC/WebRTC_architecture">WebRTC এর আর্কিটেকচার পরিচিতি</a></dt> + <dd>WebRTC এর অনেকগুলো আলাদা আলাদা অংশ রয়েছে যা নবাগতদের জন্য প্রচণ্ড বিভ্রান্তকর। এই আর্টিকেলে এইসকল অংশগুলোর পরিচয় দিয়ে, তারা কিভাবে একত্রে কাজ করে - সে সম্পর্কে ধারণা দেওয়া হয়েছে।</dd> + <dt><a href="/bn-BD/docs/Web/Guide/API/WebRTC/WebRTC_basics" title="/bn-BD/docs/Web/Guide/API/WebRTC/WebRTC_basics">WebRTC এর সাধারণ বিষয়াবলী</a></dt> + <dd>Now you understand the WebRTC architecture, you can move on to this article, which takes you through the creation of a basic cross-browser RTC App.</dd> +</dl> + +<h2 id="রেফারেন্স">রেফারেন্স</h2> + +<dl> + <dt><a href="/bn-BD/docs/Web/API/Navigator.getUserMedia">Navigator.getUserMedia</a></dt> + <dd>মিডিয়া (ভিডিও/অডিও) ক্যাপচার করার এপিআই।</dd> + <dt><a href="/bn-BD/docs/Web/API/RTCPeerConnection"><span style="color: #0095dd;">RTCPeerConnection</span></a></dt> + <dd>দুইটি পিয়ারের মধ্যে ডাটা স্ট্রিমিং করার ইন্টারফেস।</dd> + <dt><a href="/bn-BD/docs/Web/API/RTCDataChannel">RTCDataChannel</a></dt> + <dd>পিয়ার কানেকশনের মধ্যে দিয়ে ডাটা (মিডিয়া নয় এমন) পাঠানোর ইন্টারফেস।</dd> +</dl> diff --git a/files/bn/web/guide/events/index.html b/files/bn/web/guide/events/index.html new file mode 100644 index 0000000000..02a20ce36e --- /dev/null +++ b/files/bn/web/guide/events/index.html @@ -0,0 +1,37 @@ +--- +title: Event developer guide +slug: Web/Guide/Events +tags: + - DOM + - Event + - Guide + - NeedsTranslation + - NeedsUpdate + - TopicStub + - events +translation_of: Web/Guide/Events +--- +<p>{{draft()}}</p> +<p>Events refers both to a design pattern used for the asynchronous handling of various incidents which occur in the lifetime of a web page and to the naming, characterization, and use of a large number of incidents of different types.</p> +<p>The <a href="/en-US/docs/Web/Guide/API/DOM/Events/Overview_of_Events_and_Handlers">overview page</a> provides an introduction to the design pattern and a summary of the types of incidents which are defined and reacted to by modern web browsers.</p> +<p>The <a href="/en-US/docs/Web/Guide/API/DOM/Events/Creating_and_triggering_events">custom events page</a> describes how the event code design pattern can be used in custom code to define new event types emitted by user objects, register listener functions to handle those events, and trigger the events in user code.</p> +<p>The remaining pages describe how to use events of different kinds defined by web browsers. Unfortunately, these events have been defined piece by piece as web browsers have evolved so that there is no satisfying systematic characterization of the events built-in or defined by modern web browsers.</p> +<p>The <strong>device</strong> on which the web browser is running can trigger events, for example due to a change in its position and orientation in the real world, as discussed partially by the <a href="/en-US/docs/Web/Guide/API/DOM/Events/Orientation_and_motion_data_explained">page on orientation coordinate systems</a> and the <a href="/en-US/docs/Web/Guide/API/DOM/Events/Using_device_orientation_with_3D_transforms">page on the use of 3D transforms</a>. That is different, but similar, to the change in device vertical orientation. </p> +<p>The <strong>window</strong> in which the browser is displayed which might trigger events, for example, change size if the user maximizes the window or otherwise changes it.</p> +<p>The <strong>process</strong> loading of a web page might trigger events in response to the completion of different steps in the downloading, parsing, and rendering of the web page for display to the user.</p> +<p>The <strong>user interaction</strong> with the web page contents might trigger events. The events triggered by user interaction evolved during the early years of browser design and include a complicated system defining the sequence in which events will be called and the manner in which that sequence can be controlled. The different types of user interaction driven events include:</p> +<ul> + <li>the original 'click' event,</li> + <li>mouse events,</li> + <li><a href="/en-US/docs/Web/Guide/API/DOM/Events/Mouse_gesture_events">mouse gesture events</a>, and</li> + <li>both <a href="/en-US/docs/Web/Guide/API/DOM/Events/Touch_events">touch events</a> and the earlier, but deprecated, <a href="/en-US/docs/Web/Guide/API/DOM/Events/Touch_events_(Mozilla_experimental)">mozilla experimental touch events</a>.</li> +</ul> +<p>The <strong>modification of the web page</strong> in structure or content might trigger some events, as is explained in the <a href="/en-US/docs/Web/Guide/API/DOM/Events/Mutation_events">mutation events page</a>, but the use of these events has been deprecated in favour of the lighter <a href="/en-US/docs/Web/API/MutationObserver">Mutation Observer</a> approach.</p> +<p>The <strong>media streams</strong> embedded in the HTML documents might trigger some events, as explained in the <a href="/en-US/docs/Web/Guide/API/DOM/Events/Media_events">media events</a> page.</p> +<p>The <strong>network requests</strong> made by a web page might trigger some events.</p> +<p>There are many other sources of events defined by web browsers for which pages are not yet available in this guide.</p> +<div class="note"> + <p>Note: This Event Developer Guide needs substantial work. The structure needs to be reorganized and the pages rewritten. Our hope is that everything you need to know about events will go under here.</p> +</div> +<h2 id="Docs">Docs</h2> +<p>{{LandingPageListSubpages}}</p> diff --git a/files/bn/web/guide/html/canvas_tutorial/index.html b/files/bn/web/guide/html/canvas_tutorial/index.html new file mode 100644 index 0000000000..2118fa3c97 --- /dev/null +++ b/files/bn/web/guide/html/canvas_tutorial/index.html @@ -0,0 +1,47 @@ +--- +title: ক্যানভাস টিউটোরিয়াল +slug: Web/Guide/HTML/Canvas_tutorial +tags: + - NeedsReview +translation_of: Web/API/Canvas_API/Tutorial +--- +<p><a href="/en-US/docs/HTML/Canvas" title="HTML/Canvas"><img alt="" src="https://mdn.mozillademos.org/files/257/Canvas_tut_examples.jpg" style="width: 200px; height: 450px; float: right;"></a></p> +<p><a href="/en-US/docs/HTML/Canvas" title="HTML/Canvas"><strong><code><canvas></code></strong></a> হচ্ছে একটি <a href="/en-US/docs/HTML" title="HTML">HTML</a> element যেটা স্ক্রিপ্টিং (সাধারণত <a href="/en-US/docs/JavaScript" title="JavaScript">JavaScript</a> ) ব্যবহার করে গ্রাফিক্স আঁকার জন্য ব্যবহার করা হয় । উদাহরণস্বরূপ গ্রাফ আঁকতে, ছবি কম্পোজিশন অথবা সাধারন ( তবে<a href="/en-US/docs/HTML/Canvas/A_Basic_RayCaster" title="A_Basic_RayCaster"> বেশি সাধারন নয় </a>) অ্যানিমেশন তৈরি করতে এটি ব্যবহার করা হয় । ডানপাশের ছবিতে <code><canvas></code> প্রয়োগ করে কিছু উদাহরণ দেওয়া হয়েছে যা আমরা পরে এর টিউটোরিয়াল এ দেখবো।</p> +<p><code><canvas></code> সর্বপ্রথম Apple এর Mac OS X ড্যাশবোর্ড এ ব্যবহার করার জন্য প্রকাশিত হয় এবং পরে Safari এবং Google Chrome এ প্রয়োগ করা হয়. <a href="/en-US/docs/Gecko" title="Gecko">Gecko</a> 1.8- ভিত্তিক browsers, যেমন Firefox 1.5 ও এই element কে সমর্থন করে. এই <code><canvas></code> element হচ্ছে <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/">WhatWG Web applications 1.0</a> এর একটি অংশ যা HTML5 নামেও পরিচিত।</p> +<p><span class="seoSummary">এই টিউটোরিয়াল কিভাবে <code><canvas></code> element ব্যবহার করে প্রাথমিক ভাবে 2D গ্রাফিক্স তৈরি করা যায় তা বর্ণনা করে । আপনি canvas ব্যবহার করে কি করতে পারবেন এই উদাহরণগুলো তার সুস্পষ্ট ধারণা দেয় এবং code কে snippets করে আপনার নিজের কাঙ্ক্ষিত বিষয়কে</span> তৈরি করতে শুরু করে ।</p> +<h2 id="Before_you_start" name="Before_you_start">শুরু করার পূর্বে</h2> +<p><code><canvas></code> element ব্যবহার করা কঠিন কিছু নয় তবে আপনার <a href="/en-US/docs/HTML" title="HTML">HTML</a> এবং <a href="/en-US/docs/JavaScript" title="JavaScript">JavaScript</a> সম্পর্কে প্রাথমিক ধারণা থাকতে হবে । কিছু পুরাতন browsers এ <code><canvas></code> element সমর্থন করে না, কিন্তু সম্প্রতি সকল প্রধান browsers গুলো তে সমর্থন করে । canvas এর default সাইজ হচ্ছে 300px * 150px (width * height). কিন্তু custom size গুলো CSS এর height এবং width property ব্যবহার করে উল্লেখ করা যায় । canvas এ গ্রাফিক্স আঁকতে গেলে আমরা javascript context object ব্যবহার করি , যা গ্রাফিক্সটিকে অনেক উন্নতমানের করে তুলে ।</p> +<h2 id="In_this_tutorial" name="In_this_tutorial">এই টিউটোরিয়াল এ যা আছে</h2> +<ul> + <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Basic_usage" title="Canvas_tutorial/Basic_usage">প্রাথমিক ব্যবহার</a></li> + <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Drawing_shapes" title="Canvas_tutorial/Drawing_shapes">আকৃতি</a></li> + <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Using_images" title="Canvas_tutorial/Using_images">ছবি ব্যবহার করা</a></li> + <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Applying_styles_and_colors" title="Canvas_tutorial/Applying_styles_and_colors">styles এবং color প্রয়োগ করা</a></li> + <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Transformations" title="Canvas_tutorial/Transformations">রূপান্তরকরণ</a></li> + <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Compositing" title="Canvas_tutorial/Compositing">একত্রীকরণ</a></li> + <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Basic_animations" title="Canvas_tutorial/Basic_animations">প্রাথমিক অ্যানিম্যাশন</a></li> + <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Optimizing_canvas" title="https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Optimizing_canvas">canvas সাজানো</a></li> +</ul> +<h2 id="See_also" name="See_also">আরও দেখুন</h2> +<ul> + <li><a href="/en-US/docs/HTML/Canvas" title="HTML/Canvas">Canvas ভিত্তিক পৃষ্ঠা</a></li> + <li><a href="/en-US/docs/HTML/Canvas/Drawing_Graphics_with_Canvas" title="Drawing_Graphics_with_Canvas">Canvas এর সাথে গ্রাফিক্স আঁকা</a></li> + <li><a href="/en-US/docs/tag/Canvas_examples" title="tag/Canvas_examples">Canvas এর উদাহরণসমূহ</a></li> + <li><a class="external" href="http://html5tutorial.com" title="http://html5tutorial.com">HTML5 টিউটোরিয়াল</a></li> + <li><a href="/en-US/docs/Drawing_text_using_a_canvas" title="Drawing_text_using_a_canvas">Canvas ব্যবহার করে টেক্সট আঁকা</a></li> + <li><a class="external" href="http://developer.apple.com/library/safari/#documentation/AudioVideo/Conceptual/HTML-canvas-guide/AddingText/AddingText.html#//apple_ref/doc/uid/TP40010542-CH6-SW4" title="Adding Text to Canvas">Canvas এ টেক্সট যোগ করা</a></li> + <li><a class="external" href="http://www.canvasdemos.com/" title="Canvas Demos">Canvas নমুনাসমূহ- গেইমস, অ্যাপ্লিকেশনস, টুলস এবং টিউটোরিয়ালস</a></li> + <li><a class="external" href="http://canvimation.github.com/" title="http://canvimation.github.com/">Canvas আঁকা এবং অ্যানিম্যাশন অ্যাপ্লিকেশন</a></li> + <li><a class="external" href="http://billmill.org/static/canvastutorial/" title="http://billmill.org/static/canvastutorial/">ইন্টার্যাক্টিভ canvas টিউটোরিয়াল</a></li> + <li><a class="external" href="http://blog.nihilogic.dk/2009/02/html5-canvas-cheat-sheet.html" title="http://blog.nihilogic.dk/2009/02/html5-canvas-cheat-sheet.html">গুণ এবং পদ্ধতিসহ Canvas Cheat শিট</a></li> + <li><a class="external" href="http://visitmix.com/labs/ai2canvas/" title="http://visitmix.com/labs/ai2canvas/">অ্যাডোব ইলাস্ট্রেটর এর জন্য Canvas plug-in</a></li> + <li><a class="external" href="http://www.html5canvastutorials.com/" title="http://www.html5canvastutorials.com/">HTML5 Canvas টিউটোরিয়াল</a></li> + <li><a class="external" href="http://html5tutorial.com/how-to-draw-n-grade-bezier-curve-with-canvas-api" title="http://html5tutorial.com/how-to-draw-n-grade-bezier-curve-with-canvas-api">Canvas API ব্যবহার করে কিভাবে N grade Bézier curves আঁকা যায়</a></li> + <li><a class="external" href="http://creativejs.com/2011/08/31-days-of-canvas-tutorials/" title="http://creativejs.com/2011/08/31-days-of-canvas-tutorials/">canvas টিউটোরিয়াল এর ৩১ দিন</a></li> + <li><a href="http://www.w3.org/TR/2dcontext/" title="http://www.w3.org/TR/2dcontext/">W3C স্ট্যান্ডার্ড</a></li> + <li><a href="http://www.tutorialspark.com/html5/HTML5_canvas_Intro.php" title="http://www.tutorialspark.com/html5/HTML5_canvas_Intro.php">HTML5 Canvas টিউটোরিয়াল এবং সহায়িকা</a></li> +</ul> +<h2 id="A_note_to_contributors">A note to contributors</h2> +<p>Due to an unfortunate technical error that occurred the week of June 17, 2013, we lost the history of this tutorial, including attributions to all past contributors to its content. We apologize for this, and hope you'll forgive this unfortunate mishap.</p> +<div> + {{ Next("Web/Guide/HTML/Canvas_tutorial/Basic_usage") }}</div> diff --git a/files/bn/web/guide/html/content_editable/index.html b/files/bn/web/guide/html/content_editable/index.html new file mode 100644 index 0000000000..0e8770f603 --- /dev/null +++ b/files/bn/web/guide/html/content_editable/index.html @@ -0,0 +1,44 @@ +--- +title: Content Editable +slug: Web/Guide/HTML/Content_Editable +tags: + - NeedsReview +translation_of: Web/Guide/HTML/Editable_content +--- +<p><span class="seoSummary">HTML5 এ যেকোনো অংশ পরিবর্তনীয়। কিছু জাভাস্ক্রিপ্ট ইভেন্ট হ্যান্ডলার ব্যবহার করে আপনি একটি ওয়েব পেজ একটি সম্পূর্ণ এবং দ্রুত rich-text editor এ রুপান্তর করতে পারবেন । এই অনুচ্ছেদ আপনাকে এর কার্যকারিতা সম্পর্কে কিছু তথ্য প্রদান করবে।</span></p> +<h2 id="সামঞ্জস্যতা"><span class="short_text" id="result_box" lang="bn"><span class="hps">সামঞ্জস্যতা</span></span></h2> +<p>পরিবর্তনীয় বিষয়গুলো সম্পূর্ণভাবে বর্তমান ব্রাউজার গুলোর সাথে সামঞ্জস্যপূর্ণ।</p> +<ul> + <li>ফায়ারফক্স ৩.৫+</li> + <li><span class="short_text" id="result_box" lang="bn"><span class="hps">অ্যান্ড্রয়েড-এর জন্য </span></span>ফায়ারফক্স ১৯+</li> + <li>ক্রোম ৪.০+</li> + <li><span class="short_text" id="result_box" lang="bn"><span class="hps">ইন্টারনেট এক্সপ্লোরার</span></span> ৫.৫+</li> + <li>সাফারি ৩.১+</li> + <li>অপেরা ৯+</li> + <li>আইওএস সাফারি ৫.০+</li> + <li><span class="short_text" id="result_box" lang="bn"><span class="hps">অ্যান্ড্রয়েড</span></span> ব্রাউজার ৩.০+</li> + <li>অপেরা মোবাইল ১২.১+</li> + <li><span class="short_text" id="result_box" lang="bn"><span class="hps">অ্যান্ড্রয়েড-এর জন্য ক্রোম </span></span>২৫+</li> +</ul> +<p>এখন পর্যন্ত অপেরা মিনি তে সমর্থিত নয়।</p> +<h2 id="এটা_কিভাবে_কাজ_করে">এটা কিভাবে কাজ করে ?</h2> +<p><code>contenteditable</code> এট্রিবিউট টি আপনার HTML উপাদান এ <code>true</code> সেট করুন। এটা প্রায় সকল HTML উপাদান এ ব্যবহার করা যায়।</p> +<h2 id="উদাহরণ">উদাহরণ</h2> +<p>একটি সহজ উদাহরণ</p> +<pre><!DOCTYPE html> +<html> + <body> + <div contenteditable="true"> + This text can be edited by the user. + </div> + </body> +</html> </pre> +<p>আপনি এখানে লোকালস্টোরেজ ব্যবহার করে জাভাস্ক্রিপ্ট ইন্টিগ্রেশন এর একটি কার্যকর উদাহরন দেখতে পারেন। এই উৎস-এর সাথে</p> +<h2 id="আরও_দেখুন">আরও দেখুন</h2> +<pre class="code">user_pref("capability.policy.policynames", "allowclipboard"); +user_pref("capability.policy.allowclipboard.sites", "https://www.mozilla.org"); +user_pref("capability.policy.allowclipboard.Clipboard.cutcopy", "allAccess"); +user_pref("capability.policy.allowclipboard.Clipboard.paste", "allAccess");</pre> +<p><a href="/en/Midas" title="en/Midas">কিভাবে এই বিষয় এর সাথে কাজ করবেন </a> (old IE style API) এবং <a href="/en/Rich-Text_Editing_in_Mozilla" title="en/rich-text editing in mozilla">এখানে</a></p> +<div> + {{ languages({ "ja": "ja/HTML/Content_Editable", "zh-cn": "zh-cn/HTML/Content_Editable" }) }}</div> diff --git a/files/bn/web/guide/html/forms/index.html b/files/bn/web/guide/html/forms/index.html new file mode 100644 index 0000000000..2e0e03ea83 --- /dev/null +++ b/files/bn/web/guide/html/forms/index.html @@ -0,0 +1,342 @@ +--- +title: HTML forms guide +slug: Web/Guide/HTML/Forms +tags: + - NeedsReview +translation_of: Learn/Forms +--- +<p>এই সহায়িকা হচ্ছে একটি সামগ্রিক নির্দেশিকা যা আপনাকে মাষ্টার<span style="background-color: #40e0d0;"> HTML</span> form তৈরি করতে সাহায্য করবে । <span id="result_box" lang="bn"><span class="hps"><span style="background-color: #00ffff;">HTML</span> from</span> <span class="hps">ব্যবহারকারীদের সাথে</span> <span class="hps">আলাপচারিতার</span> <span class="hps">জন্য খুব</span> <span class="hps">শক্তিশালী হাতিয়ার</span> <span class="hps">হয়</span></span> না । <span id="result_box" lang="bn"><span class="hps">এই সহায়িকার মধ্যে,<span style="background-color: #00ffff;"> </span></span><span id="result_box" lang="bn"><span class="hps"><span style="background-color: #00ffff;">HTML</span></span> from <span class="hps">হতে </span></span><span class="hps">আমরা</span> <span class="hps">কাস্টম উইজেট</span> <span class="hps">করার</span> <span class="hps">পরিচালনার</span> <span class="hps">তথ্য</span> <span class="hps">থেকে</span> <span class="hps">কাঠামো</span> <span class="hps">থেকে</span> <span class="hps">স্টাইলিং</span> <span class="hps">করার</span></span>। তুমি এই শক্তিশালি অফার শিখতে এবং উপভোগে পারবে।</p> +<h2 id="বর্ন_মালা">বর্ন মালা</h2> +<ol> + <li><a href="/en-US/docs/HTML/Forms/My_first_HTML_form" title="/en-US/docs/HTML/Forms/My_first_HTML_form">আমার প্রথম HTML form</a></li> + <li><a href="/en-US/docs/HTML/Forms/How_to_structure_an_HTML_form" title="/en-US/docs/HTML/Forms/How_to_structure_an_HTML_form"><span>HTML form </span></a>কি ভাবে গঠন করতে হয় </li> + <li><a href="/en-US/docs/HTML/Forms/The_native_form_widgets" title="/en-US/docs/HTML/Forms/The_native_form_widgets"><span>নেটিভ form <span id="result_box" lang="bn"><span class="hps">উইজেট</span></span></span></a></li> + <li>CSS সাথে HTML forms + <ol> + <li><a href="/en-US/docs/HTML/Forms/Styling_HTML_forms" title="/en-US/docs/HTML/Forms/Styling_HTML_forms"><span>HTML forms</span></a> এর উন্নতি</li> + <li><a href="/en-US/docs/Web/Guide/HTML/Forms/Advanced_styling_for_HTML_forms" title="/en-US/docs/Advanced_styling_for_HTML_forms"> HTML forms উন্নতির ধরন</a></li> + <li> উইজেট এর টেবিল হতে <a href="/en-US/docs/Property_compatibility_table_for_form_widgets" title="/en-US/docs/Property_compatibility_table_for_form_widgets">Property </a>শামাযশ্যতা</li> + </ol> + </li> + <li><a href="/en-US/docs/HTML/Forms/Sending_and_retrieving_form_data" title="/en-US/docs/HTML/Forms/Sending_and_retrieving_form_data"><span>তথ্য হতে </span></a>পাঠাতে এবং চেষ্টা করতে</li> + <li> তথ্য হতে বৈধতা</li> + <li> উইজেট হতে কিভাবে coustom তৈরি করতে হয়</li> + <li><a href="/en-US/docs/HTML/Forms/Sending_forms_through_JavaScript" title="/en-US/docs/HTML/Forms/Sending_forms_through_JavaScript"> JavaScript কি ভাবে নিক্ষেপ করতে হয়</a> + <ol> + <li><a href="/en-US/docs/DOM/XMLHttpRequest/FormData/Using_FormData_Objects" title="/en-US/docs/DOM/XMLHttpRequest/FormData/Using_FormData_Objects">ডাটা অবজে</a>কট কিভাবে ব্যাবহার করতে হয়</li> + </ol> + </li> + <li><a href="/en-US/docs/HTML/Forms/HTML_forms_in_legacy_browsers" title="/en-US/docs/HTML/Forms/HTML_forms_in_legacy_browsers">HTML হতে <span id="result_box" lang="bn"><span class="hps">ব্রাউজারে </span></span></a></li> +</ol> +<h2 id="HTML_Documentation">HTML Documentation</h2> +<h3 id="HTML_Elements">HTML Elements</h3> +<table> + <thead> + <tr> + <th scope="col">Element</th> + <th scope="col">Related DOM interface</th> + <th scope="col">Description</th> + </tr> + </thead> + <tbody> + <tr> + <td style="vertical-align: top;">{{HTMLElement("button")}}</td> + <td style="vertical-align: top;">{{domxref("HTMLButtonElement")}}</td> + <td style="vertical-align: top;">The <code>button</code> element represents a clickable button.</td> + </tr> + <tr> + <td style="vertical-align: top;">{{HTMLElement("datalist")}}</td> + <td style="vertical-align: top;">{{domxref("HTMLDataListElement")}}</td> + <td style="vertical-align: top;">The <span style="font-family: Courier New;">datalist</span> element contains a set of {{ HTMLElement("option") }} elements that represent the possible options for the value of other forms elements.</td> + </tr> + <tr> + <td style="vertical-align: top;">{{HTMLElement("fieldset")}}</td> + <td style="vertical-align: top;">{{domxref("HTMLFieldSetElement")}}</td> + <td style="vertical-align: top;">The <span style="font-family: Courier New;">fieldset</span> is used to group several form elements within a form.</td> + </tr> + <tr> + <td style="vertical-align: top;">{{HTMLElement("form")}}</td> + <td style="vertical-align: top;">{{domxref("HTMLFormElement")}}</td> + <td style="vertical-align: top;">The <code>form</code> element represents a section of document that contains interactive element that enable a user to submit information to a web server.</td> + </tr> + <tr> + <td style="vertical-align: top;">{{HTMLElement("input")}}</td> + <td style="vertical-align: top;">{{domxref("HTMLInputElement")}}</td> + <td style="vertical-align: top;">The <code>input</code> element is used to create interactive controls for forms.</td> + </tr> + <tr> + <td style="vertical-align: top;">{{HTMLElement("keygen")}}</td> + <td style="vertical-align: top;">{{domxref("HTMLKeygenElement")}}</td> + <td style="vertical-align: top;">The <code>keygen</code> element exists to facilitate generation of key material, and submission of the public key as part of an HTML form</td> + </tr> + <tr> + <td style="vertical-align: top;">{{HTMLElement("label")}}</td> + <td style="vertical-align: top;">{{domxref("HTMLLabelElement")}}</td> + <td style="vertical-align: top;">The <code>label</code> element represents a caption for an item in a user interface</td> + </tr> + <tr> + <td style="vertical-align: top;">{{HTMLElement("legend")}}</td> + <td style="vertical-align: top;">{{domxref("HTMLLegendElement")}}</td> + <td style="vertical-align: top;">The <code>legend</code> element represents a caption for the content of its parent {{ HTMLElement("fieldset") }}.</td> + </tr> + <tr> + <td style="vertical-align: top;">{{HTMLElement("meter")}}</td> + <td style="vertical-align: top;">{{domxref("HTMLMeterElement")}}</td> + <td style="vertical-align: top;">The <code>meter</code> element represents either a scalar value within a known range or a fractional value.</td> + </tr> + <tr> + <td style="vertical-align: top;">{{HTMLElement("optgroup")}}</td> + <td style="vertical-align: top;">{{domxref("HTMLOptGroupElement")}}</td> + <td style="vertical-align: top;">the <code>optgroup</code> element creates a group of options within a {{ HTMLElement("select") }} element.</td> + </tr> + <tr> + <td style="vertical-align: top;">{{HTMLElement("option")}}</td> + <td style="vertical-align: top;">{{domxref("HTMLOptionElement")}}</td> + <td style="vertical-align: top;">the HTML<em> </em><code>option<em> </em></code>element is used to create a control representing an item within a {{ HTMLElement("select") }}, an {{ HTMLElement("optgroup") }} or a {{ HTMLElement("datalist") }} element.</td> + </tr> + <tr> + <td style="vertical-align: top;">{{HTMLElement("output")}}</td> + <td style="vertical-align: top;">{{domxref("HTMLOutputElement")}}</td> + <td style="vertical-align: top;">The <code>output</code> element represents the result of a calculation.</td> + </tr> + <tr> + <td style="vertical-align: top;">{{HTMLElement("progress")}}</td> + <td style="vertical-align: top;">{{domxref("HTMLProgressElement")}}</td> + <td style="vertical-align: top;">The <code>progress</code> element is used to view the completion progress of a task.</td> + </tr> + <tr> + <td style="vertical-align: top;">{{HTMLElement("select")}}</td> + <td style="vertical-align: top;">{{domxref("HTMLSelectElement")}}</td> + <td style="vertical-align: top;">The <code>select</code> element represents a control that presents a menu of options.</td> + </tr> + <tr> + <td style="vertical-align: top;">{{HTMLElement("textarea")}}</td> + <td style="vertical-align: top;">{{domxref("HTMLTextAreaElement")}}</td> + <td style="vertical-align: top;">The <code>textarea</code> element represents a multi-line plain-text editing control.</td> + </tr> + </tbody> +</table> +<div class="note"> + <p><strong>Note:</strong> All form elements, as all HTML elements, support the {{domxref("HTMLElement")}} DOM interface.</p> +</div> +<h3 id="HTML_Attributes">HTML Attributes</h3> +<table class="standard-table"> + <thead> + <tr> + <th>Attribute Name</th> + <th>Elements</th> + <th>Description</th> + </tr> + </thead> + <tbody> + <tr> + <td>accept</td> + <td>{{ HTMLElement("form") }}, {{ HTMLElement("input") }}</td> + <td>List of types the server accepts, typically a file type.</td> + </tr> + <tr> + <td style="white-space: nowrap;">accept-charset</td> + <td>{{ HTMLElement("form") }}</td> + <td>List of supported charsets.</td> + </tr> + <tr> + <td>action</td> + <td>{{ HTMLElement("form") }}</td> + <td>The URI of a program that processes the information submitted via the form.</td> + </tr> + <tr> + <td>autocomplete</td> + <td>{{ HTMLElement("form") }}, {{ HTMLElement("input") }}</td> + <td>Indicates whether controls in this form can by default have their values automatically completed by the browser.</td> + </tr> + <tr> + <td>autofocus</td> + <td>{{ HTMLElement("button") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td> + <td>The element should be automatically focused after the page loaded.</td> + </tr> + </tbody> + <tbody> + <tr> + <td>challenge</td> + <td>{{ HTMLElement("keygen") }}</td> + <td>A challenge string that is submitted along with the public key.</td> + </tr> + <tr> + <td>checked</td> + <td>{{ HTMLElement("input") }}</td> + <td>Indicates whether the element should be checked on page load.</td> + </tr> + <tr> + <td>cols</td> + <td>{{ HTMLElement("textarea") }}</td> + <td>Defines the number of columns in a textarea.</td> + </tr> + <tr> + <td>data</td> + <td>{{ HTMLElement("object") }}</td> + <td>Specifies the URL of the resource.</td> + </tr> + <tr> + <td>dirname</td> + <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td> + <td> </td> + </tr> + <tr> + <td>disabled</td> + <td>{{ HTMLElement("button") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("optgroup") }}, {{ HTMLElement("option") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td> + <td>Indicates whether the user can interact with the element.</td> + </tr> + <tr> + <td>enctype</td> + <td>{{ HTMLElement("form") }}</td> + <td>Defines the content type of the form date when the <code>method</code> is POST.</td> + </tr> + <tr> + <td>for</td> + <td>{{ HTMLElement("label") }}, {{ HTMLElement("output") }}</td> + <td>Describes elements which belongs to this one.</td> + </tr> + <tr> + <td>form</td> + <td>{{ HTMLElement("button") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("label") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("object") }}, {{ HTMLElement("output") }}, {{ HTMLElement("progress") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td> + <td>Indicates the form that is the owner of the element.</td> + </tr> + </tbody> + <tbody> + <tr> + <td>high</td> + <td>{{ HTMLElement("meter") }}</td> + <td>Indicates the lower bound of the upper range.</td> + </tr> + <tr> + <td>keytype</td> + <td>{{ HTMLElement("keygen") }}</td> + <td>Specifies the type of key generated.</td> + </tr> + <tr> + <td>list</td> + <td>{{ HTMLElement("input") }}</td> + <td>Identifies a list of pre-defined options to suggest to the user.</td> + </tr> + <tr> + <td>low</td> + <td>{{ HTMLElement("meter") }}</td> + <td>Indicates the upper bound of the lower range.</td> + </tr> + <tr> + <td>max</td> + <td>{{ HTMLElement("input") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("progress") }}</td> + <td>Indicates the maximum value allowed.</td> + </tr> + <tr> + <td>maxlength</td> + <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td> + <td>Defines the maximum number of characters allowed in the element.</td> + </tr> + <tr> + <td>method</td> + <td>{{ HTMLElement("form") }}</td> + <td>Defines which HTTP method to use when submitting the form. Can be GET (default) or POST.</td> + </tr> + <tr> + <td>min</td> + <td>{{ HTMLElement("input") }}, {{ HTMLElement("meter") }}</td> + <td>Indicates the minimum value allowed.</td> + </tr> + <tr> + <td>multiple</td> + <td>{{ HTMLElement("input") }}, {{ HTMLElement("select") }}</td> + <td>Indicates whether multiple values can be entered in an input of the type <code>email</code> or <code>file</code>.</td> + </tr> + <tr> + <td>name</td> + <td>{{ HTMLElement("button") }}, {{ HTMLElement("form") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("output") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td> + <td>Name of the element. For example used by the server to identify the fields in form submits.</td> + </tr> + <tr> + <td>novalidate</td> + <td>{{ HTMLElement("form") }}</td> + <td>This attribute indicates that the form shouldn't be validated when submitted.</td> + </tr> + <tr> + <td>optimum</td> + <td>{{ HTMLElement("meter") }}</td> + <td>Indicates the optimal numeric value.</td> + </tr> + <tr> + <td>pattern</td> + <td>{{ HTMLElement("input") }}</td> + <td>Defines a regular expression which the element's value will be validated against.</td> + </tr> + <tr> + <td>placeholder</td> + <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td> + <td>Provides a hint to the user of what can be entered in the field.</td> + </tr> + <tr> + <td>readonly</td> + <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td> + <td>Indicates whether the element can be edited.</td> + </tr> + <tr> + <td>required</td> + <td>{{ HTMLElement("input") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td> + <td>Indicates whether this element is required to fill out or not.</td> + </tr> + <tr> + <td>rows</td> + <td>{{ HTMLElement("textarea") }}</td> + <td>Defines the number of rows in a textarea.</td> + </tr> + <tr> + <td>selected</td> + <td>{{ HTMLElement("option") }}</td> + <td>Defines a value which will be selected on page load.</td> + </tr> + <tr> + <td>size</td> + <td>{{ HTMLElement("input") }}, {{ HTMLElement("select") }}</td> + <td>Defines the width of the element (in pixels). If the element's <code>type</code> attribute is <code>text</code> or <code>password</code> then it's the number of characters.</td> + </tr> + <tr> + <td>src</td> + <td>{{ HTMLElement("input") }}</td> + <td>The URL of the embeddable content.</td> + </tr> + <tr> + <td>step</td> + <td>{{ HTMLElement("input") }}</td> + <td> </td> + </tr> + <tr> + <td>target</td> + <td>{{ HTMLElement("form") }}</td> + <td> </td> + </tr> + <tr> + <td>type</td> + <td>{{ HTMLElement("button") }}, {{ HTMLElement("input") }}</td> + <td>Defines the type of the element.</td> + </tr> + <tr> + <td>usemap</td> + <td>{{ HTMLElement("input") }}</td> + <td> </td> + </tr> + <tr> + <td>value</td> + <td>{{ HTMLElement("button") }}, {{ HTMLElement("option") }}, {{ HTMLElement("input") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("progress") }}</td> + <td>Defines a default value which will be displayed in the element on page load.</td> + </tr> + <tr> + <td>wrap</td> + <td>{{ HTMLElement("textarea") }}</td> + <td>Indicates whether the text should be wrapped.</td> + </tr> + </tbody> +</table> +<h3 id="Normative_reference">Normative reference</h3> +<ul> + <li><a href="http://www.w3.org/TR/html5/forms.html" lang="en" rel="external" title="http://www.w3.org/TR/html5/forms.html">W3C HTML5 Specification (Forms)</a></li> + <li><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/forms.html#forms" rel="external" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/forms.html#forms">WHATWG HTML Living Standard (Forms)</a></li> +</ul> diff --git a/files/bn/web/guide/index.html b/files/bn/web/guide/index.html new file mode 100644 index 0000000000..e2979917bc --- /dev/null +++ b/files/bn/web/guide/index.html @@ -0,0 +1,20 @@ +--- +title: ওয়েব ডেভেলপার গাইড +slug: Web/Guide +translation_of: Web/Guide +--- +<p>এই আর্টিকেলগুলো আপনাকে নির্দিষ্ট কিছু প্রযুক্তি এবং এপিআই ব্যবহার সংক্রান্ত তথ্য দেবে।</p> +<div class="note"> + <p><strong>সাবধান:</strong> আমাদের কন্টেন্টগুলো ঠিকমত সাজানোর আগ পর্যন্ত পেজটির অবস্থা বেশ অগোছালো থাকতে পারে। দুঃখিত!</p> +</div> +<p>{{LandingPageListSubpages}}</p> +<dl> + <dt> + <a href="/en-US/docs/JavaScript" title="/en-US/docs/JavaScript">জাভাস্ক্রিপ্ট</a></dt> + <dd> + ওয়েবে অ্যাপ্লিকেশন লেখার জন্য শক্তিশালী প্রোগ্রামিং ল্যাঙ্গুয়েজটি হল জাভাস্ক্রিপ্ট।</dd> +</dl> +<h2 id="আরও_দেখুন">আরও দেখুন</h2> +<ul> + <li><a href="/en-US/docs/Web/Reference" title="/en-US/docs/Web/Reference">ওয়েব ডেভেলপার রেফারেন্স</a></li> +</ul> diff --git a/files/bn/web/guide/performance/index.html b/files/bn/web/guide/performance/index.html new file mode 100644 index 0000000000..e8280ffae1 --- /dev/null +++ b/files/bn/web/guide/performance/index.html @@ -0,0 +1,9 @@ +--- +title: অপটিমাইজেশন অ্যান্ড পারফরমেন্স +slug: Web/Guide/Performance +tags: + - NeedsReview +translation_of: Web/Guide/Performance +--- +<p><span id="result_box" lang="bn"><span class="hps">আধুনিক</span> <span class="hps">ওয়েব</span> <span class="hps">অ্যাপ্লিকেশন এবং</span> <span class="hps">সাইট</span> <span class="hps">নির্মাণ</span> <span class="hps">করার সময়, আপনার কনটেন্ট সঠিক ভাবে কাজ করা অত্যন্ত জরুরি।</span></span> যেন, তা <span class="short_text" id="result_box" lang="bn"><span class="hps">দ্রুত এবং</span> <span class="hps">দক্ষতার সঙ্গে কাজ</span> <span class="hps">করতে পারে।</span></span> <span class="short_text" id="result_box" lang="bn"><span class="hps">এটি</span> <span class="hps"><span id="result_box" lang="bn"><span class="hps">শক্তিশালী</span> <span class="hps">ডেস্কটপ</span> <span class="hps">সিস্টেম</span> <span class="hps">ব্যবহারকারীদের</span> <span class="hps">পাশাপাশি</span> <span class="hps">কম</span> <span class="hps">ক্ষমতা সম্পন্ন</span> <span class="hps">ডিভাইসের জন্যও</span></span></span></span><span class="short_text" lang="bn"><span class="hps"><span lang="bn"> </span>কার্যকরভাবে</span> <span class="hps">কাজ</span> করে থাকে</span>।</p> +<p>{{LandingPageListSubpages}}</p> diff --git a/files/bn/web/guide/গ্রাফিক্স/index.html b/files/bn/web/guide/গ্রাফিক্স/index.html new file mode 100644 index 0000000000..fdf50fc2b7 --- /dev/null +++ b/files/bn/web/guide/গ্রাফিক্স/index.html @@ -0,0 +1,53 @@ +--- +title: গ্রাফিক্স অন দি ওয়েব +slug: Web/Guide/গ্রাফিক্স +tags: + - NeedsReview +translation_of: Web/Guide/Graphics +--- +<p><span id="result_box" lang="bn"><span class="hps">আধুনিক ওয়েব</span> <span class="hps">সাইট এবং</span> <span class="hps">অ্যাপ্লিকেশনে</span> <span class="hps">প্রায়ই</span> <span class="hps">গ্রাফিক্স</span> <span class="hps">উপস্থাপন</span> <span class="hps">প্রয়োজন পরে। </span></span><span id="result_box" lang="bn"><span class="hps">{{HTMLElement("img")}} উপাদান <span id="result_box" lang="bn"><span class="hps">ব্যবহার করে </span></span><span id="result_box" lang="bn"><span class="hps">সহজে</span>ই </span>স্ট্যাটিক</span> <span class="hps">ইমেজ</span> <span class="hps">প্রদর্শিত করা</span></span><span lang="bn"><span class="hps"> </span><span class="hps">যায়, অথবা</span></span> {{cssxref("background-image")}} প্রোপার্টি <span id="result_box" lang="bn"><span class="hps">ব্যবহার করে</span> <span class="hps">এইচটিএমএল</span> <span class="hps">উপাদানের</span> <span class="hps">পটভূমি</span> <span class="hps">নির্ধারণ করা যায়।</span></span></p> +<p><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 class="hps">নির্মাণ করতে</span> <span class="hps">চান</span></span>, অথবা ঘটনার পরে ছবি প্রদর্শন করতে চান। এই নিবন্ধনটি আপনাকে সাহায্য করবে কিভাবে আপনি তা সম্পন্ন করতে পারেন।</p> +<div class="row topicpage-table"> + <div class="section"> + <h2 class="Documentation" id="Docs_for_add-on_developers" name="Docs_for_add-on_developers">2D গ্রাফিক্স</h2> + <dl> + <dt> + <a href="/en-US/docs/HTML/Canvas">Canvas(ক্যানভাস)</a></dt> + <dd> + এই {{HTMLElement("canvas")}}উপাদানটি APIs প্রদান করে যেন জাভাস্ক্রিপ্ট ব্যাবহার করে 2D গ্রাফিক্স তৈরি করা যায়।</dd> + <dd> + <a href="/en-US/docs/Web/SVG">SVG(এস ভি জি)</a><br> + স্কেলেবল ভেক্টর গ্রাফিক্স (SVG) লাইনস, কারভস, এবং অন্যান্য <span class="short_text" id="result_box" lang="bn"><span class="hps">জ্যামিতিক আকার প্রদান </span></span>করে। bitmaps ব্যাবহার করা এড়িয়ে চলার মাধ্যমে, আপনি যেকোনো আকারের ছবি পরিছন্নভাবে <span id="result_box" lang="bn"><span class="hps">তৈরি করতে পারেন।</span></span></dd> + </dl> + <p><span class="alllinks"><a href="/en-US/docs/tag/Graphics">সম্পূর্ণ দেখুন্...</a></span></p> + </div> + <div class="section"> + <h2 class="Documentation" id="Docs_for_add-on_developers" name="Docs_for_add-on_developers">3D গ্রাফিক্স</h2> + <dl> + <dt> + <a href="/en-US/docs/Web/WebGL">WebGL(ওয়েব জি এল)</a></dt> + <dd> + <div class="almost_half_cell" id="gt-res-content"> + <div dir="ltr" style="zoom: 1;"> + <span class="short_text" id="result_box" lang="bn"><span class="hps">WebGL</span> <span class="hps">শুরু</span> <span class="hps">করার একটি নির্দেশিকা</span></span>, ওয়েবের জন্য <span class="short_text" id="result_box" lang="bn"><span class="hps">3D গ্রাফিক্স API</span></span>. এই প্রযুক্তি আপনাকে <span class="short_text" id="result_box" lang="bn"><span class="hps">ওয়েবের মধ্যে স্ট্যান্ডার্ড</span></span> OpenGL ES ব্যাবহার করতে দেয়।</div> + </div> + </dd> + </dl> + <h2 id="ভিডিও">ভিডিও</h2> + <dl> + <dt> + <a href="/en-US/docs/Web/Guide/HTML/Using_HTML5_audio_and_video">HTML5 (অডিও এবং ভিডিও ব্যাবহার)</a></dt> + </dl> + <div class="almost_half_cell" id="gt-res-content"> + <div dir="ltr" style="zoom: 1;"> + <span id="result_box" lang="bn"><span class="hps">একটি HTML</span> <span class="hps">নথিতে</span> <span class="hps">ভিডিও এম্বেড</span> <span class="hps">এবং প্লেব্যাক</span> <span class="hps">নিয়ন্ত্রণ</span><span>।</span></span></div> + </div> + <dl> + <dt> + <a href="/en-US/docs/WebRTC">WebRTC(ওয়েব আর টি সি)</a></dt> + <dd> + WebRTC(ওয়েব আর টি সি) এর RTC (আর টি সি) বলতে Real-Time Communications (রিয়েল টাইম কমিউনিকেশন) কে বুঝায়, এই প্রযুক্তি <span id="result_box" lang="bn"><span class="hps">অডিও / ভিডিও</span> <span class="hps">স্ট্রিমিং</span> <span class="hps">এবং ব্রাউজার</span> <span class="hps">ক্লায়েন্ট</span>স <span class="hps atn">(</span><span>মিত্রগণ</span><span>)</span> <span class="hps">মধ্যে তথ্য</span> <span class="hps">ভাগ</span> <span class="hps">করতে সক্ষম</span><span>।</span></span></dd> + </dl> + </div> +</div> +<p> </p> |