ওফ, আমি অবশেষে ম্যাগাজিন থেকে নতুন রেসিপি সংগঠিত করে শেষ করেছি। যখন তারা একটি খামে ধুলো জড়ো করছিল, তখন আমি ভাবিনি যে আমি তাদের অনেক কিছু জমা করেছি। আমি যখন আমার ছেলের সাথে গর্ভবতী ছিলাম, তখন আমি এত নতুন রেসিপি তৈরি করেছিলাম যে সেগুলি সম্ভবত বেশ কয়েকটি রান্নার বইয়ের জন্য যথেষ্ট হবে। হতে পারে কারণ আমি সব সময় খেতে চেয়েছিলাম :)) বা হয়তো .. কে জানে। একটি সন্তানের জন্মের সাথে, রান্নার সাথে পরীক্ষা করার জন্য কার্যত কোন সময় বাকি ছিল না, তবে আমার ছেলে বড় হচ্ছে, তার মাকে মাফিন এবং কেক বেক করতে সাহায্য করতে পছন্দ করে এবং অবশেষে রেসিপিগুলি সংগঠিত করতে শুরু করে।
তাই, আমি 2টি ফোল্ডার নিয়েছি, একটি নতুন রেসিপির জন্য, অন্যটি ইতিমধ্যেই পরীক্ষিত, প্রিয় এবং ব্যবহৃতদের জন্য।
আমি নতুন এবং অ-পরীক্ষিত রেসিপি সহ ফোল্ডারটিকে অনেকগুলি বিভাগে ভাগ করিনি, প্রথমত, কারণ ফোল্ডারটি যে কোনও ক্ষেত্রে অস্থায়ী, কারণ ... রেসিপি পরীক্ষা করা প্রয়োজন, এবং দ্বিতীয়ত, এমনকি বিভিন্ন বিভাগে বাছাই বেশ অনেক সময় নিয়েছে.
অতএব, আমি অস্থায়ী ফোল্ডারের জন্য নতুন রেসিপিগুলিকে ভাগ করেছি:
- প্রাতঃরাশ;
- জলখাবার;
- সালাদ;
- স্যুপ (লাঞ্চ);
- ডিনার;
- সালাদ;
- বেকড পণ্য (প্রধানত মিষ্টি এবং ডেজার্ট)।
আমি একটি রঙিন প্রিন্টারে বিভাজক মুদ্রণ করেছি, এবং এটি ঘটেছে:
নতুন রেসিপি সহ আমার ফোল্ডারটি বেশ পুরু, 80 পৃষ্ঠার মতো। অতএব, দ্রুত একটি ফোল্ডারের মধ্যে বিভাগগুলি খুঁজে পেতে, আমি এটিকে পার্শ্ব বিভাজকের সাথে সম্পূরক করার পরামর্শ দিই যাতে আপনি দ্রুত পছন্দসই বিভাগটি খুঁজে পেতে পারেন। আপনি রেডিমেড ব্যবহার করতে পারেন, উদাহরণস্বরূপ, এইগুলির মতো:
অথবা আমার ডাউনলোড করুন:
আমি স্ব-আঠালো কাগজে ডিভাইডারগুলি মুদ্রণ করেছি, সেগুলি কেটে ফেলেছি এবং কেবল পছন্দসই পৃষ্ঠাগুলিতে আঠা দিয়েছি:
আমি সমস্ত রেসিপিগুলি পুঙ্খানুপুঙ্খভাবে ট্র্যাশ করেছি, অবশেষে সেগুলি থেকে মুক্তি পেয়েছি যা আমার পরিবার অবশ্যই খাবে না। আমি যেগুলি রাখতে চেয়েছিলাম সেগুলি আমি কাঁচি দিয়ে কেটে ফেলি। একটি খুব ক্লান্তিকর এবং কঠিন কাজ. অতএব, আপনি যদি একটি কাগজ কাটার খুশি মালিক হন, আপনি ভাগ্যবান.
আমি কাটা আউট রেসিপি জন্য একটি সমর্থন হিসাবে নিয়মিত রঙিন নৈপুণ্য কাগজ ব্যবহার. আমার কাছে IKEA থেকে এই মোলা কাগজ ছিল। যদি ইচ্ছা হয়, রঙিন কাগজ এমনকি রেসিপিগুলিকে বিভাগে বিভক্ত করার ভিত্তি হিসাবে ব্যবহার করা যেতে পারে, তবে আপনি জানতে পারবেন যে, উদাহরণস্বরূপ, সবুজ পৃষ্ঠাগুলিতে সালাদ রয়েছে এবং উদাহরণস্বরূপ, লাল মাংসের খাবারগুলি।
আমি কেবল একটি রঙিন কাগজের পটভূমির উপরে কাটা রেসিপিগুলি রেখেছি। আমি যদি থালা পছন্দ করি তবে আমি এটি ইতিমধ্যেই চেষ্টা করা রেসিপি সহ একটি ফোল্ডারে রাখব। না হলে ফেলে দেবো।
শুভেচ্ছা। সম্প্রতি আমাকে জিজ্ঞাসা করা হয়েছিল কিভাবে পেজের একটি নির্দিষ্ট অংশে মসৃণভাবে পৃষ্ঠা স্ক্রোল করা যায়। সাধারণভাবে, এটিকে অ্যাঙ্কর লিঙ্ক অনুসরণ করা বলা হয়। যখন কোনও সাইট ভিজিটর এমন একটি উপাদানে ক্লিক করে যাতে এটিতে একটি অ্যাঙ্কর লিঙ্ক যুক্ত থাকে, তখন তারা স্বয়ংক্রিয়ভাবে পৃষ্ঠার সেই অংশে নিয়ে যায় যেখানে অ্যাঙ্কর যোগ করা হয়েছিল।
সাধারণত, একটি বড় ভলিউম সহ পৃষ্ঠাগুলিতে অ্যাঙ্কর ব্যবহার করা হয় যাতে আপনি সহজে নেভিগেশনের জন্য দ্রুত পছন্দসই বিভাগে যেতে পারেন। আপনি সম্ভবত অনেক ওয়েবসাইটে এটি দেখেছেন.
একটি অ্যাঙ্কর তৈরি করতে, আপনাকে প্রথমে উপযুক্ত জায়গায় একটি বুকমার্ক তৈরি করতে হবে এবং ট্যাগের নাম বৈশিষ্ট্য ব্যবহার করে একটি নাম দিতে হবে .
এটি কিভাবে কাজ করে তা দেখতে পরীক্ষা ব্লগটি দেখুন।
আসুন জেনে নেই কিভাবে ব্লগারে একটি পৃষ্ঠার মধ্যে অ্যাঙ্কর লিঙ্কগুলি অনুসরণ করতে হয়। সবকিছু বেশ সহজ.
আসুন একটি সাধারণ মেনু তৈরি করি, যেখানে একটি লিঙ্ক প্যারামিটার হিসাবে আমরা ব্লকগুলির আইডি সেট করি যেখানে স্ক্রোলিং ঘটবে। এটার মতো কিছু
যাতে আপনাকে আবার বোকা না বানানো যায়, আমি এখনই আপনাকে সম্পূর্ণ কোডটি দেব। আপনি পোস্ট এডিটরে HTML মোডে স্যুইচ করে এটিকে কপি করে একটি পরীক্ষামূলক ব্লগে আপনার পৃষ্ঠায় চেষ্টা করতে পারেন। এবং এর এখানে কি করা হয়েছে চিন্তা করা যাক
- কোথা থেকে শুরু করতে হবে
- কিভাবে করবেন
- কোথা থেকে পাব
- কিভাবে বাস্তবায়ন করা যায়
কোথা থেকে শুরু করতে হবে
কিভাবে করবেন
Lorem ipsum dolor sit amet, consectetur adipisicing elit. সহজে মুক্ত করা quibusdam molestiae esse ad iusto natus, asperiores doloribus impedit quia quasi placeat unde recusandae ut fuga enim y incidunt sed perspiciatis magni culpa corporis hic! ম্যাগনি রিপেলাট, এক্সপেডিটা মোলেস্টিয়া, ডিলেক্টাস, অ্যালকোয়ম লেবারম বা ইভেন্ট রিপ্রেহেন্ডারিট স্বেচ্ছাসেবী সাদৃশ্যের জন্য আলাদা আলাদা আলাদা করা হয়েছে!
কোথা থেকে পাব
Lorem ipsum dolor sit amet, consectetur adipisicing elit. সহজে মুক্ত করা quibusdam molestiae esse ad iusto natus, asperiores doloribus impedit quia quasi placeat unde recusandae ut fuga enim y incidunt sed perspiciatis magni culpa corporis hic! ম্যাগনি রিপেলাট, এক্সপেডিটা মোলেস্টিয়া, ডিলেক্টাস, অ্যালকোয়ম লেবারম বা ইভেন্ট রিপ্রেহেন্ডারিট স্বেচ্ছাসেবী সাদৃশ্যের জন্য আলাদা আলাদা আলাদা করা হয়েছে!
কিভাবে বাস্তবায়ন করা যায়
Lorem ipsum dolor sit amet, consectetur adipisicing elit. সহজে মুক্ত করা quibusdam molestiae esse ad iusto natus, asperiores doloribus impedit quia quasi placeat unde recusandae ut fuga enim y incidunt sed perspiciatis magni culpa corporis hic! ম্যাগনি রিপেলাট, এক্সপেডিটা মোলেস্টিয়া, ডিলেক্টাস, অ্যালকোয়ম লেবারম বা ইভেন্ট রিপ্রেহেন্ডারিট স্বেচ্ছাসেবী সাদৃশ্যের জন্য আলাদা আলাদা আলাদা করা হয়েছে!
এবং এইচটিএমএল কোড, সেই অনুযায়ী টেক্সট এই ধরনের বিভাগ যোগ
কিভাবে বাস্তবায়ন করা যায়
আপনার সমস্ত পাঠ্য এখানে থাকবে
এবং এখানে আমি কেবল নিম্নলিখিত আপনার দৃষ্টি আকর্ষণ করতে হবে
আপনি যদি একটি বার্তা সম্পাদনা করার সময় অ্যাঙ্করগুলি নির্দিষ্ট করে থাকেন তবে "তৈরি করুন" ট্যাবে স্যুইচ করবেন না, কাজ করুন এবং এইচটিএমএল মোডে বার্তাটি লিখুন৷ তাহলে নোঙ্গরগুলো তাদের আসল রূপে থাকবে। অন্যথায়, স্বয়ংক্রিয় সংশোধন সহজভাবে ঘটবে (এগুলি ব্লগারের অস্পষ্টতা)।
এখানে কিছু নাম আছে
তারা এই মত হবে
অর্থাৎ, একটি অস্তিত্বহীন পৃষ্ঠায় রূপান্তর করা হবে (যেন অপ্রকাশিত)।
যদি এখনও HTML মোডে কাজ করা কঠিন হয় এবং এই ক্ষেত্রে সবকিছু সঠিকভাবে কাজ করার জন্য, আপনাকে শুধু লিঙ্কটি একটু পরিবর্তন করতে হবে যাতে অ্যাঙ্কর ট্যাগটি এরকম দেখায়
এখানে কিছু নাম আছে
যেখানে https://n-t-b-b.blogspot.com/2019/08/blog-post.html পৃষ্ঠার লিঙ্ক যা এখানে সেটিংসে পোস্ট সম্পাদকের ডানদিকে দেখা যাবে
এটা সব যে মত বেশ সহজ. ওয়ার্ডপ্রেসে ব্লগে এই ধরনের উদ্দেশ্যে একটি বিশেষ প্লাগইন রয়েছে। ব্লগারে এটি নিম্নলিখিত কোড ব্যবহার করে সহজেই প্রয়োগ করা হয়। সৌভাগ্য সবার।
হ্যালো বন্ধুরা। এবং আজ আপনার জন্য আরেকটি সাইট ম্যাপ। এটি দীর্ঘকাল ধরে আমার "বিনে" পড়ে আছে, এবং তারপরে আমি ঘটনাক্রমে একটি ভুলে যাওয়া পুরানোটির কাছে এসেছিলাম। সম্ভবত কেউ এই এক পছন্দ করবে. এটি অ্যাকর্ডিয়ন শৈলীতে ডিজাইন করা হয়েছে।
এই জাতীয় মানচিত্রে আমাদের কী থাকবে -
সমস্ত লেবেল (শিরোনাম, বিভাগ) বাম দিকে প্রদর্শিত হয়।
ডানদিকের তীরটিতে ক্লিক করলে এই শর্টকাটের সব পোস্ট ওপেন হবে।
লেবেল সেট - নতুন বার্তা।
আপনার শৈলী অনুসারে সহজ ডিজাইন কাস্টমাইজেশন।
পৃষ্ঠায় সহজ ইনস্টলেশন.
কাজের সংস্করণ দেখতে, পরীক্ষা ব্লগে যান।
.টেবিল-অফ-কন্টেন্ট(ব্যাকগ্রাউন্ড-রঙ:#008B8B;রঙ:#444;ফন্ট-ফ্যামিলি:ভারদানা,জেনেভা,তাহোমা,আরিয়াল,সান-সেরিফ;ফন্ট-সাইজ:13px;ফন্ট-ওজন:400;ওভারফ্লো:লুকানো ;বর্ডার-ব্যাসার্ধ:4px;বক্স-ছায়া:0 0 10px rgba(0,0,0,.2))
.table-of-content .toc-header(color:#444;font-family:inherit;font-weight:400;font-size:14px;background-color:#fff;margin:0;padding:15px;overflow : hidden;cursor:pointer;border-bottom:1px solid #ccc;ট্রানজিশন:প্রাথমিক)
.টেবিল-অফ-কন্টেন্ট .toc-হেডার:হোভার (ব্যাকগ্রাউন্ড-রং:#fdfdfd)
.টেবিল-অফ-কন্টেন্ট .toc-হেডার: আগে(সামগ্রী:""; প্রস্থ: 0; উচ্চতা: 0; অবস্থান: পরম; শীর্ষ: 22px; ডান: 15px; সীমান্ত: 5px কঠিন স্বচ্ছ; বর্ডার-রঙ: #aaa স্বচ্ছ স্বচ্ছ;পরিবর্তন:সমস্ত .3s সহজ)
.টেবিল-অফ-কন্টেন্ট .toc-header.active(রঙ:#fc4f3f)
.table-of-content .toc-header.active:before(border-color:#666 transparent transparent;top:16px;-webkit-transform:rotate(-180deg);-moz-transform:rotate(-180deg); -ms-ট্রান্সফর্ম: ঘুরান(-180deg);-o-ট্রান্সফর্ম:রোটেট(-180deg);transform:rotate(-180deg))
.টেবিল-অফ-কন্টেন্ট .লোড হচ্ছে (প্রদর্শন:ব্লক;প্যাডিং:15px;টেক্সট-সজ্জা:ঝলক)
.টেবিল-অফ-কন্টেন্ট ol(মারজিন:0;প্যাডিং:0;লিস্ট-স্টাইল:কোনটি নয়;ট্রানজিশন:প্রাথমিক)
.টেবিল-অফ-কন্টেন্ট li(লাইন-উচ্চতা:স্বাভাবিক!গুরুত্বপূর্ণ;মার্জিন:0!গুরুত্বপূর্ণ;প্যাডিং:8px 8px 8px 15px!গুরুত্বপূর্ণ;হোয়াইট-স্পেস:নোর্যাপ;টেক্সট-সারিবদ্ধ:বাম;ওভারফ্লো:লুকানো;ব্যাকগ্রাউন্ড:# 808080 !গুরুত্বপূর্ণ;পরিবর্তন:প্রাথমিক)
.টেবিল-অফ-কন্টেন্ট a(রঙ:#d9d9d9!গুরুত্বপূর্ণ;টেক্সট-সজ্জা:কোনও নয়;ফন্ট-সাইজ:86%;ট্রানজিশন:প্রাথমিক)
.সারণীর বিষয়বস্তু a:পরিদর্শন করা হয়েছে(রঙ:#a2a2a9;পরিবর্তন:প্রাথমিক)
.টেবিল-অফ-কন্টেন্ট a:হোভার,.টেবিল-অফ-কন্টেন্ট a:ভিজিট করা হয়েছে:হোভার
.পোস্ট ol li:আগে (প্রদর্শন:কোনটি নয়)
var toc_config = (
url: "https://"+window.location.hostname,
ধারক আইডি: "সারণি-অব-সামগ্রী",
showNew: 15,
নতুন পাঠ্য: "নতুন",
বর্ণানুক্রমিকভাবে: (
প্যানেল: সত্য,
তালিকা: সত্য
},
সর্বাধিক ফলাফল: 9999,
সক্রিয় প্যানেল: 1,
স্লাইড স্পীড: (
নিচে: 400,
আপ: 400
},
স্লাইডইজিং: (
নিচে: শূন্য,
up: null
},
স্লাইডকলব্যাক: (
নিচে: ফাংশন() (),
আপ: ফাংশন() ()
},
ক্লিক কলব্যাক: ফাংশন()(),
jsonCallback: "_toc",
!function(e,o)(var t=o.getElementById(toc_config.containerId),c=o.getElementsByTagName("head"),n=;e=function(e)(for(var o,c,i=) e.feed.entry,a=e.feed.category,l="",s=0,d=a.length;d>s;++s)n.push(a[s].term);এর জন্য (var r=0,f=i.length;f>r;++r)(toc_config.showNew||toc_config.showNew>0)&++g)(l+=""+n[g]+"" ,l+="";এর জন্য(var _=0,p=i.length;p>_;++_)(o=i[_].title.$t;for(var w=0,u=i [_].link.length;u>w;++w)if("alternate"==i[_].link[w].rel)(c=i[_].link[w].href; (var v=0,m=i[_].category.length;m>v;++v)n[g]==i[_].category[v].term&&(l+="
আপনি অবিলম্বে সম্পূর্ণ কোড অনুলিপি করতে পারেন. যাও ব্লগ অ্যাডমিন প্যানেল - পৃষ্ঠা ট্যাব - পৃষ্ঠা তৈরি করুন। অবিলম্বে পৃষ্ঠা সম্পাদকে HTML মোডে স্যুইচ করুন, কপি করা কোড পেস্ট করুন এবং প্রকাশ করুন৷
এই তো, আর কিছু করার দরকার নেই। এটি আপনার ব্লগ ফিড মাধ্যমে উত্পন্ন হয়. কোডে আমি সাধারণ পটভূমির রঙটিকে ধূসর হিসাবে হাইলাইট করেছি, তবে আপনি সহজেই এটি পছন্দসইটিতে পরিবর্তন করতে পারেন। এখানে রং আছে যাইহোক, অন্যান্য অনেক শৈলীর মত - ফন্ট, বর্ডার, শ্যাডো ইত্যাদি।
দ্রুত, সহজ, সুবিধাজনক, সুন্দর।
আমি আপনাদের সকলের সৌভাগ্য কামনা করছি এবং শীঘ্রই দেখা হবে।
নতুন চিট শীট সদস্যতা
ফটোশপ, জিম্প এবং অন্যদের মত গ্রাফিক্স প্রোগ্রাম ব্যবহার করে আপনি GIF ফরম্যাটে অ্যানিমেটেড ছবি তৈরি করতে পারেন। এই নিবন্ধে আমি আপনাকে দেখাতে চাই কিভাবে CSS3 এবং Javascript ব্যবহার করে টেক্সট এবং ইমেজ থেকে ব্লিঙ্কিং উপাদান তৈরি করতে হয়।
CSS3 বেছে নেওয়া জাভাস্ক্রিপ্টের চেয়ে ভালো, কারণ এটি ব্রাউজার পৃষ্ঠা খোলার গতি কমিয়ে দেয় না। একটি নির্দিষ্ট অনুচ্ছেদ হাইলাইট করার জন্য বা কিছু উপাদানে ক্লিক করতে উদ্দীপিত করার জন্য এই সেটিংটি আকর্ষণীয় হতে পারে।
স্পষ্টতার জন্য, আমি পোস্টটিকে 4টি বিভাগে ভাগ করব:
CSS ব্যবহার করে ফ্ল্যাশিং ইমেজ
জাভাস্ক্রিপ্ট ব্যবহার করে পাঠ্য ঝলকানি
জাভাস্ক্রিপ্ট ব্যবহার করে ফ্ল্যাশিং ইমেজ
ব্যক্তিগত প্রয়োজনের জন্য, আপনি লিঙ্ক যোগ করতে পারেন।
ব্লগারের চিট শীট ফেসবুক পেজে যোগ দিন
.blink_text(
animation:1s blinker linear infinite;
রঙ: #00f;
ফন্ট সাইজ:18px;
ফন্ট-ওজন:বোল্ড;
}
.blink_text a (রঙ:#f00;)
@কীফ্রেম ব্লিঙ্কার (
0% (অস্বচ্ছতা: 1.0;)
50% (অস্বচ্ছতা: 0.0;)
100% (অস্বচ্ছতা: 1.0;)
}
সেই অনুযায়ী https://www.facebook.com/ViktoriyBarad/ পেজের লেখা ও ঠিকানা পরিবর্তন করুন।
এই টেক্সট শৈলী হয়
রঙ: #00f;
ফন্ট সাইজ:18px;
ফন্ট-ওজন:বোল্ড;
অ্যানিমেশন সময় 1 সেকেন্ডে সেট করা হয়েছে (কাস্টমাইজযোগ্য)
2. একটি ফ্ল্যাশিং ছবির একটি উদাহরণ সিএসএস
আমি টুইটারে আছি
কোড
.blink_text(
animation:1s blinker linear infinite;
}
@কীফ্রেম ব্লিঙ্কার (
0% (অস্বচ্ছতা: 1.0;)
50% (অস্বচ্ছতা: 0.0;)
100% (অস্বচ্ছতা: 1.0;)
}
সেটিংস অনুরূপ - আপনার ঠিকানা এবং png বিন্যাসে একটি ছবি।
এখন দেখা যাক কিভাবে জাভাস্ক্রিপ্ট ব্যবহার করে একই প্রভাব প্রয়োগ করা যায়।
1. জাভাস্ক্রিপ্টে ফ্ল্যাশিং টেক্সট
ব্লগারের চিট শীট ফাংশন blink_one() ( document.getElementById("blink").style.visibility="visible"; setTimeout("blink_two()",700); ) ফাংশন blink_two() ( document.getElementById(") এর সদস্যতা নিন blink ").style.visibility="hidden"; setTimeout("blink_one()",700); ) blink_one();
এটি আপনার ফিড ঠিকানায় পরিবর্তন করুন এবং আপনার পাঠ্য লিখুন।