Pages

First Lecture

 

                                              Visual code Studio                    

VS code studio is an editor .It support for development operations like task running ,debugging ,and version controls. It provides the tools for a quick code debug cycle .It leaves more complex workflows to featured ID's , and these ID's known as VS code Studio.

VS code studio is an editor. It is easy to use and it is a clever coder by HTML .We create our Web Pages by using Visual Code Studio. 

How to we use Visual Code Studio:

  • Firstly to make a new folder on desktop.
  • Then name them this folder any name which you like.
  • Open  Visual Code Studio .
  • Then go on file button on VS code then open workplace from file , and attach your folder with VS.
  • Otherwise click the button of add folder.
  • Then one message will be come like are u agree with this we click on agree button .
  • View your HTML file on Browser.
  • And then we start our project on VS code Studio.

HTML Shortcut Template:

                                                                Its a HTML shortcut Template .

 Some Boiler Plates of  HTML:

  • DOCTYPE tag
  • <html> tag 
  • <head> tag
  • <tittle>HELO WORD<tittle>
  • Then head close braces </head>
  • Then start from body tag <body> we write all data in body .and then  close the body like </body>
LIKE ....,




                          Now start HTML coding on VS code Studio 



What is HTML :

  • HTML stands for Hyper Text Markup Language.
  • HTML describes the structure of a Web page
  • HTML consists of a series of elements
  • HTML label pieces of content are "this is a heading", "this a paragraph", "this is a link".
  • HTML tells the browser how to display the contents.

How to create Web Page with using HTML:


  1. Create a Layout. .
  2. Set up the boiler code as i discuss in upper.
  3. Create major elements in the layout.
  4. Create HTML contents.
  5. Create CSS for the layout.
  6. Create CSS to style individual elements.
  7. Add background color and style.

Simple HTML CODE  is here:

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>
</html>


Example Explained

  • The <DOCTYPE html> defines that this content is an HTML document.
  • The <html> is the element that define the root of an HTML page .
  • The <head> the meta information  about HTML page.
  • The <tittle> is the tittle for the HTML page .(Which shows in the Browser title bar on  the web page).
  • The <body> defines the document body and it is the container of all the visible contents 
                                                      1.  such as heading 
                                                      2.   paragraphs
                                                      3.   images
                                                      4.   tables, list etc..,

  • The <h1> tag defines a large heading .
  • The <p> Defines a paragraph.

Why we use heading tag in HTML:

Header tags ,also known as heading tags, which are used to separate headings and subheadings.
it starts with <h1>and close with </h1> tag and heading tag end with <h6></h6> tag which is smaller then the  (h1)
tag.

Why we use paragraph tag in HTML:

Paragraph tag is use to write a paragraph. Some more tags are use to make our paragraph easy to understand like to break a paragraph , to horizontal Rules, Poem problems etc.

like 


Tag                                         Description
<p>                                           Defines  a paragraph.
<hr>                                          Define a thematic change in the content.
<br>                                          Insert a single line break.
<pre>                                        Defines pre-formatted text.




We can style our paragraph and heading as we like to style .we also insert images through HTML codes. and we also change the color of our font and background etc....
We also change our text color and text background color. We style our content through CSS.
                             
                                             

HTML Styles


The HTML style attribute is used to add styles , such as color, font ,size etc.

  • Use the style attribute for styling HTML elements
  • Use background-color for background color
  • Use color for text colors
  • Use font-family for text fonts
  • Use font-size for text sizes
  • Use text-align for text alignment


No comments:

Post a Comment