CSS Only Laptop Device Template


Author: jjkaufman
Views Total: 228 views
Official Page: Go to website
Last Update: September 15, 2019
License: MIT

Preview:

CSS Only Laptop Device Template

Description:

A pure CSS laptop mockup/template designed to showcase anything in an ASCII art laptop device.

How to use it:

Import the stylesheet laptop.css into the HTML.

<link href="laptop.css" rel="stylesheet" />

Wrap your design to be showcased in the CSS laptop.

<div class="laptop">
  <img src="https://source.unsplash.com/aK5Dt6L6_hQ/400x300">
</div>

Adjust the laptop size. Possible sizes:

<div class="laptop-sm">
  <img src="https://source.unsplash.com/aK5Dt6L6_hQ/400x300">
</div>
<div class="laptop-lg">
  <img src="https://source.unsplash.com/aK5Dt6L6_hQ/400x300">
</div>

See also  Extra Styles/Colors For Bootstrap 4 Buttons - button.css

Leave a Reply

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