Home-theater-designers
CSS ভাষাগুলির একটি অনন্য শ্রেণীর অন্তর্গত, যা স্টাইল শীট ল্যাঙ্গুয়েজ নামে পরিচিত। এটি মূলত আপনার ওয়েব পেজের উপস্থাপনা নির্ধারণ করতে ব্যবহৃত হয়। যদিও এইচটিএমএল আপনাকে নির্দিষ্ট করতে দেয় যে আপনার পৃষ্ঠাটি কীভাবে গঠন করা উচিত, এটি সিএসএস যা এটি স্টাইল করতে ব্যবহৃত হয়। অন্যথায়, আপনি একটি সুন্দর অপ্রীতিকর ওয়েবসাইটের সাথে শেষ করবেন।
CSS- এর উপর মনোযোগ কেন্দ্রীভূত করা আপনার ওয়েবসাইটের আবেদন উন্নত করার অন্যতম সেরা উপায়, বিশেষ করে যখন আপনার ব্যবহারকারীর অভিজ্ঞতা বাড়ানোর কথা আসে। এই ভাবে, আপনি আপনার ট্রাফিক বাড়াতে পারেন। শুরু করার জন্য, আপনি একটি স্ট্যাক করা ফর্ম ব্যবহার করতে পারেন।
স্ট্যাক করা ফর্ম কী?
স্ট্যাক করা ফর্ম আপনাকে একটি বিশেষ ফর্ম তৈরি করতে দেয় যেখানে আপনি আপনার লেবেল এবং ইনপুটগুলিকে একটি অনুভূমিক প্যাটার্নে রাখার পরিবর্তে একে অপরের উপরে রাখতে পারেন।
এখানে আপনি কিভাবে এটি করতে পারেন।
এইচটিএমএল কোড করুন
HTML উপাদান ব্যবহার করুন, , আপনার তথ্য প্রক্রিয়া করতে। প্রাসঙ্গিক ক্ষেত্রগুলির জন্য লেবেল যুক্ত করুন এবং প্রাসঙ্গিক ইনপুট ক্ষেত্রগুলি বরাদ্দ করুন। এই উদাহরণে, আমরা ব্যবহারকারীদের ফর্মের ইনপুট টাইপের সাথে তাদের পুরো নাম এবং ইমেল ঠিকানা দিতে বলছি পাঠ্য , যেখানে একটি ড্রপ-ডাউন মেনু মাধ্যমে তৈরি করা হয় আইডি নির্বাচন করুন তাদের শিল্প চয়ন করতে সাহায্য করার জন্য।
What Is a Stacked Form?
Here's how you create a stacked form.
Full Name
Email Address
Department
Information Technology
Customer Support
Sales
যাইহোক, এই টুকরা কোডটি চালানোর ফলে ক্ষেত্রগুলি উল্লম্বভাবে স্ট্যাক না করে কেবল একটি নরম ফর্ম তৈরি হবে। এবং সেখানেই আপনাকে CSS যোগ করতে হবে।
আপনি কি ম্যাক থেকে নেটফ্লিক্স সিনেমা ডাউনলোড করতে পারেন?
সিএসএস পার্ট কোড করুন
এখন, একটি পৃথক স্টাইল শীট তৈরি করুন এবং বডি ট্যাগের আগে এটি আপনার HTML এ যোগ করুন:
এরপরে, আপনার এইচটিএমএল এর বডি, ইনপুট টাইপ এবং কন্টেইনার নির্বাচন করুন এবং সেগুলিকে সিএসএস এর মাধ্যমে স্টাইল করুন। এতে ফন্ট-পরিবার, প্রস্থ, প্যাডিং, মার্জিন, ডিসপ্লে, সীমানা ইত্যাদি বিভিন্ন CSS বৈশিষ্ট্যের সাথে পরীক্ষা করা এবং আপনার পছন্দের মান যোগ করা হবে। এই ভাবে, আপনি একটি স্ট্যাক করা ফর্ম যা আপনার সঠিক পছন্দ অনুসারে শেষ হবে। এখানে একটি উদাহরণ।
body {
font-family: Calibri;
}
input[type=text], select {
width: 25%;
padding: 12px 20px;
margin: 8px 10;
display: list-item;
border: 4px double #39A9DB;
border-radius: 8px;
box-sizing: border-box;
}
input[type=submit] {
width: 25%;
background-color: #F8E2E6;
color: #0000FF;
padding: 12px 18px;
margin: 20px 0;
border: none;
border-radius: 6px;
cursor: pointer;
}
div.container {
border-radius: 10px;
background-color: #39A9DB;
padding: 40px;
}
নীচের আউটপুট চেক করুন।
এখন আপনি CSS এ একটি স্ট্যাক করা ফর্ম তৈরি করতে পারেন
এই নিবন্ধটি দিয়ে, আপনি শিখেছেন কিভাবে CSS এ স্ট্যাক করা ফর্ম তৈরি করতে হয়। অনুশীলনের সাথে, আপনি আপনার ফর্মগুলি পরিমার্জিত করতে এবং আপনার ওয়েবসাইটকে আরও ব্যবহারকারী বান্ধব করতে সক্ষম হবেন।
কীভাবে নিজের ফোনের স্ক্রিন প্রতিস্থাপন করবেন
প্রোগ্রামিং গেমের নাম 'অনুশীলন'। একটি স্টাইলিশ ওয়েব ডিজাইনার এবং আরও দক্ষ ওয়েব ডেভেলপার হওয়ার জন্য প্রদর্শনী প্রকল্পগুলির সাথে দিন দিন আপনার CSS দক্ষতা উন্নত করুন।
শেয়ার করুন শেয়ার করুন টুইট ইমেইল 10 টি সহজ CSS কোড উদাহরণ আপনি 10 মিনিটে শিখতে পারেনসিএসএসের সাহায্যের প্রয়োজন? শুরু করার জন্য এই মৌলিক CSS কোড উদাহরণগুলি চেষ্টা করুন, তারপর সেগুলি আপনার নিজের ওয়েব পেজে প্রয়োগ করুন।
পরবর্তী পড়ুন সম্পর্কিত বিষয়- প্রোগ্রামিং
- ওয়েব ডেভেলপমেন্ট
- সিএসএস
উসমান একজন কন্টেন্ট মার্কেটার যিনি ডিজিটাল প্ল্যাটফর্মে জৈব প্রবৃদ্ধির সাথে বেশ কয়েকটি ব্যবসাকে সাহায্য করেছেন। তিনি প্রোগ্রামিং এবং রাইটিং দুটোই পছন্দ করেন, যার অর্থ হল টেকনিক্যাল রাইটিং এমন একটি বিষয় যা তিনি অনেক উপভোগ করেন। যখন কাজ না করে, উসমান টিভি শো দেখে, ক্রিকেট অনুসরণ করে এবং ডেটা অ্যানালিটিক্স সম্পর্কে পড়তে সময় কাটায়।
উসমান গণির কাছ থেকে আরোআমাদের নিউজলেটার সদস্যতা
প্রযুক্তি টিপস, রিভিউ, ফ্রি ইবুক এবং এক্সক্লুসিভ ডিলের জন্য আমাদের নিউজলেটারে যোগ দিন!
সাবস্ক্রাইব করতে এখানে ক্লিক করুন