သင္ခန္းစာ-၂
ဒီေန႕class selectorနဲ႔id selectorကို႐ွင္းျပပါမယ္ႏွစ္ခုလံုးကေတာ့ ကိုstyleထည့္ခ်င္တဲ့စာပိုဒ္သို႔မဟုတ္အေၾကာင္းအရာကိုနာမည္ေပးၿပီးအဲ့ဒီနာမည္ ကိုselectorကိုအသံုးျပဳကာအေရာင္ေတြstyleေတြထည့္တာပါပဲ ၁။ ။class selector ပထမဆံုးclass selectorကိုစ႐ွင္းပါမယ္ ဥပမာမိမိရဲ႕html documentထဲမွာ<p>ဆိုတဲ့စာပိုဒ္တစ္ခု႐ွိတယ္ဆိုပါဆို႔ အဲ့ဒီစာပိုဒ္ကိုclassဆိုတဲ့html altributeကိုသံုးၿပီးနာမည္တစ္ခုသတ္မွတ္ပါမယ္ <p class="name"> text </p> ဒီလိုေရးပါတယ္ classကိုသံုးၿပီး nameလို႔အမည္ေပးလိုက္တယ္ အဲ့ဒီနာမည္ ကိုcssမွာselectorအျဖစ္အသံုးျပဳမယ္ဆိုရင္ ပထမဆံုး <p> tagကေန pဆိုတဲ့စာလံုးကိုယူမယ္ ပီးသူ႔ေနာက္က(.)dotဆိုတဲ့အစက္ခ်မယ္ ပီးရင္နာမည္ေရးရံုပါပဲ p.name{ font-size:10px; } ဒီလိုပါ ကဲhtmlအျပည့္အစံုနဲ႔ေရးျပမယ္ေနာ္ <html> <head> <style type="text/css"> p.naing{ font-size:20px; color:green; } </style> </head> <body> <p class="naing">မဂၤလာပါ </p> </body> </html> Code ကိုrunၾကည့္ပါခမ်ာ မွတ္ထားရမွာတစ္ခုက classကိုအမည္ေပးရမွာ နံပါဂဏန္းေတြမေပးပါနဲ႔ htmlရဲ႕altributeနာမည္ေတြမေပးပါနဲ႔ ဥပမာ class="12345"(အမွား) class="body"(အမွား) class="hacker"(အမွန္) ၂။ ။id selector သူလည္းclass selectorလိုပါပဲ <p id="name">text</p> ဒါေပမယ့္သူ႔မွာကြဲျပားတာက class selectorလို(.)dotကိုမသံုး ပဲ (#)ကိုသံုးပါတယ္ #name{ font-size:20px; color:green; }ဒီလိုေရးပါတယ္ ေအာက္မွာဥပမာၾကည့္ပါခမ်ာ <html> <head> <style type="text/css"> #hacker{ font-size:20px; color:green; } </style> </head> <body> <p id="hacker"> မဂၤလာပါ </p> </body> </html> Runၾကည့္ပါဦး
Sunday, March 27, 2016
CSS-LESSION-2
Subscribe to:
Post Comments (Atom)
WINDOWS PASSWORD ကို ေဆာ့၀ဲလ္ မသံုးဘဲ ေက်ာ္နည္း
windows 7 မွာ password ေမ့သြားရင္ ေက်ာ္ခြနည္းေလးပါ။ windows 7 အေခြေတာ့ လုိအပ္ပါတယ္။ windows 7 အေခြကို Drive ထဲကို ထည့္လို...
-
၁.ႏွစ္သစ္မဂၤလာ ~ (ရင္ဂုိ) ၂.ဖုိးညဳိျမ ~ (စည္သူလြင္) ၃.ခ်မ္းပါတယ္ ~ (ဂေရဟမ္) ၄.သၾက္န္မုိးေရ တန္ခုူးေလ ~ (ရင္ဂုိ) ၅.ရွာပုံေတာ္မင္းသားၾက... -
ဆားပုလင္းႏွင္းေမာင္ႏွင့္ ပေရာ္ဖက္ဆာ ေဒါက္တာဆိတ္ဖြား (မင္းသိခၤ) Inspector Hnin Maung and Professor Dr. Sate Phwar Author : Min Thane Kha ...
-
Mac OS X နဲ႔ ပါတ္သက္ျပီး ေမးထားတာေတြမ်ားေနလို႔ ကို သီဟဦး ေရးထားတဲ႔ ပို႔စ္ေလးကိုပဲ ဗဟုသုတအျဖစ္ ျပန္လည္ မွ်ေဝေပးလိုက္ပါတယ္.. Mac ကြန္ပ်ဴ...
No comments:
Post a Comment