Showing posts with label Html Crash Course. Show all posts
Showing posts with label Html Crash Course. Show all posts
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.
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>
