WEB TECHNOLOGIES UNIT-1 | Degree 4th sem BCOM Computers web technologies unit-1 full explanation💯✅

Ajouté : 2026-05-30

[00:00:00]Hello dear students, welcome back to our YouTube channel Learn with Sahira. In this video, we are going to see the complete and easy explanation of unit number one from the subject web technologies, which is for degree fourth semester B.Com computer application students. After watching this one single video, I can confidently say you that you will become perfect in unit number one. So, definitely watch the video till the very end and if you are new to our YouTube channel Learn with Sahira, subscribe it for more exam preparation videos. Students, one important thing I have personally prepared damn sure important question and answers notes for all subjects and languages of degree fourth semester. These notes are easy, simple, clear to understand and 100% exam oriented. If you want these notes for quick exam preparation, you can message me on my Instagram. My Instagram ID is Learn with Sahira. Link is also available in this video description.

[00:00:49]Just message me want notes along with your group and semester. I will be giving you the access to all the notes, but remember students, these are paid notes. Yes, there is a small payment for the notes, but believe me, you are going to see excellent results with these notes. Only the students who want the notes should text me and if you want to watch all explanation videos of this subject, do visit our YouTube channel's playlist to semester four web technologies. You will be finding all the videos there. That playlist link is also available in this video description. Do check it out. Without getting late, let us get started.

[00:01:20]Students, question number one is define table. Explain the attributes of table in HTML. Please listen to me carefully that a table in HTML is used to display the data in the form of rows and columns. When we have information students that needs to be shown in proper order, as simple as that, we will be using a table. For example, student marks, a timetable, product list. In all these cases, data is arranged in rows and columns, right? So, when we arrange the data in the form of rows and columns, it becomes easy to read as well as it becomes easy to compare. Now, the question is how table is created in HTML. To create a table, we use three main tags, students. First is this table tag, which is the main container, which is used to create a table. Then we have this TR tag. This creates a row. Then we have this TD tag. This adds data inside the row. So the structure works like this. First, we create a table. Inside the table, we create rows. Inside each row, we add data. So here each TR represents one row. And the inside row, we are having this multiple TD tags that represents column. So this is the way how a table is created. Now let us talk about the attributes. What are attributes? Attributes are used to control the appearance of the table. By default, table simple again attributes used the table more clear, readable, as well as properly space to So let us talk about attributes one by one. First, we have this border attribute. Border is used to show lines around the table and cells. The lines table will be using border attribute.

[00:03:03]Without border, the table exists, but it is not clearly visible because there are no lines. So when we use this, we are creating lines inside the table.

[00:03:12]Example, you can see table border one.

[00:03:16]This means it will give normal line. But if you increase the value here, if you increase it, it will give thicker line.

[00:03:22]So this helps us to clearly see rows as well as columns inside the table. Then we have width attribute. Width is used to control how much space the table takes on the screen. Okay, you can see the example table width 500 means table will have fixed width. But if we give 100% table will take full width of of the screen. Okay, so if we want a flexible table that adjust to the screen size, we will be using percentage. Otherwise, we will be fixing it. So, basically, it will show how much space the table should take on the screen. Then we have cell padding, students. It is the space inside each cell, okay? That means the space between the content text and the border of the cell is nothing but cell padding. If there is no cell padding, text will be very close to the border.

[00:04:11]Table will look crowded, messy when you But if we increase cell padding, more space will be created. Table will look clean and easy to read. Then we have cell spacing, students.

[00:04:24]It is the space between cells, okay? It creates a gap between rows and columns.

[00:04:28]If there is no cell spacing, cells will stick to each other. If we add cell spacing, small gap will appear between the cells. Please try to understand the difference between cell padding and cell spacing. Don't get confused. Cell padding means space inside the cell, like text or border But when we talk about cell spacing, it is space between the cells. So, the difference is most important to understand how spacing works in the tables, okay? Then we have align attribute, which you can see on the screen.

[00:05:01]Align is used to set the position of the table on the web page, okay? Left, table appears on the left side. Center, table appears in center. Right, the table appear appears on the right side. So, this helps in placing the table properly on the page. Then we have BG color attribute, students. BG color is used to change the background color of the table. Background color to change we will be using this attribute. See, here we kept a light blue. So, it will give us light blue background color. So, adding color makes the table more attractive and it helps to highlight the data. That is why we will be using it.

[00:05:37]So, yes, on whole overall, we can say that HTML tables organize the data in rows and columns and attributes help in improving the layout and appearance of the table. Table normal to change general banana we will be using our attributes. I hope you understood.

[00:05:55]Students, if you want in detail explanation answers notes you need to message me on my Instagram. These notes I have made shorter in order to provide you free free explanation on YouTube, but in detail explanation answers are already available in my notes. Just by giving a reading you will be understanding the whole concept. You will be getting what is there in the answer. If you want those notes you can message me on my Instagram. Then we have question number two, define frames, explain the various frames in HTML with examples.

[00:06:26]Students, frames are used to divide a web page into different sections, okay?

[00:06:31]And each section can show a different HTML page. Please understand, instead of showing only one page, we can display multiple pages in a single browser window. For example, one part can show menu, another part can show content. So, both will be visible at the same time. I have different windows you laptop or computer by here but I got that instead of showing only one page, multiple pages can be shown on single browser window, okay? So, how these frames work, students? How they work? First we have like frames are created using frame set.

[00:07:07]This will divide the browser window.

[00:07:09]Then we have frame. It loads a page inside each section, okay? Inside frame we use SRC to give the page name. This is to give the page name. So, each frame will show a separate HTML file. Please understand the structure. Definitely you have to mention this structure. Now let us talk about the types of frames in HTML. We have column frames. Column frames divide the page vertically, okay?

[00:07:36]Vertically means left to right. The page is split into left and right parts. We use c o l s attributes. okay?

[00:07:46]It's going to use example idea of the globe. Left side, okay. Other left side menu chahiye, right side content chahiye, so we will be using this column frame. Both are shown side by side. Okay, upload your happy example. You can just have a look.

[00:08:02]Then we have row frame students. Row frames divide the page horizontally.

[00:08:07]That means the page will be split into top and bottom. We use rows attribute.

[00:08:13]Yeah, attribute can use concept top header bottom make content so one part will appear above and the another will appear below. Upload different some Joe column frames with side by side either a window or either a window castle missile or a speaker or a speaker then we have mixed frame students. What is meant by mixed frames? Mixed frames use both rows and columns together, okay? First the page is divided into rows and then one page is again divided into columns. So basically this will help to create more structured layout students. Top header bottom may split into menu and content.

[00:08:53]It's not header you can some Joe it's not header or beach may niche again parts essay. Okay, I hope you understood mixed frames rows and columns you have to do that again.

[00:09:05]Then we have nested frame students.

[00:09:07]Nested frames means one frame inside another frame nested. It can do something so instead of just dividing once we divide again inside a section.

[00:09:17]So basically this will create more detailed layout students. Some Joe left me full section here right may divided into top and bottom. I get left here some Joe left me it's not section right me again it's not section two parts may divide the header. Okay, so please understand this in one side it remains same and then another side, it is further divided. So, yes, this is about this. I have different yacht color. Uh, if we talk about the important points, frames divide the browser into sections. Each section will show a different page and it is useful for layout and navigation. So, overall students, frames helps to display multiple pages in one screen by dividing the browser into sections.

[00:10:10]Please understand this. Now, let us talk about question number three. What is our question number three? Question number three is define form in HTML, explain the various elements of form and the form controls in HTML. Students, please try to understand this that a form in HTML is used to collect information from users through a web page. Google Sheets upload the camera Google Forms upload the camera.

[00:10:35]They can have a very concept. Whenever you enter details on a website like creating an account, logging in, filling feedback, what you are doing? You are actually using a form. So, form will act like a connection between user and website. Where user will give the data and website will receive it. Websites upload visit Google because such great different websites at the end of the year and I got upload of my details share garden. That is nothing but form.

[00:11:01]You're using form there. How form works, students? You can say work at the forms.

[00:11:07]A form is created using this tag. Okay.

[00:11:09]Inside the form, we add different input fields where the user can enter the data. Okay. And form has two important things.

[00:11:17]It has action where the data will go.

[00:11:20]The second method how the data is sent.

[00:11:22]Okay. So, when user fills the form and when the user clicks submit, the data is sent to the server. What you are doing form elements key to Bella hair form element.

[00:11:35]yeah to form tag I'm guessing this is the main container of the form okay everything like text fields buttons or options so good you tag me place okay that they without form we cannot create a proper form yeah you score a tag to hear form Jackie manta upload Google sheets may they can only not be uploading a number upload college upload a details that they email ID global Google that is nothing but a form where you are giving your information so yeah form that guy use for gay upload Google form and that they feel don't use this you will not be finding or you will not be making the form then we have label students label is used to give a name to the input field for example fields guys they had the name they do email they do password they do I said that I know it will tell the user what they need to enter it also improves clarity and makes form easy to understand students label can be now upload Google my room that that I think yeah information download then we have input elements students this is the most important element we can say it is used to take input from the user different types of input can be created using this tag okay for example text password radio checkbox so one that can create many type of fields we can say input input yeah yeah user can pass the input learning in the then we have text area students tag a day clue text area that I think text area is used when we need long input text okay feedback comments okay suggestions okay upload Google form and that they feel don't use this you will not be finding or you will not be making the form then we have label students label is used to give a name to the input field for example fields guys they had the name they do email they do password they do I said that I know it will tell the user what they need to enter it also improves clarity and makes form easy to understand students label can be now upload Google my room then we have select element students it is used to create a drop down list okay user can choose one option from the list instead of typing as a drop down list now I was getting to say upload Google select upload you select it, the different options are available.

[00:13:36]That is nothing but select element. Then we have options. Students, option is used inside select. Okay, it defines each element in the drop-down list.

[00:13:45]Select the option.

[00:13:49]Now, let us talk about form controls in HTML. Text field is the first one. It is used to enter short text. Like name, city. It will allow only one line input.

[00:14:00]Then we have password field. It is used to enter secret information. Okay, the characters are hidden here. Like it will be shown like dots and stars. After you enter the password, the password dots or stars show. This is mainly used for login. Then we have radio button. It is used when only one option must be selected. Male or female. You can't select both. You can select only one.

[00:14:23]So, if you select one, the other gets automatically unselected. That is nothing but radio button. Check box.

[00:14:29]Check box is used when multiple options can be selected. Hobbies, skills.

[00:14:35]You can select multiple options.

[00:14:37]User can choose more than one option.

[00:14:40]Then we have submit button. It is used to send the form data. When user clicks this button, all the entered data is sent to the server. Then we have reset button. Students, it is used to clear all the data in the form. If user wants to refill the form, this will be helped.

[00:14:57]Then we have button button control.

[00:14:59]Students, what is button control? A general button is used for different actions. Okay, it can be used with scripts to perform special tasks. So, so this is what it is all about. So, HTML forms are used to collect user information. And different elements control help in creating a complete and user-friendly form, we can say. Then we have our question number four, which is write about the structure of HTML and execution of HTML code. Students, HTML structure means the basic layout of a web page. Okay, every web page follows a proper structure, right? So that the browser can understand what to display and how to display. It looks like a format, students, or it looks like a framework in which all the content is arranged.

[00:15:45]Other structure had to browser cannot show the page correctly. The structure is very important. We are having different parts. Let us see one by one.

[00:15:53]First it is HTML declaration. Doc type HTML we can say.

[00:15:58]This is the first line in every HTML document, okay? It tells the browser that this file is an HTML document. Then we have HTML tag. This is the main tag of the entire page. All the content of the web page is written inside this tag.

[00:16:14]You have to write the content in this tag.

[00:16:17]It will show the beginning and the ending of the HTML document. Then we have head section. The name itself is saying that the head section will contain information about the web page, okay? This information is not directly visible on the screen, students. It will include title, links, styles, scripts, and all. So head section will give instructions to the browser.

[00:16:38]Title tag, students. Title is written inside the head section, okay? Head section under here you can write it. It will show the name of the web page on the browser tab. So basically it will help the user to identify which page is open. Then body section, students. This is the most important part we can say.

[00:16:55]Everything that we see on the web page is written inside the body. It may contain images, links, tables, forms, whatever is visible to the user comes under the body section. Now let us talk about the execution. How HTML code is converted into web page. First we have writing the code. First we write HTML code using any text editor, okay?

[00:17:20]Notepad VS code is used to write HTML code. We write tags, the content, and structure in the file. Then we will be saving the file. After writing the code, we save the file with HTML extension. Yeah, yeah, yeah, use them to save this extension. This tells the computer tells the computer that it is an HTML file. Then we have opening the file in browser. Then we open the file using any browser, okay? Like Chrome, Edge, Firefox.

[00:17:52]We will be opening this file. Then parsing and rendering student, the browser will read the code line by line, okay? It will understand each tag and it will convert it into visual form. So this process is called as parsing and rendering. Parsing reading the code, rendering displaying the output. Read and display. Then we have displaying the output students.

[00:18:15]Finally the web page is shown on the screen. We can see text, images, tables, and all other elements which are properly arranged. Arranged. So user can interact with the web page. Please have a look at the important points. So basically HTML structure will organize the web page, okay? And the execution is the process by which the browser will display that web page on the screen, okay?

[00:18:40]We also have one extra question which is HTML tags and types of HTML tags. I will be explaining you this question as well because in case if you get this question in the examination, you should be able to write it. What are HTML tags students? HTML tags are the basic building blocks of a web page. Whatever we see on a web page like text, images, links, tables, everything is created using tags, okay? So basically tags will tell the browser what to display and how to display. And all All tags are written inside angle brackets like this, okay?

[00:19:14]This brackets.

[00:19:15]So, most tags work in pairs. Let us see types of tags, you will be getting a broader idea. First, we have paired tags or we can also say container tags. These tags have both opening and closing tags, okay? Content is written in between them, we can say. So, I will be happy to accept it. Yeah, though. Okay. Starts the tag, this one will start the tag and this will one will end the tag. Whatever is written inside becomes bold students.

[00:19:43]These tags are used when we want to display content between them.

[00:19:46]Then, we have unpaid tags, students.

[00:19:48]What are unpaid tags? These tags do not have a closing tag, okay? They work alone and they do not contain any content. You can see BR is line break, HR is horizontal line. So, these tags are used for a specific purpose, like if we want to move to next line or if we want to add a line, we will be using these unpaid tags. Then, we have nested tags. Nested tags means one tag inside another tag. This is used to create proper structure, okay? This means the text is inside the paragraph and also bold, this example. Then, we have formatting tags. The name itself says that when we want to change the appearance of text, we will be using formatting tags.

[00:20:27]So, then we have structural tags, students.

[00:20:30]It is used to create the basic structure of the web page. So, yes, what are the different types of tags and how they work, everything you have come to know.

[00:20:39]This is the extra question which you need to just give a reading on the screen. HTML tags are used to create and design web pages, we can say. This was the complete explanation of unit number one. How was the explanation? Let me know in the comment section. For notes, message me on my Instagram. Check out our playlist. Join our Telegram channel for more important updates. Playlist link, Telegram link, Instagram link, all links are available in this video description. All the very best. Bye-bye.