This project adds a box and the class names around elements for easier debugging and visualization of the HTML/CSS structure.
It's easy, just load classbxr CDN on your HTML <head> and add the .classbxr on your <body> or any other element.
<!DOCTYPE html>
<html>
<head>
...
<link rel="stylesheet" href="https://cdn.rawgit.com/srambach/classbxr/5456df40/css/classbxr.css">
</head>
...
<body class="classbxr">
You can help improve classbxr by reporting an issue or sending a PR.
To build the project locally:
- Fork and clone this repo.
- If you don't have nodejs installed, go ahead and install it.
- Once inside your folder run
npm install - 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.