Skip to main content

How to start learning Web-development

Html tutorial 3 ids , class in html and how we use them

 Basic tags which left -

Semantic tags -

1. article tag -
    article is self contained content we write article related content in this tag like blog , newspaper , etc.

syntax -
<article>
article tag in html
</article>

2. aside tag - 
    some content was aside from its place and they place at the side of website like a small column box .

syntax - 

<aside>
this is aside tag
</aside>

3. Header tag - it is place at top of the website or say as a head of the website and work as menu or navigation bar for web page .

syntax -

<header>
this is header tag 
</header>

4. Footer tag -
this tag was placed at the bottom of the web page and we can take our more detail in the footer and address contact number etc are present at footer 

syntax - 
<footer> this is footer <footer>

what is means of &nbsp in html ?
it is know as non breaking space we use it in line no space and it do not break the line and make space between words or in other word to word separate are stick togather but not break in different lines.

what is id's means ??

we use id in html for give a unique number to tags and find them simple for any modification or say to point that id for styling of it through css and because it was unique number for all tags so once it was used we cannot use it again in any other tags so thats was it is a unique all time .

syntax - 
<p id="id_name">
this is how we take id in html
</p>

css - 
#id_name{
            color: blue;
        }

on server -

this is how we take id in html



what is class attribute in html 
We use one class named in more than one tags and modified them or say style them by class simply if we want to style multiple paragarph tag so we get them by class and style them in CSS ( if we want same style ).

Syntax -

<!-- class in html -->
<p class="class_name">
this is how we take class
</p>

css-
.class_name{
            color: red;
        }

on server -

this is how we take class

Code -

<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>tags in html</title>
<style>
.class_name{
color: red;
}
#id_name{
color: blue;
}
</style>
</head>

<body>
<!-- semantic tags -->

<!-- article -->
<article>
article tag in html
</article>

<!-- aside tag -->
<aside>
this is aside tag
</aside>

<!-- id -->
<p id="id_name">
this is how we take id in html
</p>

<!-- class in html -->
<p class="class_name">
this is how we take class
</p>
</body>

</html>


ON SERVER -

article tag in html

this is how we take id in html

this is how we take class

Which type of IDE you have to use it -

This code editor is mostly used by  programmer in competitive level and also in collages and this is a best programming ide and it is belongs to Microsoft one of the best company which most of the people belive so for starting  you start with vs-code ide and its UI is very simple to understand but at start have to take a tutorial about it in YOUTUBE  so first  start programming with this .


Comments

Popular posts from this blog

Funcation in c++ programming example in detail

Friend Funcation- 1. Adding to complex number in friend function #include<iostream> using namespace std; class container { float a,b; public: void get() { cout<<endl<<"Enter value for A="; cin>>a; cout<<endl<<"Enter value for B="; cin>>b; } void disp() { cout<<endl<<a; cout<<endl<<b; } friend container addition(container,container); }; container addition(container X,container y) { container Z; Z.a=X.a+y.a; Z.b=X.b+y.b; return Z; } int main() { container P,Q,R; P.get(); P.disp(); Q.get(); Q.disp(); R=addition(P,Q); R.disp(); return 0; } Output - Enter value for A=12 Enter value for B=12 12 12 Enter value for A=1 Enter value for B=1 1 1 13 13 2.  If class one is friend function of two it not means that two is friend functio...

Tutorial 10 text align , decoration etc explaining

 Text in Css - 1.Text color -     here we can set color in text for making them more enhancive or if we want required to change in color of text it work perfectly  syntax - color : red; OUTPUT - text color is change to red 2.Text alignment -     It is used for align the text according to the requirement and their situation we align text at center , right , left etc syntax - text-align:center; 3.Text decoration-     It is to decorate the text let if we want to underline in text then we use text decoration and make it on the line  syntax - text-decoration: underline; OUTPUT - text have an underline decoration 4.Text transformation -  In this we transform letters into uppercase , lowercase and capitalization means if the letter is small then it will convert into uppercase or visa-versa syntax - text-transform:(uppercase , lowercase , capitalize); 5.Text spacing - It decided the space between letter and words both how many gap are between...

C++ programming tutorial 3

 Control statement in c++ programming - 1. For loop statement in c++ programming -  In this loops we run a single part of code many times this used for simple our programming and in less code , time work done is same . Syntax - for(int i =0; i< x ; i++){ ..... } Code -  // For loop in c++ language  #include <iostream> using   namespace  std; int   main () {      int   i  ,  a ;      cout << "Loop was start Below " << endl ;      cout << "Enter the value of a:" << endl ;      cin >> a ;      for ( i = 0 ; i <= a ; i ++ )     {          cout <<   "this is a number count :" <<   i << endl ;     }  ...