Wednesday, March 17, 2021

HTML5-Syntax for tables

Major tags used in HTML tables 

<table>

<tr>

<th>

<td>

<thead>

<tbody>

border=

<! tables>

<!doctype html>

<! doctype declaration>

<html>
<! The beggining of the html code>

<head>
<! The head section begins>
    <title>

        CODE-4Tables
        
    </title> 
    <! The title is the name of the browser tab>

</head>
<! The end of the head section>
<body>
<! The body section begins>    
    <table>
    <! Table declaration>

        <thead>
        
            <tr>
                <th>Name</th>
                <th>Fav</th>
                <! Table head data>

            </tr>
        </thead><! This is the head of the table>

        <tr>
        <! Table row declaration>

            <td>Niel</td>
            <td>Red</td>
            <! Table data declaration and definition>

        </tr><! Table row complete>

        <tr>
        <! Table row declaration>

            <td>Dad</td>
            <td>Blue</td>
            <! Table data declaration and definition>
        </tr>

        <tr>   
        <! Table row declaration>

            <td>Niel</td>
            <td>Black</td>
            <! Table data declaration and definition>

        </tr>
        <tr>
        <! Table row declaration>

            <td>Isha</td>
            <td>While</td>
            <! Table data declaration and definition>

        </tr>

        <tr><! Table row declaration>

            <td>Mumma</td>
            <td>Green</td>
            <! Table data declaration and definition>

        </tr>

        
    </table>


</body>

</html>

The code of the above code looks like :



at No comments:

Tuesday, March 16, 2021

HTML5-Code Syntax for forms

<!forms>

<!doctype html> <! doctype declaration>

<html>  <!start of the html webpage> 

<head>  <!start of the head section of the webpage>

<title> <!title declaration that appears on the browser tab name>

 CODE-3

</title>   <! title end>

</head>    <! head end>

<h1>Forms</h1>

    <hr>    <!insert a break in the webpage>

    <body>  <!start of the body section of the body>

        <p>Username <input type="text" value="your username"> </p>    
        <!accept text input for usename>

        <p>Password <input type="password"></p>     
        <!accept password>

        <p>Stay Logged <input type="checkbox"></p>  
        <!checkbox to see accept if user wants to stay logged in>

        <p>Under 18 <input type="radio" name="age" value="u18"></p> 
        <!radio button to determine the approxmiate age of the user>

        <p>Over 18 <input type="radio" name="age" value="o18"></p>  
        <!radio button to determine the approxmiate age of the user>


        <p>Faveriote Food : <select> 
            <!seletion dropbox to accept one of the predefined options>
                
            <option>Burger</option>  
            <!option declaration>

            <option >Pizza</option> 
             <!option declaration>

            <option selected>Fries</option>     
            <!option declaration>

            <option>Momos</option>      
            <!option declaration>

            <option>Soft Drink</option>    
             <!option declaration>

        </select> </p>     
         <!end of the selection element>

            
        <p><input type="submit" Submit></p>   
          <!submit button to accept all the data enterd by the user>   

        <hr>      
          <!insert break in the webpage>

    

</body>     <!end of the body section>

</html>     <!end of the html code>
Read more »
at No comments:

Saturday, March 13, 2021

Different HTML tags and their uses

<!--..--> 

This tag is used to add a comment in the code.

EXAMPLE: <!doctype html>

____________________________________________________________________________________________

<html> 

This tag defines the root if a html document. In simpler term it is the gate/entrance of the html code. 
This is where it all begins.
____________________________________________________________________________________________

</html>

This tag closes the opened html root. In simpler terms it is the ending of the html
doc/code.
____________________________________________________________________________________________

<head> 

This tag contains the metadata i.e. the data about the data or the information for                         the  information.
___________________________________________________________________________________

</head> 

This tag defines the end or closing of the head section.
_______________________________________________________________________________________________

<body>  

This tag is the beginning of the body of the webpage where the main context of                      
the website.
_______________________________________________________________________________________________

</body> 

  This tag shows the end of the body section of the webpage.
_______________________________________________________________________________________________

<title> 

This tag defines the title i.e. what we see on the browser tab, the name of the tab.
_______________________________________________________________________________________________

</title> 

 This tag defines the ending of the title tag.
_______________________________________________________________________________________________

<h1> 
  
This tag is used to define the header1. 
It is the biggest header of the html doc.
This tag is ended with a </h> following the entered context of the header. 
If we use header 2,3,4,5 or 6 /<h2> with every next header the size of the header                         reduces.
_________________________________________________________________________________

<p>
   
This tag is used to initiate a paragraph in the webpage.    
The context of the paragraph is written in between <p> and </p> tags.
_______________________________________________________________________________________________

<br> (<br  /> in xhtml)

This tag defines a single line break in a paragraph. This tag is a self closing tag.    
___________________________________________________________________________________

<b> </b> /<bold> </bold>

This tag is used to make the text of the context look bold.
___________________________________________________________________________________

<i> </i> / <em> </em>

This tag is used to make the text of the context look italic.
_______________________________________________________________________________________________

 <u> </u> / <ins> </ins>

This tag is used to underline the text of the context.
__________________________________________________________________________________

<sub> </sub>

This tag is used to make the text of the context appear as a subscript.   
___________________________________________________________________________________

<sup> </sup>

This tag is used to make the text of the context appear as a superscript/super text.
_______________________________________________________________________________________________
         
<del> </del>

Ths is tag is used to make the text of the context appear as a struck out text.
_______________________________________________________________________________________________

<hr> (<hr /> in xhtml)

This tag is used to put a horizontal rule in betweeen the context of the webpage. This is also a self closing tag like <br>.
___________________________________________________________________________________

<ul> </ul>

This tag is used to make a list of terms in a unordered manner.
_______________________________________________________________________________________________

<ol> </ol>  (<ol type="a"> for alphabetical list/ "I" for roman numerals)

This tag is used to make a list of terms  in a ordered manner.
___________________________________________________________________________________

<li> </li>

This tag is used to add terms in ordered/unordered list.
_______________________________________________________________________________________________

<img src="IMAGE DIRECTORTY ADDRESS / IMAGE URL" width="XXX"px height="XXX"px aliigh="left">

This tag is used to add images in webpage.
_______________________________________________________________________________________________

<input type="text" value ="your name" placeholder="enter username">

This tag is used to used to accept text input for username/name in a form.
_______________________________________________________________________________________________

<input type="checkbox">

This tag is used to check/confirm certain parameters in a form.
___________________________________________________________________________________

<input type="radio"

This tag is used to add radio buttons to select from a number of options in a form.
___________________________________________________________________________________

<select>
    <option> option1 </option>
    <option selected> option2 </option>
</select>

This tag is used to create a dropdown box with multiple option to select with.
The tag with the selected term is selected by default.
_______________________________________________________________________________________________

<table> </table>

This tag is used to create a table in the webpage.
___________________________________________________________________________________

<thead>   
    <tr>
            <th>
            Name for the head data of the table 
            </th>
    </tr>
</thead>

This tag is used to create the main heads of the created table.
_______________________________________________________________________________________________

<tr> </tr>

This tag is used to create rows in table.
_______________________________________________________________________________________________

<td> </td>

This tag is used to enter table data in the declared rows of a table.
_______________________________________________________________________________________________

<
at No comments:
Subscribe to: Posts (Atom)

HTML Semantics sheet

<article> : Defines independent, self-contained content. <aside>: Contains content that is tangentially related to the content...