HTML unit 1.2
Write a 1.Quotations,2.comments,3.Images,4.Blocks and class
1.Quotations
In HTML, quotes are used to define the value
of an attribute within an HTML element. Quotations can either be single quotes (') or double quotes ("), and must be used to surround the value of an
attribute.
Example:code:01
<!DOCTYPE html>
<html>
<body>
<p>html quotations notes visit website:
<a href="https://slk-computers.blogspot.com">click me</a>
</p>
<blockquote >
In HTML, quotes are used to define the value of an attribute within an HTML element. Quotations can either be single quotes (') or double quotes ("), and must be used to surround the value of an attribute.
</blockquote>
</body>
</html>
Output:image-01
2.comments
In HTML, comments are
used to add annotations or notes to the HTML code that are not displayed in the
web page. HTML comments start with <!-- and end with -->.
For example: code:02
<!DOCTYPE html>
<html>
<body>
<!-- This is an HTML comment -->
<p>This text will be displayed on the web page</p>
<!-- This is another HTML comment -->
</body>
</html>
Output:-image-02
HTML comments are useful for adding explanations or notes to the code, temporarily hiding parts of the code, or for debugging purposes. They are ignored by the browser and are not shown in the final rendered web page.
3.Images
In HTML, images are added using the <img> element. The src attribute is used to specify the source URL of the image, and the alt attribute is used to provide a text description of the image, which is displayed if the image cannot be loaded. For example:
<img src="https://www.example.com/image.jpg" alt="Example Image">
Program:-code:03
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>images</title>
</head>
<body>
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXPIS8C2oNXxZh6GKeNqrjCRdtsS-0Jk4tHqrT7uevXrzbl5vsFCgy7wkbrhY673OVqHx-Y11JYzDcPJiH5Dc3I_vc2EC8q1cXWznyBykMQnijZGYDYF07KMAMdGXoPVmI69CwEAq1QAk5UhM-R2c9KxEanvBVB4Q1gLqk2dHcjTPIB6dl1tte2m0TbA/s628/ibm-new-logo.jpgwidth="75" height="100"><br>
<a href="https://drive.google.com/file/d/1dW9GQR-joo2_nTUftZ0-ycoAkV-LeHi0/view?usp=sharing">click me download</a>
</body>
</html>
output:-image-03
4.Blocks and class
In HTML, a block-level element creates a rectangular block of content that is set apart from other content, typically on its own line. Examples of block-level elements include <div>, <p>, <h1>, <form>, <header>, etc.
A class in HTML is a way to define a specific style for a group of elements, using CSS. The class is defined using the class attribute, and can be applied to one or multiple elements. The CSS style is defined using a "." followed by the class name in the CSS file or within a <style> tag. The same class can be used multiple times on a page, and each element with that class will have the same styles applied to it.
For example: code:04
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>BLocks and class</title>+
<style>
.highlight {
background-color: yellow;
}
</style>
</head>
<body>
<p class="highlight">This is a highlighted paragraph.</p>
<p>This is a normal paragraph.</p>
</body>
</html>
Output:-image-04
Color:-
In HTML and CSS, color refers to the visual appearance of text, background, and other elements on a web page. Color can be specified using a variety of methods, including color names (e.g. "red"), RGB values (e.g. "rgb(255, 0, 0)"), hexadecimal values (e.g. "#FF0000"), and HSL values (e.g. "hsl(0, 100%, 50%)").
CSS provides several properties for controlling the color of elements, including color for text color, background-color for background color, and border-color for the color of an element's border.
For example:code:05
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Color</title>
<style>
p {
color: blue;
background-color: yellow;
border: 1px solid red;
}
</style>
</head>
<body>
<p>This is a blue paragraph with a yellow background and a red border.</p>
</body>
</html>
output:-image-05
Comments
Post a Comment