A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.
One-line version to paste in your DevTools
Use $$
if your browser aliases it:
~ 108 byte version
<!doctype html> | |
<html ng-app="project"> | |
<head> | |
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.js" ></script> | |
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular-route.js"></script> | |
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet" > | |
<script src="app.js"></script> | |
</head> | |
<body> |
<div id="wrapper"> | |
<div id="left"> | |
<div id="signin"> | |
<div class="logo"> | |
<img src="https://image.ibb.co/hW1YHq/login-logo.png" alt="Sluralpright" /> | |
</div> | |
<form> | |
<div> | |
<label>Email or username</label> | |
<input type="text" class="text-input" /> |
Basic principles of API Fetch.
Website For Learn - https://developer.mozilla.org/en/docs/Web/API/Fetch_API/Using_Fetch
<div class="container"> | |
<h1>Start</h1> | |
<img src="https://graph.facebook.com/freakout.jq/picture?type=small" width="50px" class="prof"/> | |
<div class="right"> | |
<h2>Martabak</h2> | |
<p>Gosong</p> | |
</div> | |
<div class='spacer'> | |
<a href="javascript://" class='wide blue'> |
<section class="header"> | |
<!-- | |
<div class="window__actions"> | |
<i class="ion-record red"></i> | |
<i class="ion-record yellow"></i> | |
<i class="ion-record green"></i> | |
</div> | |
--> | |
A Pen by Patrick BIYAGA on CodePen.
A Pen by Patrick BIYAGA on CodePen.