Link with CSS
.link
{
text-decoration:none
}
<a href="test.html" class="link">Home</a>
အ ဲဒါဆိုရင္ ကၽြန္ေတာ္တို႕ သံုးလိုက္တဲ့ Home မွာ ေအာက္မွာ မ်ဥ္းသားထားသာကို
ေတြ႕ရမွာမဟုတ္ေတာ့ဘူး...
ဘာျဖစ္လို႕လည္းဆိုကၽြန္ေတာ္တို႕ttext-decoration:noneလုိ႕ေရးသားထားခဲ့လို႕ပါ..
<html><head><title>CSS</title><head>
<style>
.link , .link:visited
{
text-decoration:none
}
.link:hover
{
color:green;
text-decoration:underline;
}
</style></head>
<body>
<a href="test.html" class="link">Home</a></body>
</html>
ဒါဆိုရင္ေတာ့ တမ်ဳိးဆန္းသြားတာေပါ့...
.link:visited ဆိုတာ ကိုယ္သြားျပီးတဲ့ link လည္း .link နဲ႕ တူတူပဲျဖစ္ခ်င္လို႕ comma
ခံျပီးေရးလိုက္တာပါ...
.link:hover ဆိုတာကေတာ့ mouse တင္လိုက္ရင္ ျဖစ္သြားမယ့္ style ပါ...ဒီမွာဆိုရင္ေတာ့ အအေရာင္က အစိမ္းေရာင္ျဖစ္သြားမယ္... underlineတားမယ္...အဲလိုေလးေပၚလာပါလိမ့္မယ္...
<html><head><title>CSS</title><head>
<style>
a , a:visited
{
text-decoration:none;
}
a:hover
{
color:green;
text-decoration:underline;
}
.link , .link:visited
{
color:green;
text-decoration:underline;
}
.link:hover
{
text-decoration:none;
}
</style></head>
<body>
<a href="test.html">Home</a>
<a href="test.html">Home2</a>
<a href="test.html" class="link">Link</a>
</body>
</html>
ကဲဒါဆိုရင္ေတာ့ a tage မွန္သမွ်ရဲ႕ style ကို တစ္ပံုစံတည္းထားခိုင္းပါတယ္..link မွာေတာ့ style ထည့္ခ့ဲပါတယ္...
class သံုးတဲ့ တစ္ခုပဲပံုေျပာင္းေနပါမယ္.. က်န္တာကေတာ့ a tage style အတိုင္းေပါ့...
h1
{
text-transform:uppercase;
}
အဲလိုေလး style tage ထဲမွာေရးျပီး<h1>hello</h1> လုိ႕ေရးထားခဲ့ရင္ေတာ့ HELLO ဆိုျပီးေပၚေနပါမယ္...
အဲ..အဲဒီလုိ သံုးရမယ့္ function ေလးေတြက ဘယ္လိုသိလဲဆိုရင္ေတာ့ dreamweaver မွာ auto
ပါျပီးသားပါ..
h1 { ျပီးေတာ့ space ျခားလိုက္တာနဲ႕ ေပၚလာပါမယ္... ေရြးလိုက္ရံုပဲ...ကဲဒါဆိုရင္ HTMLTage ေတြမွာသံုး လို႕ရ တာသိေလာက္ျပီထင္တယ္...ဒီထက္နည္နည္းျမင့္တဲ့ အပိုင္းေလးေတြ မၾကာခင္သြားေတာ့မယ္...
}
Post a Comment