Explore the significance of HTML in urdu / hindi. Discover the fundamentals of Hypertext Markup Language and its pivotal role in shaping immersive digital experiences. Join us on this enlightening journey into the heart of modern web creation.
What you will learn
- What is HTML
- Syntax & Basics of HTML
- A detailed explanation of important HTML Elements
- Using CSS with HTML
- HTML & CSS Basic Layouts
- HTML & CSS Complex Layouts
- Responsive Layouts
- HTML Forms
- CSS3 Animations
- CSS3 Transformations & Transitions
What is HTML introduction in urdu / hindi 2023
HTML, a markup language, enables developers to create structured documents that are displayed on web browsers. It employs a system of tags to define and organize various elements, such as headings, paragraphs, images, links, and more. These tags help browsers interpret and render content, ensuring a consistent and accessible user experience across devices.
lecture 1
Structure
Every HTML document follows a basic structure. It begins with a the <html> element, which contains two main sections: <head> and <body>. The <head> section provides metadata and links to external resources, while the <body> section contains the visible content of the webpage.
Tags and Elements
HTML offers a wide array of tags and elements, each serving a unique purpose. Some common ones include:
- <h1> to <h6>: Headings of varying sizes.
- <p>: Paragraphs of text.
- <a>: Hyperlinks, connecting one webpage to another.
- <img>: Embedding images.
- <ul> and <ol>: Unordered and ordered lists.
- <li>: List items.
- <div> and <span>: Containers for grouping and styling content.
Creating a Basic HTML Document
To create a simple HTML document, follow these steps:
- Open a text editor.
- Begin with the declaration:
<html>. - Structure the document within the <html> tags, including the <head> and <body> sections.
- Add content using various tags and elements.
- Save the file with a
.htmlextension. - Open the HTML file in a web browser to see the result.
HTML serves as the cornerstone of web development, enabling the creation of visually appealing and functional webpages. By understanding its fundamental concepts, tags, and elements, developers can harness the power of HTML to build dynamic and engaging online experiences. As technology continues to advance, HTML remains an essential skill for anyone venturing into the world of web development in 2023 and beyond.
lecture 2
HTML Headings
HTML headings are defined with the <h1> to <h6> tags.
<h1> defines the most important heading. <h6> defines the least important heading.
program code:
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
lecture 3
HTML <img> Tag
The <img> tag is used to embed an image in an HTML page.
Images are not technically inserted into a web page; images are linked to web pages. The <img> tag creates a holding space for the referenced image.
The <img> tag has two required attributes:
- src – Specifies the path to the image
- alt – Specifies an alternate text for the image, if the image for some reason cannot be displayed
display text from another website
The <a> tag defines a hyperlink, which is used to link from one page to another.
<!DOCTYPE html>
<html>
<body>​
<h1>Add a hyperlink to an image</h1>
​<p><a href=”https://articlebase.pk“>
<img src=”https://articlebase.pk/wp-content/uploads/2023/08/Slide2-1024×576.jpg” alt=”artificial intelligence course in pakistan” width=”500″ height=”400″></a></p>​
</body>
</html>
horizontal and vertical images
<img src=”https://articlebase.pk/wp-content/uploads/2023/08/Slide2-1024×576.jpg” alt=”artificial intelligence course in pakistan” width=”500″ height=”400″ align:”left”></a></p>
lecture 4
HTML Attributes
In this in-depth article, we dive into the world of HTML attributes and explore their significance in web development. HTML attributes play a crucial role in enhancing the functionality and interactivity of your web pages. Whether you’re a beginner or an experienced developer, understanding how to leverage attributes effectively is essential.
The <a> tag defines a hyperlink. The href attribute specifies the URL of the page the link goes to:
HTML Formatting Elements
Formatting elements were designed to display special types of text:
<b>– Bold text<strong>– Important text<i>– Italic text<em>– Emphasized text<mark>– Marked text<small>– Smaller text<del>– Deleted text<ins>– Inserted text<sub>– Subscript text<sup>– Superscript text
In this tutorial, we cover the fundamentals of HTML attributes, including their syntax and usage. We explore various commonly used attributes, such as `href`, `src`, `alt`, and `class`, and explain how they impact the behavior and appearance of HTML elements. Additionally, we discuss best practices for choosing appropriate attribute values and provide tips for optimizing your code.
Join us as we demonstrate practical examples and share valuable insights to help you harness the power of HTML attributes. By the end of this video, you’ll have a solid understanding of how to utilize attributes to create dynamic and engaging web pages.
lecture 5
HTML Table
HTML tables allow web developers to arrange data into rows and columns.
Common HTML Table Tags
Other tags include:
<tr>– represents rows<td>– used to create data cells<th>– used to add table headings<caption>– used to insert captions<thead>– adds a separate header to the table<tbody>– shows the main body of the table<tfoot>– creates a separate footer for the table
HTML Table Syntax
<table>
<tr>
<th>table 1</th>
<th>First Name</th>
<th>Last Name</th>
<th>Email Address</th>
</tr>
<tr>
<td>Mehak</td>
<td>Alamgir</td>
<td>mehak94@mail.com</td>
</tr>
</table>
for caption : <caption>Free Coding Resources</caption>
<thead> - provides a separate haeder for the table
<tbody> - conatins main content of the table
<tfoot> - creates a separete footer for the table
