What is HTML?
HTML is an acronym for Hypertext Markup Language and is the standard language for documents that have been designed to be displayed in a web browser. You have certainly met HTML in one way or another, as all web pages on the Internet are written using a version of HTML.
HTML (HyperText Markup Language) is the code used to create websites. It tells the web browser how to display text and images on a web page. HTML tags mark the text on a web page in its most basic form. Tags are surrounded by angle brackets (e.g. <HTML> ), and they usually come in pairs, with an opening tag (e.g. <p> and a closing tag e.g. </p>).
How is HTML Structured?
HTML for web pages has two main sections: the head and the body. The head contains information about the page, while the body contains the content. Nested elements are additional HTML tags that surround other text or images.
Here's a basic example of HTML code:
<!DOCTYPE html>
<HTML>
<head>
<title>This is the title of the page</title>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</HTML>
HTML consists of various elements, which mark up different types of text and images. Some of the most common elements include:
Heading Elements: <h1> through <h6>
These elements define the headings of your page. The <h1> tag is the most important and defines the main heading of your page. The <h2> tag is for subheadings, and the <h3> - <h6> tag is used for smaller headings within the body text.
Paragraph Elements: <p>
The <p> element will define your paragraphs of text. Any text that appears between an opening <p> tag and a closing </p> tag defines a paragraph.
Image Elements: <img>
The <img> element is used to insert images into your HTML code. The element is empty, which means it doesn't have a closing tag. To insert an image, you'll need to use the src attribute, which specifies the URL of the image.
Link Elements: <a>
The <a> element is used to create links. The href attribute specifies the URL of the page you want to link to. Links can link to other pages on your website or external websites.
List Elements: <ul>, <ol>, and <li>
The <ul> element creates an unordered lists.
The <ol> element creates ordered lists.
The <li> element will create list items, the individual items within a list.
HTML Attributes
HTML attributes provides more information about an HTML element. In addition, the attributes style the element or manipulate it with JavaScript.
HTML attributes are placed in the opening tag of an HTML element. They always come in pairs, with the attribute's name followed by a value.
Here's an example of an attribute:
<p style="color:red;">This is a red paragraph.</p>
In this example, the style attribute is the color of the paragraph. The value of the style attribute (in this case, "color:red;") tells the web browser how to style the element.
Attributes specify a wide range of information about HTML elements, including:
- The id attribute specifies a unique id for an element.
- The class attribute specifies one or more class names for an element.
- The src attribute specifies the URL of various elements such as images, video, audio, etc.
- Finally, the href attribute specifies the URL of a link.
These are just a few of the most common attributes. There are many more, each with its specific purpose.
How is HTML, CSS and JavaScript related?
HTML, CSS, and JavaScript are all used to create web pages. HTML provides the basic structure of a webpage, CSS is used to style the HTML elements, and JavaScript is used to manipulate the HTML elements and add interactivity.
CSS is used to style the HTML elements. You can use CSS to change the text's color, size, and font and add background colors and images. CSS can also create responsive layouts that adapt to different screen sizes.
JavaScript can manipulate the HTML elements and add interactivity. For instance, you can use JavaScript to create drop-down menus or display a popup window when a user clicks on a link. You can also use JavaScript to validate forms, create animations, and add interactivity to websites.