Html crash course | Html Basic To Advanced :


This Is About (Html Crash Course | Html Basic To Advanced ) Course And This Is Well Designed By DanishWebCreator

Previous Article, We Discuss The Road Map Of Web Development.
In This Course Of Html Basic To Advanced, We Discuss Following Things
  • Basic Intro Of Html
  • Setup And First Code Of Html
  • Elements/Tags and Attributes
  • Heading/Paragraph/Text Formation
  • Lists
  • Tables
  • Form
The Full Form Of Html (HyperText Markup Language).This is used to make the basic structure of the webpage. We Also Discuss Html5 Tags And News thing In The Comming lectures. 


Html Crash Course | Html Basic To Advanced




Let's Start Our First Code Of Html crash course | Html Basic To Advanced


You Need Laptop+Text Editor(Download Sublime)+Browser (Google) So Lets Starts.

1) Create A Folder By Name Website On Desktop
2). Open File To You Text Editor :
3). Create New File By Right Click On Website Folder In Sublime
Click on the new file and then press Ctrl + S Then,
4). Save File With index.html File Extension :
If You Are Not Save File To .html Extension So The Coding Not Working5). In This File You Write Basic Code Of Html :
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
These Are the tags used in the Html 
  • The first tag is Html that Shows That the Html starts from here for the browser help.
  • The second Tag is Head All link are put in this section Like(link, script, font awesome, etc.) And Also The Title Of The Web site
  • In The Head Tag, There is Title  Tag The Contain Text That Display On Browser Tab then the last Tag is Body  In This All Code is Add That Display On browser(Chrome).

6). Display You First Code

Copy Paste The Code Written in the Below And Save The File And Double Click On The Index.html File in the Desktop Folder So, The File Open In The Default Browser.<!DOCTYPE html><html><head> <title></title></head><body><h1>My First Website</h1><p>My Paragraph</p></body></html>Our First Code Is Successfully work

 Elements/Tags and Attributes Of  Html Crash Course

  • Element is the mixture of open And end tag and element Content in the above example (<h1>My First Website</h1>,<p>My Paragraph</p>) <p>,<h1> are open tags, </p>,</h1>are the end tags and (My First Website),(My Paragraph) are the Element Content.If Tag Contain (Element Content) is called Element If Not So Called Tag. 
  • Attributes Contain The Addition Information Of Tag Like(<img src"image.jpg">) this contain src attribute for additional information.

 Heading/Paragraph/Text Formation  In Html Crash Course

  • <p></p>
  • <h1></h1>......<h6></h6>
  • <br>
  • <hr>
  • <i></i>
  • <b></b>,<strong></strong>
  • <del></del>
  • <u></u>
  • <img>
  • <a></a>

All Tags Intro 

  • <p></p> :
                        This Tag Is Use To Display Paragraph On The Browser and We Use p Tag Many Times In Our Web Page On Different Places.
  • <h1></h1>......<h6></h6>
                                                  This Tag Is Use To Display Headings On Web Page The Biggest Heading Is Display By h1 And Smallest Heading Is By h6 And h2,h3,h4,h5 are subheadings of each other.
  • <br>
                   br Tag Is Use For Line Break Means Text Starts From New Line.
  • <hr>
                hr Tag Is Use To Display Horizontal Line On Webpage.
  • <i></i>
                     I Tag Is Use For Text To Italic  The Line Or Word On The Web Page.
  • <b></b>,<strong></strong>
                                                     <b>,<strong> Tags are Used For Text To Bold The Line Or Word On The Web Page
  • <del></del>
                             del is Use To Cut The Word Or Line Like In The Below.
Demo Text In 2020
  • <u></u>
                      u is Use To Underline The Line Or Word In The Web Page.
  • <img>
  Img Tag is Use For Showing Image On Web page Of Your Website. In This, We Use Src Attribute For The Image Source.
  • <a></a>
                       a Stands For Anchor Tag Used For Link On Page To Other Or Link One Website To Other WebSite.

Lists In Html Crash Course

There Are Two Types Of List:-
  • Order List
  • UnOrder List
  • Order List
In Order List, The List Is make In order Like(1,2,3,4,5,6,7..... etc)
The Is Start With <ol></ol> And In The ol Attribute We Use Type Like(A,a,1(By Default),i,I) Because In ol We Use <li> For Data Insertion In The List.
  • UnOrder List
In UnOrder List The List Is make In order Like(Dotted List)
The Is Start With <ul></ul> And In The ul Attribute We Use Type Like(Disc(By Default),Circle,None,Square) Because In ul We Use <li> For Data Insertion In The List.

 Table  In Html Crash Course

  • You See Data Show In Table In Many Sites That Is Show By Table Tag
  • In The <table> Tag We Make Rows By <tr> (Table Row) And In This For First Row We Use <th> (Table Header). So, The Words In This Row Was bold Heading And For Second, Third And More Used <td> (Table Data).
  • Also, You Use The Attribute Colspan And Rowspan For Cover 2 Or More Columns And Rows.

 Form In Html Crash Course

  • You See Forms In Web Pages Like ( Contact Us, Login, Sign Up ) So Make Lets Start Creating WebForms.
  • It Form is Start With <form> Tag With Open And Close Both Tags In This We Use Input Type Like( text, email, Password).
  • In This, We Use Many Attributes But Most Important is Placeholder. Placeholder Is Use To Show The Data In The Box Of Input. But in The Submit Button, We Use Value Attribute.
<form>
<input type="text" Placeholder="Enter Your User Name">
<input type="Email"  placeholder="Enter Your Email">
<input type="Password"  Placeholder="Enter Your Password">
</form>
All In Put Types :
  • Text
  • Email
  • Password
  • File
  • Date
  • Color
  • Checkbox
  • Submit
  • Radio
  • Search
  • Hidden
  • Textarea
  • <select></select>

All Form InPut Type Intro 

  • Text
For getting Alpha-numeric Data From The User Like(First Name, Last Name, UserName).
  • Email
Forget the Value Emails From The User Like(UserName@gmail.com Or Example@gmail.com).
  • Password
                          For getting Password Like Dotted Form From The User Like(Real Data: danishwebcreator In This Field: ******************).
  • File
                          For getting File OR Image From The User Like(Jpg, Pdf, Png, Gif, etc). This Is Use In Backend For the User Profile Photo And For Cv Uploading We Also Discuss In The Php LessonIn The Future. 
  • Date
  For getting Date Of Birth From The User Like(1 May 2020 in 01/05/2020) Because This Is Need For Office Applications.
  • Color
  For getting Favourite Color From The User Like(red, Green, Blue, Yellow).
  • Checkbox
  For getting Hobbies Or Those Things That Possible Greater than 1 From The User Like(In These: Songs, Book Reading, Playing Cricket).
  • Submit
  For Submitting The Form Like(Login Now, Register Now, Etc.).
  • Radio
  Input Type Radio Is Like CheckBox But In This, We Select  One Thing Only At Same Time  Like(Male, Female).
  • Search
                       Forgetting Data For Searching In The website  From The User Like(Html Course Or CSS Course).
  • Hidden
  No Data Enter In This Filed Of Form Because This is disabled For User.
  • Textarea
  TextArea Not an InPut Type Its A Tag  Used In A Form Tag. In The Attribute, We Use Rows And Cols That contains Words In Row And Lines In Cols. Also Use TheAttribute Of Css (Resize:none;).
  • <select></select>
                                             Select Not an InPut Type Its A Tag  Used In A Form Tag But In The Tag, We Use Option Tag That contains Data Of Drop Down In Website We Use It For Country Name Or City Name.
We Discuss Html Basic To Advanced In This Course In The Next Lecture We Discuss CSS Crash Course

<End Of Html Crash Course | Html Basic To Advanced>

Html Crash Course | Html Basic To Advanced

Html crash course | Html Basic To Advanced :


This Is About (Html Crash Course | Html Basic To Advanced ) Course And This Is Well Designed By DanishWebCreator

Previous Article, We Discuss The Road Map Of Web Development.
In This Course Of Html Basic To Advanced, We Discuss Following Things
  • Basic Intro Of Html
  • Setup And First Code Of Html
  • Elements/Tags and Attributes
  • Heading/Paragraph/Text Formation
  • Lists
  • Tables
  • Form
The Full Form Of Html (HyperText Markup Language).This is used to make the basic structure of the webpage. We Also Discuss Html5 Tags And News thing In The Comming lectures. 


Html Crash Course | Html Basic To Advanced




Let's Start Our First Code Of Html crash course | Html Basic To Advanced


You Need Laptop+Text Editor(Download Sublime)+Browser (Google) So Lets Starts.

1) Create A Folder By Name Website On Desktop
2). Open File To You Text Editor :
3). Create New File By Right Click On Website Folder In Sublime
Click on the new file and then press Ctrl + S Then,
4). Save File With index.html File Extension :
If You Are Not Save File To .html Extension So The Coding Not Working5). In This File You Write Basic Code Of Html :
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
These Are the tags used in the Html 
  • The first tag is Html that Shows That the Html starts from here for the browser help.
  • The second Tag is Head All link are put in this section Like(link, script, font awesome, etc.) And Also The Title Of The Web site
  • In The Head Tag, There is Title  Tag The Contain Text That Display On Browser Tab then the last Tag is Body  In This All Code is Add That Display On browser(Chrome).

6). Display You First Code

Copy Paste The Code Written in the Below And Save The File And Double Click On The Index.html File in the Desktop Folder So, The File Open In The Default Browser.<!DOCTYPE html><html><head> <title></title></head><body><h1>My First Website</h1><p>My Paragraph</p></body></html>Our First Code Is Successfully work

 Elements/Tags and Attributes Of  Html Crash Course

  • Element is the mixture of open And end tag and element Content in the above example (<h1>My First Website</h1>,<p>My Paragraph</p>) <p>,<h1> are open tags, </p>,</h1>are the end tags and (My First Website),(My Paragraph) are the Element Content.If Tag Contain (Element Content) is called Element If Not So Called Tag. 
  • Attributes Contain The Addition Information Of Tag Like(<img src"image.jpg">) this contain src attribute for additional information.

 Heading/Paragraph/Text Formation  In Html Crash Course

  • <p></p>
  • <h1></h1>......<h6></h6>
  • <br>
  • <hr>
  • <i></i>
  • <b></b>,<strong></strong>
  • <del></del>
  • <u></u>
  • <img>
  • <a></a>

All Tags Intro 

  • <p></p> :
                        This Tag Is Use To Display Paragraph On The Browser and We Use p Tag Many Times In Our Web Page On Different Places.
  • <h1></h1>......<h6></h6>
                                                  This Tag Is Use To Display Headings On Web Page The Biggest Heading Is Display By h1 And Smallest Heading Is By h6 And h2,h3,h4,h5 are subheadings of each other.
  • <br>
                   br Tag Is Use For Line Break Means Text Starts From New Line.
  • <hr>
                hr Tag Is Use To Display Horizontal Line On Webpage.
  • <i></i>
                     I Tag Is Use For Text To Italic  The Line Or Word On The Web Page.
  • <b></b>,<strong></strong>
                                                     <b>,<strong> Tags are Used For Text To Bold The Line Or Word On The Web Page
  • <del></del>
                             del is Use To Cut The Word Or Line Like In The Below.
Demo Text In 2020
  • <u></u>
                      u is Use To Underline The Line Or Word In The Web Page.
  • <img>
  Img Tag is Use For Showing Image On Web page Of Your Website. In This, We Use Src Attribute For The Image Source.
  • <a></a>
                       a Stands For Anchor Tag Used For Link On Page To Other Or Link One Website To Other WebSite.

Lists In Html Crash Course

There Are Two Types Of List:-
  • Order List
  • UnOrder List
  • Order List
In Order List, The List Is make In order Like(1,2,3,4,5,6,7..... etc)
The Is Start With <ol></ol> And In The ol Attribute We Use Type Like(A,a,1(By Default),i,I) Because In ol We Use <li> For Data Insertion In The List.
  • UnOrder List
In UnOrder List The List Is make In order Like(Dotted List)
The Is Start With <ul></ul> And In The ul Attribute We Use Type Like(Disc(By Default),Circle,None,Square) Because In ul We Use <li> For Data Insertion In The List.

 Table  In Html Crash Course

  • You See Data Show In Table In Many Sites That Is Show By Table Tag
  • In The <table> Tag We Make Rows By <tr> (Table Row) And In This For First Row We Use <th> (Table Header). So, The Words In This Row Was bold Heading And For Second, Third And More Used <td> (Table Data).
  • Also, You Use The Attribute Colspan And Rowspan For Cover 2 Or More Columns And Rows.

 Form In Html Crash Course

  • You See Forms In Web Pages Like ( Contact Us, Login, Sign Up ) So Make Lets Start Creating WebForms.
  • It Form is Start With <form> Tag With Open And Close Both Tags In This We Use Input Type Like( text, email, Password).
  • In This, We Use Many Attributes But Most Important is Placeholder. Placeholder Is Use To Show The Data In The Box Of Input. But in The Submit Button, We Use Value Attribute.
<form>
<input type="text" Placeholder="Enter Your User Name">
<input type="Email"  placeholder="Enter Your Email">
<input type="Password"  Placeholder="Enter Your Password">
</form>
All In Put Types :
  • Text
  • Email
  • Password
  • File
  • Date
  • Color
  • Checkbox
  • Submit
  • Radio
  • Search
  • Hidden
  • Textarea
  • <select></select>

All Form InPut Type Intro 

  • Text
For getting Alpha-numeric Data From The User Like(First Name, Last Name, UserName).
  • Email
Forget the Value Emails From The User Like(UserName@gmail.com Or Example@gmail.com).
  • Password
                          For getting Password Like Dotted Form From The User Like(Real Data: danishwebcreator In This Field: ******************).
  • File
                          For getting File OR Image From The User Like(Jpg, Pdf, Png, Gif, etc). This Is Use In Backend For the User Profile Photo And For Cv Uploading We Also Discuss In The Php LessonIn The Future. 
  • Date
  For getting Date Of Birth From The User Like(1 May 2020 in 01/05/2020) Because This Is Need For Office Applications.
  • Color
  For getting Favourite Color From The User Like(red, Green, Blue, Yellow).
  • Checkbox
  For getting Hobbies Or Those Things That Possible Greater than 1 From The User Like(In These: Songs, Book Reading, Playing Cricket).
  • Submit
  For Submitting The Form Like(Login Now, Register Now, Etc.).
  • Radio
  Input Type Radio Is Like CheckBox But In This, We Select  One Thing Only At Same Time  Like(Male, Female).
  • Search
                       Forgetting Data For Searching In The website  From The User Like(Html Course Or CSS Course).
  • Hidden
  No Data Enter In This Filed Of Form Because This is disabled For User.
  • Textarea
  TextArea Not an InPut Type Its A Tag  Used In A Form Tag. In The Attribute, We Use Rows And Cols That contains Words In Row And Lines In Cols. Also Use TheAttribute Of Css (Resize:none;).
  • <select></select>
                                             Select Not an InPut Type Its A Tag  Used In A Form Tag But In The Tag, We Use Option Tag That contains Data Of Drop Down In Website We Use It For Country Name Or City Name.
We Discuss Html Basic To Advanced In This Course In The Next Lecture We Discuss CSS Crash Course

<End Of Html Crash Course | Html Basic To Advanced>

3 comments:

  1. Thanks, foг ones marvelous posting! I genuinely enjoyed reading it, you miggһt Ƅe a great author. I wiⅼl made certain to booҝmark your blog and ѡill often come back sometime soon. I want to encoᥙrage yourself to continue your great job, have a nice evening!
    Web Development Course
    best web development courses
    web development classes
    web development course near me
    Web Development Training
    training on web development
    web development training program
    web development training course
    web development summer training

    ReplyDelete