The :last-child selector matches every element that is the last child of its parent.
Code:-
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
p:last-child:after {
content: "¾6";
/* Here comes the ivy leaf */
font-size: 150%;
/* Makes the leaf larger than the normal text */
padding-left: 10px;
/* Leaf won't clash with the last letter of the text */
float: right;
/* Horizontal position is set to the right edge of the column */
position: relative;
/* This is just an homage to Albert Einstein */
top: 15px/*Vertical distance from the last line of text */
}
</style>
</head>
<body>
<p>Paragraph 1</p>
<p>Paragraph 2</p>
<p>Paragraph 3</p>
<p>Paragraph 4</p>
<p>Paragraph 5</p>
<p>Paragraph 6</p>
</body>
</html>
Css:- The last child
Reviewed by Network security
on
May 23, 2019
Rating:
Goods works
ReplyDelete