সিএসএস (CSS)

সিএসএস বলতে বুঝায় Cascading Style Sheets.
HTML কোড গুলো কিভাবে (ডিজাইনে) প্রকাশিত হবে তাই প্রকাশ করে
HTML এর সাথে CSS কোড যুক্ত হয়ে প্রকাশিত হয়।
CSS এর কোড গুলো আলাদাভাবে আলাদা ফাইলেও রাখা যায় যা HTML এ কল করে সংযুক্ত করা যায়।
CSS এর মাধ্যমে কোড লিখতে সবচেয়ে বড় যে সুবিধা পাওয়া যায় তা হলো বার বার একই কোড লিখতে হয় না।

ওয়ার্ডপ্রেস ডেভেলপমেন্ট কী? ওয়ার্ডপ্রেস ডেভেলপমেন্ট শেখার গুরুত্ব…

বর্তমান সময়ে ফ্রীল্যান্সিং এর সবচেয়ে জনপ্রিয় মাধ্যম হচ্ছে কন্টেন্ট ম্যানেজমেন্ট সিস্টেম ওয়ার্ডপ্রেস। ওয়ার্ডপ্রেস কে সংক্ষিপ্ত করে বলে (cms)। বর্তমানে শতকরা প্রায় ৮০ ভাগ ওয়েবসাইট ওয়ার্ডপ্রেস প্ল্যাটফর্ম ব্যবহার করে যা পিএইচপি এবং মাইএসকিউএল দ্বারা তৈরিকৃত একটি ওপেন সোর্স ব্লগিং সফটওয়্যার। সারা বিশ্বজুড়ে ওয়ার্ডপ্রেস ব্যবহারের মাধ্যমে অসংখ্য ওয়েবসাইট তৈরী হচ্ছে। ফলে প্রতিনিয়ত বেড়েই চলেছে ওয়ার্ডপ্রেস ডেভেলপারদের চাহিদা।…

ওয়েব ডিজাইন – অডিয়েন্সই শেষ কথা

আজকাল ওয়ার্ল্ড ওয়াইড ওয়েবের ভুবনে নিজের জন্য একটি ঠিকানা খোঁজার জন্য অনেকেই ব্যতিব্যস্ত হয়ে পড়েন। ওয়েব প্রেজেন্স বা নিজের একটি ওয়েব সাইট থাকাটা এখন বিলাসীতার গণ্ডী পেরিয়ে অতি প্রয়োজনীয় একটি ব্যাপারে রূপান্তরিত হয়েছে। এ কারণেই ওয়েব সাইটের নকশা করাটা এখন আর হেলাফেলা করে করলে চলে না। প্রয়োজন হয় সতর্ক পরিকল্পনা এবং অনেক ভাবনা চিন্তার। ওয়েব…

ওয়ার্ডপ্রেস ব্লগের থাম্বনেইলের উপর মাউস রাখুন আর উল্টো দিকে ক্যাপশন দেখান

অনেক দিন পর ওয়ার্ডপ্রেস সম্পর্কে লেখতে বসলাম। আসেন একটু মজাদার ক্রিয়েটিভ কিছু তৈরি করার চেষ্টা করি। ওয়ার্ডপ্রেস ব্লগের হোমপেজে সাধারণত পর্যায়ক্রমিকভাবে নতুন পোস্ট সমূহ সংক্ষিপ্ত আকারে দেখানো হয়। প্রায় সকলেই এই পোস্টগুলোর সাথে পোস্ট থাম্বনেইল প্রদর্শন করতে পছন্দ করেন।পোস্ট থাম্বনেইল ইমেজের সাথে আপনি চাইলেই কিছু টেক্সট ক্যাপশনের মাধ্যমে প্রদর্শন করতে পারেন। আপনার ওয়ার্ডপ্রেস ব্লগে যদি…

ওয়েব সাইটে স্ক্রল টু টপ বাটন যুক্ত করার পদ্ধতি

ওয়েব সাইট তথ্য প্রকাশের অন্যতম জনপ্রিয় মাধ্যম। আমরা বিভিন্ন ধরণের ওয়েব সাইটের সাথে পরিচিত। কেন একটি সাইটের একটি পেজ অনেক বেশি কনটেন্ট ধরণ করতে পারে আবার কয়েকটি লাইনও থাকতে পারে। সাধারণত জনপ্রিয় ব্লগ সমূহে দেখা যায় ৩০০-৫০০ শব্দের কোন একটা পোস্টেও কয়েক শত কমেন্ট পরে,এক্ষেত্রে একজন ব্যবহারকারী পেজের শেষ প্রান্তে পৌছানোর পর আবার প্রথমে স্ক্রল…

নেভিগেশন বারে ট্রানজিশন ইফেক্টের ব্যবহার

নেভিগেশনবার যে কোন সাইটের জন্যই একটা অপরিহার্য উপাদান। বর্তমান সময়ে বিভিন্ন ধরণের নেভিগেশনবার ব্যবহার করা হয়, আর এতে ব্যবহার করা হয় বিভিন্ন ধরণের সি এস এস ৩ এবং জেকোয়েরি ইফেক্ট। আজ আমরা নেভিগেশন বারে সি এস এস ৩ এর ট্রানজিশন ইফেক্টের ব্যবহার দেখব। ট্রানজিশন ইফেক্টের ব্যবহার এবং কলাকৌশল লেখাটিতে ট্রানজিশন ইফেক্টের ব্যবহার সম্পর্কে বিস্তারিত প্রজেক্ট…

সিএসএস৩ দিয়ে রাউন্ড এবং ইলিফটিকাল কর্নারের ব্যবহার

আসসালামু আলাইকুম। সবাইকে সিএসএস ট্রিক্স এ স্বাগতম। গত টিউটোরিয়ালে দেখিয়েছিলাম সিএসএস দিয়ে লেখায় ব্লার ইফেক্ট যুক্ত করুন। এবার দেখাবো কিভাবে সিএসএস৩ দিয়ে রাউন্ড এবং ইলিফটিকাল কর্নারের ব্যবহার দিয়ে সহজে রাউন্ড কর্নার বানানো যায়।তবে সেক্ষেত্রে প্রত্যেক ব্রাউজারের জন্য আলাদা কোড লিখে দিতে হয়।  আজকে যে কোডগুলো দিব সেগুলো শুধু ক্রোমে কাজ করবে । তো চলুন দেখি…

সিএসএস দিয়ে লেখায় ব্লার ইফেক্ট যুক্ত করুন!

আসসালামু আলাইকুম। সবাইকে সিএসএস ট্রিক্স এ স্বাগতম। গত টিউটোরিয়ালে দেখিয়েছিলাম কিভাবে মেনুবারে গ্রোয়িং ইফেক্ট যুক্ত করবেন সিএসএস দিয়ে। এবার দেখাবো কিভাবে সিএসএস ব্যবহার করে লেখার মধ্যে ব্লার ইফেক্ট দেওয়া যায়। তো চলুন কোডগুলো দেখে নিই- নরমাল টেক্সট, ফন্ট, কালার এবং সাইজ ইত্যাদির জন্য নিচের কোডগুলো 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 দিয়ে কিভাবে  ত্রিভুজের বর্ডার তৈরি করা যায় তা দেখাবো আজকে। আমরা সাধারনত যে সকল বর্ডার তৈরি করি তা সরল রৈখিক এবং আয়তাকার, বর্গাকার। দেখুন কিভাবে  ত্রিভুজ বর্ডার তৈরি করছি- কোডগুলো কপি করে নোটপ্যাডে নিয়ে traingle.html…

সিএসএস এর বিভিন্ন শেপের কালেকশনসমূহ!

আজকে আপনাদের জন্য নিয়ে এলাম  সিএসএস এর শেপের কালেকশন! এই টিউটরিয়ালের মাধ্যমে দেখাব কিভাবে সিএসএস এবং এইচটিএমএল ব্যবহার করে বিভিন্নন প্রকার শেপ গঠন করা যায়। তো চলুন দেখি নিচে- বর্গ শেপ এর জন্য সিএসএস আয়তাকার গোলাকার ডিম্বাকার ত্রিভুজ নিম্নমুখী ত্রিভুজ বামমুখী ত্রিভুজ ডানমুখী ত্রিভুজ উপর- বামমুখী ত্রিভুজ উপর- ডানমুখী ত্রিভুজ নিম্ন- বামমুখী ত্রিভুজ নিম্ন-ডানমুখী ত্রিভুজ…

সিএসএস এ টেক্সট এনিমেশন!

আশা করি সবাই ভালই আছেন। আমার আজকের আর্টিকেলও সিএসএস নিয়ে। আজকে লিখব সিএসএস এনিমেশন। কোন টেক্সটে কিভাবে এনিমেশন দেওয়া যায় তাই দেখাব আজকে।  কিছু শব্দ পর্যায়ক্রমে পরিবর্তন হবে। এবং এভাবে হতে থাকবে চক্রাকারে। সিএসএস এনিমেশন ব্যবহার করে কাজটি কিভাবে করেছি তার বর্ননা নিচে দেখুন। তো চলুন কোডগুলো দেখে নিই- এইচটিএমএল কোড- সিএসএস কোড- মেইন wrapper …

সিএসএস৩ এর মাধ্যমে গ্র্যাডিয়েন্ট ইফেক্ট

সিএসএস৩  মাধ্যমে ফটোশপের মত গ্র্যাডিয়েন্ট  ইফেক্ট যেমন- linear , radial  এসব ধরণের ইফেক্ট ই দেওয়া যায়।এগুলো  আজকে আমার টিউটোরিয়াল এ দেখাব  কিভাবে এই ইফেক্টগুলোর কোড লিখতে হয় ।এক্ষেত্রে সকল ব্রাউজারের জন্য আলাদা আলাদা কোড উল্লেখ করে দিতে হয়। সকলের জন্য আলাদা আলাদা কোড হলেও সবার জন্য একটি  স্ট্যান্ডার্ড কোড হবে। সেটি নিচে উল্লেখ করা হল-…