HTML tutorial

If you guys haven't gone through my first tutorial then click here 

THIS IS MY SECOND WEB TUTORIAL :-


Today i will going to teach you basic html tags with a simple example
 that i used in last class addition to that today i am going to use few more tags with them
so lets start, In this class i will teach you all about  displaying "Heading tags and Paragraph" in the browser, example below shows how they are used:

<html>
    <head><title>example</title></head>
    <body>
             <h1>HTML tutorial<h1>
              <p>Hellow welcome you all to the web tutorial in this tutorial i am going to teach you regarding the Heading tags and Writing paragraphs</p>
    </body>
</html>

In the example above
    "b" is the Bold font that i am using to diplay and the
    "h1" is the heading tag used for our topic
                 To use them you need to know what they are and how they are used there are several heading tags used h1,h2,h3,h4,h5&h6 as the number increases the size decreases so the heading used in h1 is more prefered and h6 is used for least prefered one.
                     After completing this you must save it by clicking file->save->in that select any
file location, In save as type select all files and in file name give any name you want after
giving the name you must continue it by using .html then click on save.
     
         THIS .html IS COMPULSORY IF YOU DIDN'T GIVE IT THEN IT WONT WORK

           Then close the file and open the saved file which is given the extension .html
right click on the that file and open it with any browser which you have so u will get
the output displayed

I am having chrome browser so i have opened my html file with that so
you could use other browsers like firefox or Interent Explorer or suffarywhich ever you have.
If you visitors have anything you want to say like complants and comments below


                                  And please don't forget to follow my page
                                      Thank you for visiting my blogspot
               
                                                                                           


THIS IS MY THIRD WEB TUTORIAL:-



                   THIS IS MY THIRD WEB TUTORIAL :-

Today i will going to teach you all how to import the other file into the
present file by using a simple tag function known as "href" this function is used for
refering other files like "HTML" and other kind of web documents we could do
other kind of things that i will teach you all in next tutorial so please be visiting. This
 files could be accessed by the files physical path if you don't know what it means
then just goto the file which you want to access and right click that file and go to
properties and in which you could see the location that is what the physical location
is, so then use your mouse or touch pad to select that and use ctr+c(copy) and then
come to the present file your typing and use ctr+v(paste) and follow the operation
shown in below example ,so please view below to know more.
example below:-

<html>
<head><title>reference</title></head>
<body>
<a href="paste the physical path here">click</a>
</body>
</html>

In the example above href the place within the double coats use ctr+v
(paste) after which type the file name with format as for you could even access
 another HTML file through this HTML file you could open other html file so
i would refer you all to store the file with in the same folder so that it would be
easier to refer. Then after the braces type what ever you want that is the link
word which will be displayed on the browser to click use same <html>, <head>,
 <title>and<body> so after this save it by clicking file->save->in that select any
 file location, In save as type select all files and in file name give any name you want
 aftergiving the name you must continue it by using .html then click on save.
     
         THIS .html IS COMPULSORY IF YOU DIDN'T GIVE IT THEN IT WONT WORK

           Then close the file and open the saved file which is given the extension .html
right click on the that file and open it with any browser which you have so u will get
the output displayed

I am having chrome browser so i have opened my html file with that so
you could use other browsers like firefox or Interent Explorer which ever you have.
If you visitors have anything you want to say like complants and comments
you can mail me at gmail id below

                 For the other 2 tutorials view the other posts below they will teach you the
other 2 basic classes so if you have any complants and comments just send them

              THANKYOU FOR VISITING
                         

THIS IS MY FORTH WEB TUTORIAL :-

              So welcome back friends this is the continuation of the 3rd class.
 
                  I think you all may be curious to know what else this href could do
and what i would teach you all today you might be thinking it may be prity hard
dont worry its prity simple if you all are visiting and learning tutorials that i am
updating so lets not waste time and lets get started.

Today i will going to teach you all how to use the "href" function to do
"download" you all may think that it might seem prity hard but its not hard as you
think you just have to prepare the file that i have  shown you all in last class
dont worry the example is below just pepare the file as it shows so now the
downloading part use the file where you enter the file path the same technic
is used here but here you can download the PDF, word, PPT files which you have
prepared not just that you could also attach the audio, video and images but after
every file name just specify the file format like for audio mp3, videos 3gp mp4
and for PDF and other formatt files with there extensions, these files could be
accessed by the files physical path if you don't know what it means then just goto
the file which you want to access and right click that file and go to properties and in
which you could see the location that is what the physical location is, so then use
your mouse or touch pad to select that and use ctr+c(copy) and then come to the
present file your typing and use ctr+v(paste) and follow the operationshown in
below example ,so please view below to know more.

example below:

<html>
<head><title>reference</title></head>
<body>
<a href="paste the physical path here">click</a>
</body>
</html>

In the example above href the place within the double coats use ctr+v
(paste) after which type the file name with format as for you could even access
 another HTML file and other file formats as refered above through this HTML
file you could open other html file so i would refer you all to store the file with in the
same folder so that it would be easier to refer. Then after the braces type what
ever you want that is the link word which will be displayed on the browser to click
use same <html>, <head>, <title>and<body> so after this save it by clicking file->
save->in that select any file location, In save as type select all files and in file name
give any name you want aftergiving the name you must continue it by using .html
then click on save.
     
         THIS .html IS COMPULSORY IF YOU DIDN'T GIVE IT THEN IT WONT WORK

           Then close the file and open the saved file which is given the extension .html
right click on the that file and open it with any browser which you have so u will get
the output displayed

If you want this to work properly then just use Interent Explorer you could
use other browsers in other browser you couldn't just download videos and audio
clips they would directly opened in the browser if you are using PDF, word or other
files they would be downloaded don't worry . For other class updates please follow me on google+.

                 For the other 3 tutorials view the other posts below they will teach you the
other 3 basic classes so if you have any complants and comments then please
send them below.

                                          THANKYOU FOR VISITING

           For more web tutorial just keep visiting the blog

           Please suggest your friends too to visit this blog
                                                                                                                           

THIS IS MY FIFTH WEB TUTORIAL:-


                   This is my fifth web tutorial :-

Hai all sorry for the long gap of uploading the 5th tutorial
 
So i hope u all have visited my other class so they are the basic of the
web building so if you have not visited them then please visit them the links for those
classes will be provided in the end of this tutorial blog.

So lets start todays tutorial so in todays tutorial i will tell you all how to
display the image in your web browser:

Step1:-Create a folder with whichever name you want then open the folder

Step2:- Within the folder right click>new>text document then start typing the below
 html in your editor(text editor)

Example:-

<html>
<head><title>image display</title></head>
<body>
<h1><b>The image of the nature<b><h1>
<img src="123.jpg" alt="(Picture of nature)" width="200px" height="120px"/>
</body>
</html>

You can even copy past the code.

This is just a exaple for your reference so that it would be easy for me to
explain them what they do ,so as for my begining classes i have told you all about
the basic html tags so i will not wast time for explaing those again so in this the new
tags are img, src, alt, width and height

img - This tag is to specify the browser that we are displaying a image.

src - This is where we specify where the image is.

alt - In this we specify the alternaternate text if the file doesn't find the image in the
folder.

width - This specifies the browser to diplay the image in a with the reference of the
width given.

height - This specifies the height.


Note :-

* The px is the number of pixels the image has to be displayed, pixel is
nothing but the smallest divisions of the display screen

* I prefer you all to keep the mage in the same folder where you have kept the
 above file

* Save the file with the with .html extension this is very important part so i am
repeating this in every tutorial

* The image name must be the source name otherwise the image wont be
displayed

Now just double click the html file if it still open in a notepad or any text
editor then just right click the file then goto open with in them then chose defalt
program and in that select any web browsers like

*Google Chrome
*Mozilla firefox
*Internet explorer

choose any one so that it works so thats it ,thank you my next tuorial
would be updated soon so keep visiting

And whoever have not visited my other tutorials want to visit them then the links are
provided below:
First tutorial:click here

second tutorial:click here

third tutorial:click here

forth tutorial:click here


                THANKYOU FOR VISITING
         For more web tutorial just keep visiting the blog
                                                                                                                                 


THIS IS MY SIXTH WEB TUTORIAL:-

             
                   Today i will teach you all how to make the music starts automatically when browser is opened

                    Are you guys curies to know how to insert music or your fav song on background i will show you all in a single html file
   
                     We could insert it using embed function

How we could use it its simple

Step1:-Create a folder with any name you desire

Step2:-copy the song or music which you want to insert and paste it in the folder that you just created

Step3:-Right click in the folder then select new>text document

Step4:-give any name for the folder then open it

Step5:-Then after opening the file then type the below code

<html>
<head><title>musical page</title></head>
<body>
<embed autostart="true" height="0" loop="true" src="" width="2"></embed>
</body>
</html>

            In src just open the properties of the audio track which you have copied to the folder then copy the physical path then paste it to src how to copy the physical path i had mentioned it in other tutorials so please view them

Step6:-Save the file with which ever name you want but after the name please give the extension as .html

DON'T FORGET TO SAVE THIS FILE USING .html

otherwise the program won't work

                                             THANKYOU FOR VISITING

                  Please comment this is only for the reference for me that wheather you are like this tutorial or not to get my next tutorial i need minimum 10 comments otherwise no further tutorials would be continued
                                                   

THIS IS MY SEVENTH WEB TUTORIAL:-

                                In this tutorial i am going to discuss regarding the css,
                                      How to use CSS how it works?
                                      Why do we use CSS?


          So lets start,
                So CSS stands for "Cascaded Style Sheets" as we use these to make our default looking html page to look it a different color with different background images and padding and all stuff you may not get what are all these but eventually you guys will know so lets start with the example of embedded CSS

<html>
    <head>
           <title>Styles</title>
           <style>
                      body{
                             color:red;
                              }
           </style>
    </head>
    <body>
               <h1> hello guys this is CSS </h1>
    </body>
</html>

There are internal CSS and External CSS are other two types of defining a html

Internal CSS
<html>
    <head>
           <title>Styles</title>

  </head>
    <body>

               <h1 style="color:blue;padding:20px;"> hello guys this is CSS </h1>
    </body>
</html>
External CSS
<html>
    <head>
           <title>Styles</title>
            <link rel="stylesheet" type="text/css" href="1.css">

  </head>
    <body>

               <h1> hello guys this is CSS </h1>
    </body>
</html>
Save this below file with 1.CSS extenstion
h1{
color:blue;
padding:20px;
}
                       So as you guys have used this html codes the default color of the texts in the body tag used to be black right, but by using this style tag we can change the default things display on the browser screen, so you guys could just use the tag followed by the flower braces and within those braces you could specify the thinks like color,padding etc., don't just try this and leave the things try other colors and try different things from the last few tutorials.

                       So try this if its working fine, then please leave a comment below

                          Thank you guys for visiting the blog....


THIS IS MY EIGHTH WEB TUTORIAL:-

              In this tutorial i am going to discuss regarding the JS(Java Script) which is a client side scripting language and this is used for server side verification by this we could also use the system calls like date and time.There are 3 ways in which the JS could be declared inner JS,Embed JS and External JS, in this i have used the the inner JS as its used within the tag as here we have used it directly. 
               We could declare this itself in External and Embedded JS if we are using the Embedded JS then we have to use the <script>Element to write the script for external JS we would use the external file with .js extension and would be linked with the help of <link>and even <script>Element. 

<!DOCTYPE html>
<html>
    <body>

          <h2>My First JavaScript</h2>

          <button type="button" onclick="document.getElementById('demo').innerHTML = Date()">
               Click me to display Date and Time.</button>

               <p id="demo"></p>

    </body>
</html>  
                 By this Example as you guys could see the onclick function the function that has been used in this we have used the Date() which would fetch the system date. 

Example for Embedded JS
<!DOCTYPE html>
<html>
    <head>
        <script>
            function msg(){  
                          alert("Hello Technomania");  
                                   }  
         </script>
    </head>
    <body>
          <h2>My First JavaScript</h2>
          <input type="button" value="click" onclick="msg()"/> 
    </body>
</html>  

Example for external JS
<html>  
   <head>  
       <script type="text/javascript" src="message.js"></script>  
   </head>  
   <body>  
            <p>Welcome to JavaScript</p>  
           <form>  
                  <input type="button" value="click" onclick="msg()"/>  
          </form>  
   </body>  
</html>  

Save this Below file with somename with .js and remember to give the same name in the script part above in <script type="text/javascript" src="message.js">

function msg(){  
       alert("Hello Javatpoint");  

}  


             I think these much knowledge is enough to start with php when you will be coding you need know regarding more of the tags but to start with php this is enough.

-------------------------------------IGNORE THE TAGS BELOW-----------------------------------------------
html, web, technology, vector, illustration, development, website, flat, icon, internet, design, software, education, coding, page, tutorial, language, symbol, computer, online, training, interface, abstract, data, information, business, sign, programming, app, concept, network, script, site, application, mobile, digital, code, course, skill, knowledge, graphic, program, programmer, css, layout, e-learning, book, distance, homepage, wireframe

Comments