YogeshChauhan.com

The :last-of-type selector

September 23, 2020

The :last-of-type selects the element that is the last child, of a particular type, of its parent.

For e.g., in the code below the css selects the last paragraph and the last heading h2.


<!DOCTYPE html>
<html>
<head>
<style> 
p:last-of-type {
 background: #C5CAE9;
}

h2:last-of-type {
 background: #CDDC39;
}
</style>
</head>

<body>

<div class="container">
 <p>1st paragraph</p>
 <p>2bd paragraph</p>
 <p>last paragraph</p>
 <h1>1st Heading</h1>
 <h2>1st heading</h2>
 <h2>last heading</h2>
</div>

</body>
</html>

 

dreamhost

Most Read

#1 How to check if radio button is checked or not using JavaScript? #2 Solution to “TypeError: ‘x’ is not iterable” in Angular 9 #3 How to uninstall Cocoapods from the Mac OS? #4 How to Use SQL MAX() Function with Dates? #5 How to add Read More Read Less Button using JavaScript? #6 PHP Login System using PDO Part 1: Create User Registration Page

Recently Posted

Apr 7 Solution for “Yarn build: Failed because of a stylelint error” Apr 7 Make sure your links have descriptive text Apr 7 How to add Laravel to WordPress using Sage theme (and install Tailwind CSS)? Apr 2 How to create a sidebar using pure CSS? Apr 1 How to switch dark and light themes using pure CSS? Apr 1 How to calculate elapsed time in JavaScript?

You might also like these

How to auto-resize textarea based on text input using JavaScript or jQuery?JavaScriptHow to scroll contents of HTML body horizontally and vertically using JavaScript?JavaScriptHow to add CurrencyPipe in TypeScript file in Angular 9 Project?AngularWhat is the correct way to enqueue multiple CSS files in WordPress?WordPressIs there a way to do a FULL OUTER JOIN in MySQL?SQL/MySQLThe Difference Between the echo and print Commands in PHPPHPKanban vs Scrum: The two frameworks of agile principlesMiscHow to check if the element exists using JavaScript and jQuery?JavaScriptHow to Create a Backup From Any Database in SQL?SQL/MySQLThe Complete Basic Explanation of PHP SessionsPHPFull and Partial CUBE in Postgres with ExamplesPostgresWhy does MOV matter in IT or any kind of projects?Misc