Dynamic Styles in HTML

I was working with Stylish and came across and article that <DIV> tags should be avoided. Stylish uses IDs and CLASSes to change the look & feel Why avoid these elements? A second thought is how can one use buttons to change the look and feel of a page by applying different styles? Do you still need javascript? Here are my notes …

The purpose of this project is to make specific sites, particularly those that are now a bit old and thus cluttered and hard to read better. This site shows you what a site would have looked like back in the day.

Ideally, I put a button on https://test.davelevy.info which switches between the native html/css and the stylish sheet! I think LRD is beyond stylish, but we might have another look at the new nwn vault.

What hangs this page together is the use of ID and CLASS rules. (I suppose I agree that IDs are redundant since one doesn’t a unique rule, one can have a rule that is only used once.

  1. https://levelup.gitconnected.com/death-to-div-creating-a-better-html-4775793270fc , “not only was I able to create an entire webpage without using any divs, but I was also able to shrink the size of the site, style everything with a proper build pipeline, and create the smallest built project that I’ve ever made”
  2. https://twitter.com/jamonholmgren/status/1333104286872453120 , the inspiration
  3. https://anubisthejackle.github.io/custom-html-tags/ , the outcome

Changing Styles

  1. https://www.w3schools.com/howto/howto_css_switch.asp
  2. https://stackoverflow.com/questions/309081/how-do-you-create-a-toggle-button

How to change the applied CSS when the button is used?

  1. https://www.thesitewizard.com/javascripts/change-style-sheets.shtml

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.