সিএসএস বলতে বুঝায় Cascading Style Sheets.
HTML কোড গুলো কিভাবে (ডিজাইনে) প্রকাশিত হবে তাই প্রকাশ করে
HTML এর সাথে CSS কোড যুক্ত হয়ে প্রকাশিত হয়।
CSS এর কোড গুলো আলাদাভাবে আলাদা ফাইলেও রাখা যায় যা HTML এ কল করে সংযুক্ত করা যায়।
CSS এর মাধ্যমে কোড লিখতে সবচেয়ে বড় যে সুবিধা পাওয়া যায় তা হলো বার বার একই কোড লিখতে হয় না।
Luxurious Style ব্যবহার করে যা করা যাবেঃ 1. নরমাল টেক্সটের মতো যে কোন color দেয়া যাবে। 2. একই টেক্সটের মাঝে একাধিক color দেয়া যাবে। 3. টেক্সটের মাঝে সকল ধরনের বর্ডার ব্যবহার করা যাবে। 4. টেক্সটের মাঝে image ব্যবহার করা যাবে। 5. শুধুমাত্র image দিয়েই টেক্সট তৈরি করা যাবে। 6. টেক্সটের মাঝে Gradient color ব্যবহার করা …
একটি Luxurious Style এবং CSS দিয়ে অসাধারণ কিছু কাজ !! Read More »
বর্তমান সময়ে ফ্রীল্যান্সিং এর সবচেয়ে জনপ্রিয় মাধ্যম হচ্ছে কন্টেন্ট ম্যানেজমেন্ট সিস্টেম ওয়ার্ডপ্রেস। ওয়ার্ডপ্রেস কে সংক্ষিপ্ত করে বলে (cms)। বর্তমানে শতকরা প্রায় ৮০ ভাগ ওয়েবসাইট ওয়ার্ডপ্রেস প্ল্যাটফর্ম ব্যবহার করে যা পিএইচপি এবং মাইএসকিউএল দ্বারা তৈরিকৃত একটি ওপেন সোর্স ব্লগিং সফটওয়্যার। সারা বিশ্বজুড়ে ওয়ার্ডপ্রেস ব্যবহারের মাধ্যমে অসংখ্য ওয়েবসাইট তৈরী হচ্ছে। ফলে প্রতিনিয়ত বেড়েই চলেছে ওয়ার্ডপ্রেস ডেভেলপারদের চাহিদা। …
ওয়ার্ডপ্রেস ডেভেলপমেন্ট কী? ওয়ার্ডপ্রেস ডেভেলপমেন্ট শেখার গুরুত্ব… Read More »
অনেক দিন পর ওয়ার্ডপ্রেস সম্পর্কে লেখতে বসলাম। আসেন একটু মজাদার ক্রিয়েটিভ কিছু তৈরি করার চেষ্টা করি। ওয়ার্ডপ্রেস ব্লগের হোমপেজে সাধারণত পর্যায়ক্রমিকভাবে নতুন পোস্ট সমূহ সংক্ষিপ্ত আকারে দেখানো হয়। প্রায় সকলেই এই পোস্টগুলোর সাথে পোস্ট থাম্বনেইল প্রদর্শন করতে পছন্দ করেন।পোস্ট থাম্বনেইল ইমেজের সাথে আপনি চাইলেই কিছু টেক্সট ক্যাপশনের মাধ্যমে প্রদর্শন করতে পারেন। আপনার ওয়ার্ডপ্রেস ব্লগে যদি …
ওয়ার্ডপ্রেস ব্লগের থাম্বনেইলের উপর মাউস রাখুন আর উল্টো দিকে ক্যাপশন দেখান Read More »
ওয়েব সাইট তথ্য প্রকাশের অন্যতম জনপ্রিয় মাধ্যম। আমরা বিভিন্ন ধরণের ওয়েব সাইটের সাথে পরিচিত। কেন একটি সাইটের একটি পেজ অনেক বেশি কনটেন্ট ধরণ করতে পারে আবার কয়েকটি লাইনও থাকতে পারে। সাধারণত জনপ্রিয় ব্লগ সমূহে দেখা যায় ৩০০-৫০০ শব্দের কোন একটা পোস্টেও কয়েক শত কমেন্ট পরে,এক্ষেত্রে একজন ব্যবহারকারী পেজের শেষ প্রান্তে পৌছানোর পর আবার প্রথমে স্ক্রল …
নেভিগেশনবার যে কোন সাইটের জন্যই একটা অপরিহার্য উপাদান। বর্তমান সময়ে বিভিন্ন ধরণের নেভিগেশনবার ব্যবহার করা হয়, আর এতে ব্যবহার করা হয় বিভিন্ন ধরণের সি এস এস ৩ এবং জেকোয়েরি ইফেক্ট। আজ আমরা নেভিগেশন বারে সি এস এস ৩ এর ট্রানজিশন ইফেক্টের ব্যবহার দেখব। ট্রানজিশন ইফেক্টের ব্যবহার এবং কলাকৌশল লেখাটিতে ট্রানজিশন ইফেক্টের ব্যবহার সম্পর্কে বিস্তারিত প্রজেক্ট …
আসসালামু আলাইকুম। সবাইকে সিএসএস ট্রিক্স এ স্বাগতম। গত টিউটোরিয়ালে দেখিয়েছিলাম সিএসএস দিয়ে লেখায় ব্লার ইফেক্ট যুক্ত করুন। এবার দেখাবো কিভাবে সিএসএস৩ দিয়ে রাউন্ড এবং ইলিফটিকাল কর্নারের ব্যবহার দিয়ে সহজে রাউন্ড কর্নার বানানো যায়।তবে সেক্ষেত্রে প্রত্যেক ব্রাউজারের জন্য আলাদা কোড লিখে দিতে হয়। আজকে যে কোডগুলো দিব সেগুলো শুধু ক্রোমে কাজ করবে । তো চলুন দেখি …
সিএসএস৩ দিয়ে রাউন্ড এবং ইলিফটিকাল কর্নারের ব্যবহার Read More »
আসসালামু আলাইকুম। সবাইকে সিএসএস ট্রিক্স এ স্বাগতম। গত টিউটোরিয়ালে দেখিয়েছিলাম কিভাবে মেনুবারে গ্রোয়িং ইফেক্ট যুক্ত করবেন সিএসএস দিয়ে। এবার দেখাবো কিভাবে সিএসএস ব্যবহার করে লেখার মধ্যে ব্লার ইফেক্ট দেওয়া যায়। তো চলুন কোডগুলো দেখে নিই- নরমাল টেক্সট, ফন্ট, কালার এবং সাইজ ইত্যাদির জন্য নিচের কোডগুলো h3 সিলেক্টরে বসাতে হবে – font: bold 80px Helvetica, Sans-Serif; …
সবাইকে সালাম এবং শুভেচ্ছা জানিয়ে শুরু করছি আমার আজকের এই টিউটোরিয়াল । আজ থেকে আমি একটি নতুন পর্বভিত্তিক টিউটোরিয়াল শুরু করতে যাচ্ছি । আমার গত পর্বভিত্তিক টিউটোরিয়াল ছিল সার্চ ইঞ্জিন অপটিমাইজেশন (এসইও) নিয়ে । আজ থেকে আমরা সিএসএস এর উপর টিউটোরিয়াল শুরু করবো । এমন এক সময় ছিল যখন শুধুমাত্র এইচটিএমএল দিয়েই একটি ওয়েব পেইজ …
বর্তমান সময়ে ওয়েব সাইটের সৌন্দর্য বর্ধনের জন্য চলছে নানা রকম গবেষণা। ইতোমধ্যেই সিএসএস ৩ এর ট্রানজিশন, গ্রেডিয়েন্ট, ট্রান্সফরম ইফেক্ট সমূহ বর্তমান যুগের ওয়েব ইলিমেন্ট সমূহকে করে তুলেছে অনেক বেশি ইন্ট্রাকটিভ এবং ব্যবহার বান্ধব। ইতোমধ্যেই সি এস এস ৪ আসার কথাও শোনা যাচ্ছে। কয়েকদিন ধরে একটা বিষয় মাথায় ঘুরছে, আমরা কতটুকু প্রস্তুত সি এস এস ৪ …
আসসালামু আলাইকুম। সবাইকে সিএসএস ট্রিক্স এ স্বাগতম। গত টিউটোরিয়ালে দেখিয়েছিলাম কিভাবে খাজকাটা বর্ডার তৈরি করা যায় সিএসএস দিয়ে। এবার দেখাবো কিভাবে সিএসএস৩ এর মাধ্যমে মেনুবারে বা নেভিগেশন বারে সহজে গ্রোয়িং ইফেক্ট যুক্ত করা যায়। অর্থাৎ মেনুতে যে সাবমেনুর উপর এ মাউস রাখব সেটাই উপরে উঠে আসবে বা ভেসে উঠবে উপরে অর্থাৎ হভার ইফেক্ট। এক্ষেত্রে আলাদা …
আসসালামু আলাইকুম। সবাইকে সিএসএস ট্রিক্স এ স্বাগতম। গত টিউটোরিয়ালে দেখিয়েছিলাম কিভাবে বর্ডারসহ ত্রিভুজ তৈরি করা যায় সিএসএস দিয়ে। এবার দেখাবো কিভাবে সিএসএস৩ ব্যবহার করে খাজকাটা বর্ডার তৈরি করা যায়। তো চলুন কোডগুলো দেখে নিই- <html><head><style> .header{ color:white; background-color:#2B3A48; text-align:center; } .header:after { content: ” “; display:block; position: relative; top:0px;left:0px; width:100%; height:36px; background: linear-gradient(#2B3A48 0%, transparent …
সিএসএস আসায় ইমেজের ব্যবহার অনেকাংশে কমে গেছে। সিএসএস দিয়ে ইমেজ বানানো যায়,এখন css3 আসাতে সে কাজ আরও সহজ হয়েছে। css দিয়ে কিভাবে ত্রিভুজের বর্ডার তৈরি করা যায় তা দেখাবো আজকে। আমরা সাধারনত যে সকল বর্ডার তৈরি করি তা সরল রৈখিক এবং আয়তাকার, বর্গাকার। দেখুন কিভাবে ত্রিভুজ বর্ডার তৈরি করছি- [css] <html><head> <style> .triangle { width: …
আজকে আপনাদের জন্য নিয়ে এলাম সিএসএস এর শেপের কালেকশন! এই টিউটরিয়ালের মাধ্যমে দেখাব কিভাবে সিএসএস এবং এইচটিএমএল ব্যবহার করে বিভিন্নন প্রকার শেপ গঠন করা যায়। তো চলুন দেখি নিচে- বর্গ শেপ এর জন্য সিএসএস [css]#square { width: 100px; height: 100px; background: red; } [/css] আয়তাকার [css]#rectangle { width: 200px; height: 100px; background: red; }[/css] গোলাকার …
আশা করি সবাই ভালই আছেন। আমার আজকের আর্টিকেলও সিএসএস নিয়ে। আজকে লিখব সিএসএস এনিমেশন। কোন টেক্সটে কিভাবে এনিমেশন দেওয়া যায় তাই দেখাব আজকে। কিছু শব্দ পর্যায়ক্রমে পরিবর্তন হবে। এবং এভাবে হতে থাকবে চক্রাকারে। সিএসএস এনিমেশন ব্যবহার করে কাজটি কিভাবে করেছি তার বর্ননা নিচে দেখুন। তো চলুন কোডগুলো দেখে নিই- এইচটিএমএল কোড- [css]<section> <h2> <span>Real poetry …
সিএসএস৩ মাধ্যমে ফটোশপের মত গ্র্যাডিয়েন্ট ইফেক্ট যেমন- linear , radial এসব ধরণের ইফেক্ট ই দেওয়া যায়।এগুলো আজকে আমার টিউটোরিয়াল এ দেখাব কিভাবে এই ইফেক্টগুলোর কোড লিখতে হয় ।এক্ষেত্রে সকল ব্রাউজারের জন্য আলাদা আলাদা কোড উল্লেখ করে দিতে হয়। সকলের জন্য আলাদা আলাদা কোড হলেও সবার জন্য একটি স্ট্যান্ডার্ড কোড হবে। সেটি নিচে উল্লেখ করা হল- …
ড্রপ শেডো এবং ইনার শেডো এই এফেক্টগুলো আমরা ফটোশপের মাধ্যমে ইমেজ বানিয়ে ওয়েবপেজে ব্যবহার করে থাকি। এতে করে দেখা যায় পেজ অনেক ভারি হয়ে যাচ্ছে বেশি ইমেজ ব্যবহার করলে। এসকল শেডো ইফেক্ট CSS3 এর মাধমে দেওয়া যায়। ডেমোতে দেখে নিতে পারেন আজকে কাজ শেষে তৈরিকৃত বক্স শেডোটি- প্রক্রিয়াটি ধাপে ধাপে নিচে লেখা হল- বক্স শেডোর …
বিভিন্ন প্রয়োজনে আমাদের ওয়েব সাইটে রেজিস্ট্রেশন ফরম ব্যবহার করতে হয়।ডাইনামিক ওয়েব সাইটের একটা গুরুত্বপূর্ণ উপাদান।এর মাধ্যমে সাধারণত ইউজাররা তাদের প্রয়োজনীয় তথ্য সাইটে প্রদান করে সাইট থেকে কোন বিশেষ সেবা গ্রহণ করে থাকেন।এক্ষেত্রে বিভিন্ন লেভেলের ইউজার থাকতে পারে। তাই রেজিস্ট্রেশন ফরমটি ব্যবহার বান্ধব হওয়া উচিৎ, যাতে করে একজন ইউজার সহজেই তার প্রয়োজনীয় ফিল্ড সমূহ বুঝতে পারে …
ওয়েব পেজে টেক্সটকে সাজানোর জন্য টেক্সট এলাইনমেন্ট ব্যবহার করা হয়। টেক্সটকে পেজের বাম পাশে রাখার জন্য Declaration করতে হবে text-align:left; অনুরূপভাবে ডান পাশে রাখার জন্য Declaration করতে হবে text-align:right; মধ্যস্থানে রাখার জন্য Declaration করতে হবে text-align:center; । যদি টেক্সট এর প্রতিটা লাইন একই আকারে সাজাতে চাই তাহলে Declaration করতে হবে text-align:justify । অনুশীলন প্রজেক্ট <html> …
টেক্সট এলাইনমেন্ট (Text Alignment): সি এস এস (পর্ব-১১) Read More »
ওয়েব সাইটের প্রধান উপাদান হচ্ছে টেক্সট। সৌন্দর্য বৃদ্ধির জন্য এবং বিশেষ কিছু সুবিধা পাবার জন্য css এর মাধ্যমে টেক্সট এর স্টাইল তৈরি করা হয়। টেক্সট এর স্টাইল তৈরির জন্য বেশ কয়েকটি বিষয় Declaration এ উল্লেখ করতে হয়। এগুলো হচ্ছে টেক্সট কালার (Text Color) টেক্সট এলাইনমেন্ট (Text Alignment) টেক্সট ডেকরেশন (Text Decoration) টেক্সট ট্রান্সফরমেশন (Text Transformation) …
ওয়েবপেজের বিভিন্ন উপাদান যেমন Body, Pragaph, Table ইত্যাদির জন্য ব্যাগ্রাউন্ড একটি অপরিহার্য উপাদান।এ সকল উপাদান সমূহের ব্যাকগ্রাউন্ড হিসেবে কালার অথবা ইমেজ ব্যবহার করা্ যায়। ব্যাকগ্রাউন্ড হিসেবে কালার ব্যবহার ব্যাকগ্রাউন্ড হিসেবে কালার ব্যবহারের জন্য Declaration হতে পারে background:#900; অথবা background-color:#900; । যেমন body{ background-color:#900; } । ব্যাকগ্রাউন্ড হিসেবে ইমেজ ব্যবহার ব্যাকগ্রাউন্ড হিসেবে ইমেজ ব্যবহারের জন্য Declaration …