CSS Display Property

The display CSS property sets whether an element is treated as a block or inline element and the layout used for its children, such as flow layout, grid or flex.

There are many types of display properties that are commonly used in, check all of them carefully, the link is given below:

https://www.w3schools.com/cssref/pr_class_display.asp


Span tag:

The HTML <span> tag is used for grouping and applying styles to inline elements.

There is a difference between the span tag and the div tag. The span tag is used with inline elements whilst the div tag is used with block-level content.

For Example:

HTML:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="styles.css">
    <title>Document</title>
</head>
<body>
    <h3>Hello my name is <span class="name">Junaid</span> and i read in class 10.</h3>
</body>
</html>

CSS:

.name {
    text-decoration: underline;
}

Output:

Hello, my name is Junaid and i read in class 10.

Comments

Post a Comment

Popular Posts