HTML TUTORIAL

 

Course Content

Learn HTML In One Video

 

 

Kickstart your html by learning it in hindi

Hey whats up! you wanna know about HTML 5 right?

Here you go !

HTML stands for Hyper Text Markup Language 

~ A language used for describing Web pages using ordinary text.

~ It forms the basic Structure of any website 

 

HTML Files 

~ Every Web page is a Html file. Each Html file is just a plain text file with ".html" file extension 

 

HTML Tags 

~ Every Html file is made up of numerous HTML Tags.

~ Html tags are hidden keywords within a Web page that defines format of that particular Web Browser.

~ Most tags have two parts namely 'Closing Tag' and 'Opening Tag'. (Note that closing tag has the same text as the opening tag but has additional forward slash / character. 

 

Essential Html Tags :-

1. <html>  </html>

 All tags fall in between the html tags. It defines the document as Web page. 

2. <head>  </head> 

 The header contains information like title of the document that won't appear on actual page. 

3. <title>  </title> 

 The title defines the title that will appear in the title bar of the Web browser. 

4. <body>  </body> 

The body tags contain all the visible content of the page including all images, links, etc. 

 

Basic Tags- 

1. Headings and Subheadings 

<h1> A heading </h1>

There are 6 levels of headings available from smallest to largest. ( h1 to h6) 

2. Paragraphs 

<p> Some text  </p> 

3. Links 

<a href = "URL" </a> 

4. Image 

<img src = "photo.jpg"> 

 

 Tag Attributes 

Attributes helps one to customise a tag and are defined within the opening tag. For Example - <ol type = "a"> 

ol stands for Ordered list and ul for Unordered List 

~ Attributes are often assigned a value using the equal sign, such as width = 65% 

~ Break Tag 

<br> Tag is used for styling. In most cases it's preferred to use CSS and Java for Styling. 

~ Comment Tag 

It's not visible on the actual page but remains saved in the language itself. 

<!--- this is a comment --->

~ Form tag- It is used for adding a special Form to the Web page.

<form>

Enter your name : <input type = 'text'/> 

<form>  

Similarly there are also other tags like <table> tags used to form a table with table row and table headings. Caption tags, Div Tags, Meta tags, etc.

We can also link 'heads tag' to external CSS easily. You can prefer other 'Sublime Text' or 'Atom Editor' to make Coding in Html a fun rather than using Notepad for Coding.

 

 

 

File index.html as described in the video


<!DOCTYPE html>
<html>
<title>This is my title</title>
<!-- this is a comment -->
<head>

</head>
<body>

<div id="mydiv" class="redbox">
This is my name ∫ f(x) dx
</div>
<h1>This is my heading 1 using h1 tag</h1>
<p>Computer programming is the process of designing </p>
<h2>This is my heading 2 using h2 tag</h2>
<h3>This is my heading 3 using h3 tag</h3>
<h4>This is my heading 4 using h4 tag</h4>
<h5>This is my heading 5 using h5 tag</h5>
<h6>This is my heading 6 <br>using h6 tag</h6>

<ol type="i">
<li><a href="https://www.google.com">Go to google</a></li>
<li>item2</li>
<li>item3</li>
<li>item4</li>
</ol>

<img src="https://upload.wikimedia.org/wikipedia/commons/4/46/Prog_one.png"/>
<button> Click me bro </button>
<ul>
<li>item1</li>
<li>item2</li>
<li>item3</li>
<li>item4</li>
</ul>

<form>
Enter your name: <input type="text"/>
Enter your Email: <input type="email"/>
<button type="submit">submit form</button>
</form>
<br/>
<table style="width:100%;border:1px solid black">
<caption> Code With Harry</caption>
<tr>
<th>Name</th>
<th>Role</th>
<th>Company</th>
</tr>

<tr>
<th>Harry</th>
<th>Developer</th>
<th>YouTube</th>
</tr>

<th>Naman</th>
<th>Developer</th>
<th>YouTube</th>
</tr>

<th>Rohan Das</th>
<th>CEO</th>
<th>YouTube</th>
</tr>

<th>Skill F</th>
<th>CTO</th>
<th>YouTube</th>
</tr>
</table>


</body>
</html>

Comments

Post a Comment

Popular posts from this blog

java chapter11 practice question on abstruct class and interfaces

  /* Chapter 11 - Practise Set 1... Create an abstract class Pen with methods Write () and refill 1) as abstract methods 2... Use the Pen Class from Q1 to create a Concrete class fountain Pen with additional method change Nibl) 3...Create a class Monkey with jump () and bitel) methods. Create a class Human which inherits this Monkey class and implements Basic Animalinterface with eati) and sleep methods. 4.... Greate a class Telephone with ring() liftus and disconnect ( methods as abstract methods Create another class Smart Telephone and demonstratepolymorphism 5.....Demonstrate polymorphism Msing monkey class from Quess 3. 6.......Create an Interface TV Remote and use it to inheritanother Interface Smart Tv Remote 7...... Create a Class Tv which implements Tv Remote interface qsn 6 */ package com.company ; //programe 1 abstract class Pen { abstract void Write (); abstract void Refill (); } //programe 2 class FountainPen extends Pen { void ...
Read more

DAY 12 -AZURE DP900(Microsoft Azure Data Fundamentals: Explore non-relational data in Azure)

Image
  Microsoft Azure Data Fundamentals: Explore non-relational data in Azure 1. Explore non-relational data offerings in Azure 2. Explore provisioning and deploying non-relational data services in Azure 3. Manage non-relational data stores in Azure Explore non-relational data offerings in Azure---------- Introduction Completed 100 XP 1 minute Data comes in all shapes and sizes, and can be used for a large number of purposes. Many organizations use relational databases to store this data. However, the relational model might not be the most appropriate schema. The structure of the data might be too varied to easily model as a set of relational tables. For example, the data might contain items such as video, audio, images, temporal information, large volumes of free text, encrypted information, or other types of data that aren't inherently relational. Additionally, the data processing requirements might not be best suited by attempting to convert this data into the relational format. In ...
Read more

java exercise4

  //implement a library using java class library //methods: issuebook,returnbook,showavailablebooks //properties:to store available books,store issued books //exercise 4 package com.company ; class library { String [] books ; int no_of_books ; library () { this . books = new String[ 100 ]; this . no_of_books = 0 ; } void addbook ( String book) { this . books [ no_of_books ] = book; no_of_books ++; System . out .println(book + ".... has been added....." ); } void showavailablebooks () { System . out .println( "available books are :" ); for ( String book : this . books ) { if ( book == null ) { //break;------//issue book jdi null hoye jy tale porer books shor krbe na tai continue continue ; } System . out .println( "*..." + book ); } } void issuebook ( String book) { //for (String b:th...
Read more