- 9 months ago
Category
📚
LearningTranscript
00:00Now, we are going to start coding in HTML.
00:03Usually, if we learn a new programming language,
00:06we will write a Hello World program.
00:10Today, we will also see a Hello World program in HTML.
00:14For writing things, we have to create a HTML file.
00:19Visual Studio Code or any editor that you have downloaded,
00:23first of all, we are going to open it.
00:25Now, I can see a lot of things here.
00:28You can't see it.
00:30Because I use Visual Studio Code a lot of times.
00:33So, these are my recent files.
00:34But if you have installed new,
00:36there will not be a recent option.
00:38We will start with a new file.
00:41First of all, we will click on the new file.
00:44I am going to start with a text file.
00:47I have created a file.
00:49Now, its name is untitled.
00:51I am going to save it.
00:53To save this file, I am going to give it a name.
00:56Hello.
00:57I am going to call it Hello World.html.
01:01I have saved it from Hello World.html.
01:03Now, we call it .html.
01:06We call it extension.
01:08It is the last thing that is added.
01:11If I make a HTML file,
01:13I always have to finish it with .html.
01:16If I make Java,
01:18I have to finish it with .java.
01:20If I make a C++ file,
01:21I have to finish it with programming languages.
01:23So, I have to finish it with .cpp.
01:24I have to finish it with .cpp.
01:25Then, we will finish it with .js.
01:26So, we will finish it with .js.
01:27So, we will finish it with .js.
01:29From this way,
01:30we will see an extension of a file.
01:31We will know that which language is written in this file.
01:33If it is a Python file,
01:35we will finish it with .py.
01:37Here, we will finish .py.
01:38This is .html,
01:40it is our HTML file.
01:42We could keep it.
01:43We can keep it in a name.
01:44We can keep it in the name of ABCD.
01:46We could keep it in our name of it,
01:48and we can keep it in our college.
01:49I have to keep it in this file.
01:50Hello World.html.
01:51And, it will look above the code of using the code.
01:54There is a folder.
01:55It is inside my folder.
01:57In a folder of the user inside,
01:58I created this file.
01:59The entire path of this file has gone.
02:01If you have a Windows system, you can see on any HTML file where it went and created.
02:08What am I going to do? I will create a paragraph tag.
02:12To create a paragraph tag, I wrote something like this.
02:16This is my opening tag and this is my closing tag.
02:19Now, I am going to write hello world.
02:23So, in this way, I created a paragraph element.
02:27This is my opening tag, then my content.
02:31What do I write in content?
02:32I have called hello world.
02:33And last is my closing tag.
02:35I have done it and saved.
02:37Now, I have to see what the output will come.
02:39I have made an HTML file.
02:41So, I need to create a web page and a website.
02:45Now, the website is a big thing.
02:47There are frontend, backend, databases.
02:49There are many things.
02:51So, here, I am using the word for your simplicity.
02:55Now, I will not create a website from HTML.
02:57We will create a web page from HTML.
02:59It will be a small page of the whole website.
03:01Now, I have written code here.
03:02Now, I will run it.
03:03I will go there, where my file is saved.
03:06So, I am going to search for my folder.
03:09My folder has opened.
03:10If I search hello world.html,
03:15So, this is my file.
03:17This is my file.
03:18This file was created in this folder.
03:20And, as I will double click on this file.
03:22Or, I will open click on this file.
03:24So, this is my whole website.
03:26My whole VS code was created.
03:28It was created a website.
03:30It looks like this.
03:31The web page has created it.
03:32It looks like this.
03:33And, it will also be seen in my browser.
03:35It will also be seen in the users' folder.
03:37The HTML file is created.
03:39This is the output.
03:41So, with the help of the paragraph tag,
03:43I can print it on the web page.
03:46Now, the same thing.
03:48I have written it in a paragraph tag.
03:50I will copy it in the second line.
03:52What can I do?
03:53I can write my name.
03:54I will write my name here.
03:56Now, if I will save it.
03:58I will save it here.
04:00I will save it in HTML.
04:01I will press the command S.
04:03You can press the control S.
04:05I will save it here.
04:06And, as I will refresh it.
04:08So, one paragraph has printed Hello World.
04:11And, the next paragraph has printed next line.
04:14In this same way, I can create another paragraph element.
04:18I will print it in my college.
04:21Now, I will save it and refresh it again.
04:24So, the third paragraph tag will be printed in the third line.
04:28So, the paragraph tag will be printed in the third line.
04:30So, the paragraph tag will be printed.
04:32If you print something new,
04:33So, it will print something new.
04:34So, it will be printed as the same way.
04:35It will show on our screen.
04:36With that, if you use multiple paragraph tags,
04:39then, each paragraph tag starts with new lines.
04:42It is not like,
04:43If you print this line,
04:44after this line,
04:45you will print it.
04:46The next line is printed.
04:47The next line is printed.
04:48The college is printed.
04:49Your college is printed on the next line.
04:50If I have to print all these things on the same line,
04:53So I don't use a different paragraph tag. Then I cut these all the information and cut it into the same paragraph tag.
05:05Cut and paste here. And single paragraph tag, then my information will show me like this.
05:13So in this way, we create HTML file and start basic coding inside it.
05:19Here I will ask you a small question. What do you need to do with the paragraph tag?
05:23You need to print your name on your browser.
05:26So once you have a paragraph tag, you have to write your name in it.
05:29Then you have to see how you can display your name on your web page.
05:33Now there is another thing that I have to learn about HTML code.
05:36This is all my web page is formed. This web page will run only on my computer.
05:41Like websites are online. If you want to open amazon.com or google.com,
05:46You can open it from your computer. I can open it from your computer.
05:49But this, which I created a web page from specific HTML,
05:52It can only open my computer.
05:55Because it's HTML file is present in my computer.
05:58If we want to put things on the internet,
06:01And make our web page in this way,
06:03If anyone can access it, anyone can open it,
06:05Then we have to learn domains, hosting,
06:08And learn some advanced things that we will learn later.
06:11So for now, the web pages, websites,
06:14We are creating all the things that are in our browser.
06:17Because their files are in our computer.
06:19Now if I want to click on this page,
06:22I can inspect it on this page.
06:24As I inspect it, what will show you?
06:26You will show the whole HTML code.
06:29In the HTML code,
06:31You will see a paragraph tag here.
06:33And all of these things are written in it.
06:35Like we have written in our VS code.
06:38But here,
06:39You will see all different tags.
06:41You will see a HTML tag.
06:42You will see a tag.
06:43You will see a head name.
06:44You will see a body name.
06:45You will see all these tags.
06:47Now we are going to read.
06:48So we don't want to see it.
06:50But the major work that we are doing,
06:52It is a paragraph tag.
06:53In which we have written a lot of information.
06:55Now with this,
06:56If I believe,
06:57I have written a lot of words.
06:59Now with these words,
07:00I want to show some words in bold.
07:02So for that,
07:03I can use my bold tag.
07:04To write bold tags,
07:05I can also write tags in these tags.
07:07Like in this paragraph tag,
07:09I have to build my college.
07:11So I have written B.
07:12This is B.
07:13The opening tag.
07:14And it is closing tag.
07:15Now I am going to write after college.
07:17So in this way,
07:18My paragraph tag is outside.
07:20And inside,
07:21My bold tag.
07:22And inside,
07:23What material is in your college.
07:25It will be displayed in bold.
07:27It will be displayed in the paragraph.
07:28But it will be displayed in bold.
07:30Once we do this,
07:31Save and Refresh.
07:32So the rest of the text is normally displayed.
07:35But your college is displayed in bold.
07:37So in this way,
07:38You also have to display your text in bold.
07:41You have to highlight in bold.
07:43We can be displayed in bold.
07:46To the instrument that you can view on capabilities
07:47You have to highlight here.
07:48To the brief message where you can see language.
07:49And then numa with language
07:54And then another one is in bold.
07:55Where you can see their reflections.
07:57glory.
07:58Inantics in those lines.
07:59Let us say.
08:00u are so psychoanalysis.
Comments