Simple personal profile

Size
2,856 Kb
Views
44,528

How do I make an simple personal profile?

I guess this doesn't need an explanation?. What is a simple personal profile? How do you make a simple personal profile? This script and codes were developed by Miro Karilahti on 07 July 2022, Thursday.

Simple personal profile Previews

Simple personal profile - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Simple personal profile</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div class="profile"> <img class="profile-pic" src="http://lorempixel.com/g/280/280/people/1/" /> <div class="text-container"> <h1> Julie Daniels </h1> <div class="title"> Software Developer </div> </div>
</div> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
</body>
</html>

Simple personal profile - Script Codes CSS Codes

@import url("//fonts.googleapis.com/css?family=Muli:300");
html, body, div, img, h1 { margin: 0; padding: 0; outline: 0;
}
body { background: #00838f;
}
.profile { width: 600px; height: 240px; position: fixed; top: 0; right: 0; bottom: 0; left: 0; margin: auto; font-family: "Muli", sans-serif; color: #e0f7fa;
}
.profile .profile-pic { width: 240px; height: 240px; float: left; border-radius: 50% 0; box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}
.profile .text-container { width: 360px; margin-left: 256px; padding-top: 68.57143px; text-align: center; text-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
}
.profile h1 { margin-bottom: 34.28571px; font-weight: 400; font-size: 2.8em; line-height: 1em; letter-spacing: -1px; text-transform: uppercase;
}
.profile .title { font-size: 1.4em; letter-spacing: 1px;
}
Simple personal profile - Script Codes
Simple personal profile - Script Codes
Home Page Home
Developer Miro Karilahti
Username miroot
Uploaded July 07, 2022
Rating 3
Size 2,856 Kb
Views 44,528
Do you need developer help for Simple personal profile?

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!

Miro Karilahti (miroot) Script Codes
Create amazing blog posts 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!