Skip to content

Latest commit

 

History

History
43 lines (29 loc) · 1.05 KB

README.md

File metadata and controls

43 lines (29 loc) · 1.05 KB

classbxr

This project adds a box and the class names around elements for easier debugging and visualization of the HTML/CSS structure.

classbxr in action

How to use it

It's easy, just load classbxr CDN on your HTML <head> and add the .classbxr on your <body> or any other element.

1. Load classbxr CDN

<!DOCTYPE html>
<html>
  <head>
    ...
    <link rel="stylesheet" href="https://cdn.rawgit.com/srambach/classbxr/5456df40/css/classbxr.css">
  </head>
  ...

2. Add classbxr class to the body

<body class="classbxr">

3. Enjoy!

Contribute to classbxr

You can help improve classbxr by reporting an issue or sending a PR.

To build the project locally:

  1. Fork and clone this repo.
  2. If you don't have nodejs installed, go ahead and install it.
  3. Once inside your folder run npm install
  4. Now run gulp

A browser window will open with the test page on http://localhost:3000/.

Edit the classbxr.scss and never the css directly.