ICT With Shantha Bandara: Basic 02

07.වෙබ් පිටුවට පින්තූරයක් එකතු කරමු.

මෙම ක්‍රමය වලංගු වන්නේ ඔබේ html ගොනුව පවතින ෆෝල්ඩර තුල ඔබ ඇතුලත් කරන පින්තුරය ඇත්නම් පමණි.මෙහිදි කොටස img src=" " ටැගය තුල ඔබේ පින්තූරයේ නම හා දිගුව ඇතුලත් කල යුතු අතර alt=" "ටැගය තුල පින්තුරයේ නම ඇතුලත් කල යුතුය.

<!DOCTYPE html>
<html>
<head>
  <title></title>
</head>
<body>

<img src="ict.jpg" alt="ict">

</body>
</html>

08.වෙබ් පිටුවට පින්තූරයක් එකතු කරමු.

මෙම ක්‍රමය තුලින් සිදු වන්නේ ඔබේ පින්තූරය පවතින ස්ථානය (path) සොයා එය ඇතුලත් කිරිම මගිනි.

<!DOCTYPE html>
<html>
<head>
  <title></title>
</head>
<body>

<img src="C:\Users\MUDITHA (2020)\Desktop\index\ict.jpg">

</body>
</html>

09.ඇතුලත් කල පින්තූරයේ size එක වෙනස් කරමු.

<!DOCTYPE html>
<html>
<head>
  <title></title>
</head>
<body>

<img src="ict.jpg" alt="ict" width="600" height="400">

</body>
</html>

10.ඇතුලත් කල පින්තූරයේ align එක වෙනස් කරමු.

<!DOCTYPE html>
<html>
<head>
  <title></title>
</head>
<body>

<img src="ict.jpg" alt="ict" width="400" height="200" align="right">

<img src="ict.jpg" alt="ict" width="400" height="200" align="left">

<center><img src="ict.jpg" alt="ict" width="400" height="200"></center>


</body>
</html>

11.ඇතුලත් කල පින්තූරයට Border එකක් යොදමු.

<!DOCTYPE html>
<html>
<head>
  <title></title>
</head>
<body>

<img src="ict.jpg" alt="ict" width="600" height="400" border="5">

</body>
</html>

12.මොකක් ද මේ br ටැග් එක කියන්නේ ?
මෙම ටැගය මගින් කිසියම් පෙලක රේඛීය බේදිමක් ඇති කරයි.මෙම ටැගය භාවිතා කරන අවස්ථා වශයෙන් ඡේදයක් වෙන් කිරිමට,පින්තූර වෙන් කිරිමට ආදි වශයෙන් යොදා ගනු ලබයි.පහත සඳහන් උදාහරණ තුලින් ඔබට මෙය වඩාත් හොඳින් පැහැදිලි වේ.

<!DOCTYPE html>
<html>
<head>
  <title></title>
</head>
<body>

<p>මෙම ටැගය මගින් කිසියම් පෙලක රේඛීය බේදිමක් ඇති කරයි.<br>මෙම ටැගය භාවිතා කරන අවස්ථා වශයෙන් ඡේදයක් වෙන් කිරිමට,පින්තූර වෙන් කිරිමට ආදි වශයෙන් යොදා ගනු ලබයි.<br>පහත සඳහන් උදාහරණ තුලින් ඔබට මෙය වඩාත් හොඳින් පැහැදිලි වේ.</p>

<br>

<img src="https://www.euro2000-courses.com/wp-content/uploads/2018/06/itc.png" alt="itc.png" width="400" height="200">
  
<br>
  
<img src="https://www.telecomreview.com/images/stories/2019/07/The_gender_dimension_in_ICT-article.jpg" alt="The_gender_dimension_in_ICT-article" width="400" height="200">
  
<br>
  
<img src="https://shipinsight.s3.amazonaws.com/_1200x630_crop_center-center_82_none/ict.jpg?mtime=20191022075818&focal=none" alt="ict.jpg?mtime=20191022075818&focal=none" width="400" height="200">

</body>
</html>

ICT With Shantha Bandara

Basic 02

No comments:

Post a Comment