11{
2- "id" : " bootstrap4"
3- "title" : " বুটস্ট্রাপ ৪"
4- "slug" : " bootstrap4"
5- "description" : " টুইটার বুটস্ট্রাপ হলো একটা এইচ টি এম এল,সি এস এস,জাভাস্ক্রিপ্ট ফ্রেমওয়ার্ক যার সর্বশেষ সংস্করণ হলো বুটস্ট্রাপ ৪ , মূলত দ্রুত ওয়েব পেজ ও ওয়েব অ্যাপ্লিকেশন তৈরী করার জন্যে এটা ব্যাপকভাবে ব্যাবহৃত ।"
6- "colorPref" : " #2535e4"
7- "contents" : [{
8- "title" : " কন্টেনার ক্লাস"
9- "items" : [{
10- "definition" : " রেস্পন্সিভ ফিক্স উইড"
11- "code" : " <div class='container'>...</div>"
12- }, {
13- "definition" : " ফুল উইড"
14- "code" : " <div class='container-fluid'>...</div>"
15- }]
16- },
17- {
18- "title" : " গ্রিড ক্লাস"
19- "items" : [{
20- "definition" : " স্ক্রীন প্রস্থ যখন ৫৭৬পিক্সেল এর ছোট"
21- "code" : " <div class='col-'>...</div>"
22- }, {
23- "definition" : " স্ক্রীন প্রস্থ যখন ৫৭৬পিক্সেল এর সমান বা বড়"
24- "code" : " <div class='col-sm'>...</div>"
25- }, {
26- "definition" : " স্ক্রীন প্রস্থ যখন ৭৬৮পিক্সেল এর সমান বা বড়"
27- "code" : " <div class='col-md'>...</div>"
28- }, {
29- "definition" : " স্ক্রীন প্রস্থ যখন ৯৯২পিক্সেল এর সমান বা বড়"
30- "code" : " <div class='col-lg'>...</div>"
31- }, {
32- "definition" : " স্ক্রীন প্রস্থ যখন ১২০০পিক্সেল এর সমান বা বড়"
33- "code" : " <div class='col-xl'>...</div>"
34- }]
35- }, {
36- "title" : " ভার্টিকাল আলাইনমেন্ট"
37- "items" : [{
38- "definition" : " সব কলাম উপরে দেখানো"
39- "code" : " <div class='row align-items-start'><div class='col'>...</div><div class='col'>...</div></div>"
40- }, {
41- "definition" : " সব কলাম মাঝে দেখানো"
42- "code" : " <div class='row align-items-center'><div class='col'>...</div><div class='col'>...</div></div>"
43- }, {
44- "definition" : " সব কলাম নিচে দেখানো"
45- "code" : " <div class='row align-items-end'><div class='col'>...</div><div class='col'>...</div></div>"
46- }, {
47- "definition" : " একটি কলাম উপরে দেখানো"
48- "code" : " <div class='row'><div class='col align-self-start'>...</div></div>"
49- }, {
50- "definition" : " একটি কলাম মাঝে দেখানো"
51- "code" : " <div class='row'><div class='col align-self-center'>...</div></div>"
52- }, {
53- "definition" : " একটি কলাম নিছে দেখানো"
54- "code" : " <div class='row'><div class='col align-self-end'>...</div></div>"
55- }
56- ]
57- }, {
58- "title" : " হরিজেন্টাল আলাইনমেন্ট"
59- "items" : [{
60- "definition" : " সব কলাম বামে দেখানো"
61- "code" : " <div class='row justify-content-start'><div class='col'>...</div><div class='col'>...</div></div>"
62- }, {
63- "definition" : " সব কলাম ডানে দেখানো"
64- "code" : " <div class='row justify-content-end'><div class='col'>...</div><div class='col'>...</div></div>"
65- }, {
66- "definition" : " সব কলাম মাঝে দেখানো"
67- "code" : " <div class='row justify-content-center'><div class='col'>...</div><div class='col'>...</div></div>"
68- }, {
69- "definition" : " সব কলাম ডানে বামে সমান গ্যাপে দেখানো"
70- "code" : " <div class='row'><div class='col justify-content-around'>...</div></div>"
71- }
72- ]
73- }, {
74- "title" : " টাইপোগ্রাফি ক্লাস"
75- "items" : [
76- {
77- "definition" : " বোল্ড টেক্সট"
78- "code" : " <p class='font-weight-bold'>...</p>"
79- }, {
80- "definition" : " ইটালিক টেক্সট"
81- "code" : " <p class='font-italic'>...</p>"
82- }, {
83- "definition" : " লাইট উইড টেক্সট"
84- "code" : " <p class='font-weight-light'>...</p>"
85- }, {
86- "definition" : " লেফট অ্যালাইন"
87- "code" : " <p class='text-left'>...</p>"
88- }, {
89- "definition" : " রাইট অ্যালাইন"
90- "code" : " <p class='text-right'>...</p>"
91- }, {
92- "definition" : " জাস্টিফাই টেক্সট"
93- "code" : " <p class='text-justify'>...</p>"
94- }, {
95- "definition" : " আপারকেস টেক্সট"
96- "code" : " <p class='text-uppercase'>...</p>"
97- }, {
98- "definition" : " ক্যাপিটালাইস টেক্সট"
99- "code" : " <p class='text-capitalize'>...</p>"
100- }
101- ]
102- }, {
103- "title" : " টেবিল ক্লাস"
104- "items" : [{
105- "definition" : " স্ট্রাইপ টেবিল"
106- "code" : " <table class='table-striped'>...</table>"
107- }, {
108- "definition" : " বর্ডার টেবিল"
109- "code" : " <table class='table-bordered'>...</table>"
110- }, {
111- "definition" : " বর্ডার ছাড়া টেবিল"
112- "code" : " <table class='table-borderedless'>...</table>"
113- }, {
114- "definition" : " মাউস হোভারে বিজি কালার পরিবর্তন টেবিল"
115- "code" : " <table class='table-hover'>...</table>"
116- }, {
117- "definition" : " ডার্ক কালার টেবিল"
118- "code" : " <table class='table-dark'>...</table>"
119- }, {
120- "definition" : " রেস্পন্সিভ টেবিল"
121- "code" : " <div class='table-responsive'><table>...</table></div>"
122- }]
123- }, {
124- "title" : " ইমেজ ক্লাস"
125- "items" : [{
126- "definition" : " রাউন্ড কর্নার"
127- "code" : " <img class='rounded'>"
128- }, {
129- "definition" : " বৃত্ত আকার"
130- "code" : " <img class='rounded-circle'>"
131- }, {
132- "definition" : " লেফট অ্যালাইন"
133- "code" : " <img class='float-left'>"
134- }, {
135- "definition" : " রাইট অ্যালাইন"
136- "code" : " <img class='float-right'>"
137- }, {
138- "definition" : " সেন্টার অ্যালাইন"
139- "code" : " <img class='d-block mx-auto'>"
140- }, {
141- "definition" : " রিস্পন্সিভ ইমেজ"
142- "code" : " <img class='img-fluid'>"
143- }]
144- }
2+ "id" :" bootstrap4"
3+ "title" :" বুটস্ট্রাপ ৪"
4+ "slug" :" bootstrap4"
5+ "description" :" টুইটার বুটস্ট্রাপ হলো একটা এইচ টি এম এল,সি এস এস,জাভাস্ক্রিপ্ট ফ্রেমওয়ার্ক যার সর্বশেষ সংস্করণ হলো বুটস্ট্রাপ ৪ , মূলত দ্রুত ওয়েব পেজ ও ওয়েব অ্যাপ্লিকেশন তৈরী করার জন্যে এটা ব্যাপকভাবে ব্যাবহৃত ।"
6+ "colorPref" :" #563D7C"
7+ "contents" :[
8+ {
9+ "title" :" কন্টেনার ক্লাস"
10+ "items" :[
11+ {
12+ "definition" :" রেস্পন্সিভ ফিক্স উইড"
13+ "code" :" <div class='container'>...</div>"
14+ },
15+ {
16+ "definition" :" ফুল উইড"
17+ "code" :" <div class='container-fluid'>...</div>"
18+ }
19+ ]
20+ },
21+ {
22+ "title" :" গ্রিড ক্লাস"
23+ "items" :[
24+ {
25+ "definition" :" স্ক্রীন প্রস্থ যখন ৫৭৬পিক্সেল এর ছোট"
26+ "code" :" <div class='col-'>...</div>"
27+ },
28+ {
29+ "definition" :" স্ক্রীন প্রস্থ যখন ৫৭৬পিক্সেল এর সমান বা বড়"
30+ "code" :" <div class='col-sm'>...</div>"
31+ },
32+ {
33+ "definition" :" স্ক্রীন প্রস্থ যখন ৭৬৮পিক্সেল এর সমান বা বড়"
34+ "code" :" <div class='col-md'>...</div>"
35+ },
36+ {
37+ "definition" :" স্ক্রীন প্রস্থ যখন ৯৯২পিক্সেল এর সমান বা বড়"
38+ "code" :" <div class='col-lg'>...</div>"
39+ },
40+ {
41+ "definition" :" স্ক্রীন প্রস্থ যখন ১২০০পিক্সেল এর সমান বা বড়"
42+ "code" :" <div class='col-xl'>...</div>"
43+ }
44+ ]
45+ },
46+ {
47+ "title" :" ভার্টিকাল আলাইনমেন্ট"
48+ "items" :[
49+ {
50+ "definition" :" সব কলাম উপরে দেখানো"
51+ "code" :" <div class='row align-items-start'><div class='col'>...</div><div class='col'>...</div></div>"
52+ },
53+ {
54+ "definition" :" সব কলাম মাঝে দেখানো"
55+ "code" :" <div class='row align-items-center'><div class='col'>...</div><div class='col'>...</div></div>"
56+ },
57+ {
58+ "definition" :" সব কলাম নিচে দেখানো"
59+ "code" :" <div class='row align-items-end'><div class='col'>...</div><div class='col'>...</div></div>"
60+ },
61+ {
62+ "definition" :" একটি কলাম উপরে দেখানো"
63+ "code" :" <div class='row'><div class='col align-self-start'>...</div></div>"
64+ },
65+ {
66+ "definition" :" একটি কলাম মাঝে দেখানো"
67+ "code" :" <div class='row'><div class='col align-self-center'>...</div></div>"
68+ },
69+ {
70+ "definition" :" একটি কলাম নিছে দেখানো"
71+ "code" :" <div class='row'><div class='col align-self-end'>...</div></div>"
72+ }
73+ ]
74+ },
75+ {
76+ "title" :" হরিজেন্টাল আলাইনমেন্ট"
77+ "items" :[
78+ {
79+ "definition" :" সব কলাম বামে দেখানো"
80+ "code" :" <div class='row justify-content-start'><div class='col'>...</div><div class='col'>...</div></div>"
81+ },
82+ {
83+ "definition" :" সব কলাম ডানে দেখানো"
84+ "code" :" <div class='row justify-content-end'><div class='col'>...</div><div class='col'>...</div></div>"
85+ },
86+ {
87+ "definition" :" সব কলাম মাঝে দেখানো"
88+ "code" :" <div class='row justify-content-center'><div class='col'>...</div><div class='col'>...</div></div>"
89+ },
90+ {
91+ "definition" :" সব কলাম ডানে বামে সমান গ্যাপে দেখানো"
92+ "code" :" <div class='row'><div class='col justify-content-around'>...</div></div>"
93+ }
94+ ]
95+ },
96+ {
97+ "title" :" টাইপোগ্রাফি ক্লাস"
98+ "items" :[
99+ {
100+ "definition" :" বোল্ড টেক্সট"
101+ "code" :" <p class='font-weight-bold'>...</p>"
102+ },
103+ {
104+ "definition" :" ইটালিক টেক্সট"
105+ "code" :" <p class='font-italic'>...</p>"
106+ },
107+ {
108+ "definition" :" লাইট উইড টেক্সট"
109+ "code" :" <p class='font-weight-light'>...</p>"
110+ },
111+ {
112+ "definition" :" লেফট অ্যালাইন"
113+ "code" :" <p class='text-left'>...</p>"
114+ },
115+ {
116+ "definition" :" রাইট অ্যালাইন"
117+ "code" :" <p class='text-right'>...</p>"
118+ },
119+ {
120+ "definition" :" জাস্টিফাই টেক্সট"
121+ "code" :" <p class='text-justify'>...</p>"
122+ },
123+ {
124+ "definition" :" আপারকেস টেক্সট"
125+ "code" :" <p class='text-uppercase'>...</p>"
126+ },
127+ {
128+ "definition" :" ক্যাপিটালাইস টেক্সট"
129+ "code" :" <p class='text-capitalize'>...</p>"
130+ }
131+ ]
132+ },
133+ {
134+ "title" :" টেবিল ক্লাস"
135+ "items" :[
136+ {
137+ "definition" :" স্ট্রাইপ টেবিল"
138+ "code" :" <table class='table-striped'>...</table>"
139+ },
140+ {
141+ "definition" :" বর্ডার টেবিল"
142+ "code" :" <table class='table-bordered'>...</table>"
143+ },
144+ {
145+ "definition" :" বর্ডার ছাড়া টেবিল"
146+ "code" :" <table class='table-borderedless'>...</table>"
147+ },
148+ {
149+ "definition" :" মাউস হোভারে বিজি কালার পরিবর্তন টেবিল"
150+ "code" :" <table class='table-hover'>...</table>"
151+ },
152+ {
153+ "definition" :" ডার্ক কালার টেবিল"
154+ "code" :" <table class='table-dark'>...</table>"
155+ },
156+ {
157+ "definition" :" রেস্পন্সিভ টেবিল"
158+ "code" :" <div class='table-responsive'><table>...</table></div>"
159+ }
160+ ]
161+ },
162+ {
163+ "title" :" ইমেজ ক্লাস"
164+ "items" :[
165+ {
166+ "definition" :" রাউন্ড কর্নার"
167+ "code" :" <img class='rounded'>"
168+ },
169+ {
170+ "definition" :" বৃত্ত আকার"
171+ "code" :" <img class='rounded-circle'>"
172+ },
173+ {
174+ "definition" :" লেফট অ্যালাইন"
175+ "code" :" <img class='float-left'>"
176+ },
177+ {
178+ "definition" :" রাইট অ্যালাইন"
179+ "code" :" <img class='float-right'>"
180+ },
181+ {
182+ "definition" :" সেন্টার অ্যালাইন"
183+ "code" :" <img class='d-block mx-auto'>"
184+ },
185+ {
186+ "definition" :" রিস্পন্সিভ ইমেজ"
187+ "code" :" <img class='img-fluid'>"
188+ }
189+ ]
190+ },
191+ {
192+ "title" :" ফ্লোট ( ভাসানো )"
193+ "items" :[
194+ {
195+ "definition" :" বামে ভাসানো"
196+ "code" :" <div class='float-left'>...</div>"
197+ },
198+ {
199+ "definition" :" ডানে ভাসানো"
200+ "code" :" <div class='float-right'>...</div>"
201+ },
202+ {
203+ "definition" :" না ভাসানো"
204+ "code" :" <div class='float-left'>...</div>"
205+ },
206+ {
207+ "definition" :" স্ক্রীন প্রস্থ যখন ৫৭৬ পিক্সেল এর সমান বা বড়"
208+ "code" :" <div class='float-sm-left'>...</div>, <div class='float-sm-right'>...</div>"
209+ },
210+ {
211+ "definition" :" স্ক্রীন প্রস্থ যখন ৭৬৮ পিক্সেল এর সমান বা বড়"
212+ "code" :" <div class='float-md-left'>...</div>, <div class='float-md-right'>...</div>"
213+ },
214+ {
215+ "definition" :" স্ক্রীন প্রস্থ যখন ৯৯২ পিক্সেল এর সমান বা বড়"
216+ "code" :" <div class='float-lg-left'>...</div>, <div class='float-lg-right'>...</div>"
217+ },
218+ {
219+ "definition" :" স্ক্রীন প্রস্থ যখন ১২০০ পিক্সেল এর সমান বা বড়"
220+ "code" :" <div class='float-xl-left'>...</div>, <div class='float-xl-right'>...</div>"
221+ }
222+ ]
223+ },
224+ {
225+ "title" :" ক্লিয়ারফিক্স"
226+ "items" :[
227+ {
228+ "definition" :" ক্লিয়ার ফ্লোটস"
229+ "code" :" <div class='clearfix'>...</div>"
230+ }
231+ ]
232+ }
145233 ]
146- }
234+ }
0 commit comments