කොහොමද යාලුවනේ…ගොඩ
කාලෙකට පස්සෙ බ්ලොග් එක පැත්තෙ ආවෙ…මතක ඇති අපි html tut ටිකක් දැම්ම ඒ සෙට් එකේ හයවෙනි
කොටස තමා අද දෙන්න යන්නෙ…
HTML පරණ
post 5 කියෙව්වෙ නැත්නම් මේ Link වලට ගිහින් කියවන්න!
- HTML මුල සිට සරලව!!! ( 5 කොටස) - http://www.sltechz.tk/2018/06/html-5.html
- HTML මුල සිට සරලව!!! ( 4 කොටස) - http://www.sltechz.tk/2018/06/html-4.html
- HTML මුල සිට සරලව!!! ( 3 කොටස) - http://www.sltechz.tk/2018/06/html-3.html
- HTML මුල සිට සරලව!!! ( 2 කොටස) - http://www.sltechz.tk/2018/06/html-2.html
- HTML මුල සිට සරලව!!! ( 1 කොටස) - http://www.sltechz.tk/2018/06/html-1.html
මේකෙදි කතාකරන්න
යන්නෙ colors පිලිබදව…web page එකක් ලස්සනට තියාගන්න නතුවම බැරි දෙයක්නෙ ඉතින්
colors කියන්නෙ…මුලින්ම අපි බලමු Headline එකක හරි Paragraph එකක හරි Background එකට
color දාන හැටි…මේඋදාහරනෙ බැලුවොත් ඔයාලට තේරෙයි…
<html>
<head>
<title>Colors</title>
</head>
<body>
<h1
style="background-color:Blue;">Blue Background Heading</h1>
<p
style="background-color:Red;">This paragraph with red
background.</p>
</body>
</html>
Code එක සරලව
කිවුවොත්
<h1(or
p) style=”background-color:පාට;>heading or paragraph</h1>
ඔය විදිහට
තමා code වෙන්නෙ…දැන් බලමු text වල color වෙනස්කරන හැටි….
ඒකත් මුලින්ම
උදාහරණයක් දෙන්නම්!
<html>
<head>
<title>Colors</title>
</head>
<body>
<h1
style="color:Blue;">Blue Color Heading</h1>
<p
style="color:Red;">This paragraph with red text.</p>
</body>
</html>
ඒකෙත්
code එක එන පිලිවෙල මේකයි ….
<h1(or
p) style="color:පාට;">Heading
or paragraph</h1>
තේරෙන්න ඇති
කියල හිතෙනව…දැන් බලමු heading එකට හරි paragraph එකට හරි border එකක් දාන හැටි…
<html>
<head>
<title>Color</title>
</head>
<body>
<h1
style="border:3px solid Red;">Headline with 3px Red
Border</h1>
<p
style="border:2px solid Blue;">Paragraph with 2px Blue
Border</p>
</body>
</html>
උදාහරනෙ දැක්කහම
තේරෙනව ඇති මේකෙන් border එකේ colore එක වගේම size එකත් වෙනස් කරන්න පුලුවන් කියල…මේකෙ code වෙන විදිහ මෙහෙමයි
…
<h1(or
p) style=”border:(Border එකේ pixel ගාන) solid (පාට);”>Heading එක හරි
Paragraph එක </h1>
හරි එහෙනම්
අපිට color දාන්න පුලුවන් විදි කිහිපයකුත්
තියනව ….අපි උඩ උදාහරණ වලදි පාවිච්චිකලේ නිකම්ම color එකේ නම …මේ විදිහට අපිට
ඕනෙ පාට දාන්න අමාරුයි…ඉතිeන් එකට විදි ඔඩක් html වලදි පාවිච්චි කරනව …මන් එකින් එක
කියන්නම් උදාහරණත් එක්ක!
RGB
values
rgb(රතු,කොල,නිල්)
මේ color
වල එක පාටකින් එන්න ඕනෙ ප්‍රමානය 0 ත් 255 වෙනකම් දාන්න ඕනෙ …
Rgb(255,0,0)
මේකෙන් රතු පාට ගන්න පුලුවන්…මේ code එක Photoshop වලින් ලේසියෙන්ම color picker එකෙන්
ගන්න පුලුවන්..
Hexa
#RRGGBB
උඩකිවුව විදිහටම
අංක වලින් දාපු අගය hexa(16 පාදයෙන්)දාන්න තියෙන්නෙ…
#00FF00 මෙකෙන්
කොල පාට පෙන්නනව …
ඒවගේම hsl
කරමේට පාට යොදන්න පුලුවන්…ඒකෙදිත් rgb වල වගේම hsl වරහනක් දාල
(hue,saturation,lightness) දානව..
ඒ වගේම
rgb hsl අගට තවත් a අකුරක් දාල විනිවිද පේන පරමානය අඩු වැඩි කරන්න පුලුවන්…
rgba(255,0,0,0.5)
hsla(0,100%,50%,0.3)
ඉතින් මේව
code කරලම බලන්න …එතකොට තේරෙයි එන විදිහ…
එහෙනම් ඉතින් මේ post එකත් ඉවරයි..ගැටලු තියෙයිනම්
comment කරන්න!වැදගත් කියල හිතෙනවනම් යාලුවන්ට බලන්න share කරන්න!එහෙනම් මම කැපුන…
බුදු සරණයි!
Comments
Post a Comment