သင္ခန္းစာ-၂
ဒီေန႕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ၾကည့္ပါဦး
No comments:
Post a Comment