Box v0.1

Developer
Size
2,187 Kb
Views
22,264

How do I make an box v0.1?

A plain, simple and good looking box/widget.. What is a box v0.1? How do you make a box v0.1? This script and codes were developed by Daniel on 04 September 2022, Sunday.

Box v0.1 Previews

Box v0.1 - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Box v0.1</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <!-- SERVICE BOX v.01 -->
<div class="col-1-4 service"> Box, ex. 1 <a href="#" title="title"> <div class="module" id="titleid"> <p> <img style="-webkit-user-select: none;" src="http://dummyimage.com/300x200/ffffff/2b2b2b.png&amp;text=picture" > </p> <h2>Service title</h2> <p> Paragraphed section for the service description. A short but informative description about the service. </p> <p></p> </div> </a>
</div>
<div class="col-1-4 service"> Box, ex. 2 <a href="#" title="title"> <div class="module" id="titleid"> <h2>Service title</h2> <p> <img style="-webkit-user-select: none;" src="http://dummyimage.com/300x200/ffffff/2b2b2b.png&amp;text=picture" > </p> <p> Paragraphed section for the service description. A short but informative description about the service. </p> <p></p> </div> </a>
</div> <script src="js/index.js"></script>
</body>
</html>

Box v0.1 - Script Codes CSS Codes

body { font:100%/1.6em helvetica,"helvetica nue",arial,san-serif;background:grey;
}
png, img{width:100%;height:auto;}
a, a:hover {text-decoration:none;}
.module { padding: 1.25em; }
.col-1-4{width:300px;float:left;margin:1%;}
.service { margin-bottom: 1.25em; min-height:200px;height:auto;
}
.service a h2 { color: rgb(80, 80, 80); font:400; margin: 0px; padding-bottom: 0.25em; border-bottom: 4px solid #cfcfcf;
}
.service a .module { color: rgb(80, 80, 80); margin-bottom: 1em; cursor: pointer;
}
.service a .module:first-child { margin: 0px; }
.service a .module:after { content: "explore"; color: rgb(255, 255, 255); padding: 8px 14px;
}
.service a #titleid.module { background: none repeat scroll 0% 0% rgb(220, 220, 220); }
.service a #titleid.module:after { background: none repeat scroll 0% 0% rgb(180, 180, 180); } .service a #titleid.module:hover:after { background: none repeat scroll 0% 0% rgb(160, 160, 160); }

Box v0.1 - Script Codes JS Codes

/*
Examples of simple and easy boxes,
but good looking
*/
Box v0.1 - Script Codes
Box v0.1 - Script Codes
Home Page Home
Developer Daniel
Username deeman
Uploaded September 04, 2022
Rating 3
Size 2,187 Kb
Views 22,264
Do you need developer help for Box v0.1?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Daniel (deeman) Script Codes
Create amazing web content with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!