Skip to main content
CSS-Tricks
  • Articles
  • Alamanac
  • Guides
  • Videos
  • Books
  • Newsletter
Search

Articles Tagged
classes

5 Articles
{
,

}
Direct link to the article How to Cycle Through Classes on an HTML Element
classes classlist JavaScript

How to Cycle Through Classes on an HTML Element

Say you have three HTML classes, and a DOM element should only have one of them at a time:

<div class="state-1"</div<div class="state-2"</div<div class="state-3"</div

Now your job is to rotate them. That is, cycle through classes …

Avatar of Chris Coyier
Chris Coyier on Jan 26, 2022
Direct link to the article Could Grouping HTML Classes Make Them More Readable?
classes HTML selectors semantics

Could Grouping HTML Classes Make Them More Readable?

You can have multiple classes on an HTML element:

<div class="module p-2"></div>

Nothing incorrect or invalid there at all. It has two classes. In CSS, both of these will apply:

.module { }
.p-2 { }
const div = document.querySelector("div");
…
Avatar of Chris Coyier
Chris Coyier on Apr 22, 2019
Direct link to the article Random Interesting Facts on HTML/SVG usage
accessibility classes data HTML SVG

Random Interesting Facts on HTML/SVG usage

Last time, we saw how the average web page looks like using data from about 8 million websites. That’s a lot of data, and we’ve been continuing to sift through it. We’re back again this time to showcase some …

Avatar of Catalin Rosu
Catalin Rosu on Nov 25, 2016
Direct link to the article (To use or not-to-use) Classes
bem classes semantics

(To use or not-to-use) Classes

Love me some blog debates! Papa Bear, Mama Bear, Baby Bear.…

Avatar of Chris Coyier
Chris Coyier on May 20, 2016
Direct link to the article Templates are easy to change. Content usually isn’t.
classes HTML

Templates are easy to change. Content usually isn’t.

There are two kinds of HTML:

  1. HTML that makes up templates
  2. HTML that is content

I feel like some discussions about HTML are clouded by not making this distinction.…

Avatar of Chris Coyier
Chris Coyier on Mar 4, 2016

CSS-Tricks is powered by DigitalOcean.

Keep up to date on web dev

with our hand-crafted newsletter

DigitalOcean
  • About DO
  • Cloudways hosting
  • Legal stuff
  • Get free credit!
CSS-Tricks
  • Write for us!
  • Advertise with us
  • Contact us
Social
  • RSS Feeds
  • CodePen
  • Mastodon
  • X
Back to Top