Scribd Logo
Importer

Bienvenue sur Scribd !

  • Learn How Get Started With HTML5

    Transféré par

    abhieduo12
    30 vues29 pages
    This book contains a helpful information which will allow you to create your webpage by using html language

    Titre original

    Learn how get started with HTML5

    Copyright

    © Attribution Non-Commercial (BY-NC)

    Formats disponibles

    DOCX, PDF, TXT ou lisez en ligne sur Scribd

    Avez-vous trouvé ce document utile ?

    Ce contenu est-il inapproprié ?

    Signaler ce document
    This book contains a helpful information which will allow you to create your webpage by using html language

    Droits d'auteur :

    Attribution Non-Commercial (BY-NC)
    Téléchargez comme DOCX, PDF, TXT ou lisez en ligne sur Scribd
    Signaler comme contenu inapproprié
    30 vues29 pages

    Learn How Get Started With HTML5

    Transféré par

    abhieduo12
    This book contains a helpful information which will allow you to create your webpage by using html language

    Droits d'auteur :

    Attribution Non-Commercial (BY-NC)
    Téléchargez comme DOCX, PDF, TXT ou lisez en ligne sur Scribd
    Signaler comme contenu inapproprié
    sur 29

    INSTALLING THE HTML TOOLS

    Steps For Installing Notepad++:


    1) Open up the browser Install the google chrome first.

    2) Specify the address www.google.com search notepad++. 3) You will get the below screen

    4)

    5) Now click on the Download of current version.

    6) Open the download folder and double click on it then following window will occur.

    7) Click on OK

    . 8) Click on accept the agreement.

    9) Click on next option button.

    10)

    Click or checked on short icon on desktop.

    11)

    Click on Finish.

    12) Run notepad++ i.e Double Click on it.Having lot more option

    13)

    Click on new menu.

    14)

    Write the simple code like

    <h1>This is the test program</h1> <p>Welcome To EDUONIX LEARNING.

    15)

    Click on save from file menu.

    16)

    Double click on test i.e our file name.

    17) Example of heading tag like <h1>to <h6> <p>paragraph tag and some other tag . Write the Code in notepad++ .

    18)

    Write the code..

    <html> <head> <b>Program1</b></head> <title>THIS IS FIRST PROGRAM </title> <style> </style> </head> <body > <marquee><h1>THESE ARE THE DIFFERENT TYPE OF HEADING </h1> </marquee> <h1>THIS IS THE FIRST HEADING</h1> <h2>THIS IS THE SECOND HEADING</h2> <h3>THIS IS THE THRID HEADING</h3> <h4>THIS IS THE THRID HEADING</h4> <h5>THIS IS THE THRID HEADING</h5> <h6>THIS IS THE THRID HEADING</h6> <p bgcolor="red">This is the paragraph tag.</p> </body> </html>

    19)

    You will get the following window.

    20) Click on save and open or double click on it i.e open google chrome browser it will display the following output

    21)

    Adding simple css in an html document.

    Write the code.


    <!DOCTYPE html> <html> <head> <style> body { background-color:#b0c4de; } </style> </head> <body> <h1>My CSS web page!</h1> <p>Hello welcome! This is a eduonix learning solution.</p> </body> </html>

    22)

    It will display the following output.

    23) CREATE AN HTML DOCUMENT FOLLOWING ARE THE PROCEDURE.i.e create an new folder

    24) Double click on folder right click ,and click on text document.

    25)

    Give it to the name index .html.

    26) When we open in the brower the file i.e index.html it has .txt extension look like.

    27) So we have to remove that txt extension Go to organize click on folder and search option .

    28)

    Click on view .

    29) Click on view and uncheck Hide extensions for known file types and click on Ok button.

    30)

    Remove the txt extension click on yes .

    31)

    It will change the icon of index.html.

    32)

    Right click on index.html edit with notepad++

    33) <html>

    Write the html code

    <head> <b>Program1</b></head> <title>THIS IS second PROGRAM in the TEST </title> <style>

    </style> </head> <body > <h1>THIS IS THE FIRST HEADING</h1> <h2>THIS IS THE SECOND HEADING</h2> <h3>THIS IS THE THRID HEADING</h3> <h4>THIS IS THE THRID HEADING</h4> <h5>THIS IS THE THRID HEADING</h5> <h6>THIS IS THE THRID HEADING</h6> <a href="E:\vivek\simplecss.html">This is the first link.</a> <a href="E:\vivek\v1.html">This is the first link.</a> <p bgcolor="red">This is the paragraph tag.</p></body>

    </html>

    34)

    Here look like this.

    35)

    Output .

    36) <html>

    Write the code .

    <head> <b>Program1</b></head> <title>THIS IS second PROGRAM in the TEST </title> <style>

    </style>

    </head>

    <body >

    <h1>THIS IS THE FIRST HEADING</h1> <h2>THIS IS THE SECOND HEADING</h2> <h3>THIS IS THE THRID HEADING</h3> <h4>THIS IS THE THRID HEADING</h4> <h5>THIS IS THE THRID HEADING</h5> <h6>THIS IS THE THRID HEADING</h6> <a href="E:\vivek\simplecss.html">This is the first link.</a> <br> <a href="E:\vivek\v1.html">This is the second link.</a><br /> <a href="http://www.google.com">Welcome to google.</a><br /> <p bgcolor="red">This is the paragraph tag.</p> <div> <img src="C:\Users\password\Desktop\Penguins.jpg" alt=Sample Image />

    </div> </body>

    </html>

    37)

    The window will look like.

    Output.

    Vous aimerez peut-être aussi