শিক্ষক ক্লাসে ৪র্থ অধ্যায়ের টেবিল তৈরির আলোচনা শেষে অপুকে ব্রাউজারে নিচের চিত্রের ন্যায় ফলাফল দেয় এমন একটি ওয়েবপেজ তৈরি করতে বললেন, যেখানে টাইটেলে Apu's Page লেখাটি প্রদর্শিত হবে। অপু webpage টি তৈরী করে হোস্টিং করল, কিন্তু নির্দিষ্ট সময় পর ওয়েব পেজটি কোনো স্থান থেকে দেখা যাচ্ছেনা।

1. Pipilikamap Jpg (100×40)
Welcome
abc  

শর্ত : Pipilika লিস্ট আকারে এবং Hyperlink করা থাকবে।

Updated: 1 year ago
উত্তরঃ

HTML (HyperText Markup Language) ডকুমেন্ট তৈরির জন্য ব্যবহৃত নির্দেশিকাসমূহকে ট্যাগ (Tag) বলা হয়। একটি শুরুর ট্যাগ (opening tag), একটি শেষের ট্যাগ (closing tag) এবং তাদের মধ্যবর্তী বিষয়বস্তু বা কন্টেন্ট (content) নিয়ে গঠিত সম্পূর্ণ অংশকে HTML উপাদান (Element) বলে।

Satt AI
Satt AI
1 month ago
উত্তরঃ

ওয়েবসাইটের মূলত দুইটি অংশ থাকে: ক্লায়েন্ট সাইড (Client-side) এবং সার্ভার সাইড (Server-side)।

ক্লায়েন্ট সাইড অংশটি ব্যবহারকারী তার ওয়েব ব্রাউজারের মাধ্যমে সরাসরি দেখতে ও ব্যবহার করতে পারে। এটি ওয়েবপেজের কাঠামো (HTML), স্টাইল (CSS) এবং ইন্টারঅ্যাকটিভিটি (JavaScript) নিয়ে গঠিত। অন্যদিকে, সার্ভার সাইড অংশটি ব্যাক-এন্ডে কাজ করে এবং ব্যবহারকারীর কাছে দৃশ্যমান নয়। এটি ডাটাবেজ ব্যবস্থাপনা, ডেটা প্রসেসিং এবং ক্লায়েন্ট সাইডে ডেটা সরবরাহ করার মতো কাজগুলো পরিচালনা করে।

Satt AI
Satt AI
1 month ago
উত্তরঃ

    

    

    আমার প্রথম ওয়েবপেজ

    

ওয়েবপেজের প্রধান শিরোনাম

    

এটি একটি সাধারণ প্যারাগ্রাফ। এখানে উদ্দীপকের বর্ণনা অনুযায়ী আরও তথ্য থাকতে পারে।

    

কিছু গুরুত্বপূর্ণ বিষয়:

    

            

  • প্রথম আইটেম
  •         

  • দ্বিতীয় আইটেম
  •         

  • তৃতীয় আইটেম
  •     

    উদাহরণ চিত্র

    উদাহরণ ওয়েবসাইটে যান


উপরে প্রদত্ত HTML কোডটি একটি সাধারণ ওয়েবপেজ কাঠামো তৈরি করে যা উদ্দীপকের বিভিন্ন উপাদান (যেমন: শিরোনাম, প্যারাগ্রাফ, তালিকা, চিত্র এবং লিঙ্ক) প্রদর্শনের জন্য ব্যবহার করা যেতে পারে। উদ্দীপকের সুনির্দিষ্ট বিন্যাস অনুযায়ী কোডটিতে আরও প্রয়োজনীয় ট্যাগ বা অ্যাট্রিবিউট (attribute) যুক্ত করা যেতে পারে।

        
  • : এটি ব্রাউজারকে নির্দেশ করে যে এটি একটি HTML5 ডকুমেন্ট।
  •     
  • ট্যাগ: এটি সম্পূর্ণ HTML ডকুমেন্টের মূল উপাদান এবং এর মধ্যে হেড ও বডি অংশ থাকে। lang="bn" অ্যাট্রিবিউটটি ডকুমেন্টের ভাষা বাংলা হিসেবে নির্ধারণ করে।
  •     
  • ট্যাগ: এই অংশে ওয়েবপেজের মেটা-তথ্য (meta-information) যেমন - ডকুমেন্টের অক্ষর সেট (character set), ভিউপোর্ট (viewport) সেটিং এবং ব্রাউজার ট্যাবে প্রদর্শিত শিরোনাম (title) থাকে, যা সরাসরি ব্রাউজারে প্রদর্শিত হয় না।
  •     
  • : এটি ডকুমেন্টের অক্ষর এনকোডিং (character encoding) UTF-8 নির্ধারণ করে, যা বাংলা সহ বিভিন্ন ভাষার অক্ষর সঠিক ভাবে প্রদর্শনে সাহায্য করে।
  •     
  • : এটি ডিভাইস-প্রস্থের (device-width) সাথে ভিউপোর্টকে মানিয়ে নিতে সাহায্য করে, যা রেসপন্সিভ ডিজাইন (responsive design) এর জন্য গুরুত্বপূর্ণ।
  •     
  • </code> ট্যাগ: এটি ওয়েবপেজটির শিরোনাম নির্ধারণ করে যা ব্রাউজারের টাইটেল বারে বা ট্যাবে প্রদর্শিত হয়।</li>     <li><code><body></code> ট্যাগ: এই অংশে ওয়েবপেজের দৃশ্যমান সকল বিষয়বস্তু থাকে, যেমন - টেক্সট, চিত্র, লিঙ্ক, তালিকা ইত্যাদি।</li>     <li><code><h1></code> ট্যাগ: এটি একটি প্রধান শিরোনাম (heading) তৈরি করে। HTML-এ <code><h1></code> থেকে <code><h6></code> পর্যন্ত বিভিন্ন আকারের শিরোনাম ট্যাগ রয়েছে।</li>     <li><code><p></code> ট্যাগ: এটি একটি প্যারাগ্রাফ (paragraph) বা অনুচ্ছেদ তৈরি করতে ব্যবহৃত হয়।</li>     <li><code><ul></code> ট্যাগ: এটি একটি আনঅর্ডারড লিস্ট (unordered list) বা ক্রমবিহীন তালিকা তৈরি করে, যার প্রতিটি আইটেম বুলেটের মাধ্যমে প্রদর্শিত হয়।</li>     <li><code><li></code> ট্যাগ: এটি তালিকার প্রতিটি আইটেম (list item) নির্ধারণ করে। <code><ul></code> বা <code><ol></code> (অর্ডারড লিস্ট) এর মধ্যে এটি ব্যবহৃত হয়।</li>     <li><code><img></code> ট্যাগ: এটি ওয়েবপেজে চিত্র (image) যুক্ত করার জন্য ব্যবহৃত হয়। <code>src</code> অ্যাট্রিবিউটে চিত্রের উৎস (source) এবং <code>alt</code> অ্যাট্রিবিউটে চিত্রের বিকল্প বিবরণ (alternative text) দিতে হয়। <code>width</code> ও <code>height</code> অ্যাট্রিবিউট চিত্রের আকার নির্ধারণ করে। <code><br></code> একটি লাইন ব্রেক তৈরি করে।</li>     <li><code><a></code> ট্যাগ: এটি একটি হাইপারলিঙ্ক (hyperlink) তৈরি করে, যা ব্যবহারকারীকে অন্য একটি ওয়েবপেজ বা ডকুমেন্টের অন্য অংশে নিয়ে যেতে পারে। <code>href</code> অ্যাট্রিবিউটে লিঙ্কের ঠিকানা (URL) দিতে হয়।</li> </ul> </div> <!-- Footer with time and actions --> <div class="flex items-center justify-between"> <div class="flex items-center gap-2"> <img src="https://sattacademy.com/uploads/avatar/1752391341.png" class="w-7 h-7 rounded-full object-cover" alt="Satt AI" > <div> <a href="https://sattacademy.com/user/u&id=476188/profile" class="text-sm font-medium text-zinc-700 dark:text-zinc-400 hover:text-blue-600 dark:hover:text-blue-400 leading-none"> Satt AI </a> <div class="text-xs text-zinc-500 dark:text-zinc-400 leading-none"> 1 month ago </div> </div> </div> <div class="flex items-center gap-3"> <!-- Like button --> <button onclick="alert('ব্যাখ্যায় ভোট দিতে লগইন করুন')" class="flex items-center gap-1 text-gray-500 hover:text-emerald-500 transition-colors"> <svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" class="icon" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"> <path d="M7 11v8a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1v-7a1 1 0 0 1 1 -1h3a4 4 0 0 0 4 -4v-1a2 2 0 0 1 4 0v5h3a2 2 0 0 1 2 2l-1 5a2 3 0 0 1 -2 2h-7a3 3 0 0 1 -3 -3"> </path> </svg> <span class="text-sm">0</span> </button> <!-- Unlike button --> <button onclick="alert('ব্যাখ্যায় ভোট দিতে লগইন করুন')" class="flex items-center gap-1 text-gray-500 hover:text-red-500 transition-colors"> <svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" class="icon" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"> <path d="M7 13v-8a1 1 0 0 0 -1 -1h-2a1 1 0 0 0 -1 1v7a1 1 0 0 0 1 1h3a4 4 0 0 1 4 4v1a2 2 0 0 0 4 0v-5h3a2 2 0 0 0 2 -2l-1 -5a2 3 0 0 0 -2 -2h-7a3 3 0 0 0 -3 3"> </path> </svg> <span class="text-sm">0</span> </button> </div> </div> </div> <!-- Other Answers (Toggle with Alpine.js) --> </div> </div> </div> <div class="select-none mt-2 ml-2"> <div class="" x-data="{showDescription: true}" > <div class="flex items-start justify-between group rounded-lg cursor-pointer select-none gap-2 md:gap-4 p-0.5 ps-1 hover:bg-zinc-50 dark:hover:bg-white/5" @click="showDescription = !showDescription" > <a href="https://sattacademy.com/question/%E0%A6%A8%E0%A6%BF%E0%A6%B0%E0%A7%8D%E0%A6%A6%E0%A6%BF%E0%A6%B7%E0%A7%8D%E0%A6%9F-%E0%A6%B8%E0%A6%AE%E0%A7%9F-%E0%A6%AA%E0%A6%B0-%E0%A6%93%E0%A7%9F%E0%A7%87%E0%A6%AC-%E0%A6%AA%E0%A7%87%E0%A6%9C%E0%A6%9F%E0%A6%BF-%E0%A6%A6%E0%A7%87%E0%A6%96%E0%A6%BE-%E0%A6%A8%E0%A6%BE-%E0%A6%AF%E0%A6%BE%E0%A6%93%E0%A7%9F%E0%A6%BE%E0%A6%B0-%E0%A6%B8%E0%A6%AE%E0%A6%B8%E0%A7%8D%E0%A6%AF%E0%A6%BE%E0%A6%9F%E0%A6%BF-%E0%A6%B8%E0%A6%AE%E0%A6%BE%E0%A6%A7%E0%A6%BE%E0%A6%A8%E0%A7%87%E0%A6%B0-%E0%A6%89%E0%A6%AA%E0%A6%BE%E0%A7%9F-%E0%A6%AC%E0%A6%BF%E0%A6%B6%E0%A7%8D%E0%A6%B2%E0%A7%87%E0%A6%B7%E0%A6%A3-%E0%A6%95%E0%A6%B0" class="flex items-start overflow-x-auto overflow-y-hidden scrollbar-hide pt-1 gap-2" @click.stop> <span class="text-zinc-800 dark:text-zinc-100 shrink-0 leading-relaxed font-normal text-sm"> (ঘ) </span> <div class="flex flex-col gap-1"> <div class="text-zinc-800 dark:text-zinc-200 leading-relaxed font-normal text-sm"> নির্দিষ্ট সময় পর ওয়েব পেজটি দেখা না যাওয়ার সমস্যাটি সমাধানের উপায় বিশ্লেষণ কর। </div> </div> <div class="flex items-center gap-0.5 pt-1"> </div> </a> <div class="shrink-0"> <button class="w-8 h-8 flex items-center justify-center rounded-md hover:bg-zinc-100 dark:hover:bg-zinc-700" aria-label="Toggle description"> <svg x-show="!showDescription" x-cloak class="w-4 h-4 text-gray-500 dark:text-gray-400 transition-transform" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"> </path> </svg> <svg x-show="showDescription" x-cloak class="w-4 h-4 text-gray-500 dark:text-gray-400 transition-transform" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 15l7-7 7 7"> </path> </svg> </button> </div> </div> <div x-show="showDescription" x-data="{ showOtherDescs: false }" x-transition:enter="transition ease-out duration-200" x-transition:enter-start="opacity-0 transform -translate-y-2" x-transition:enter-end="opacity-100 transform translate-y-0" class="space-y-4 mt-1 des"> <!-- Best Answer Card --> <div class="relative bg-[#dcebe596] dark:bg-[#2c3532] rounded-lg p-4 mb-4 border border-gray-200 dark:border-gray-700"> <!-- Content --> <div class="text-gray-700 dark:text-gray-300 text-sm mb-3 leading-relaxed prose prose-sm dark:prose-invert max-w-none overflow-x-auto hide-scrollbar"> <span class="font-semibold text-gray-800 dark:text-gray-200 float-left mr-1"> উত্তরঃ </span> <p>একটি ওয়েবপেজ নির্দিষ্ট সময় পর দেখা না যাওয়ার সমস্যাটি একটি সাধারণ বিষয়, যা বিভিন্ন কারণে হতে পারে। এই সমস্যা সমাধানের জন্য এর মূল কারণগুলো চিহ্নিত করা এবং সে অনুযায়ী পদক্ষেপ নেওয়া অত্যন্ত জরুরি। কারণ চিহ্নিত করতে ব্যর্থ হলে বা সময়মতো পদক্ষেপ না নিলে একটি ওয়েবসাইট দীর্ঘ সময়ের জন্য ইন্টারনেট থেকে অদৃশ্য হয়ে যেতে পারে, যা ব্যক্তিগত বা ব্যবসায়িক উভয়ের জন্যই ক্ষতিকর।</p> <p>উদ্দীপকে অপুর তৈরি করা ওয়েবপেজটি হোস্টিং করার পরও নির্দিষ্ট সময় পর আর দেখা যাচ্ছিল না। এর প্রধান কারণ হতে পারে ওয়েব হোস্টিং অথবা ডোমেইন সংক্রান্ত সমস্যার সৃষ্টি। একটি ওয়েবসাইট অনলাইনে সক্রিয় রাখতে নিয়মিত হোস্টিং এবং ডোমেইন নবায়ন করা অপরিহার্য। অপুর ক্ষেত্রে, সম্ভবত ডোমেইনের মেয়াদ শেষ হয়ে গেছে অথবা হোস্টিং সেবাদাতার সাথে তার চুক্তি শেষ হয়ে গেছে, যার ফলস্বরূপ তার ওয়েবপেজটি আর অ্যাক্সেস করা যাচ্ছে না।</p> <p>ওয়েবপেজটি দেখা না যাওয়ার সমস্যা সমাধানের জন্য নিম্নলিখিত উপায়গুলো বিশ্লেষণ করা যেতে পারে:</p> <ul> <li><strong>ডোমেইন নবায়ন (Domain Renewal):</strong> ওয়েবসাইটের ঠিকানা অর্থাৎ ডোমেইন নেম নির্দিষ্ট মেয়াদের জন্য রেজিস্টার করা থাকে (যেমন – ১ বছর, ২ বছর ইত্যাদি)। মেয়াদ শেষ হওয়ার পর এটি নবায়ন না করলে ওয়েবসাইটটি ইন্টারনেট থেকে অদৃশ্য হয়ে যায়। অপুকে তার ডোমেইনের মেয়াদ পরীক্ষা করে দ্রুত নবায়নের ব্যবস্থা করতে হবে।</li> <li><strong>হোস্টিং নবায়ন ও সার্ভার পরীক্ষা (Hosting Renewal & Server Check):</strong> ওয়েবসাইটের ফাইলগুলো যেখানে জমা থাকে, সেই হোস্টিং সার্ভিসেরও নির্দিষ্ট মেয়াদ থাকে। হোস্টিং প্যাকেজের মেয়াদ শেষ হয়ে গেলে বা হোস্টিং সার্ভারে কোনো প্রযুক্তিগত সমস্যা দেখা দিলে ওয়েবসাইট দেখা যায় না। অপুকে তার হোস্টিং সেবাদাতার সাথে যোগাযোগ করে হোস্টিং নবায়ন করতে হবে এবং সার্ভারের স্ট্যাটাস জানতে চাইতে হবে।</li> <li><strong>DNS সমস্যা (DNS Issues):</strong> ডোমেইন নেম সিস্টেম (DNS) ডোমেইনকে আইপি অ্যাড্রেসে (IP Address) রূপান্তর করে। DNS সেটিংসে ভুল বা মেয়াদোত্তীর্ণ DNS এন্ট্রি থাকলে ওয়েবসাইট লোড হয় না। অপুকে তার ডোমেইন রেজিস্ট্রারের মাধ্যমে DNS সেটিংস পরীক্ষা করে সঠিক আছে কিনা নিশ্চিত করতে হবে।</li> <li><strong>ওয়েব সার্ভার ডাউনটাইম (Web Server Downtime):</strong> হোস্টিং প্রদানকারীর সার্ভার রক্ষণাবেক্ষণ অথবা প্রযুক্তিগত ত্রুটির কারণে সাময়িকভাবে ডাউন (down) হতে পারে। এক্ষেত্রে, অপুকে হোস্টিং প্রোভাইডারের সাপোর্ট টিমের সাথে যোগাযোগ করে সার্ভারের স্ট্যাটাস জানতে হবে এবং তাদের সমাধানের জন্য অপেক্ষা করতে হবে।</li> <li><strong>ওয়েব কন্টেন্ট পরীক্ষা (Web Content Check):</strong> যদিও এটি কম সম্ভাব্য কারণ, তবে ওয়েবসাইটে কোনো ক্ষতিকারক কোড বা ভাইরাস থাকলে হোস্টিং প্রোভাইডার নিরাপত্তার স্বার্থে ওয়েবসাইটটি সাময়িকভাবে বন্ধ করে দিতে পারে। এই ক্ষেত্রে, কন্টেন্ট পরীক্ষা করে সমস্যা সমাধান করা উচিত।</li> </ul> <p>পরিশেষে, অপুর ওয়েবপেজটি দৃশ্যমান না হওয়ার সমস্যাটি সমাধান করতে হলে তাকে প্রথমে ডোমেইন এবং হোস্টিংয়ের মেয়াদ পরীক্ষা করে নবায়ন করতে হবে। এরপর DNS সেটিংস এবং হোস্টিং সার্ভারের স্ট্যাটাস যাচাই করতে হবে। নিয়মিত এই বিষয়গুলো পর্যবেক্ষণ করা এবং সেবাদাতাদের সাথে সুসম্পর্ক রাখা একটি ওয়েবসাইটকে অনলাইনে সক্রিয় রাখতে অত্যন্ত গুরুত্বপূর্ণ।</p> </div> <!-- Footer with time and actions --> <div class="flex items-center justify-between"> <div class="flex items-center gap-2"> <img src="https://sattacademy.com/uploads/avatar/1752391341.png" class="w-7 h-7 rounded-full object-cover" alt="Satt AI" > <div> <a href="https://sattacademy.com/user/u&id=476188/profile" class="text-sm font-medium text-zinc-700 dark:text-zinc-400 hover:text-blue-600 dark:hover:text-blue-400 leading-none"> Satt AI </a> <div class="text-xs text-zinc-500 dark:text-zinc-400 leading-none"> 1 month ago </div> </div> </div> <div class="flex items-center gap-3"> <!-- Like button --> <button onclick="alert('ব্যাখ্যায় ভোট দিতে লগইন করুন')" class="flex items-center gap-1 text-gray-500 hover:text-emerald-500 transition-colors"> <svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" class="icon" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"> <path d="M7 11v8a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1v-7a1 1 0 0 1 1 -1h3a4 4 0 0 0 4 -4v-1a2 2 0 0 1 4 0v5h3a2 2 0 0 1 2 2l-1 5a2 3 0 0 1 -2 2h-7a3 3 0 0 1 -3 -3"> </path> </svg> <span class="text-sm">0</span> </button> <!-- Unlike button --> <button onclick="alert('ব্যাখ্যায় ভোট দিতে লগইন করুন')" class="flex items-center gap-1 text-gray-500 hover:text-red-500 transition-colors"> <svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" class="icon" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"> <path d="M7 13v-8a1 1 0 0 0 -1 -1h-2a1 1 0 0 0 -1 1v7a1 1 0 0 0 1 1h3a4 4 0 0 1 4 4v1a2 2 0 0 0 4 0v-5h3a2 2 0 0 0 2 -2l-1 -5a2 3 0 0 0 -2 -2h-7a3 3 0 0 0 -3 3"> </path> </svg> <span class="text-sm">0</span> </button> </div> </div> </div> <!-- Other Answers (Toggle with Alpine.js) --> </div> </div> </div> </div> <div class="flex md:hidden items-center justify-between gap-2 mt-1 mb-2 flex-wrap md:flex-nowrap"> <div class="ml-auto"> <div class="flex items-center gap-4 shrink-0 cursor-pointer ques-action-bar" > <div class="flex items-center gap-1 text-zinc-400 dark:text-zinc-500 cursor-default"> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" class="iconify iconify--solar text-md"> <g fill="none" stroke="currentColor" stroke-width="1.5"> <path d="M3.275 15.296C2.425 14.192 2 13.639 2 12c0-1.64.425-2.191 1.275-3.296C4.972 6.5 7.818 4 12 4s7.028 2.5 8.725 4.704C21.575 9.81 22 10.361 22 12c0 1.64-.425 2.191-1.275 3.296C19.028 17.5 16.182 20 12 20s-7.028-2.5-8.725-4.704Z"></path> <path d="M15 12a3 3 0 1 1-6 0a3 3 0 0 1 6 0Z"></path> </g> </svg> <span class="text-md leading-none text-zinc-800 dark:text-zinc-200">216</span> </div> <div class="flex items-center gap-3"> <button class="w-6 h-6 flex items-center justify-center rounded-full cursor-pointer text-zinc-400 dark:text-zinc-500 hover:text-yellow-500 dark:hover:text-yellow-400 hover:bg-yellow-50 dark:hover:bg-yellow-900/20" onclick="alert('অ্যানালিটিক্স দেখতে লগইন করুন')" aria-label="Question Analytics" title="Analytics"> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" class="iconify iconify--basil text-md"> <path fill="currentColor" d="M11.25 2.745c0-.116-.1-.208-.216-.196A9.5 9.5 0 0 0 2.5 12a9.5 9.5 0 0 0 16.243 6.692a.197.197 0 0 0-.017-.292l-7.197-5.817A.75.75 0 0 1 11.25 12z"></path> <path fill="currentColor" d="M19.67 17.234c.09.073.224.054.288-.044a9.45 9.45 0 0 0 1.494-4.225a.197.197 0 0 0-.197-.215h-6.568a.2.2 0 0 0-.126.355zm1.585-5.984c.116 0 .208-.1.197-.216a9.5 9.5 0 0 0-8.486-8.486a.197.197 0 0 0-.216.197v8.205a.3.3 0 0 0 .3.3z"></path> </svg> </button> <button class="relative w-6 h-6 flex items-center justify-center rounded-full cursor-pointer text-zinc-400 dark:text-zinc-500 hover:text-yellow-500 dark:hover:text-yellow-400 " onclick="alert('বুকমার্ক করতে লগইন করুন')" class="text-zinc-400 hover:text-yellow-600" aria-label="Bookmark question" title="Bookmark"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="w-4 h-4"> <path fill="currentColor" d="M8 3h8a3 3 0 0 1 3 3v15l-7-3l-7 3V6a3 3 0 0 1 3-3m0 1a2 2 0 0 0-2 2v13.5l6-2.56l6 2.56V6a2 2 0 0 0-2-2z"></path> </svg> </button> <button class="relative w-6 h-6 flex items-center justify-center rounded-full text-zinc-400 dark:text-zinc-500 hover:text-pink-500 dark:hover:text-pink-400 " onclick="alert('পছন্দ করতে লগইন করুন')" class="text-zinc-400 hover:text-pink-500" aria-label="Favorite question" title="Favorite"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="w-4 h-4"> <path fill="currentColor" d="m8.962 18.91l.464-.588zM12 5.5l-.54.52a.75.75 0 0 0 1.08 0zm3.038 13.41l.465.59zm-5.612-.588C7.91 17.127 6.253 15.96 4.938 14.48C3.65 13.028 2.75 11.335 2.75 9.137h-1.5c0 2.666 1.11 4.7 2.567 6.339c1.43 1.61 3.254 2.9 4.68 4.024zM2.75 9.137c0-2.15 1.215-3.954 2.874-4.713c1.612-.737 3.778-.541 5.836 1.597l1.08-1.04C10.1 2.444 7.264 2.025 5 3.06C2.786 4.073 1.25 6.425 1.25 9.137zM8.497 19.5c.513.404 1.063.834 1.62 1.16s1.193.59 1.883.59v-1.5c-.31 0-.674-.12-1.126-.385c-.453-.264-.922-.628-1.448-1.043zm7.006 0c1.426-1.125 3.25-2.413 4.68-4.024c1.457-1.64 2.567-3.673 2.567-6.339h-1.5c0 2.198-.9 3.891-2.188 5.343c-1.315 1.48-2.972 2.647-4.488 3.842zM22.75 9.137c0-2.712-1.535-5.064-3.75-6.077c-2.264-1.035-5.098-.616-7.54 1.92l1.08 1.04c2.058-2.137 4.224-2.333 5.836-1.596c1.659.759 2.874 2.562 2.874 4.713zm-8.176 9.185c-.526.415-.995.779-1.448 1.043s-.816.385-1.126.385v1.5c.69 0 1.326-.265 1.883-.59c.558-.326 1.107-.756 1.62-1.16z"></path> </svg> </button> <button class="w-6 h-6 flex items-center justify-center rounded-full cursor-pointer text-zinc-400 dark:text-zinc-500 hover:text-red-500 dark:hover:text-red-400 hover:bg-red-50 dark:hover:bg-red-900/20" onclick="alert('রিপোর্ট করতে লগইন করুন')" aria-label="Flag question" title="Flag"> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" class="iconify iconify--solar text-md"> <path fill="none" stroke="currentColor" stroke-linecap="round" stroke-width="1.5" d="M5 22v-8m0 0V4m0 10l2.47-.494a8.7 8.7 0 0 1 4.925.452a8.68 8.68 0 0 0 5.327.361l.214-.053A1.404 1.404 0 0 0 19 12.904V5.537a1.2 1.2 0 0 0-1.49-1.164a8 8 0 0 1-4.911-.334l-.204-.081a8.7 8.7 0 0 0-4.924-.452L5 4m0 0V2"></path> </svg> </button> <button class="w-6 h-6 flex items-center justify-center rounded-full cursor-pointer text-zinc-400 dark:text-zinc-500 hover:text-blue-500 dark:hover:text-blue-400 hover:bg-blue-50 dark:hover:bg-blue-900/20" onclick="alert('শেয়ার করতে লগইন করুন')" aria-label="Share question" title="Share"> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" class="iconify iconify--solar text-md"> <g fill="none" stroke="currentColor" stroke-width="1.5"> <path d="M9 12a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0Z"></path> <path stroke-linecap="round" d="M14 6.5L9 10m5 7.5L9 14"></path> <path d="M19 18.5a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0Zm0-13a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0Z"></path> </g> </svg> </button> </div> </div> </div> </div> </div> <div class="flex items-center justify-center mb-2"> <style> @keyframes fadeUp { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } } @keyframes pulse-ring { 0% { transform: scale(1); opacity: 0.7; } 70% { transform: scale(1.5); opacity: 0; } 100% { transform: scale(1); opacity: 0; } } @keyframes countUp { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } } .strip { display: flex; align-items: center; gap: 5px; overflow-x: auto; flex-wrap: nowrap; max-width: 100%; -ms-overflow-style: none; scrollbar-width: none; } .strip::-webkit-scrollbar { height: 4px; } .pill { display: inline-flex; flex-shrink: 0; align-items: center; gap: 4px; border-radius: 50px; padding: 4px 10px; font-size: 11px; font-weight: 500; cursor: pointer; border: none; text-decoration: none; white-space: nowrap; opacity: 0; transition: transform 0.15s, box-shadow 0.15s, background 0.15s; position: relative; overflow: hidden; } .pill.show { animation: fadeUp 0.4s ease forwards; } .pill:hover { transform: translateY(-3px); box-shadow: 0 6px 18px rgba(0, 0, 0, 0.13); } .pill:active { transform: scale(0.96); } .pill-mcq { background: #1a7a3c; color: #fff !important; animation-delay: 0s; } .pill-cq { background: #155e2f; color: #fff !important; animation-delay: 0.12s; } .pill-prac { background: #fff; color: #1a7a3c; border: 2px solid #1a7a3c; animation-delay: 0.24s; } [data-theme="dark"] .pill-mcq, [data-theme="dark"] .pill-cq { color: #fff !important; } .pill svg { width: 15px; height: 15px; fill: currentColor; flex-shrink: 0; } .pill-count { font-weight: 500; font-size: 11px; } .pill-prac .pulse-wrap { position: relative; width: 15px; height: 15px; display: flex; align-items: center; justify-content: center; } .pill-prac .pulse-wrap::before { content: ''; position: absolute; inset: -3px; border-radius: 50%; background: #1a7a3c; animation: pulse-ring 1.8s ease infinite; } .prac-icon { position: relative; z-index: 1; } .ripple { position: absolute; border-radius: 50%; background: rgba(255, 255, 255, 0.3); width: 100px; height: 100px; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(0); animation: ripple-out 0.5s ease forwards; pointer-events: none; } @keyframes ripple-out { to { transform: translate(-50%, -50%) scale(3); opacity: 0; } } .dopamin-toast { display: inline-block; margin-left: 8px; background: #eaf3de; color: #27500A; border-radius: 20px; padding: 6px 14px; font-size: 13px; font-weight: 500; opacity: 0; transform: translateX(-8px); transition: opacity 0.2s, transform 0.2s; } .dopamin-toast.show { opacity: 1; transform: translateX(0); } </style> <div class="strip justify-content-md-center overflow-hidden"> <a href="https://sattacademy.com/all-mcq/%E0%A6%93%E0%A7%9F%E0%A7%87%E0%A6%AC-%E0%A6%A1%E0%A6%BF%E0%A6%9C%E0%A6%BE%E0%A6%87%E0%A6%A8-%E0%A6%AA%E0%A6%B0%E0%A6%BF%E0%A6%9A%E0%A6%BF%E0%A6%A4%E0%A6%BF-%E0%A6%8F%E0%A6%AC%E0%A6%82-html-68638" class="pill pill-mcq" id="mcqBtn"> MCQ: <span class="pill-count" id="mcqCount">498</span> </a> <a href="https://sattacademy.com/all-written/%E0%A6%93%E0%A7%9F%E0%A7%87%E0%A6%AC-%E0%A6%A1%E0%A6%BF%E0%A6%9C%E0%A6%BE%E0%A6%87%E0%A6%A8-%E0%A6%AA%E0%A6%B0%E0%A6%BF%E0%A6%9A%E0%A6%BF%E0%A6%A4%E0%A6%BF-%E0%A6%8F%E0%A6%AC%E0%A6%82-html-68638" class="pill pill-cq" id="cqBtn"> CQ: <span class="pill-count" id="cqCount">51</span> </a> <a href="/user/practice?mode=fresh&name=ওয়েব ডিজাইন পরিচিতি এবং HTML&source=subject&source_id=6246" class="pill pill-prac" id="pracBtn"> <div class="pulse-wrap"> <svg class="prac-icon" viewBox="0 0 24 24"> <path d="M8 5v14l11-7z" /> </svg> </div> Practice </a> <a class="pill pill-prac p-0" href="https://play.google.com/store/apps/details?id=com.sattacademy.app" target="_blank" rel="noopener" aria-label="Satt Academy Play Store Link"> <img src="/satt_logo/playstore-white.png" alt="Satt Academy Play Store" style="width: 70px; height: auto; cursor: pointer;"> </a> </div> <div class="text-center"> <span class="dopamin-toast" id="dopamin-toast"></span> </div> </div> <div class="rounded-xl border border-zinc-100 dark:border-zinc-800 overflow-auto scrollbar-hide mb-4"> <div class="flex items-center justify-between bg-emerald-50 dark:bg-emerald-900/20 px-5 py-3"> <a href="https://sattacademy.com/guide/%E0%A6%93%E0%A7%9F%E0%A7%87%E0%A6%AC-%E0%A6%A1%E0%A6%BF%E0%A6%9C%E0%A6%BE%E0%A6%87%E0%A6%A8-%E0%A6%AA%E0%A6%B0%E0%A6%BF%E0%A6%9A%E0%A6%BF%E0%A6%A4%E0%A6%BF-%E0%A6%8F%E0%A6%AC%E0%A6%82-html-68638"> </h2 class="text-zinc-800 dark:text-zinc-100 font-semibold text-base"> ওয়েব ডিজাইন পরিচিতি এবং HTML </h2> </a> </div> <div class="p-5 text-justify space-y-4"> <div class="prose prose-sm dark:prose-invert max-w-none text-zinc-700 dark:text-zinc-300 text-[15px]"> <p style="text-align:justify; margin-bottom:11px"><span style="font-size:11pt"><span style="line-height:107%"><span style="font-family:Calibri,sans-serif"><span style="font-family:Kalpurush">আমরা সবাই জানি ইন্টারনেট ব্যবহার করে ইমেইল, ফাইল শেয়ারিং, ভয়েস কলিং এরকম বিভিন্ন তথ্য ও সেৰা আদান-প্রদান করা যায়। এদের মধ্যে তথ্য আদান-প্রদানের জন্য বহুল ব্যবহৃত একটি মডেল হচ্ছে ওয়েৰ। ওয়েব হচ্ছে ওয়ার্ল্ড ওয়াইড ওয়েব-এর সংক্ষিপ্ত রূপ। ওয়েবের মাধ্যমে ইন্টারনেট ব্যবহার করে ছুটি যন্ত্রের মধ্যে তথ্য আদান-প্রদান করা যায়। বর্তমানে ওয়েবকে আমরা বলতে পারি তথ্যভান্ডার যেখানে অনেক তথ্য রিসোর্স, ওয়েব ডকুমেন্ট আকারে সঞ্চিত আছে। জামরা আমাদের দৈনন্দিন জীবনে ওয়েবের নানা ধরনের তথ্যের উপর পুরোপুরি নির্ভরশীল হয়ে গেছি। এই অধ্যায়ে কীভাবে একটি কার্যকর ওয়েব সাইট তৈরি করা যায় সেটি শিক্ষার্থীদের সামনে তুলে ধরা হবে।</span></span></span></span></p> <p style="text-align:justify; margin-bottom:11px"><span style="font-size:11pt"><span style="line-height:107%"><span style="font-family:Calibri,sans-serif"><span style="font-family:Kalpurush">এ অধ্যায় পাঠ শেষে শিক্ষার্থীরা-</span></span></span></span></p> <ul> <li style="text-align:justify; margin-left:8px"><span style="font-size:11pt"><span style="line-height:107%"><span style="font-family:Calibri,sans-serif"><span style="font-family:Kalpurush">ওয়েব ডিজাইনের ধারণা ব্যাখ্যা করতে পারবে; </span></span></span></span></li> <li style="text-align:justify; margin-left:8px"><span style="font-size:11pt"><span style="line-height:107%"><span style="font-family:Calibri,sans-serif"><span style="font-family:Kalpurush">ওয়েবসাইটের কাঠামো বর্ণনা করতে পারবে;</span></span></span></span></li> <li style="text-align:justify; margin-left:8px"><span style="font-size:11pt"><span style="line-height:107%"><span style="font-family:Calibri,sans-serif"><span style="font-family:Kalpurush">এইচটিএমএল-এর ধারণা ব্যাখ্যা করতে পারবে।</span></span></span></span></li> <li style="text-align:justify; margin-left:8px"><span style="font-size:11pt"><span style="line-height:107%"><span style="font-family:Calibri,sans-serif"><span style="font-family:Kalpurush">এইচটিএমএল ব্যবহার করে ওয়েব পেইজ ডিজাইন করতে পারবে; </span></span></span></span></li> <li style="text-align:justify; margin-bottom:11px; margin-left:8px"><span style="font-size:11pt"><span style="line-height:107%"><span style="font-family:Calibri,sans-serif"><span style="font-family:Kalpurush">ওয়েব সাইট পাবলিশ করতে পারবে।</span></span></span></span></li> </ul> </div> </div> </div> <div class="grid grid-cols-1 gap-5 lg:grid-cols-2 xl:gap-10"> <div class="col-span-full"> <div class="flex flex-col"> <!-- Header Section --> <div class="bg-gray-100 dark:bg-zinc-800 px-0 py-2 rounded-t-lg"> <div class="flex items-center justify-between px-4"> <h2 class="text-dark dark:text-gray-100 text-xl font-semibold"> Related Question </h2> <a href="https://sattacademy.com/all-written/%E0%A6%A4%E0%A6%A5%E0%A7%8D%E0%A6%AF-%E0%A6%93-%E0%A6%AF%E0%A7%8B%E0%A6%97%E0%A6%BE%E0%A6%AF%E0%A7%8B%E0%A6%97-%E0%A6%AA%E0%A7%8D%E0%A6%B0%E0%A6%AF%E0%A7%81%E0%A6%95%E0%A7%8D%E0%A6%A4%E0%A6%BF" class="inline-flex items-center gap-2 bg-white dark:bg-zinc-700 hover:bg-gray-50 dark:hover:bg-zinc-700 text-gray-900 dark:text-gray-100 px-2 py-1.5 rounded-lg transition-colors duration-200"> <svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" class="h-4 w-4"> <path d="M12 6h-6a2 2 0 0 0 -2 2v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-6"></path> <path d="M11 13l9 -9"></path> <path d="M15 4h5v5"></path> </svg> View All </a> </div> </div> <!-- Question Cards --> <div class="space-y-5"> <div class="select-none group border rounded-md p-2 bg-white dark:bg-zinc-800 mb-2 border-zinc-100 dark:border-white/5"> <div class="" x-data="{showDescription: true}" > <div class="flex items-start justify-between group rounded-lg cursor-pointer select-none gap-2 md:gap-4 p-0.5 ps-1 " @click="showDescription = !showDescription" > <a href="https://sattacademy.com/question/%E0%A6%95-html-%E0%A6%8F%E0%A6%B0-%E0%A6%8F%E0%A6%B2%E0%A6%BF%E0%A6%AE%E0%A7%87%E0%A6%A8%E0%A7%8D%E0%A6%9F-%E0%A6%95%E0%A7%80" class="flex items-start overflow-x-auto overflow-y-hidden scrollbar-hide pt-1 gap-2" @click.stop> <div class="flex flex-col gap-1"> <div class="text-zinc-800 dark:text-zinc-200 leading-relaxed font-medium text-md"> ক. HTML এর এলিমেন্ট কী? </div> </div> <div class="flex items-center gap-0.5 pt-1"> </div> </a> <div class="shrink-0"> <button class="w-8 h-8 flex items-center justify-center rounded-md hover:bg-zinc-100 dark:hover:bg-zinc-700" aria-label="Toggle description"> <svg x-show="!showDescription" x-cloak class="w-4 h-4 text-gray-500 dark:text-gray-400 transition-transform" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"> </path> </svg> <svg x-show="showDescription" x-cloak class="w-4 h-4 text-gray-500 dark:text-gray-400 transition-transform" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 15l7-7 7 7"> </path> </svg> </button> </div> </div> <div class="flex items-center justify-between gap-2 mt-1 mb-2 flex-wrap md:flex-nowrap"> <div class="flex overflow-x-auto scrollbar-hide gap-2 mt-2 tags-22195"> <a href="https://sattacademy.com/%E0%A6%8F%E0%A6%95%E0%A6%BE%E0%A6%A6%E0%A6%B6-%E0%A6%A6%E0%A7%8D%E0%A6%AC%E0%A6%BE%E0%A6%A6%E0%A6%B6-%E0%A6%B6%E0%A7%8D%E0%A6%B0%E0%A7%87%E0%A6%A3%E0%A6%BF/cq" class="inline-flex items-center px-2.5 py-1 text-[11px] font-normal rounded-full border whitespace-nowrap bg-zinc-100 dark:bg-zinc-800 text-zinc-600 dark:text-zinc-300 border-zinc-100 dark:border-white/5 hover:bg-zinc-200 dark:hover:bg-zinc-700 hover:text-zinc-800 dark:hover:text-zinc-200 " title="এইচএসসি"> এইচএসসি </a> <a href="https://sattacademy.com/all-written/%E0%A6%A4%E0%A6%A5%E0%A7%8D%E0%A6%AF-%E0%A6%93-%E0%A6%AF%E0%A7%8B%E0%A6%97%E0%A6%BE%E0%A6%AF%E0%A7%8B%E0%A6%97-%E0%A6%AA%E0%A7%8D%E0%A6%B0%E0%A6%AF%E0%A7%81%E0%A6%95%E0%A7%8D%E0%A6%A4%E0%A6%BF" class="inline-flex items-center px-2.5 py-1 text-[11px] font-normal rounded-full border whitespace-nowrap bg-zinc-100 dark:bg-zinc-800 text-zinc-600 dark:text-zinc-300 border-zinc-100 dark:border-white/5 hover:bg-zinc-200 dark:hover:bg-zinc-700 hover:text-zinc-800 dark:hover:text-zinc-200 " title="তথ্য ও যোগাযোগ প্রযুক্তি"> তথ্য ও যোগাযোগ প্রযুক্তি </a> <a href="https://sattacademy.com/all-written/%E0%A6%93%E0%A7%9F%E0%A7%87%E0%A6%AC-%E0%A6%A1%E0%A6%BF%E0%A6%9C%E0%A6%BE%E0%A6%87%E0%A6%A8-%E0%A6%AA%E0%A6%B0%E0%A6%BF%E0%A6%9A%E0%A6%BF%E0%A6%A4%E0%A6%BF-%E0%A6%8F%E0%A6%AC%E0%A6%82-html-68638" class="inline-flex items-center px-2.5 py-1 text-[11px] font-normal rounded-full border whitespace-nowrap bg-zinc-100 dark:bg-zinc-800 text-zinc-600 dark:text-zinc-300 border-zinc-100 dark:border-white/5 hover:bg-zinc-200 dark:hover:bg-zinc-700 hover:text-zinc-800 dark:hover:text-zinc-200 " title="ওয়েব ডিজাইন পরিচিতি এবং HTML"> ওয়েব ডিজাইন পরিচিতি এবং HTML </a> </div> <div class="ml-auto hidden md:block"> <div class="flex items-center gap-4 shrink-0 cursor-pointer ques-action-bar" > <div class="flex items-center gap-1 text-zinc-400 dark:text-zinc-500 cursor-default"> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" class="iconify iconify--solar text-md"> <g fill="none" stroke="currentColor" stroke-width="1.5"> <path d="M3.275 15.296C2.425 14.192 2 13.639 2 12c0-1.64.425-2.191 1.275-3.296C4.972 6.5 7.818 4 12 4s7.028 2.5 8.725 4.704C21.575 9.81 22 10.361 22 12c0 1.64-.425 2.191-1.275 3.296C19.028 17.5 16.182 20 12 20s-7.028-2.5-8.725-4.704Z"></path> <path d="M15 12a3 3 0 1 1-6 0a3 3 0 0 1 6 0Z"></path> </g> </svg> <span class="text-md leading-none text-zinc-800 dark:text-zinc-200">1.9k</span> </div> <div class="flex items-center gap-3"> <button class="w-6 h-6 flex items-center justify-center rounded-full cursor-pointer text-zinc-400 dark:text-zinc-500 hover:text-yellow-500 dark:hover:text-yellow-400 hover:bg-yellow-50 dark:hover:bg-yellow-900/20" onclick="alert('অ্যানালিটিক্স দেখতে লগইন করুন')" aria-label="Question Analytics" title="Analytics"> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" class="iconify iconify--basil text-md"> <path fill="currentColor" d="M11.25 2.745c0-.116-.1-.208-.216-.196A9.5 9.5 0 0 0 2.5 12a9.5 9.5 0 0 0 16.243 6.692a.197.197 0 0 0-.017-.292l-7.197-5.817A.75.75 0 0 1 11.25 12z"></path> <path fill="currentColor" d="M19.67 17.234c.09.073.224.054.288-.044a9.45 9.45 0 0 0 1.494-4.225a.197.197 0 0 0-.197-.215h-6.568a.2.2 0 0 0-.126.355zm1.585-5.984c.116 0 .208-.1.197-.216a9.5 9.5 0 0 0-8.486-8.486a.197.197 0 0 0-.216.197v8.205a.3.3 0 0 0 .3.3z"></path> </svg> </button> <button class="relative w-6 h-6 flex items-center justify-center rounded-full cursor-pointer text-zinc-400 dark:text-zinc-500 hover:text-yellow-500 dark:hover:text-yellow-400 " onclick="alert('বুকমার্ক করতে লগইন করুন')" class="text-zinc-400 hover:text-yellow-600" aria-label="Bookmark question" title="Bookmark"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="w-4 h-4"> <path fill="currentColor" d="M8 3h8a3 3 0 0 1 3 3v15l-7-3l-7 3V6a3 3 0 0 1 3-3m0 1a2 2 0 0 0-2 2v13.5l6-2.56l6 2.56V6a2 2 0 0 0-2-2z"></path> </svg> </button> <button class="relative w-6 h-6 flex items-center justify-center rounded-full text-zinc-400 dark:text-zinc-500 hover:text-pink-500 dark:hover:text-pink-400 " onclick="alert('পছন্দ করতে লগইন করুন')" class="text-zinc-400 hover:text-pink-500" aria-label="Favorite question" title="Favorite"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="w-4 h-4"> <path fill="currentColor" d="m8.962 18.91l.464-.588zM12 5.5l-.54.52a.75.75 0 0 0 1.08 0zm3.038 13.41l.465.59zm-5.612-.588C7.91 17.127 6.253 15.96 4.938 14.48C3.65 13.028 2.75 11.335 2.75 9.137h-1.5c0 2.666 1.11 4.7 2.567 6.339c1.43 1.61 3.254 2.9 4.68 4.024zM2.75 9.137c0-2.15 1.215-3.954 2.874-4.713c1.612-.737 3.778-.541 5.836 1.597l1.08-1.04C10.1 2.444 7.264 2.025 5 3.06C2.786 4.073 1.25 6.425 1.25 9.137zM8.497 19.5c.513.404 1.063.834 1.62 1.16s1.193.59 1.883.59v-1.5c-.31 0-.674-.12-1.126-.385c-.453-.264-.922-.628-1.448-1.043zm7.006 0c1.426-1.125 3.25-2.413 4.68-4.024c1.457-1.64 2.567-3.673 2.567-6.339h-1.5c0 2.198-.9 3.891-2.188 5.343c-1.315 1.48-2.972 2.647-4.488 3.842zM22.75 9.137c0-2.712-1.535-5.064-3.75-6.077c-2.264-1.035-5.098-.616-7.54 1.92l1.08 1.04c2.058-2.137 4.224-2.333 5.836-1.596c1.659.759 2.874 2.562 2.874 4.713zm-8.176 9.185c-.526.415-.995.779-1.448 1.043s-.816.385-1.126.385v1.5c.69 0 1.326-.265 1.883-.59c.558-.326 1.107-.756 1.62-1.16z"></path> </svg> </button> <button class="w-6 h-6 flex items-center justify-center rounded-full cursor-pointer text-zinc-400 dark:text-zinc-500 hover:text-red-500 dark:hover:text-red-400 hover:bg-red-50 dark:hover:bg-red-900/20" onclick="alert('রিপোর্ট করতে লগইন করুন')" aria-label="Flag question" title="Flag"> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" class="iconify iconify--solar text-md"> <path fill="none" stroke="currentColor" stroke-linecap="round" stroke-width="1.5" d="M5 22v-8m0 0V4m0 10l2.47-.494a8.7 8.7 0 0 1 4.925.452a8.68 8.68 0 0 0 5.327.361l.214-.053A1.404 1.404 0 0 0 19 12.904V5.537a1.2 1.2 0 0 0-1.49-1.164a8 8 0 0 1-4.911-.334l-.204-.081a8.7 8.7 0 0 0-4.924-.452L5 4m0 0V2"></path> </svg> </button> <button class="w-6 h-6 flex items-center justify-center rounded-full cursor-pointer text-zinc-400 dark:text-zinc-500 hover:text-blue-500 dark:hover:text-blue-400 hover:bg-blue-50 dark:hover:bg-blue-900/20" onclick="alert('শেয়ার করতে লগইন করুন')" aria-label="Share question" title="Share"> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" class="iconify iconify--solar text-md"> <g fill="none" stroke="currentColor" stroke-width="1.5"> <path d="M9 12a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0Z"></path> <path stroke-linecap="round" d="M14 6.5L9 10m5 7.5L9 14"></path> <path d="M19 18.5a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0Zm0-13a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0Z"></path> </g> </svg> </button> </div> </div> </div> </div> <div x-show="showDescription" x-data="{ showOtherDescs: false }" x-transition:enter="transition ease-out duration-200" x-transition:enter-start="opacity-0 transform -translate-y-2" x-transition:enter-end="opacity-100 transform translate-y-0" class="space-y-4 mt-1 des"> <!-- Best Answer Card --> <div class="relative bg-[#dcebe596] dark:bg-[#2c3532] rounded-lg p-4 mb-4 border border-gray-200 dark:border-gray-700"> <!-- Content --> <div class="text-gray-700 dark:text-gray-300 text-sm mb-3 leading-relaxed prose prose-sm dark:prose-invert max-w-none overflow-x-auto hide-scrollbar"> <span class="font-semibold text-gray-800 dark:text-gray-200 float-left mr-1"> উত্তরঃ </span> <p>একটি HTML ফাইলকে ব্রাউজারে সুন্দরভাবে উপস্থাপনের জন্য বিভিন্ন ট্যাগ ব্যবহার করা হয়, আর এই ট্যাগ এবং ট্যাগের ভেতরের বিষয়বস্তুকে একত্রে HTML এলিমেন্ট বলে।</p> </div> <!-- Footer with time and actions --> <div class="flex items-center justify-between"> <div class="flex items-center gap-2"> <img src="https://sattacademy.com/uploads/avatar/1752391341.png" class="w-7 h-7 rounded-full object-cover" alt="Satt AI" > <div> <a href="https://sattacademy.com/user/u&id=476188/profile" class="text-sm font-medium text-zinc-700 dark:text-zinc-400 hover:text-blue-600 dark:hover:text-blue-400 leading-none"> Satt AI </a> <div class="text-xs text-zinc-500 dark:text-zinc-400 leading-none"> 1 month ago </div> </div> </div> <div class="flex items-center gap-3"> <!-- Like button --> <button onclick="alert('ব্যাখ্যায় ভোট দিতে লগইন করুন')" class="flex items-center gap-1 text-gray-500 hover:text-emerald-500 transition-colors"> <svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" class="icon" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"> <path d="M7 11v8a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1v-7a1 1 0 0 1 1 -1h3a4 4 0 0 0 4 -4v-1a2 2 0 0 1 4 0v5h3a2 2 0 0 1 2 2l-1 5a2 3 0 0 1 -2 2h-7a3 3 0 0 1 -3 -3"> </path> </svg> <span class="text-sm">0</span> </button> <!-- Unlike button --> <button onclick="alert('ব্যাখ্যায় ভোট দিতে লগইন করুন')" class="flex items-center gap-1 text-gray-500 hover:text-red-500 transition-colors"> <svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" class="icon" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"> <path d="M7 13v-8a1 1 0 0 0 -1 -1h-2a1 1 0 0 0 -1 1v7a1 1 0 0 0 1 1h3a4 4 0 0 1 4 4v1a2 2 0 0 0 4 0v-5h3a2 2 0 0 0 2 -2l-1 -5a2 3 0 0 0 -2 -2h-7a3 3 0 0 0 -3 3"> </path> </svg> <span class="text-sm">0</span> </button> </div> </div> </div> <!-- Other Answers (Toggle with Alpine.js) --> </div> </div> <div class="flex md:hidden items-center justify-between gap-2 mt-1 mb-2 flex-wrap md:flex-nowrap"> <div class="ml-auto"> <div class="flex items-center gap-4 shrink-0 cursor-pointer ques-action-bar" > <div class="flex items-center gap-1 text-zinc-400 dark:text-zinc-500 cursor-default"> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" class="iconify iconify--solar text-md"> <g fill="none" stroke="currentColor" stroke-width="1.5"> <path d="M3.275 15.296C2.425 14.192 2 13.639 2 12c0-1.64.425-2.191 1.275-3.296C4.972 6.5 7.818 4 12 4s7.028 2.5 8.725 4.704C21.575 9.81 22 10.361 22 12c0 1.64-.425 2.191-1.275 3.296C19.028 17.5 16.182 20 12 20s-7.028-2.5-8.725-4.704Z"></path> <path d="M15 12a3 3 0 1 1-6 0a3 3 0 0 1 6 0Z"></path> </g> </svg> <span class="text-md leading-none text-zinc-800 dark:text-zinc-200">1.9k</span> </div> <div class="flex items-center gap-3"> <button class="w-6 h-6 flex items-center justify-center rounded-full cursor-pointer text-zinc-400 dark:text-zinc-500 hover:text-yellow-500 dark:hover:text-yellow-400 hover:bg-yellow-50 dark:hover:bg-yellow-900/20" onclick="alert('অ্যানালিটিক্স দেখতে লগইন করুন')" aria-label="Question Analytics" title="Analytics"> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" class="iconify iconify--basil text-md"> <path fill="currentColor" d="M11.25 2.745c0-.116-.1-.208-.216-.196A9.5 9.5 0 0 0 2.5 12a9.5 9.5 0 0 0 16.243 6.692a.197.197 0 0 0-.017-.292l-7.197-5.817A.75.75 0 0 1 11.25 12z"></path> <path fill="currentColor" d="M19.67 17.234c.09.073.224.054.288-.044a9.45 9.45 0 0 0 1.494-4.225a.197.197 0 0 0-.197-.215h-6.568a.2.2 0 0 0-.126.355zm1.585-5.984c.116 0 .208-.1.197-.216a9.5 9.5 0 0 0-8.486-8.486a.197.197 0 0 0-.216.197v8.205a.3.3 0 0 0 .3.3z"></path> </svg> </button> <button class="relative w-6 h-6 flex items-center justify-center rounded-full cursor-pointer text-zinc-400 dark:text-zinc-500 hover:text-yellow-500 dark:hover:text-yellow-400 " onclick="alert('বুকমার্ক করতে লগইন করুন')" class="text-zinc-400 hover:text-yellow-600" aria-label="Bookmark question" title="Bookmark"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="w-4 h-4"> <path fill="currentColor" d="M8 3h8a3 3 0 0 1 3 3v15l-7-3l-7 3V6a3 3 0 0 1 3-3m0 1a2 2 0 0 0-2 2v13.5l6-2.56l6 2.56V6a2 2 0 0 0-2-2z"></path> </svg> </button> <button class="relative w-6 h-6 flex items-center justify-center rounded-full text-zinc-400 dark:text-zinc-500 hover:text-pink-500 dark:hover:text-pink-400 " onclick="alert('পছন্দ করতে লগইন করুন')" class="text-zinc-400 hover:text-pink-500" aria-label="Favorite question" title="Favorite"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="w-4 h-4"> <path fill="currentColor" d="m8.962 18.91l.464-.588zM12 5.5l-.54.52a.75.75 0 0 0 1.08 0zm3.038 13.41l.465.59zm-5.612-.588C7.91 17.127 6.253 15.96 4.938 14.48C3.65 13.028 2.75 11.335 2.75 9.137h-1.5c0 2.666 1.11 4.7 2.567 6.339c1.43 1.61 3.254 2.9 4.68 4.024zM2.75 9.137c0-2.15 1.215-3.954 2.874-4.713c1.612-.737 3.778-.541 5.836 1.597l1.08-1.04C10.1 2.444 7.264 2.025 5 3.06C2.786 4.073 1.25 6.425 1.25 9.137zM8.497 19.5c.513.404 1.063.834 1.62 1.16s1.193.59 1.883.59v-1.5c-.31 0-.674-.12-1.126-.385c-.453-.264-.922-.628-1.448-1.043zm7.006 0c1.426-1.125 3.25-2.413 4.68-4.024c1.457-1.64 2.567-3.673 2.567-6.339h-1.5c0 2.198-.9 3.891-2.188 5.343c-1.315 1.48-2.972 2.647-4.488 3.842zM22.75 9.137c0-2.712-1.535-5.064-3.75-6.077c-2.264-1.035-5.098-.616-7.54 1.92l1.08 1.04c2.058-2.137 4.224-2.333 5.836-1.596c1.659.759 2.874 2.562 2.874 4.713zm-8.176 9.185c-.526.415-.995.779-1.448 1.043s-.816.385-1.126.385v1.5c.69 0 1.326-.265 1.883-.59c.558-.326 1.107-.756 1.62-1.16z"></path> </svg> </button> <button class="w-6 h-6 flex items-center justify-center rounded-full cursor-pointer text-zinc-400 dark:text-zinc-500 hover:text-red-500 dark:hover:text-red-400 hover:bg-red-50 dark:hover:bg-red-900/20" onclick="alert('রিপোর্ট করতে লগইন করুন')" aria-label="Flag question" title="Flag"> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" class="iconify iconify--solar text-md"> <path fill="none" stroke="currentColor" stroke-linecap="round" stroke-width="1.5" d="M5 22v-8m0 0V4m0 10l2.47-.494a8.7 8.7 0 0 1 4.925.452a8.68 8.68 0 0 0 5.327.361l.214-.053A1.404 1.404 0 0 0 19 12.904V5.537a1.2 1.2 0 0 0-1.49-1.164a8 8 0 0 1-4.911-.334l-.204-.081a8.7 8.7 0 0 0-4.924-.452L5 4m0 0V2"></path> </svg> </button> <button class="w-6 h-6 flex items-center justify-center rounded-full cursor-pointer text-zinc-400 dark:text-zinc-500 hover:text-blue-500 dark:hover:text-blue-400 hover:bg-blue-50 dark:hover:bg-blue-900/20" onclick="alert('শেয়ার করতে লগইন করুন')" aria-label="Share question" title="Share"> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" class="iconify iconify--solar text-md"> <g fill="none" stroke="currentColor" stroke-width="1.5"> <path d="M9 12a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0Z"></path> <path stroke-linecap="round" d="M14 6.5L9 10m5 7.5L9 14"></path> <path d="M19 18.5a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0Zm0-13a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0Z"></path> </g> </svg> </button> </div> </div> </div> </div> </div> <div class="select-none group border rounded-md p-2 bg-white dark:bg-zinc-800 mb-2 border-zinc-100 dark:border-white/5"> <div class="" x-data="{showDescription: true}" > <div class="flex items-start justify-between group rounded-lg cursor-pointer select-none gap-2 md:gap-4 p-0.5 ps-1 " @click="showDescription = !showDescription" > <a href="https://sattacademy.com/question/%E0%A6%96-%E0%A6%93%E0%A6%AF%E0%A6%BC%E0%A7%87%E0%A6%AC%E0%A6%B8%E0%A6%BE%E0%A6%87%E0%A6%9F-%E0%A6%AA%E0%A6%BE%E0%A6%AC%E0%A6%B2%E0%A6%BF%E0%A6%B6-%E0%A6%95%E0%A6%B0%E0%A6%BE%E0%A6%B0-%E0%A6%9C%E0%A6%A8%E0%A7%8D%E0%A6%AF-%E0%A6%95%E0%A7%8B%E0%A6%A8%E0%A6%9F%E0%A6%BF-%E0%A6%AA%E0%A7%8D%E0%A6%B0%E0%A6%AF%E0%A6%BC%E0%A7%8B%E0%A6%9C%E0%A6%A8-%E0%A6%AC%E0%A7%8D%E0%A6%AF%E0%A6%BE%E0%A6%96%E0%A7%8D%E0%A6%AF%E0%A6%BE-%E0%A6%95%E0%A6%B0" class="flex items-start overflow-x-auto overflow-y-hidden scrollbar-hide pt-1 gap-2" @click.stop> <div class="flex flex-col gap-1"> <div class="text-zinc-800 dark:text-zinc-200 leading-relaxed font-medium text-md"> খ. ওয়েবসাইট পাবলিশ করার জন্য কোনটি প্রয়োজন? ব্যাখ্যা কর। </div> </div> <div class="flex items-center gap-0.5 pt-1"> </div> </a> <div class="shrink-0"> <button class="w-8 h-8 flex items-center justify-center rounded-md hover:bg-zinc-100 dark:hover:bg-zinc-700" aria-label="Toggle description"> <svg x-show="!showDescription" x-cloak class="w-4 h-4 text-gray-500 dark:text-gray-400 transition-transform" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"> </path> </svg> <svg x-show="showDescription" x-cloak class="w-4 h-4 text-gray-500 dark:text-gray-400 transition-transform" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 15l7-7 7 7"> </path> </svg> </button> </div> </div> <div class="flex items-center justify-between gap-2 mt-1 mb-2 flex-wrap md:flex-nowrap"> <div class="flex overflow-x-auto scrollbar-hide gap-2 mt-2 tags-22196"> <a href="https://sattacademy.com/%E0%A6%8F%E0%A6%95%E0%A6%BE%E0%A6%A6%E0%A6%B6-%E0%A6%A6%E0%A7%8D%E0%A6%AC%E0%A6%BE%E0%A6%A6%E0%A6%B6-%E0%A6%B6%E0%A7%8D%E0%A6%B0%E0%A7%87%E0%A6%A3%E0%A6%BF/cq" class="inline-flex items-center px-2.5 py-1 text-[11px] font-normal rounded-full border whitespace-nowrap bg-zinc-100 dark:bg-zinc-800 text-zinc-600 dark:text-zinc-300 border-zinc-100 dark:border-white/5 hover:bg-zinc-200 dark:hover:bg-zinc-700 hover:text-zinc-800 dark:hover:text-zinc-200 " title="এইচএসসি"> এইচএসসি </a> <a href="https://sattacademy.com/all-written/%E0%A6%A4%E0%A6%A5%E0%A7%8D%E0%A6%AF-%E0%A6%93-%E0%A6%AF%E0%A7%8B%E0%A6%97%E0%A6%BE%E0%A6%AF%E0%A7%8B%E0%A6%97-%E0%A6%AA%E0%A7%8D%E0%A6%B0%E0%A6%AF%E0%A7%81%E0%A6%95%E0%A7%8D%E0%A6%A4%E0%A6%BF" class="inline-flex items-center px-2.5 py-1 text-[11px] font-normal rounded-full border whitespace-nowrap bg-zinc-100 dark:bg-zinc-800 text-zinc-600 dark:text-zinc-300 border-zinc-100 dark:border-white/5 hover:bg-zinc-200 dark:hover:bg-zinc-700 hover:text-zinc-800 dark:hover:text-zinc-200 " title="তথ্য ও যোগাযোগ প্রযুক্তি"> তথ্য ও যোগাযোগ প্রযুক্তি </a> <a href="https://sattacademy.com/all-written/%E0%A6%93%E0%A7%9F%E0%A7%87%E0%A6%AC-%E0%A6%A1%E0%A6%BF%E0%A6%9C%E0%A6%BE%E0%A6%87%E0%A6%A8-%E0%A6%AA%E0%A6%B0%E0%A6%BF%E0%A6%9A%E0%A6%BF%E0%A6%A4%E0%A6%BF-%E0%A6%8F%E0%A6%AC%E0%A6%82-html-68638" class="inline-flex items-center px-2.5 py-1 text-[11px] font-normal rounded-full border whitespace-nowrap bg-zinc-100 dark:bg-zinc-800 text-zinc-600 dark:text-zinc-300 border-zinc-100 dark:border-white/5 hover:bg-zinc-200 dark:hover:bg-zinc-700 hover:text-zinc-800 dark:hover:text-zinc-200 " title="ওয়েব ডিজাইন পরিচিতি এবং HTML"> ওয়েব ডিজাইন পরিচিতি এবং HTML </a> </div> <div class="ml-auto hidden md:block"> <div class="flex items-center gap-4 shrink-0 cursor-pointer ques-action-bar" > <div class="flex items-center gap-1 text-zinc-400 dark:text-zinc-500 cursor-default"> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" class="iconify iconify--solar text-md"> <g fill="none" stroke="currentColor" stroke-width="1.5"> <path d="M3.275 15.296C2.425 14.192 2 13.639 2 12c0-1.64.425-2.191 1.275-3.296C4.972 6.5 7.818 4 12 4s7.028 2.5 8.725 4.704C21.575 9.81 22 10.361 22 12c0 1.64-.425 2.191-1.275 3.296C19.028 17.5 16.182 20 12 20s-7.028-2.5-8.725-4.704Z"></path> <path d="M15 12a3 3 0 1 1-6 0a3 3 0 0 1 6 0Z"></path> </g> </svg> <span class="text-md leading-none text-zinc-800 dark:text-zinc-200">5.8k</span> </div> <div class="flex items-center gap-3"> <button class="w-6 h-6 flex items-center justify-center rounded-full cursor-pointer text-zinc-400 dark:text-zinc-500 hover:text-yellow-500 dark:hover:text-yellow-400 hover:bg-yellow-50 dark:hover:bg-yellow-900/20" onclick="alert('অ্যানালিটিক্স দেখতে লগইন করুন')" aria-label="Question Analytics" title="Analytics"> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" class="iconify iconify--basil text-md"> <path fill="currentColor" d="M11.25 2.745c0-.116-.1-.208-.216-.196A9.5 9.5 0 0 0 2.5 12a9.5 9.5 0 0 0 16.243 6.692a.197.197 0 0 0-.017-.292l-7.197-5.817A.75.75 0 0 1 11.25 12z"></path> <path fill="currentColor" d="M19.67 17.234c.09.073.224.054.288-.044a9.45 9.45 0 0 0 1.494-4.225a.197.197 0 0 0-.197-.215h-6.568a.2.2 0 0 0-.126.355zm1.585-5.984c.116 0 .208-.1.197-.216a9.5 9.5 0 0 0-8.486-8.486a.197.197 0 0 0-.216.197v8.205a.3.3 0 0 0 .3.3z"></path> </svg> </button> <button class="relative w-6 h-6 flex items-center justify-center rounded-full cursor-pointer text-zinc-400 dark:text-zinc-500 hover:text-yellow-500 dark:hover:text-yellow-400 " onclick="alert('বুকমার্ক করতে লগইন করুন')" class="text-zinc-400 hover:text-yellow-600" aria-label="Bookmark question" title="Bookmark"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="w-4 h-4"> <path fill="currentColor" d="M8 3h8a3 3 0 0 1 3 3v15l-7-3l-7 3V6a3 3 0 0 1 3-3m0 1a2 2 0 0 0-2 2v13.5l6-2.56l6 2.56V6a2 2 0 0 0-2-2z"></path> </svg> </button> <button class="relative w-6 h-6 flex items-center justify-center rounded-full text-zinc-400 dark:text-zinc-500 hover:text-pink-500 dark:hover:text-pink-400 " onclick="alert('পছন্দ করতে লগইন করুন')" class="text-zinc-400 hover:text-pink-500" aria-label="Favorite question" title="Favorite"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="w-4 h-4"> <path fill="currentColor" d="m8.962 18.91l.464-.588zM12 5.5l-.54.52a.75.75 0 0 0 1.08 0zm3.038 13.41l.465.59zm-5.612-.588C7.91 17.127 6.253 15.96 4.938 14.48C3.65 13.028 2.75 11.335 2.75 9.137h-1.5c0 2.666 1.11 4.7 2.567 6.339c1.43 1.61 3.254 2.9 4.68 4.024zM2.75 9.137c0-2.15 1.215-3.954 2.874-4.713c1.612-.737 3.778-.541 5.836 1.597l1.08-1.04C10.1 2.444 7.264 2.025 5 3.06C2.786 4.073 1.25 6.425 1.25 9.137zM8.497 19.5c.513.404 1.063.834 1.62 1.16s1.193.59 1.883.59v-1.5c-.31 0-.674-.12-1.126-.385c-.453-.264-.922-.628-1.448-1.043zm7.006 0c1.426-1.125 3.25-2.413 4.68-4.024c1.457-1.64 2.567-3.673 2.567-6.339h-1.5c0 2.198-.9 3.891-2.188 5.343c-1.315 1.48-2.972 2.647-4.488 3.842zM22.75 9.137c0-2.712-1.535-5.064-3.75-6.077c-2.264-1.035-5.098-.616-7.54 1.92l1.08 1.04c2.058-2.137 4.224-2.333 5.836-1.596c1.659.759 2.874 2.562 2.874 4.713zm-8.176 9.185c-.526.415-.995.779-1.448 1.043s-.816.385-1.126.385v1.5c.69 0 1.326-.265 1.883-.59c.558-.326 1.107-.756 1.62-1.16z"></path> </svg> </button> <button class="w-6 h-6 flex items-center justify-center rounded-full cursor-pointer text-zinc-400 dark:text-zinc-500 hover:text-red-500 dark:hover:text-red-400 hover:bg-red-50 dark:hover:bg-red-900/20" onclick="alert('রিপোর্ট করতে লগইন করুন')" aria-label="Flag question" title="Flag"> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" class="iconify iconify--solar text-md"> <path fill="none" stroke="currentColor" stroke-linecap="round" stroke-width="1.5" d="M5 22v-8m0 0V4m0 10l2.47-.494a8.7 8.7 0 0 1 4.925.452a8.68 8.68 0 0 0 5.327.361l.214-.053A1.404 1.404 0 0 0 19 12.904V5.537a1.2 1.2 0 0 0-1.49-1.164a8 8 0 0 1-4.911-.334l-.204-.081a8.7 8.7 0 0 0-4.924-.452L5 4m0 0V2"></path> </svg> </button> <button class="w-6 h-6 flex items-center justify-center rounded-full cursor-pointer text-zinc-400 dark:text-zinc-500 hover:text-blue-500 dark:hover:text-blue-400 hover:bg-blue-50 dark:hover:bg-blue-900/20" onclick="alert('শেয়ার করতে লগইন করুন')" aria-label="Share question" title="Share"> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" class="iconify iconify--solar text-md"> <g fill="none" stroke="currentColor" stroke-width="1.5"> <path d="M9 12a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0Z"></path> <path stroke-linecap="round" d="M14 6.5L9 10m5 7.5L9 14"></path> <path d="M19 18.5a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0Zm0-13a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0Z"></path> </g> </svg> </button> </div> </div> </div> </div> <div x-show="showDescription" x-data="{ showOtherDescs: false }" x-transition:enter="transition ease-out duration-200" x-transition:enter-start="opacity-0 transform -translate-y-2" x-transition:enter-end="opacity-100 transform translate-y-0" class="space-y-4 mt-1 des"> <!-- Best Answer Card --> <div class="relative bg-[#dcebe596] dark:bg-[#2c3532] rounded-lg p-4 mb-4 border border-gray-200 dark:border-gray-700"> <!-- Content --> <div class="text-gray-700 dark:text-gray-300 text-sm mb-3 leading-relaxed prose prose-sm dark:prose-invert max-w-none overflow-x-auto hide-scrollbar"> <span class="font-semibold text-gray-800 dark:text-gray-200 float-left mr-1"> উত্তরঃ </span> <p>ওয়েবসাইট পাবলিশ করার জন্য প্রধানত ওয়েব সার্ভার (Web Server) বা হোস্টিং (Hosting) এবং একটি ডোমেইন নাম (Domain Name) প্রয়োজন।</p> <p>একটি ওয়েবসাইটকে ইন্টারনেটে সকলের জন্য উন্মুক্ত করতে হলে ওয়েবসাইটের ফাইলগুলো একটি শক্তিশালী কম্পিউটারে সংরক্ষণ করতে হয় যা ২৪/৭ (২৪ ঘণ্টা, ৭ দিন) চালু থাকে এবং ইন্টারনেট সংযুক্ত থাকে। এই কম্পিউটারকেই ওয়েব সার্ভার বলে এবং এই সেবা প্রদানকারীকে হোস্টিং প্রোভাইডার (Hosting Provider) বলা হয়। অন্যদিকে, ডোমেইন নাম হলো ওয়েবসাইটের একটি অনন্য ঠিকানা (যেমন: example.com) যার মাধ্যমে ব্যবহারকারীরা ইন্টারনেট ব্রাউজারে ঠিকানা লিখে ওয়েবসাইটটি খুঁজে পায়। এই দুটি উপাদান ছাড়া ওয়েবসাইট ইন্টারনেটে অ্যাক্সেস করা সম্ভব নয়।</p> </div> <!-- Footer with time and actions --> <div class="flex items-center justify-between"> <div class="flex items-center gap-2"> <img src="https://sattacademy.com/uploads/avatar/1752391341.png" class="w-7 h-7 rounded-full object-cover" alt="Satt AI" > <div> <a href="https://sattacademy.com/user/u&id=476188/profile" class="text-sm font-medium text-zinc-700 dark:text-zinc-400 hover:text-blue-600 dark:hover:text-blue-400 leading-none"> Satt AI </a> <div class="text-xs text-zinc-500 dark:text-zinc-400 leading-none"> 1 month ago </div> </div> </div> <div class="flex items-center gap-3"> <!-- Like button --> <button onclick="alert('ব্যাখ্যায় ভোট দিতে লগইন করুন')" class="flex items-center gap-1 text-gray-500 hover:text-emerald-500 transition-colors"> <svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" class="icon" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"> <path d="M7 11v8a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1v-7a1 1 0 0 1 1 -1h3a4 4 0 0 0 4 -4v-1a2 2 0 0 1 4 0v5h3a2 2 0 0 1 2 2l-1 5a2 3 0 0 1 -2 2h-7a3 3 0 0 1 -3 -3"> </path> </svg> <span class="text-sm">0</span> </button> <!-- Unlike button --> <button onclick="alert('ব্যাখ্যায় ভোট দিতে লগইন করুন')" class="flex items-center gap-1 text-gray-500 hover:text-red-500 transition-colors"> <svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" class="icon" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"> <path d="M7 13v-8a1 1 0 0 0 -1 -1h-2a1 1 0 0 0 -1 1v7a1 1 0 0 0 1 1h3a4 4 0 0 1 4 4v1a2 2 0 0 0 4 0v-5h3a2 2 0 0 0 2 -2l-1 -5a2 3 0 0 0 -2 -2h-7a3 3 0 0 0 -3 3"> </path> </svg> <span class="text-sm">0</span> </button> </div> </div> </div> <!-- Other Answers (Toggle with Alpine.js) --> </div> </div> <div class="flex md:hidden items-center justify-between gap-2 mt-1 mb-2 flex-wrap md:flex-nowrap"> <div class="ml-auto"> <div class="flex items-center gap-4 shrink-0 cursor-pointer ques-action-bar" > <div class="flex items-center gap-1 text-zinc-400 dark:text-zinc-500 cursor-default"> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" class="iconify iconify--solar text-md"> <g fill="none" stroke="currentColor" stroke-width="1.5"> <path d="M3.275 15.296C2.425 14.192 2 13.639 2 12c0-1.64.425-2.191 1.275-3.296C4.972 6.5 7.818 4 12 4s7.028 2.5 8.725 4.704C21.575 9.81 22 10.361 22 12c0 1.64-.425 2.191-1.275 3.296C19.028 17.5 16.182 20 12 20s-7.028-2.5-8.725-4.704Z"></path> <path d="M15 12a3 3 0 1 1-6 0a3 3 0 0 1 6 0Z"></path> </g> </svg> <span class="text-md leading-none text-zinc-800 dark:text-zinc-200">5.8k</span> </div> <div class="flex items-center gap-3"> <button class="w-6 h-6 flex items-center justify-center rounded-full cursor-pointer text-zinc-400 dark:text-zinc-500 hover:text-yellow-500 dark:hover:text-yellow-400 hover:bg-yellow-50 dark:hover:bg-yellow-900/20" onclick="alert('অ্যানালিটিক্স দেখতে লগইন করুন')" aria-label="Question Analytics" title="Analytics"> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" class="iconify iconify--basil text-md"> <path fill="currentColor" d="M11.25 2.745c0-.116-.1-.208-.216-.196A9.5 9.5 0 0 0 2.5 12a9.5 9.5 0 0 0 16.243 6.692a.197.197 0 0 0-.017-.292l-7.197-5.817A.75.75 0 0 1 11.25 12z"></path> <path fill="currentColor" d="M19.67 17.234c.09.073.224.054.288-.044a9.45 9.45 0 0 0 1.494-4.225a.197.197 0 0 0-.197-.215h-6.568a.2.2 0 0 0-.126.355zm1.585-5.984c.116 0 .208-.1.197-.216a9.5 9.5 0 0 0-8.486-8.486a.197.197 0 0 0-.216.197v8.205a.3.3 0 0 0 .3.3z"></path> </svg> </button> <button class="relative w-6 h-6 flex items-center justify-center rounded-full cursor-pointer text-zinc-400 dark:text-zinc-500 hover:text-yellow-500 dark:hover:text-yellow-400 " onclick="alert('বুকমার্ক করতে লগইন করুন')" class="text-zinc-400 hover:text-yellow-600" aria-label="Bookmark question" title="Bookmark"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="w-4 h-4"> <path fill="currentColor" d="M8 3h8a3 3 0 0 1 3 3v15l-7-3l-7 3V6a3 3 0 0 1 3-3m0 1a2 2 0 0 0-2 2v13.5l6-2.56l6 2.56V6a2 2 0 0 0-2-2z"></path> </svg> </button> <button class="relative w-6 h-6 flex items-center justify-center rounded-full text-zinc-400 dark:text-zinc-500 hover:text-pink-500 dark:hover:text-pink-400 " onclick="alert('পছন্দ করতে লগইন করুন')" class="text-zinc-400 hover:text-pink-500" aria-label="Favorite question" title="Favorite"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="w-4 h-4"> <path fill="currentColor" d="m8.962 18.91l.464-.588zM12 5.5l-.54.52a.75.75 0 0 0 1.08 0zm3.038 13.41l.465.59zm-5.612-.588C7.91 17.127 6.253 15.96 4.938 14.48C3.65 13.028 2.75 11.335 2.75 9.137h-1.5c0 2.666 1.11 4.7 2.567 6.339c1.43 1.61 3.254 2.9 4.68 4.024zM2.75 9.137c0-2.15 1.215-3.954 2.874-4.713c1.612-.737 3.778-.541 5.836 1.597l1.08-1.04C10.1 2.444 7.264 2.025 5 3.06C2.786 4.073 1.25 6.425 1.25 9.137zM8.497 19.5c.513.404 1.063.834 1.62 1.16s1.193.59 1.883.59v-1.5c-.31 0-.674-.12-1.126-.385c-.453-.264-.922-.628-1.448-1.043zm7.006 0c1.426-1.125 3.25-2.413 4.68-4.024c1.457-1.64 2.567-3.673 2.567-6.339h-1.5c0 2.198-.9 3.891-2.188 5.343c-1.315 1.48-2.972 2.647-4.488 3.842zM22.75 9.137c0-2.712-1.535-5.064-3.75-6.077c-2.264-1.035-5.098-.616-7.54 1.92l1.08 1.04c2.058-2.137 4.224-2.333 5.836-1.596c1.659.759 2.874 2.562 2.874 4.713zm-8.176 9.185c-.526.415-.995.779-1.448 1.043s-.816.385-1.126.385v1.5c.69 0 1.326-.265 1.883-.59c.558-.326 1.107-.756 1.62-1.16z"></path> </svg> </button> <button class="w-6 h-6 flex items-center justify-center rounded-full cursor-pointer text-zinc-400 dark:text-zinc-500 hover:text-red-500 dark:hover:text-red-400 hover:bg-red-50 dark:hover:bg-red-900/20" onclick="alert('রিপোর্ট করতে লগইন করুন')" aria-label="Flag question" title="Flag"> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" class="iconify iconify--solar text-md"> <path fill="none" stroke="currentColor" stroke-linecap="round" stroke-width="1.5" d="M5 22v-8m0 0V4m0 10l2.47-.494a8.7 8.7 0 0 1 4.925.452a8.68 8.68 0 0 0 5.327.361l.214-.053A1.404 1.404 0 0 0 19 12.904V5.537a1.2 1.2 0 0 0-1.49-1.164a8 8 0 0 1-4.911-.334l-.204-.081a8.7 8.7 0 0 0-4.924-.452L5 4m0 0V2"></path> </svg> </button> <button class="w-6 h-6 flex items-center justify-center rounded-full cursor-pointer text-zinc-400 dark:text-zinc-500 hover:text-blue-500 dark:hover:text-blue-400 hover:bg-blue-50 dark:hover:bg-blue-900/20" onclick="alert('শেয়ার করতে লগইন করুন')" aria-label="Share question" title="Share"> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" class="iconify iconify--solar text-md"> <g fill="none" stroke="currentColor" stroke-width="1.5"> <path d="M9 12a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0Z"></path> <path stroke-linecap="round" d="M14 6.5L9 10m5 7.5L9 14"></path> <path d="M19 18.5a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0Zm0-13a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0Z"></path> </g> </svg> </button> </div> </div> </div> </div> </div> <div class="select-none group border rounded-md p-2 bg-white dark:bg-zinc-800 mb-2 border-zinc-100 dark:border-white/5"> <div class="" x-data="{showDescription: true}" > <div class="flex items-start justify-between group rounded-lg cursor-pointer select-none gap-2 md:gap-4 p-0.5 ps-1 " @click="showDescription = !showDescription" > <a href="https://sattacademy.com/question/%E0%A6%97-%E0%A6%89%E0%A6%A6%E0%A7%8D%E0%A6%A6%E0%A7%80%E0%A6%AA%E0%A6%95%E0%A7%87-%E0%A6%89%E0%A6%B2%E0%A7%8D%E0%A6%B2%E0%A6%BF%E0%A6%96%E0%A6%BF%E0%A6%A4-%E0%A6%B9%E0%A7%8B%E0%A6%AE-%E0%A6%AA%E0%A7%87%E0%A6%9C-%E0%A6%A4%E0%A7%88%E0%A6%B0%E0%A6%BF%E0%A6%B0-%E0%A6%9C%E0%A6%A8%E0%A7%8D%E0%A6%AF-html-%E0%A6%95%E0%A7%8B%E0%A6%A1-%E0%A6%B2%E0%A6%BF%E0%A6%96" class="flex items-start overflow-x-auto overflow-y-hidden scrollbar-hide pt-1 gap-2" @click.stop> <div class="flex flex-col gap-1"> <div class="text-zinc-800 dark:text-zinc-200 leading-relaxed font-medium text-md"> গ. উদ্দীপকে উল্লিখিত হোম পেজ তৈরির জন্য HTML কোড লিখ। </div> </div> <div class="flex items-center gap-0.5 pt-1"> </div> </a> <div class="shrink-0"> <button class="w-8 h-8 flex items-center justify-center rounded-md hover:bg-zinc-100 dark:hover:bg-zinc-700" aria-label="Toggle description"> <svg x-show="!showDescription" x-cloak class="w-4 h-4 text-gray-500 dark:text-gray-400 transition-transform" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"> </path> </svg> <svg x-show="showDescription" x-cloak class="w-4 h-4 text-gray-500 dark:text-gray-400 transition-transform" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 15l7-7 7 7"> </path> </svg> </button> </div> </div> <div class="flex items-center justify-between gap-2 mt-1 mb-2 flex-wrap md:flex-nowrap"> <div class="flex overflow-x-auto scrollbar-hide gap-2 mt-2 tags-22197"> <a href="https://sattacademy.com/%E0%A6%8F%E0%A6%95%E0%A6%BE%E0%A6%A6%E0%A6%B6-%E0%A6%A6%E0%A7%8D%E0%A6%AC%E0%A6%BE%E0%A6%A6%E0%A6%B6-%E0%A6%B6%E0%A7%8D%E0%A6%B0%E0%A7%87%E0%A6%A3%E0%A6%BF/cq" class="inline-flex items-center px-2.5 py-1 text-[11px] font-normal rounded-full border whitespace-nowrap bg-zinc-100 dark:bg-zinc-800 text-zinc-600 dark:text-zinc-300 border-zinc-100 dark:border-white/5 hover:bg-zinc-200 dark:hover:bg-zinc-700 hover:text-zinc-800 dark:hover:text-zinc-200 " title="এইচএসসি"> এইচএসসি </a> <a href="https://sattacademy.com/all-written/%E0%A6%A4%E0%A6%A5%E0%A7%8D%E0%A6%AF-%E0%A6%93-%E0%A6%AF%E0%A7%8B%E0%A6%97%E0%A6%BE%E0%A6%AF%E0%A7%8B%E0%A6%97-%E0%A6%AA%E0%A7%8D%E0%A6%B0%E0%A6%AF%E0%A7%81%E0%A6%95%E0%A7%8D%E0%A6%A4%E0%A6%BF" class="inline-flex items-center px-2.5 py-1 text-[11px] font-normal rounded-full border whitespace-nowrap bg-zinc-100 dark:bg-zinc-800 text-zinc-600 dark:text-zinc-300 border-zinc-100 dark:border-white/5 hover:bg-zinc-200 dark:hover:bg-zinc-700 hover:text-zinc-800 dark:hover:text-zinc-200 " title="তথ্য ও যোগাযোগ প্রযুক্তি"> তথ্য ও যোগাযোগ প্রযুক্তি </a> <a href="https://sattacademy.com/all-written/%E0%A6%93%E0%A7%9F%E0%A7%87%E0%A6%AC-%E0%A6%A1%E0%A6%BF%E0%A6%9C%E0%A6%BE%E0%A6%87%E0%A6%A8-%E0%A6%AA%E0%A6%B0%E0%A6%BF%E0%A6%9A%E0%A6%BF%E0%A6%A4%E0%A6%BF-%E0%A6%8F%E0%A6%AC%E0%A6%82-html-68638" class="inline-flex items-center px-2.5 py-1 text-[11px] font-normal rounded-full border whitespace-nowrap bg-zinc-100 dark:bg-zinc-800 text-zinc-600 dark:text-zinc-300 border-zinc-100 dark:border-white/5 hover:bg-zinc-200 dark:hover:bg-zinc-700 hover:text-zinc-800 dark:hover:text-zinc-200 " title="ওয়েব ডিজাইন পরিচিতি এবং HTML"> ওয়েব ডিজাইন পরিচিতি এবং HTML </a> </div> <div class="ml-auto hidden md:block"> <div class="flex items-center gap-4 shrink-0 cursor-pointer ques-action-bar" > <div class="flex items-center gap-1 text-zinc-400 dark:text-zinc-500 cursor-default"> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" class="iconify iconify--solar text-md"> <g fill="none" stroke="currentColor" stroke-width="1.5"> <path d="M3.275 15.296C2.425 14.192 2 13.639 2 12c0-1.64.425-2.191 1.275-3.296C4.972 6.5 7.818 4 12 4s7.028 2.5 8.725 4.704C21.575 9.81 22 10.361 22 12c0 1.64-.425 2.191-1.275 3.296C19.028 17.5 16.182 20 12 20s-7.028-2.5-8.725-4.704Z"></path> <path d="M15 12a3 3 0 1 1-6 0a3 3 0 0 1 6 0Z"></path> </g> </svg> <span class="text-md leading-none text-zinc-800 dark:text-zinc-200">6.7k</span> </div> <div class="flex items-center gap-3"> <button class="w-6 h-6 flex items-center justify-center rounded-full cursor-pointer text-zinc-400 dark:text-zinc-500 hover:text-yellow-500 dark:hover:text-yellow-400 hover:bg-yellow-50 dark:hover:bg-yellow-900/20" onclick="alert('অ্যানালিটিক্স দেখতে লগইন করুন')" aria-label="Question Analytics" title="Analytics"> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" class="iconify iconify--basil text-md"> <path fill="currentColor" d="M11.25 2.745c0-.116-.1-.208-.216-.196A9.5 9.5 0 0 0 2.5 12a9.5 9.5 0 0 0 16.243 6.692a.197.197 0 0 0-.017-.292l-7.197-5.817A.75.75 0 0 1 11.25 12z"></path> <path fill="currentColor" d="M19.67 17.234c.09.073.224.054.288-.044a9.45 9.45 0 0 0 1.494-4.225a.197.197 0 0 0-.197-.215h-6.568a.2.2 0 0 0-.126.355zm1.585-5.984c.116 0 .208-.1.197-.216a9.5 9.5 0 0 0-8.486-8.486a.197.197 0 0 0-.216.197v8.205a.3.3 0 0 0 .3.3z"></path> </svg> </button> <button class="relative w-6 h-6 flex items-center justify-center rounded-full cursor-pointer text-zinc-400 dark:text-zinc-500 hover:text-yellow-500 dark:hover:text-yellow-400 " onclick="alert('বুকমার্ক করতে লগইন করুন')" class="text-zinc-400 hover:text-yellow-600" aria-label="Bookmark question" title="Bookmark"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="w-4 h-4"> <path fill="currentColor" d="M8 3h8a3 3 0 0 1 3 3v15l-7-3l-7 3V6a3 3 0 0 1 3-3m0 1a2 2 0 0 0-2 2v13.5l6-2.56l6 2.56V6a2 2 0 0 0-2-2z"></path> </svg> </button> <button class="relative w-6 h-6 flex items-center justify-center rounded-full text-zinc-400 dark:text-zinc-500 hover:text-pink-500 dark:hover:text-pink-400 " onclick="alert('পছন্দ করতে লগইন করুন')" class="text-zinc-400 hover:text-pink-500" aria-label="Favorite question" title="Favorite"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="w-4 h-4"> <path fill="currentColor" d="m8.962 18.91l.464-.588zM12 5.5l-.54.52a.75.75 0 0 0 1.08 0zm3.038 13.41l.465.59zm-5.612-.588C7.91 17.127 6.253 15.96 4.938 14.48C3.65 13.028 2.75 11.335 2.75 9.137h-1.5c0 2.666 1.11 4.7 2.567 6.339c1.43 1.61 3.254 2.9 4.68 4.024zM2.75 9.137c0-2.15 1.215-3.954 2.874-4.713c1.612-.737 3.778-.541 5.836 1.597l1.08-1.04C10.1 2.444 7.264 2.025 5 3.06C2.786 4.073 1.25 6.425 1.25 9.137zM8.497 19.5c.513.404 1.063.834 1.62 1.16s1.193.59 1.883.59v-1.5c-.31 0-.674-.12-1.126-.385c-.453-.264-.922-.628-1.448-1.043zm7.006 0c1.426-1.125 3.25-2.413 4.68-4.024c1.457-1.64 2.567-3.673 2.567-6.339h-1.5c0 2.198-.9 3.891-2.188 5.343c-1.315 1.48-2.972 2.647-4.488 3.842zM22.75 9.137c0-2.712-1.535-5.064-3.75-6.077c-2.264-1.035-5.098-.616-7.54 1.92l1.08 1.04c2.058-2.137 4.224-2.333 5.836-1.596c1.659.759 2.874 2.562 2.874 4.713zm-8.176 9.185c-.526.415-.995.779-1.448 1.043s-.816.385-1.126.385v1.5c.69 0 1.326-.265 1.883-.59c.558-.326 1.107-.756 1.62-1.16z"></path> </svg> </button> <button class="w-6 h-6 flex items-center justify-center rounded-full cursor-pointer text-zinc-400 dark:text-zinc-500 hover:text-red-500 dark:hover:text-red-400 hover:bg-red-50 dark:hover:bg-red-900/20" onclick="alert('রিপোর্ট করতে লগইন করুন')" aria-label="Flag question" title="Flag"> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" class="iconify iconify--solar text-md"> <path fill="none" stroke="currentColor" stroke-linecap="round" stroke-width="1.5" d="M5 22v-8m0 0V4m0 10l2.47-.494a8.7 8.7 0 0 1 4.925.452a8.68 8.68 0 0 0 5.327.361l.214-.053A1.404 1.404 0 0 0 19 12.904V5.537a1.2 1.2 0 0 0-1.49-1.164a8 8 0 0 1-4.911-.334l-.204-.081a8.7 8.7 0 0 0-4.924-.452L5 4m0 0V2"></path> </svg> </button> <button class="w-6 h-6 flex items-center justify-center rounded-full cursor-pointer text-zinc-400 dark:text-zinc-500 hover:text-blue-500 dark:hover:text-blue-400 hover:bg-blue-50 dark:hover:bg-blue-900/20" onclick="alert('শেয়ার করতে লগইন করুন')" aria-label="Share question" title="Share"> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 24 24" class="iconify iconify--solar text-md"> <g fill="none" stroke="currentColor" stroke-width="1.5"> <path d="M9 12a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0Z"></path> <path stroke-linecap="round" d="M14 6.5L9 10m5 7.5L9 14"></path> <path d="M19 18.5a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0Zm0-13a2.5 2.5 0 1 1-5 0a2.5 2.5 0 0 1 5 0Z"></path> </g> </svg> </button> </div> </div> </div> </div> <div x-show="showDescription" x-data="{ showOtherDescs: false }" x-transition:enter="transition ease-out duration-200" x-transition:enter-start="opacity-0 transform -translate-y-2" x-transition:enter-end="opacity-100 transform translate-y-0" class="space-y-4 mt-1 des"> <!-- Best Answer Card --> <div class="relative bg-[#dcebe596] dark:bg-[#2c3532] rounded-lg p-4 mb-4 border border-gray-200 dark:border-gray-700"> <!-- Content --> <div class="text-gray-700 dark:text-gray-300 text-sm mb-3 leading-relaxed prose prose-sm dark:prose-invert max-w-none overflow-x-auto hide-scrollbar"> <span class="font-semibold text-gray-800 dark:text-gray-200 float-left mr-1"> উত্তরঃ </span> <p>এইচটিএমএল (HyperText Markup Language) হলো ওয়েব পেজ তৈরির জন্য ব্যবহৃত একটি মার্কআপ ভাষা। এটি ওয়েব ব্রাউজারে প্রদর্শিত বিষয়বস্তু যেমন টেক্সট, ছবি এবং লিংক কাঠামোবদ্ধ করতে সাহায্য করে।</p> <p>উদ্দীপকে বর্ণিত X ডিগ্রি কলেজের হোম পেজ তৈরির জন্য <code><img></code> ট্যাগ ব্যবহার করে ict.jpg ছবিটি 200x300 px আকারে যুক্ত করতে হবে। ছবির নিচে notice.html পেজের লিংক তৈরির জন্য <code><a></code> ট্যাগ ব্যবহার করা হবে। এছাড়াও, "Welcome to X Degree College" লেখাটি নীল রঙে প্রদর্শনের জন্য <code><h1></code> ট্যাগের সাথে <code>style="color: blue;"</code> অ্যাট্রিবিউট ব্যবহার করতে হবে।</p> <p>উদ্দীপকের শর্তানুযায়ী হোম পেজ তৈরির জন্য প্রয়োজনীয় HTML কোড নিচে দেওয়া হলো:</p> <p> <!DOCTYPE html><br> <html><br> <head><br>   <title>X Degree College Home


      

    Welcome to X Degree College


      ICT Image
      

    Notice Page



Satt AI
Satt AI
1 month ago
6.7k
উত্তরঃ

X ডিগ্রি কলেজের ওয়েবসাইটটিকে ডায়নামিক ওয়েবসাইট বলা যায় না। এটি একটি স্ট্যাটিক ওয়েবসাইট।

একটি স্ট্যাটিক ওয়েবসাইট মূলত সাধারণ HTML কোড ব্যবহার করে তৈরি করা হয়, যেখানে প্রতিটি পেজ সার্ভারে পূর্ব-নির্ধারিত অবস্থায় সংরক্ষিত থাকে এবং ব্যবহারকারীকে সবসময় একই তথ্য প্রদর্শন করে। এই ওয়েবসাইটগুলোতে সাধারণত সার্ভার-সাইড স্ক্রিপ্টিং ভাষা বা ডেটাবেসের ব্যবহার থাকে না। অন্যদিকে, একটি ডায়নামিক ওয়েবসাইট সার্ভার-সাইড স্ক্রিপ্টিং ভাষা (যেমন PHP, ASP.NET, Python) এবং ডেটাবেস (যেমন MySQL, SQL Server) ব্যবহার করে তৈরি হয়, যা ব্যবহারকারীর কার্যকলাপ বা সময় অনুযায়ী কন্টেন্ট পরিবর্তন করতে সক্ষম এবং ব্যবহারকারীর সাথে ইন্টারঅ্যাক্ট করতে পারে।

উদ্দীপকে উল্লিখিত X ডিগ্রি কলেজের ওয়েবসাইটটি "শুধু এইচটিএমএল ব্যবহার করে" তৈরি করা হয়েছে এবং এতে "ভিজিটরদের মতামত প্রদানের কোনো ব্যবস্থা নেই"। এই দুটি বৈশিষ্ট্য একটি স্ট্যাটিক ওয়েবসাইটের মূল নির্দেশক। যেহেতু ওয়েবসাইটটি শুধুমাত্র HTML ব্যবহার করে নির্মিত, তাই এটি সার্ভার থেকে ব্যবহারকারীর অনুরোধ অনুযায়ী ডেটাবেস থেকে তথ্য এনে প্রদর্শন করতে পারে না বা ব্যবহারকারীর ইনপুট গ্রহণ করে প্রতিক্রিয়া জানাতে পারে না। ওয়েবসাইটের হোম পেজে একটি ছবি (ict.jpg) এবং একটি লিংকের (notice.html) উপস্থিতি এটিকে আরও স্ট্যাটিক প্রকৃতির প্রমাণ করে, কারণ এই উপাদানগুলি পূর্ব-নির্ধারিত এবং স্বয়ংক্রিয়ভাবে পরিবর্তন হয় না।

যদি এটি একটি ডায়নামিক ওয়েবসাইট হতো, তবে এতে ভিজিটরদের মতামত প্রদানের ব্যবস্থা, লগইন অপশন, বা কন্টেন্ট আপডেট করার জন্য একটি অ্যাডমিন প্যানেলের মতো ফিচার্স থাকত। উদ্দীপকের তথ্য বিশ্লেষণ করে নিশ্চিতভাবে বলা যায় যে, X ডিগ্রি কলেজের ওয়েবসাইটটি কোনোভাবেই ডায়নামিক ওয়েবসাইট নয়, বরং এটি একটি স্ট্যাটিক ওয়েবসাইট।

Satt AI
Satt AI
1 month ago
950
উত্তরঃ ওয়েবপেজ হলো ইন্টারনেটে প্রদর্শিত একটি ডিজিটাল ডকুমেন্ট যা টেক্সট, ছবি, ভিডিও এবং অন্যান্য মাল্টিমিডিয়া ডেটা ধারণ করে। এটি সাধারণত HTML (Hypertext Markup Language) দ্বারা লিখিত হয় এবং ওয়েব ব্রাউজারের মাধ্যমে দেখা যায়।
Satt AI
Satt AI
1 month ago
779
উত্তরঃ

ডোমেইন নেম হলো ইন্টারনেটে একটি ওয়েবসাইটের স্বতন্ত্র পরিচয়সূচক নাম, যা সংখ্যাভিত্তিক আইপি অ্যাড্রেসের (IP Address) পরিবর্তে ব্যবহৃত হয়। এটি ব্যবহারকারীদের জন্য ওয়েবসাইট খুঁজে পাওয়া ও মনে রাখা সহজ করে তোলে, কারণ দীর্ঘ এবং জটিল আইপি অ্যাড্রেসের চেয়ে একটি সহজে স্মরণীয় শব্দভিত্তিক নাম ব্যবহারকারীদের জন্য অনেক বেশি সুবিধাজনক।

ডোমেইন নেমের গুরুত্ব অপরিসীম কারণ এটি ইন্টারনেটে একটি সুনির্দিষ্ট অনলাইন ঠিকানা হিসেবে কাজ করে। এটি একটি প্রতিষ্ঠান বা ব্যক্তির অনলাইন ব্র্যান্ডিং (branding) এবং বিশ্বাসযোগ্যতা তৈরিতে অপরিহার্য ভূমিকা পালন করে। ডোমেইন নেম ছাড়া নির্দিষ্ট কোনো ওয়েবসাইটে প্রবেশ করা কঠিন হয়ে পড়ত, যা ডিজিটাল যোগাযোগ, তথ্য আদান-প্রদান ও ই-কমার্সের মতো কার্যক্রমে ব্যাপক বাধা সৃষ্টি করত।

Satt AI
Satt AI
1 month ago
2.8k
শিক্ষকদের জন্য বিশেষভাবে তৈরি

১ ক্লিকে প্রশ্ন, শীট, সাজেশন
অনলাইন পরীক্ষা তৈরির সফটওয়্যার!

শুধু প্রশ্ন সিলেক্ট করুন — প্রশ্নপত্র অটোমেটিক তৈরি!

প্রশ্ন এডিট করা যাবে
জলছাপ দেয়া যাবে
ঠিকানা যুক্ত করা যাবে
Logo, Motto যুক্ত হবে
অটো প্রতিষ্ঠানের নাম
অটো সময়, পূর্ণমান
প্রশ্ন এডিট করা যাবে
জলছাপ দেয়া যাবে
ঠিকানা যুক্ত করা যাবে
Logo, Motto যুক্ত হবে
অটো প্রতিষ্ঠানের নাম
অটো সময়, পূর্ণমান
অটো নির্দেশনা (এডিটযোগ্য)
অটো বিষয় ও অধ্যায়
OMR সংযুক্ত করা যাবে
ফন্ট, কলাম, ডিভাইডার
প্রশ্ন/অপশন স্টাইল পরিবর্তন
সেট কোড, বিষয় কোড
অটো নির্দেশনা (এডিটযোগ্য)
অটো বিষয় ও অধ্যায়
OMR সংযুক্ত করা যাবে
ফন্ট, কলাম, ডিভাইডার
প্রশ্ন/অপশন স্টাইল পরিবর্তন
সেট কোড, বিষয় কোড
এখনই শুরু করুন ডেমো দেখুন
৫০,০০০+
শিক্ষক
৩০ লক্ষ+
প্রশ্নপত্র
মাত্র ১৫ পয়সায় প্রশ্নপত্র
১ ক্লিকে প্রশ্ন, শীট, সাজেশন তৈরি করুন আজই

Complete Exam
Preparation

Learn, practice, analyse and improve

1M+ downloads
4.6 · 8k+ Reviews