Reply to thread

Message

<blockquote data-quote="dinesh89" data-source="post: 12256913" data-attributes="member: 323066">කාටහරි වැදගත් වෙයි කියලා හිතලා දැන්මේ.. බලලා නිකම් යන්න එපා පොඩි බම්ප් එකක් දෙන්න හොදේ...<img src="/styles/default/xenforo/smilies/default/confused.gif"&nbsp; class="smilie" loading="lazy" alt=":confused:" title="Confused&nbsp; &nbsp; :confused:" data-shortname=":confused:" /><img src="/styles/default/xenforo/smilies/default/confused.gif"&nbsp; class="smilie" loading="lazy" alt=":confused:" title="Confused&nbsp; &nbsp; :confused:" data-shortname=":confused:" /><img src="/styles/default/xenforo/smilies/default/yes.gif"&nbsp; class="smilie" loading="lazy" alt=":yes:" title="Yes&nbsp; &nbsp; :yes:" data-shortname=":yes:" /><img src="/styles/default/xenforo/smilies/default/yes.gif"&nbsp; class="smilie" loading="lazy" alt=":yes:" title="Yes&nbsp; &nbsp; :yes:" data-shortname=":yes:" /><img src="/styles/default/xenforo/smilies/default/happy.gif"&nbsp; class="smilie" loading="lazy" alt=":)" title="Happy&nbsp; &nbsp; :)" data-shortname=":)" /><img src="/styles/default/xenforo/smilies/default/happy.gif"&nbsp; class="smilie" loading="lazy" alt=":)" title="Happy&nbsp; &nbsp; :)" data-shortname=":)" /><img src="/styles/default/xenforo/smilies/default/D.gif"&nbsp; class="smilie" loading="lazy" alt=":D" title="Big grin&nbsp; &nbsp; :D" data-shortname=":D" /><img src="/styles/default/xenforo/smilies/default/D.gif"&nbsp; class="smilie" loading="lazy" alt=":D" title="Big grin&nbsp; &nbsp; :D" data-shortname=":D" />ExampleHTML Home&lt;html&gt;&lt;head&gt;&lt;title&gt; My First Heading&lt;/title&gt;&lt;/head&gt;&lt;p&gt;My first paragraph.&lt;/p&gt;&lt;/body&gt;&lt;/html&gt; My First Heading – Title NameMy first paragraph.Example – HTML Basic - 4 HeadingsHTML headings are defined with the &lt;h1&gt; to &lt;h6&gt; tags.&lt;h1&gt;This is a heading&lt;/h1&gt;&lt;h2&gt;This is a heading&lt;/h2&gt;&lt;h3&gt;This is a heading&lt;/h3&gt; This is heading 1This is heading 2This is heading 3This is heading 4This is heading 5This is heading 6ParagraphsHTML paragraphs are defined with the &lt;p&gt; tag.&lt;p&gt;This is a paragraph.&lt;/p&gt;&lt;p&gt;This is another paragraph.&lt;/p&gt; This is a paragraph.This is a paragraph.This is a paragraph.HTML LinksHTML links are defined with the &lt;a&gt; tag.&lt;a href=&quot;http://www.w3schools.com&quot;&gt;This is a link&lt;/a&gt; This is a linkHTML ImagesHTML images are defined with the &lt;img&gt; tag.&lt;img src=&quot;w3schools.jpg&quot; width=&quot;104&quot; height=&quot;142&quot; /&gt; &nbsp;HTML ElementsAn HTML element is everything from the start tag to the end tag:Start tag *&nbsp; &nbsp; Element content&nbsp; &nbsp; End tag *&lt;p&gt;&nbsp; &nbsp; This is a paragraph&nbsp; &nbsp; &lt;/p&gt;&lt;a href=&quot;default.htm&quot; &gt;&nbsp; &nbsp; This is a link&nbsp; &nbsp; &lt;/a&gt;&lt;br /&gt;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; * The start tag is often called the opening tag. The end tag is often called the closing tag.HTML Document Example&lt;html&gt;&lt;body&gt;&lt;p&gt;This is my first paragraph.&lt;/p&gt;&lt;/body&gt;&lt;/html&gt; HTML Text Formatting&lt;html&gt;&lt;body&gt;&lt;p&gt;&lt;b&gt;This text is bold&lt;/b&gt;&lt;/p&gt;&lt;p&gt;&lt;strong&gt;This text is strong&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;&lt;big&gt;This text is big&lt;/big&gt;&lt;/p&gt;&lt;p&gt;&lt;i&gt;This text is italic&lt;/i&gt;&lt;/p&gt;&lt;p&gt;&lt;em&gt;This text is emphasized&lt;/em&gt;&lt;/p&gt;&lt;p&gt;&lt;code&gt;This is computer output&lt;/code&gt;&lt;/p&gt;&lt;p&gt;This is&lt;sub&gt; subscript&lt;/sub&gt; and &lt;sup&gt;superscript&lt;/sup&gt;&lt;/p&gt;&lt;/body&gt;&lt;/html&gt;This text is boldThis text is bigThis text is italicThis is computer outputThis is subscript and superscriptThe HTML &lt;font&gt; Tag &lt;p&gt;&lt;font size=&quot;5&quot; face=&quot;arial&quot; color=&quot;red&quot;&gt;This paragraph is in Arial, size 5, and in red text color.&lt;/font&gt;&lt;/p&gt;&lt;p&gt;&lt;font size=&quot;3&quot; face=&quot;verdana&quot; color=&quot;blue&quot;&gt;This paragraph is in Verdana, size 3, and in blue text color.&lt;/font&gt;&lt;/p&gt;This paragraph is in Arial, size 5, and in red text color. This paragraph is in Verdana, size 3, and in blue text color. The font element is deprecated in HTML 4. Use CSS instead!HTML Styles - CSS&lt;html&gt;&lt;body style=&quot;background-color<img src="/styles/default/xenforo/smilies/default/P.gif"&nbsp; class="smilie" loading="lazy" alt=":P" title=":P&nbsp; &nbsp; :P" data-shortname=":P" />owderBlue;&quot;&gt;&lt;h1&gt;Look! Styles and colors&lt;/h1&gt;&lt;p style=&quot;font-family:verdana;color:red;&quot;&gt;This text is in Verdana and red&lt;/p&gt;&lt;p style=&quot;font-family:times;color:green;&quot;&gt;This text is in Times and green&lt;/p&gt;&lt;p style=&quot;font-size:30px;&quot;&gt;This text is 30 pixels high&lt;/p&gt;&lt;/body&gt;&lt;/html&gt;Look! Styles and colorsThis text is in Verdana and redThis text is in Times and greenThis text is 30 pixels highHTML Style Example - Background Color&lt;html&gt;&lt;body style=&quot;background-color:yellow;&quot;&gt;&lt;h2 style=&quot;background-color:red;&quot;&gt;This is a heading&lt;/h2&gt;&lt;p style=&quot;background-color:green;&quot;&gt;This is a paragraph.&lt;/p&gt;&lt;/body&gt;&lt;/html&gt;&nbsp;HTML Style Example - Font, Color and Size&lt;html&gt;&lt;body&gt;&lt;h1 style=&quot;font-family:verdana;&quot;&gt;A heading&lt;/h1&gt;&lt;p style=&quot;font-family:arial;color:red;font-size:20px;&quot;&gt;A paragraph.&lt;/p&gt;&lt;/body&gt;&lt;/html&gt;A headingA paragraph.HL Style Example - Text Alignmen&nbsp; &nbsp; &lt;html&gt;&lt;body&gt;&lt;h1 style=&quot;text-align:center;&quot;&gt;Center-aligned heading&lt;/h1&gt;&lt;p&gt;This is a paragraph.&lt;/p&gt;&lt;/body&gt;&lt;/html&gt;Center-aligned headingThis is a paragraph.HTML Images - The &lt;img&gt; Tag and the Src Attribute &lt;img src=&quot;url&quot; alt=&quot;some_text&quot;/&gt;HTML Images - The Alt Attribute&lt;img src=&quot;boat.gif&quot; alt=&quot;Big Boat&quot; /&gt;HTML Images - Set Height and Width of an Image&lt;img src=&quot;pulpit.jpg&quot; alt=&quot;Pulpit rock&quot; width=&quot;304&quot; height=&quot;228&quot; /&gt;Alignment Image&lt;html&gt;&lt;body&gt;&lt;p&gt;An image &lt;img src=&quot;smiley.gif&quot; alt=&quot;Smiley face&quot; align=&quot;bottom&quot; width=&quot;32&quot; height=&quot;32&quot; /&gt;with align=&quot;bottom&quot;.&lt;/p&gt;&lt;p&gt;An image&lt;img src=&quot;smiley.gif&quot; alt=&quot;Smiley face&quot; align=&quot;middle&quot; width=&quot;32&quot; height=&quot;32&quot; /&gt; with align=&quot;middle&quot;.&lt;/p&gt;&lt;p&gt;An image &lt;img src=&quot;smiley.gif&quot; alt=&quot;Smiley face&quot; align=&quot;top&quot; width=&quot;32&quot; height=&quot;32&quot; /&gt;with align=&quot;top&quot;.&lt;/p&gt;&lt;p&gt;&lt;b&gt;Tip:&lt;/b&gt; align=&quot;bottom&quot; is default!&lt;/p&gt;&lt;p&gt;&lt;img src=&quot;smiley.gif&quot; alt=&quot;Smiley face&quot; width=&quot;32&quot; height=&quot;32&quot; /&gt;An image before the text.&lt;/p&gt;&lt;p&gt;An image after the text. &lt;img src=&quot;smiley.gif&quot; alt=&quot;Smiley face&quot; width=&quot;32&quot; height=&quot;32&quot; /&gt;&lt;/p&gt;&lt;/body&gt;&lt;/html&gt;An image&nbsp; with align=&quot;bottom&quot;.An image&nbsp; with align=&quot;middle&quot;.An image&nbsp; with align=&quot;top&quot;.Tip: align=&quot;bottom&quot; is default!&nbsp;An image before the text.An image after the text.&nbsp; Let the image float&lt;html&gt;&lt;body&gt;&lt;p&gt;&lt;img src=&quot;smiley.gif&quot; alt=&quot;Smiley face&quot; align=&quot;left&quot; width=&quot;32&quot; height=&quot;32&quot; /&gt;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;A paragraph with an image. The align attribute of the image is set to &quot;left&quot;. Theimage will float to the left of this text.&lt;/p&gt;&lt;p&gt;&lt;img src=&quot;smiley.gif&quot; alt=&quot;Smiley face&quot; align=&quot;right&quot; width=&quot;32&quot; height=&quot;32&quot; /&gt;A paragraph with an image. The align attribute of the image is set to &quot;right&quot;. The image will float to the right of this text.&lt;/p&gt;&lt;/body&gt;&lt;/html&gt;&nbsp; &nbsp; &nbsp;&nbsp; A paragraph with an image. The align attribute of the image is set to &quot;left&quot;. The image will float to the left of this text. A paragraph with an image. The align attribute of the image is set to &quot;right&quot;. The image will float to the right of this text. Make a hyperlink of an image&lt;html&gt;&lt;body&gt;&lt;p&gt;Create a link of an image:&lt;a href=&quot;default.asp&quot;&gt;&lt;img src=&quot;smiley.gif&quot; alt=&quot;HTML tutorial&quot; width=&quot;32&quot; height=&quot;32&quot; /&gt;&lt;/a&gt;&lt;/p&gt;&lt;p&gt;No border around the image, but still a link:&lt;a href=&quot;default.asp&quot;&gt;&lt;img border=&quot;0&quot; src=&quot;smiley.gif&quot; alt=&quot;HTML tutorial&quot; width=&quot;32&quot; height=&quot;32&quot; /&gt;&lt;/a&gt;&lt;/p&gt;&lt;/body&gt;&lt;/html&gt;Create an image map&lt;html&gt;&lt;body&gt;&lt;p&gt;Click on the sun or on one of the planets to watch it closer:&lt;/p&gt;&lt;img src=&quot;planets.gif&quot; width=&quot;145&quot; height=&quot;126&quot; alt=&quot;Planets&quot; usemap=&quot;#planetmap&quot; /&gt;&lt;map name=&quot;planetmap&quot;&gt;&nbsp; &lt;area shape=&quot;rect&quot; coords=&quot;0,0,82,126&quot; alt=&quot;Sun&quot; href=&quot;sun.htm&quot; /&gt;&nbsp; &lt;area shape=&quot;circle&quot; coords=&quot;90,58,3&quot; alt=&quot;Mercury&quot; href=&quot;mercur.htm&quot; /&gt;&nbsp; &lt;area shape=&quot;circle&quot; coords=&quot;124,58,8&quot; alt=&quot;Venus&quot; href=&quot;venus.htm&quot; /&gt;&lt;/map&gt;&lt;/body&gt;&lt;/html&gt;Click on the sun or on one of the planets to watch it closer:&nbsp; &nbsp;&nbsp; HTML Tables&lt;table border=&quot;1&quot;&gt;&lt;tr&gt;&lt;td&gt;row 1, cell 1&lt;/td&gt;&lt;td&gt;row 1, cell 2&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;row 2, cell 1&lt;/td&gt;&lt;td&gt;row 2, cell 2&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;Row 1, Cell 1&nbsp; &nbsp; Row 1, Cell 1Row 1, Cell 1&nbsp; &nbsp; Row 1, Cell 1Table Border - Example - 01&lt;html&gt;&lt;body&gt;&lt;h4&gt;With a normal border:&lt;/h4&gt;&nbsp; &lt;table border=&quot;1&quot;&gt;&lt;tr&gt;&nbsp; &lt;td&gt;First&lt;/td&gt;&nbsp; &lt;td&gt;Row&lt;/td&gt;&lt;/tr&gt;&nbsp;&nbsp; &lt;tr&gt;&nbsp;&nbsp; &lt;td&gt;Second&lt;/td&gt;&nbsp; &lt;td&gt;Row&lt;/td&gt;&lt;/tr&gt; &lt;/table&gt;&lt;h4&gt;With a thick border:&lt;/h4&gt;&nbsp; &lt;table border=&quot;8&quot;&gt;&lt;tr&gt;&nbsp;&nbsp; &lt;td&gt;First&lt;/td&gt;&nbsp; &lt;td&gt;Row&lt;/td&gt;&lt;/tr&gt;&nbsp;&nbsp; &lt;tr&gt;&nbsp;&nbsp; &lt;td&gt;Second&lt;/td&gt;&nbsp; &lt;td&gt;Row&lt;/td&gt; &lt;/tr&gt;With a normal border:First&nbsp; &nbsp; RowSecond&nbsp; &nbsp; RowWith a thick border:First&nbsp; &nbsp; RowSecond&nbsp; &nbsp; RowWith a very thick border:First&nbsp; &nbsp; RowSecond&nbsp; &nbsp; RowTables - Example1 - 02&lt;html&gt;&lt;body&gt;&lt;p&gt;Each table starts with a table tag. Each table row starts with a tr tag.Each table data starts with a td tag.&lt;/p&gt;&lt;h4&gt;One column:&lt;/h4&gt;&lt;table border=&quot;1&quot;&gt;&lt;tr&gt;&nbsp; &lt;td&gt;100&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;&lt;h4&gt;One row and three columns:&lt;/h4&gt;&lt;table border=&quot;1&quot;&gt;&lt;tr&gt;&nbsp; &lt;td&gt;100&lt;/td&gt;&nbsp; &lt;td&gt;200&lt;/td&gt;&nbsp; &lt;td&gt;300&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;Each table starts with a table tag. Each table row starts with a tr tag. Each table data starts with a td tag. One column:100One row and three columns:100&nbsp; &nbsp; 200&nbsp; &nbsp; 300Two rows and three columns:100&nbsp; &nbsp; 200&nbsp; &nbsp; 300400&nbsp; &nbsp; 500&nbsp; &nbsp; 600HTML Table Headers&lt;table border=&quot;1&quot;&gt;&lt;tr&gt;&lt;th&gt;Header 1&lt;/th&gt;&lt;th&gt;Header 2&lt;/th&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;row 1, cell 1&lt;/td&gt;&lt;td&gt;row 1, cell 2&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;row 2, cell 1&lt;/td&gt;&lt;td&gt;row 2, cell 2&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;Header 1&nbsp; &nbsp; Header 2Row 1, Cell 1&nbsp; &nbsp; Row 1, Cell 1Row 1, Cell 1&nbsp; &nbsp; Row 1, Cell 1Apples&nbsp; &nbsp; 44%Bananas&nbsp; &nbsp; 23%Oranges&nbsp; &nbsp; 13%Other&nbsp; &nbsp; 10%&nbsp;Tables without border&lt;html&gt;&lt;body&gt;&lt;h4&gt;This table has no borders:&lt;/h4&gt;&lt;table&gt;&lt;tr&gt;&nbsp; &lt;td&gt;100&lt;/td&gt;&nbsp; &lt;td&gt;200&lt;/td&gt;&nbsp; &lt;td&gt;300&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&nbsp; &lt;td&gt;400&lt;/td&gt;&nbsp; &lt;td&gt;500&lt;/td&gt;&nbsp; &lt;td&gt;600&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;&lt;h4&gt;And this table has no borders:&lt;/h4&gt;&lt;table border=&quot;0&quot;&gt;&lt;tr&gt;&nbsp; &lt;td&gt;100&lt;/td&gt;&nbsp; &lt;td&gt;200&lt;/td&gt;&nbsp; &lt;td&gt;300&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&nbsp; &lt;td&gt;400&lt;/td&gt;&nbsp; &lt;td&gt;500&lt;/td&gt;&nbsp; &lt;td&gt;600&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;&lt;/body&gt;&lt;/html&gt;This table has no borders:100&nbsp; &nbsp; 200&nbsp; &nbsp; 300400&nbsp; &nbsp; 500&nbsp; &nbsp; 600And this table has no borders:100&nbsp; &nbsp; 200&nbsp; &nbsp; 300400&nbsp; &nbsp; 500&nbsp; &nbsp; 600&nbsp;Table headers&lt;html&gt;&lt;body&gt;&lt;h4&gt;Table headers:&lt;/h4&gt;&lt;table border=&quot;1&quot;&gt;&lt;tr&gt;&nbsp; &lt;th&gt;Name&lt;/th&gt;&nbsp; &lt;th&gt;Telephone&lt;/th&gt;&nbsp; &lt;th&gt;Telephone&lt;/th&gt;&lt;/tr&gt;&lt;tr&gt;&nbsp; &lt;td&gt;Bill Gates&lt;/td&gt;&nbsp; &lt;td&gt;555 77 854&lt;/td&gt;&nbsp; &lt;td&gt;555 77 855&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;&lt;h4&gt;Vertical headers:&lt;/h4&gt;&lt;table border=&quot;1&quot;&gt;&lt;tr&gt;&nbsp; &lt;th&gt;First Name:&lt;/th&gt;&nbsp; &lt;td&gt;Bill Gates&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&nbsp; &lt;th&gt;Telephone:&lt;/th&gt;&nbsp; &lt;td&gt;555 77 854&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&nbsp; &lt;th&gt;Telephone:&lt;/th&gt;&nbsp; &lt;td&gt;555 77 855&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;&lt;/body&gt;&lt;/html&gt;Table headers:Name&nbsp; &nbsp; Telephone&nbsp; &nbsp; TelephoneBill Gates&nbsp; &nbsp; 555 77 854&nbsp; &nbsp; 555 77 855Vertical headers:First Name:&nbsp; &nbsp; Bill GatesTelephone:&nbsp; &nbsp; 555 77 854Telephone:&nbsp; &nbsp; 555 77 855Table with a Caption &lt;html&gt;&lt;body&gt;&lt;table border=&quot;1&quot;&gt;&nbsp; &lt;caption&gt;Monthly savings&lt;/caption&gt;&nbsp; &lt;tr&gt;&nbsp; &nbsp; &lt;th&gt;Month&lt;/th&gt;&nbsp; &nbsp; &lt;th&gt;Savings&lt;/th&gt;&nbsp; &lt;/tr&gt;&nbsp; &lt;tr&gt;&nbsp; &nbsp; &lt;td&gt;January&lt;/td&gt;&nbsp; &nbsp; &lt;td&gt;$100&lt;/td&gt;&nbsp; &lt;/tr&gt;&nbsp; &lt;tr&gt;&nbsp; &nbsp; &lt;td&gt;February&lt;/td&gt;&nbsp; &nbsp; &lt;td&gt;$50&lt;/td&gt;&nbsp; &lt;/tr&gt;&lt;/table&gt;&lt;/body&gt;&lt;/html&gt;Month Savings Month&nbsp; &nbsp; Savings January&nbsp; &nbsp; $100 February&nbsp; &nbsp;&nbsp; $50</blockquote>

[QUOTE="dinesh89, post: 12256913, member: 323066"] [SIZE="5"]කාටහරි වැදගත් වෙයි කියලා හිතලා දැන්මේ.. බලලා නිකම් යන්න එපා පොඩි බම්ප් එකක් දෙන්න හොදේ... [/SIZE] :confused::confused::yes::yes::):):D:D [SIZE="3"]Example HTML Home <html><head><title> My First Heading</title></head> My first paragraph. </body> </html> My First Heading – Title Name My first paragraph. Example – HTML Basic - 4 Headings HTML headings are defined with the <h1> to <h6> tags. <h1>This is a heading</h1> <h2>This is a heading</h2> <h3>This is a heading</h3> This is heading 1 This is heading 2 This is heading 3 This is heading 4 This is heading 5 This is heading 6 Paragraphs HTML paragraphs are defined with the tag. This is a paragraph. This is another paragraph. This is a paragraph. This is a paragraph. This is a paragraph. HTML Links HTML links are defined with the <a> tag. <a href="http://www.w3schools.com">This is a link</a> This is a link HTML Images HTML images are defined with the <img> tag. <img src="w3schools.jpg" width="104" height="142" /> HTML Elements An HTML element is everything from the start tag to the end tag: Start tag * Element content End tag * This is a paragraph <a href="default.htm" > This is a link </a> * The start tag is often called the opening tag. The end tag is often called the closing tag. HTML Document Example <html> <body> This is my first paragraph. </body> </html> HTML Text Formatting <html> <body> This text is bold This text is strong <big>This text is big</big> This text is italic This text is emphasized <code>This is computer output</code> This is subscript and superscript </body> </html> This text is bold This text is big This text is italic This is computer output This is subscript and superscript The HTML Tag This paragraph is in Arial, size 5, and in red text color. This paragraph is in Verdana, size 3, and in blue text color. This paragraph is in Arial, size 5, and in red text color. This paragraph is in Verdana, size 3, and in blue text color. The font element is deprecated in HTML 4. Use CSS instead! HTML Styles - CSS <html> <body style="background-color:PowderBlue;"> <h1>Look! Styles and colors</h1> This text is in Verdana and red This text is in Times and green This text is 30 pixels high </body> </html> Look! Styles and colors This text is in Verdana and red This text is in Times and green This text is 30 pixels high HTML Style Example - Background Color <html> <body style="background-color:yellow;"> <h2 style="background-color:red;">This is a heading</h2> This is a paragraph. </body> </html> HTML Style Example - Font, Color and Size <html> <body> <h1 style="font-family:verdana;">A heading</h1> A paragraph. </body> </html> A heading A paragraph. HL Style Example - Text Alignmen <html> <body> <h1 style="text-align:center;">Center-aligned heading</h1> This is a paragraph. </body> </html> Center-aligned heading This is a paragraph. HTML Images - The <img> Tag and the Src Attribute <img src="url" alt="some_text"/> HTML Images - The Alt Attribute <img src="boat.gif" alt="Big Boat" /> HTML Images - Set Height and Width of an Image <img src="pulpit.jpg" alt="Pulpit rock" width="304" height="228" /> Alignment Image <html> <body> An image <img src="smiley.gif" alt="Smiley face" align="bottom" width="32" height="32" /> with align="bottom". An image <img src="smiley.gif" alt="Smiley face" align="middle" width="32" height="32" /> with align="middle". An image <img src="smiley.gif" alt="Smiley face" align="top" width="32" height="32" /> with align="top". Tip: align="bottom" is default! <img src="smiley.gif" alt="Smiley face" width="32" height="32" /> An image before the text. An image after the text. <img src="smiley.gif" alt="Smiley face" width="32" height="32" /> </body> </html> An image with align="bottom". An image with align="middle". An image with align="top". Tip: align="bottom" is default! An image before the text. An image after the text. Let the image float <html> <body> <img src="smiley.gif" alt="Smiley face" align="left" width="32" height="32" /> A paragraph with an image. The align attribute of the image is set to "left". The image will float to the left of this text. <img src="smiley.gif" alt="Smiley face" align="right" width="32" height="32" /> A paragraph with an image. The align attribute of the image is set to "right". The image will float to the right of this text. </body> </html> A paragraph with an image. The align attribute of the image is set to "left". The image will float to the left of this text. A paragraph with an image. The align attribute of the image is set to "right". The image will float to the right of this text. Make a hyperlink of an image <html> <body> Create a link of an image: <a href="default.asp"> <img src="smiley.gif" alt="HTML tutorial" width="32" height="32" /> </a> No border around the image, but still a link: <a href="default.asp"> <img border="0" src="smiley.gif" alt="HTML tutorial" width="32" height="32" /> </a> </body> </html> Create an image map <html> <body> Click on the sun or on one of the planets to watch it closer: <img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap" /> <map name="planetmap"> <area shape="rect" coords="0,0,82,126" alt="Sun" href="sun.htm" /> <area shape="circle" coords="90,58,3" alt="Mercury" href="mercur.htm" /> <area shape="circle" coords="124,58,8" alt="Venus" href="venus.htm" /> </map> </body> </html> Click on the sun or on one of the planets to watch it closer: HTML Tables <table border="1"> <tr> <td>row 1, cell 1</td> <td>row 1, cell 2</td> </tr> <tr> <td>row 2, cell 1</td> <td>row 2, cell 2</td> </tr> </table> Row 1, Cell 1 Row 1, Cell 1 Row 1, Cell 1 Row 1, Cell 1 Table Border - Example - 01 <html> <body> <h4>With a normal border:</h4> <table border="1"> <tr> <td>First</td> <td>Row</td> </tr> <tr> <td>Second</td> <td>Row</td> </tr> </table> <h4>With a thick border:</h4> <table border="8"> <tr> <td>First</td> <td>Row</td> </tr> <tr> <td>Second</td> <td>Row</td> </tr> With a normal border: First Row Second Row With a thick border: First Row Second Row With a very thick border: First Row Second Row Tables - Example1 - 02 <html> <body> Each table starts with a table tag. Each table row starts with a tr tag. Each table data starts with a td tag. <h4>One column:</h4> <table border="1"> <tr> <td>100</td> </tr> </table> <h4>One row and three columns:</h4> <table border="1"> <tr> <td>100</td> <td>200</td> <td>300</td> </tr> </table> Each table starts with a table tag. Each table row starts with a tr tag. Each table data starts with a td tag. One column: 100 One row and three columns: 100 200 300 Two rows and three columns: 100 200 300 400 500 600 HTML Table Headers <table border="1"> <tr> <th>Header 1</th> <th>Header 2</th> </tr> <tr> <td>row 1, cell 1</td> <td>row 1, cell 2</td> </tr> <tr> <td>row 2, cell 1</td> <td>row 2, cell 2</td> </tr> </table> Header 1 Header 2 Row 1, Cell 1 Row 1, Cell 1 Row 1, Cell 1 Row 1, Cell 1 Apples 44% Bananas 23% Oranges 13% Other 10% Tables without border <html> <body> <h4>This table has no borders:</h4> <table> <tr> <td>100</td> <td>200</td> <td>300</td> </tr> <tr> <td>400</td> <td>500</td> <td>600</td> </tr> </table> <h4>And this table has no borders:</h4> <table border="0"> <tr> <td>100</td> <td>200</td> <td>300</td> </tr> <tr> <td>400</td> <td>500</td> <td>600</td> </tr> </table> </body> </html> This table has no borders: 100 200 300 400 500 600 And this table has no borders: 100 200 300 400 500 600 Table headers <html> <body> <h4>Table headers:</h4> <table border="1"> <tr> <th>Name</th> <th>Telephone</th> <th>Telephone</th> </tr> <tr> <td>Bill Gates</td> <td>555 77 854</td> <td>555 77 855</td> </tr> </table> <h4>Vertical headers:</h4> <table border="1"> <tr> <th>First Name:</th> <td>Bill Gates</td> </tr> <tr> <th>Telephone:</th> <td>555 77 854</td> </tr> <tr> <th>Telephone:</th> <td>555 77 855</td> </tr> </table> </body> </html> Table headers: Name Telephone Telephone Bill Gates 555 77 854 555 77 855 Vertical headers: First Name: Bill Gates Telephone: 555 77 854 Telephone: 555 77 855 Table with a Caption <html> <body> <table border="1"> <caption>Monthly savings</caption> <tr> <th>Month</th> <th>Savings</th> </tr> <tr> <td>January</td> <td>$100</td> </tr> <tr> <td>February</td> <td>$50</td> </tr> </table> </body> </html> Month Savings Month Savings January $100 February $50 [/SIZE] [/QUOTE]

Verification

Hathara warak wissa keeyada? (Hathara wadi karanna 20)

Search

Latest ads

Reply to thread