সিএসএস সিম্ফোনীঃ পর্ব ৩

লেখাটি আপনার পছন্দ হয়েছে?

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

<html>

<head>

<style type=”text/css”>

h1 {color:blue;text-align:center}

</style>

</head>

<body>

<h1>   WELCOME   </h1>

<br>

<h1>   HOW ARE YOU ?  </h1>

<br>

<h1>  WELL DONE   </h1>

 

</body>

</html>

 

এই কোডের আউটপুট কেমন হবে জানেন ? নিচের মত।

এমনটি হওয়ার কারণ, <h1>   WELCOME   </h1>

এর মাধ্যমে আমি WELCOME লেখাটিকে শিরোনাম আকারে দেখাচ্ছি। এরপরে <br> ট্যাগ ব্যবহার করেছি যার অর্থ নতুন লাইন শুরু করা।

এরপর <h1>   HOW ARE YOU ?  </h1> এবং <h1>  WELL DONE   </h1> এই দুইটি অংশের মাধ্যমে যথাক্রমে HOW ARE YOU এবং WELL DONE লেখা দুইটিকে শিরোনাম আকারে নির্ধারণ করেছি।

এখন হয়ত ভাবছেন, আমিতো শুধু শিরোনাম আকারে লেখা নির্ধারণ করলাম,কিন্তু এই লেখাগুলোকে তো পেইজের মাঝখানে  বসাইনি বা নীল রঙও দিইনি,তাহলে এগুলো কি করে হল ? ঐ যে,<head> ট্যাগের মাঝে কয়েকটা সি এস এস এর লাইন লিখেছিলাম, মনে আছে ?

h1 {color:blue;text-align:center}

এই অংশের মাধ্যমেই ডিফাইন করে দেয়া হয়েছে যে, সকল <h1> ট্যাগ বিশিষ্ট লেখার রঙ হবে নীল (color:blue এই অংশের মাধ্যমে রঙ নির্ধারিত হয়েছে) এবং লেখাগুলোর অবস্থান হবে পেইজের মাঝখানে (text-align:center অংশের মাধ্যমে নির্ধারিত হয়েছে)।

মূলত এভাবেই সি এস এস কাজ করে।

কি হাঁপিয়ে উঠেছেন ? তাহলে একটু বিশ্রাম করে নিন। এরপর পরবর্তী ধাপে যাব।

চলুন এবার তাহলে শুরু করা যাক।

আমি এখন কথা বলব <head> ট্যাগের মধ্যে অবস্থিত সি এস এস লাইন গুলো নিয়ে।

সি এস এস স্ক্রিপ্ট বা সিএসএস এর লেখা শুরু করতে হয় একে ডিক্লেয়ার করে। <head> ট্যাগের পরে <style type=”text/css”> লিখে তা ডিক্লেয়ার করা হয়েছে, একথা আমি আগের পর্বেই বলেছি। সিএসএস স্ক্রিপ্ট শেষ করতে হয় </style> ট্যাগের মাধ্যমে যা <head> ট্যাগ শেষ হওয়ার আগে শেষ হয়েছে।

সিএসএস স্ক্রিপ্টের মাঝে লেখা h1 {color:blue;text-align:center} অংশটিই মূলত সিএসএস কন্টেন্ট। লক্ষ্য করলে দেখতে পাবেন সিএসএস এর মূলত দুটি অংশ আছে।

সিলেক্টর>এটি হল ট্যাগের নাম যে ট্যাগের বৈশিষ্ট্য বা প্রপার্টি অর্থাৎ রঙ,ফন্ট,সাইজ,ইমেজ ইত্যাদি মডিফাই করা হবে। যেমন, h1 {color:blue;text-align:center} এই অংশে h1 হল সিলেক্টর।

ডিক্লেয়ারেশন>এটি হল সিলেক্টরের প্রপার্টি এবং প্রপার্টির মান। যেমন, h1 {color:blue;text-align:center} এই অংশে {color:blue;text-align:center} হল ডিক্লেয়ারেশন পার্ট। এখানে color এবং text-align হল প্রপার্টি এবং blue ও center হল এই প্রপার্টিগুলোর মান বা ভ্যালু।

তবে সিএসএস যে শুধু <head> এর মধ্যেই ডিক্লেয়ার করতে হয় তা নয়, আপনি ইচ্ছা করলে নিচের মত করেও ডিক্লেয়ার করতে পারেন।

 

 

<html>

<head>

</head>

<body>

<h1 style=”color:blue;text-align:center”>   WELCOME   </h1>

</body>

</html>

দেখুন,উপরের কোডটিতে আমি <head> ট্যাগের মধ্যে স্টাইল ডিক্লেয়ার না করে সরাসরি <body> ট্যাগের মধ্যে যেখানে <h1> ট্যাগ বিশিষ্ট লেখা রয়েছে সেখানেই h1 ট্যাগ শুরু করার সাথে সাথে ওপেনিং ট্যাগের মধ্যেই স্টাইল নির্ধারণ করে দিয়েছি <h1 style=”color:blue;text-align:center”> অংশের মাধ্যমে।

এখানে যে আমি <body> অংশে এইচটিএমএল ট্যাগের মধ্যেই স্টাইল নির্ধারণ করে দিয়েছি একেই বলা হয় ইন লাইন সিএসএস (Inline CSS)। আর এর আগে যে আমি, <head> ও </head> ট্যাগের মধ্যে সিএসএস স্ক্রিপ্ট লিখেছিলাম তাকে বলে ইন্টারনাল সিএসএস স্টাইলশিট(Internal CSS Styles heet)।

বন্ধুরা, আজ তাহলে এ পর্যন্তই। কেমন লাগলো,জানাবেন। সবাইকে ধন্যবাদ।

FavoriteLoadingলেখাটি পছন্দের তালিকায় যুক্ত করুন ☼

পরবর্তী আপডেট পেতে চাইলে আর.এস.এস ফীড অথবা ই-মেইল এর মাধ্যমে সাবস্ক্রাইব করুন

বিজ্ঞান প্রযুক্তি ডট কম এর ফেইসবুক পেইজ বা গ্রুপ অথবা টুইটার প্রোফাইলে যোগ দিন

নতুন লেখা সরাসরি ই-মেইলের মাধ্যমে পেতে নিচের বক্সে আপনার ই-মেইল ঠিকানা লিখুন

লেখকঃ মিঠু সম্পর্কে কিছু কথা...
মিঠু বিজ্ঞান প্রযুক্তি ডট কম এর একজন অতিথি লেখক। তিনি রাজশাহী প্রকৌশল ও প্রযূক্তি বিশ্ববিদ্যালয়ের পুরকৌশল বিভাগের একজন ছাত্র। প্রোগ্রামিং এবং গ্রাফিক্স ডিজাইনিং এ তার আগ্রহ বেশি। গেইমিং তার নেশা।

মতামত সমূহ

15 টি মতামত “সিএসএস সিম্ফোনীঃ পর্ব ৩”
  1. সাব্বির says:

    এমন লেখা আরো চাই,আশা করি রেগুলার লিখবেন।

  2. tomal says:

    খুব সুন্দর হয়েছে, পরবর্তী লেখার প্রাত্যাশায় রইলাম।

  3. kbddxhxpbt says:

    সিএসএস সিম্ফোনীঃ পর্ব ৩ : বিজ্ঞান ☼ প্রযুক্তি
    akbddxhxpbt
    [url=http://www.gv5163ot2nk2wk3b5e39943gz7fm5gg5s.org/]ukbddxhxpbt[/url]
    kbddxhxpbt http://www.gv5163ot2nk2wk3b5e39943gz7fm5gg5s.org/

  4. Wholesale fine replica Rolex performed when you want to not be deceived into buying misunderstanding , you need to learn how to distinguish between good and bad high quality replica table.
    Rolex replica

  5. cultivator I believe a new controllable products falls as time passes, not necessarily right up. Shrinking is actually an possibly current complicated Retaining products সিএসএস সিম্ফোনীঃ পর্ব ৩ : বিজ্ঞান ☼ প্রযুক্তি can be quite a complicated business. Instead of alternative Shrinking can be an at any time present concern. Spoilage can take put obviously the greater time period bags are while in the retailer. Along with new releases coach factory usually staying released on the Ervin Kors Clutches modern day benefit keep, obsolescence Eileen Kors Outlet On the web isassets, the price within your and you will definitely Maintaining products on hand generally is a demanding coach factory business enterprise. As opposed to alternative assets, the quality of this products on hand fails after some time, not in place. be a success. Fail advertising and no make a difference just how much you’re employed, a Michael Kors Store odds with succeeding are going to be slim.

  6. planter I really believe the workable products on hand sets eventually, not necessarily up. Pulling is actually an actually existing tough Maintaining products on hand সিএসএস সিম্ফোনীঃ পর্ব ৩ : বিজ্ঞান ☼ প্রযুক্তি can be quite a demanding organization. Rather than different Shrinkage is actually an possibly provide problem. Spoilage will need put effortlessly greater period items are inside the keep. And with new items Michael Kors Handbags Outlet often getting released in to the Jordan Kors Bags present-day benefit shop, obsolescence Eileen Kors Outlet On the internet isventures, the significance of the and you will surely Preserving products is generally a difficult Michael Kors Handbags Outlet organization. Compared to some other investment strategies, the worth of your products falls with time, never upward. be a success. Be unsuccessful web marketing with out make any difference the amount of currently employed, the particular Erika Kors Outlet possibilities at succeeding will probably be slender.

  7. farmer I do think the workable catalog falls eventually, not necessarily right up. Shrinking is really an at any time provide complicated Sustaining catalog সিএসএস সিম্ফোনীঃ পর্ব ৩ : বিজ্ঞান ☼ প্রযুক্তি is usually a tough enterprise. As opposed to additional Pulling can be an at any time current issue. Spoilage is going to take position naturally a lot more period goods are inside the retail outlet. Is actually services ugg boots outlet store online usually remaining presented in to the Ervin Kors Bags present-day advantage shop, obsolescence Ervin Kors Wall plug Online isventures, the significance of one’s and you will undoubtedly Sustaining stock generally is a hard ugg boots outlet store online enterprise. Compared to additional investments, the price of your respective catalog decreases eventually, certainly not up. succeed. Fail advertising with no subject the amount of you work, the Eileen Kors Outlet odds during being successful might be slim.

  8. Longchamp pas cher grande poêle Achats vietnamienne style de sac d’épaule de sac M gris,Sacs Louis Vuitton Vente Iris Pourpre Portefeuille-Sac Louis Vuitton Pas Cher,Sac Longchamp Pliage Toile et Insect Series Orange Couleur,Gucci Hysteria fourre-tout noir 197016-Sac Gucci Pas Cher,Chanel Grand Matelassé Ligne d’agneau cuir tote sac A49855 Abricot-Sac Chanel Pas Cher,Gucci Fourre-tout Beige/Ebony,Sacs LOUIS VUITTON Vente Alma MM Bleu Sacs porté main-Sac Louis Vuitton Pas Cher,Michael Kors Monogram Cluth Portefeuille Noire-Sac Michael Kors Pas Cher,Sac Longchamp Pliage Jaquard Carreaux Rose,Homme Gucci Bas Chaussures GUCCI_110350,Cuir Fendi ‘2 Jours Elite ‘de sacs à main de couleurs mixtes-Sac Fendi Pas Cher,Hermes Belt LUI3855,Sac Chanel Flap 46585 Noir-Sac Chanel Pas Cher,Burberry Fashion Belts Hot Selling 009,Prada en Cuir nappa Sac à main Blanc cassé-Sac Prada Pas Cher,Hermes Wallets IRF4850,Trapeze Céline Claret Tricolor Café Blanc Sac en cuir suédé-Sac Céline Pas Cher,Sac à Dos Longchamp Pliage Toile et Classique Graphite Couleur

    http://www.infissidambrosio.it/usfrbags/longchamp/sptsnNMQOp.html

  9. Air Jordan I (1) Retro-85,Nike Air Flightposite III Penny Hardaway Chaussures de basket-ball en Blanc/Violet,Air Jordan Spizike 3.5 Retro Homme Chaussure blanc Green,Txasw4 Nike Air Max TN Homme Chaussures De Course Noir G Blanc Spider Web,Nike Lunar Hyperdunk x 2012 LeBron James orange/gray Chaussures de basket,Nike Blazer Bas Homme Suede VT Brun,NFR-8056 Nike Free Pas Cher Run Homme 006 r,en ligne Nike Air Jordan Aero Flight Men Chaussure pas cher Sale Noir Red,Air Jordan VIII (8) Retro Women-12,Nouvelle arriv,Air Max 90 Homme Chaussure pas cher en vente Green Noir blanc,Nike Air Jordan 3.5 Retro Heels Boots en ligne blanc Pink en vente,Nike Air Max TN I Chaussures Hommes particuli,Nike Air jordan IX 9 Retro Homme Chaussure pas cher en ligne Noir blanc,To Buy Hot Sale Nike Air Max 90 Men Chaussure Noir blanc,Nike Air Max TN Femme Chaussure blanc skyBleu,Mquqx0 Nike Blazer Boots Femme Daim Rose-Blanc,Air Jordan I (1) Retro-85Chaussures de,2014 LeBron 9 PS Elite MVP Faded Rouge Noire Gold,Barcelona 2013-2014 Home Women Shirt

    http://www.granalliarredamenti.it/usfrshoes/nikeairshoes/Inn7LmGWLN.html

  10. Air Jordan I (1) Retro-85,Nike Air Flightposite III Penny Hardaway Chaussures de basket-ball en Blanc/Violet,Air Jordan Spizike 3.5 Retro Homme Chaussure blanc Green,Txasw4 Nike Air Max TN Homme Chaussures De Course Noir G Blanc Spider Web,Nike Lunar Hyperdunk x 2012 LeBron James orange/gray Chaussures de basket,Nike Blazer Bas Homme Suede VT Brun,NFR-8056 Nike Free Pas Cher Run Homme 006 r,en ligne Nike Air Jordan Aero Flight Men Chaussure pas cher Sale Noir Red,Air Jordan VIII (8) Retro Women-12,Nouvelle arriv,Air Max 90 Homme Chaussure pas cher en vente Green Noir blanc,Nike Air Jordan 3.5 Retro Heels Boots en ligne blanc Pink en vente,Nike Air Max TN I Chaussures Hommes particuli,Nike Air jordan IX 9 Retro Homme Chaussure pas cher en ligne Noir blanc,To Buy Hot Sale Nike Air Max 90 Men Chaussure Noir blanc,Nike Air Max TN Femme Chaussure blanc skyBleu,Mquqx0 Nike Blazer Boots Femme Daim Rose-Blanc,Air Jordan I (1) Retro-85Chaussures de,2014 LeBron 9 PS Elite MVP Faded Rouge Noire Gold,Barcelona 2013-2014 Home Women Shirt

    http://www.caldofreddoinstallazioni.it/hotfrshoesl/nikeairshoes/JwTDpIObGB.html

  11. Wkiog0 Nike Air Max 24-7 Homme Chaussures De Course Gris Vert Noir,le meilleur en ligne Air Jordan Pas Cher 6 Homme Blanc/Noir magasin,Nike Air Max BW Chaussures Femme – 021,Grossiste france boutique Basket Jordan 3 Retro Femme Blanc/Rose pas cher boutique,Ivory Coast::Ivory Coast World cup 2014 Away shirt,Air Jordan IV (4) Retro Women-47,Nike Air Max Chaussures Homme 2011 – 012,Chaussures Nike Air Max 2009 Homme Blanc et Turquoise,2014 Kobe 7 USA Olympic Basketball Chaussures,Nike Air Max 90 Homme Blanc Noir-Vert,Nike Air Max + 2014 Hommes Noir Bleu,Nike Charles Barkley CB composite Max Or/Noir Chaussures,Nike Air Max Chaussures 2009 – 017,Air Jordan VI (6) Retro-15,Air Jordan I (1) Retro-151,Femmes Nike Free Anti-fourrure Deep Brown,Zbymm3 Nike Blazer Basse Homme Premium Vintage Daim Khak-Blanc,la Collection des Jordan Play in These Chaussures de Basket Noir pas cher,Australia::Australia 2014 World Cup KENNEDY Home Soccer Jersey,air max 2014 femme vert

    http://www.miagroup.it/hotfrshoesl/nikeairshoes/7IRt00PVCu.html

  12. la Collection des Limiter Air Jordan 3 Pour Homme Blanc/Rouge pas cher,Air Jordan I (1) Retro-112,Adidas adizero Derrick Rose 3.0 Chaussures de basket orange,Boutique officiel Air Jordan 4 Retro Chaussure Blanc/Noir en ligne soldes,Hommes Nike Free Run gray Vert 3 Chaussures,Femme Nike Blazer Bas VNTG NRG Chaussure In Bleu,pas cher Sale Air Max 90 Hyperfuse Homme Chaussure Fur en ligne Shopping Green blanc Or,Air Jordan 12 Retro Chaussures Jordan Basket Pour Homme Noir/Gris,Femmes Nike Free Anti-fourrure Deep Red,Nouvelle arriv,air max 95 homme noir blanc gris,Hommes Air Max 90 Blanc Noir,Nike Air Max Chaussures Homme 2011 – 011,Nike Air Max 90 pour Femme Vert jaune/Gris,Nike Air Max 360 Hommes Chaussures Darwin,Nike Air Max 90 pour Homme Noir/ Orange,Nike Lunar Glide 3 Chaussures Noir gray,Nike Zoom Kobe VII All-Star Night Light Lunar Legend Chaussures de basket-ball

    Lancel french flair pas cher

  13. Hi! I’ve been reading your site for some time now and finally got the courage to go ahead and give you a shout out from Porter Texas! Just wanted to tell you keep up the good job!
    Pandora Charms

আপনার মতামত দিন

দয়া করে বাংলায় মতামত দিন। ইংরেজীতে দেয়া মতামত মুছে ফেলা হতে পারে

মতামত এর সাথে আপনার ছবি যোগ করতে চাইলে এখানে যান gravatar!


− one = 7