Posts

colgroup tag in html

-
The <colgroup> tag specifies a group of one or more columns in a table for formatting. The <colgroup> tag is useful for applying styles to entire columns, instead of repeating the styles for each cell, for each row.  The <colgroup> tag must be a child of a <table> element, after any <caption> elements and before any <thead>, <tbody>, <tfoot>, and <tr> elements.  To define different properties to a column within a <colgroup>, use the <col> tag within the <colgroup> tag. <!DOCTYPE html> <html> <head> </head> <body> <table>   <colgroup>     <col span="2" style="background-color:red">     <col style="background-color:yellow">   </colgroup>   <tr>     <th>ISBN</th>     <th>Title</th>     <th>Price<...
Post a Comment
Read more

image tag in html

-
The <img> tag defines an image in an HTML page. The <img> tag has two required attributes: src and alt.  Images are not technically inserted into an HTML page, images are linked to HTML pages. The <img> tag creates a holding space for the referenced image. <!DOCTYPE html> <html> <body> <img src="smiley.gif" alt="Smiley face" width="42" height="42"> </body> </html>
Post a Comment
Read more

span tag in html

-
The <span> tag is used to group inline-elements in a document. The <span> tag provides no visual change by itself. The <span> tag provides a way to add a hook to a part of a text or a part of a document. <!DOCTYPE html> <html> <body> <p>My mother has <span style="color:blue;font-weight:bold">blue</span> eyes and my father has <span style="color:darkolivegreen;font-weight:bold">dark green</span> eyes.</p> </body> </html> Output: My mother has  blue  eyes and my father has  dark green  eyes.
Post a Comment
Read more

Anchor tag in html

-
The <a> tag defines a hyperlink, which is used to link from one page to another. The most important attribute of the <a> element is the href attribute, which indicates the link's destination. By default, links will appear as follows in all browsers: An unvisited link is underlined and blue A visited link is underlined and purple An active link is underlined and red <!DOCTYPE html> <html> <body> <a href="https://technisias.blogspot.com/">technisia!</a> </body> </html> Output: technisia! phone number as a link: <!DOCTYPE html> <html> <body> <p> This is a phone link: <a href="tel:+4733378901">+47 333 78 901</a> </p> </body> </html> Output: This is a phone link:  +47 333 78 901 linking java script with anchor tag: <!DOCTYPE html> <html> <body> <a hre...
Post a Comment
Read more

figure tag in html

-
Image
The <figure> tag specifies self-contained content, like illustrations, diagrams, photos, code listings, etc. While the content of the <figure> element is related to the main flow, its position is independent of the main flow, and if removed it should not affect the flow of the document. <!DOCTYPE html> <html> <body> <figure>   <img src="img_pulpit.jpg" alt="The Pulpit Rock" width="304" height="228"> </figure> </body> </html> Output:
Post a Comment
Read more

image has a link in html or image as a anchor tag

-
Image
<!DOCTYPE html> <html> <body> <p> An image that is a link: <a href="https://technisias.blogspot.com/"> <img src="smiley.gif" alt="Technisia" width="42" height="42" border="0"> </a> </p> </body> </html> Output: An image that is a link: 
Post a Comment
Read more

figure caption tag in html

-
Image
The <figcaption> tag defines a caption for a  <figure>  element. The <figcaption> element can be placed as the first or last child of the <figure> element. <!DOCTYPE html> <html> <body> <figure>   <img src="../html/pic_trulli.jpg" alt="Trulli" style="width:100%">   <figcaption>Fig.1 - Trulli, Puglia, Italy.</figcaption> </figure> </body> </html> Output: Fig.1 - Trulli, Puglia, Italy.
Post a Comment
Read more

footer tag in html

-
The <footer> tag defines a footer for a document or section. A <footer> element should contain information about its containing element. A <footer> element typically contains: authorship information copyright information contact information sitemap back to top links related documents You can have several <footer> elements in one document. <!DOCTYPE html> <html> <body> <footer>   <p>Posted by: Hege Refsnes</p>   <p>Contact information: <a href="mailto:pavantekula@gmail.com.com">send a mail</a>.</p> </footer> </body> </html> Output: Posted by: Hege Refsnes Contact information:  send a mail .
Post a Comment
Read more

nav tag in html

-
The <nav> tag defines a set of navigation links. Notice that NOT all links of a document should be inside a <nav> element. The <nav> element is intended only for major block of  navigation links . <!DOCTYPE html> <html> <body> <nav> <a href="https://technisias.blogspot.com/">HTML</a> | <a href="https://technisias.blogspot.com/">CSS</a> | <a href="https://technisias.blogspot.com/">JavaScript</a> | <a href="https://technisias.blogspot.com/">jQuery</a> </nav> <p><strong>Note:</strong> The nav tag is not supported in Internet Explorer 8 and earlier versions.</p> </body> </html> Output: HTML  |  CSS  |  JavaScript  |  jQuery Note:  The nav tag is not supported in Internet Explorer 8 and earlier versions.
Post a Comment
Read more

picture tag

-
Image
The <picture> tag gives web developers more flexibility in specifying image resources. The most common use of the <picture> element will be for art direction in responsive designs. Instead of having one image that is scaled up or down based on the viewport width, multiple images can be designed to more nicely fill the browser viewport. The <picture> element holds two different tags: one or more  <source>  tags and one <img> tag. The <source> element has the following attributes: srcset (required) - defines the URL of the image to show media - accepts any valid media query that would normally be defined in a CSS sizes - defines a single width descriptor, a single media query with width descriptor, or a comma-delimited list of media queries with a width descriptor type - defines the MIME type The browser will use the attribute values to load the most appropriate image. The browser will use the first <source> ele...
Post a Comment
Read more