Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!--
- ♥ hi there, friendo! thanks for using my code! the stoof is fairly self explanatory and should be easy to edit (i'm not that smart so i don't want to make my codes rocket science AKIGHYSIDG). it is required to keep the credit otherwise you are stealing my code and i expect to be credited for my mediocre creation, thankyouverymuch. have fun and do something cool! ♥
- -->
- <!DOCTYPE html>
- <html>
- <link href="https://fonts.googleapis.com/css2?family=Orbitron&display=swap" rel="stylesheet">
- <style>
- .bg{
- background:url('https://t3.ftcdn.net/jpg/03/07/88/64/360_F_307886432_FbDT1fR3JwoQv1oaQdyaWNFBpiJE6w0C.jpg');
- width:700px;
- height:450px;
- object-fit:cover;
- font-size:12px;
- font-family:'times';
- padding:75px;
- }
- .box1{
- background:#1A374D;
- width:225px;
- height:275px;
- padding:20px;
- opacity:90%;
- box-shadow: #fff 1px 1px 5px 3px;
- }
- .row:after {
- content: "";
- display: table;
- clear: both;
- }
- .stats1 {
- float: left;
- width:60%;
- }
- .stats2{
- float:right;
- width:40%;
- }
- .trait{
- background:#1A374D;
- padding:3px;
- font-size:13px;
- text-align:center;
- text-transform:lowercase;
- color:#fff;
- }
- </style>
- <body>
- <div class="bg">
- <div style="width:700px;height:475px;text-align:justify;overflow:hidden;margin-top:-50px;">
- <!-- PAGE ONE -->
- <a name="1">
- <div style="width:650px;height:475px;padding:20px;font-size:12px;overflow:auto;scrollbar-width:0px;">
- <center><div class="box1"style="margin-top:75px">
- <img src="https://fontmeme.com/permalink/220706/b55042f8adb42c54f212339d54112264.png"style="width:230px;margin-top:100px">
- <br><br>
- <div style="background:#fff;padding:5px;width:150px;height:10px;font-size:15px;box-shadow: #fff 1px 1px 3px 3px;font-family:'arial'"><b>
- ********</b></div>
- <br>
- <a href="#2" style="background:#fff;opacity:80%;padding:5px;width:;height:10px;font-size:10px;box-shadow: #fff 1px 1px 3px 3px;display:inline-block;text-decoration:none;font-family:'Orbitron', sans-serif;color:#1A374D;text-align:center;">submit</a>
- </div>
- </center>
- </div></a>
- <!-- PAGE TWO -->
- <a name="2">
- <div style="width:650px;height:475px;padding:20px;font-size:12px;overflow:auto;scrollbar-width:0px;color:#fff">
- <div style="background:#1A374D;width:500px;height:30px;padding:10px;opacity:90%;box-shadow: #fff 1px 1px 5px 3px;">
- <img src="https://fontmeme.com/permalink/220706/1d8aa374c9d25cb0873f5f87d990abb4.png"style="width:400px;margin-top:3px">
- </div>
- <div style="margin-left:540px;margin-top:-50px">
- <img src="https://i.ibb.co/yFrHbr5/2159-B498-E928-4-DA3-96-A3-32-CEF42-CA151.png"style="width:50px;height:50px">
- </div>
- <br>
- <div style="width:250px;height:15px;margin-left:120px;padding:5px;font-size:8px;color:#fff;font-family:'Orbitron', sans-serif; border:1px solid #ff0000">
- <center>FLAGGED: Dangerous individual, approach with caution.
- </center>
- </div><br><br>
- <img src="https://i.pinimg.com/564x/9b/6d/b4/9b6db463c7e6ca1bf66716e474e1fca9.jpg"style="width:200px;height:300px;object-fit:cover;box-shadow: #fff 1px 1px 5px 3px;margin-top:15px;">
- <div style="margin-left:250px;margin-top:-300px">
- <a href="#1" style="background:#fff;opacity:80%;padding:5px;width:25px;height:25px;font-size:12px;box-shadow: #fff 1px 1px 3px 3px;display:inline-block;text-decoration:none;font-family:'Orbitron', sans-serif;color:#1A374D;text-align:center;"><div style="margin-top:5px">
- <b>H</b>
- </div></a>
- <br><br>
- <a href="#3" style="background:#fff;opacity:80%;padding:5px;width:25px;height:25px;font-size:12px;box-shadow: #fff 1px 1px 3px 3px;display:inline-block;text-decoration:none;font-family:'Orbitron', sans-serif;color:#1A374D;text-align:center;"><div style="margin-top:5px">
- <b>1</b>
- </div></a>
- <br><br>
- <a href="#4" style="background:#fff;opacity:80%;padding:5px;width:25px;height:25px;font-size:12px;box-shadow: #fff 1px 1px 3px 3px;display:inline-block;text-decoration:none;font-family:'Orbitron', sans-serif;color:#1A374D;text-align:center;"><div style="margin-top:5px">
- <b>2</b>
- </div></a>
- <br><br>
- <a href="#5" style="background:#fff;opacity:80%;padding:5px;width:25px;height:25px;font-size:12px;box-shadow: #fff 1px 1px 3px 3px;display:inline-block;text-decoration:none;font-family:'Orbitron', sans-serif;color:#1A374D;text-align:center;"><div style="margin-top:5px">
- <b>3</b>
- </div></a>
- <br><br>
- <a href="#6" style="background:#fff;opacity:80%;padding:5px;width:25px;height:25px;font-size:12px;box-shadow: #fff 1px 1px 3px 3px;display:inline-block;text-decoration:none;font-family:'Orbitron', sans-serif;color:#1A374D;text-align:center;"><div style="margin-top:5px">
- <b>4</b>
- </div></a>
- <br><br>
- <a href="#7" style="background:#fff;opacity:80%;padding:5px;width:25px;height:25px;font-size:12px;box-shadow: #fff 1px 1px 3px 3px;display:inline-block;text-decoration:none;font-family:'Orbitron', sans-serif;color:#1A374D;text-align:center;"><div style="margin-top:5px">
- <b>5</b>
- </div></a>
- </div>
- <div style="margin-left:335px;margin-top:-290px;background:#fff;opacity:80%;padding:20px;width:290px;height:265px;box-shadow: #fff 1px 1px 3px 3px;">
- <div style="width:290px;height:265px;text-align:justify;overflow:hidden;">
- <!-- PAGE THREE -->
- <a name="3">
- <div style="width:280px;height:250px;padding:20px;font-size:12px;overflow:auto;scrollbar-width:0px;color:#000;margin-left:-10px">
- <div class="row">
- <div class="stats1">
- <b>name →</b> info <br>
- <b>nickname(s) →</b> info<br><br>
- <b>age (years old) →</b> info <br>
- <b>birthdate →</b> info<br>
- <b>birthplace →</b> info<br>
- <b>current residence →</b> info<br>
- <b>occupation →</b> info<br><br>
- <b>orientation →</b> info <br>
- <b>relationship status →</b> info<br>
- <b>partner name →</b> info <br><br>
- <b>clan/house/whatevs →</b> info<br>
- <b>origin/bloodline →</b> info<br>
- <b>extra stat →</b> info<br>
- <b>extra stat →</b> info
- </div>
- <div class="stats2">
- <img src="https://i.pinimg.com/564x/50/b0/42/50b042b0d5481e48920e388d86af56c8.jpg"style="width:100px;height:100px;box-shadow: #1A374D 1px 1px 3px 3px;">
- <br><br><br><br>
- <img src="https://64.media.tumblr.com/3696d9229d1c88c9792a0b3bf2ea38dd/d629514d4270f3d9-3b/s540x810/00c7152bda6bd2515e6b5b3d99db86b22ec01000.jpg"style="width:100px;height:100px;box-shadow: #1A374D 1px 1px 3px 3px;">
- </div>
- </div>
- <br><br>
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam interdum justo in lacinia dignissim. Phasellus ornare porttitor convallis. Vestibulum porta id orci eu vehicula. Curabitur sed faucibus ligula. Etiam pharetra sed quam in imperdiet. Curabitur in augue quis tellus tempor eleifend ut eu ante. Sed porttitor sem nunc, eu viverra nunc molestie eget.
- <br><br>
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam interdum justo in lacinia dignissim. Phasellus ornare porttitor convallis. Vestibulum porta id orci eu vehicula. Curabitur sed faucibus ligula. Etiam pharetra sed quam in imperdiet. Curabitur in augue quis tellus tempor eleifend ut eu ante. Sed porttitor sem nunc, eu viverra nunc molestie eget.
- <br><br>
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam interdum justo in lacinia dignissim. Phasellus ornare porttitor convallis. Vestibulum porta id orci eu vehicula. Curabitur sed faucibus ligula. Etiam pharetra sed quam in imperdiet. Curabitur in augue quis tellus tempor eleifend ut eu ante. Sed porttitor sem nunc, eu viverra nunc molestie eget.
- <br><br><br><br>
- </div></a>
- <!-- PAGE FOUR -->
- <a name="4">
- <div style="width:280px;height:250px;padding:20px;font-size:12px;overflow:auto;scrollbar-width:0px;color:#000;margin-left:-10px">
- <center style="text-align:left">
- <div style="background:#eee;width:300px;margin:7px 0;">
- <div class="trait" style="width:65%">
- trait → 65%
- </div>
- </div>
- <div style="background:#eee;width:300px;margin:7px 0;">
- <div class="trait" style="width:92%">
- trait → 92%
- </div>
- </div>
- <div style="background:#eee;width:300px;margin:7px 0;">
- <div class="trait" style="width:41%">
- trait → 41%
- </div>
- </div>
- <div style="background:#eee;width:300px;margin:7px 0;">
- <div class="trait" style="width:78%">
- trait → 78%
- </div>
- </div>
- </center>
- <br><br>
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur viverra, magna nec molestie laoreet, nibh sem condimentum odio, non iaculis urna elit vitae urna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Praesent non arcu at dolor blandit aliquet. In scelerisque gravida pretium. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Proin lacinia velit lectus, sollicitudin consectetur ex vestibulum ut. Etiam congue, libero ut convallis fringilla, enim arcu congue lectus, quis dictum mi tortor eget nibh. Nullam non magna ac nunc tincidunt gravida nec id quam. Morbi non mauris vel risus scelerisque accumsan. Aliquam et augue quis nibh pellentesque consectetur et dictum quam. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. <br><br>
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur viverra, magna nec molestie laoreet, nibh sem condimentum odio, non iaculis urna elit vitae urna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Praesent non arcu at dolor blandit aliquet. In scelerisque gravida pretium. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Proin lacinia velit lectus, sollicitudin consectetur ex vestibulum ut. Etiam congue, libero ut convallis fringilla, enim arcu congue lectus, quis dictum mi tortor eget nibh. Nullam non magna ac nunc tincidunt gravida nec id quam. Morbi non mauris vel risus scelerisque accumsan. Aliquam et augue quis nibh pellentesque consectetur et dictum quam. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
- <br><br><br><br>
- </div></a>
- <!-- PAGE FIVE -->
- <a name="5">
- <div style="width:280px;height:250px;padding:20px;font-size:12px;overflow:auto;scrollbar-width:0px;color:#000;margin-left:-10px">
- <center>
- <img src="IMG"style="height:100px;width:100px">
- <img src="IMG"style="height:100px;width:100px">
- <br>
- <img src="IMG"style="height:100px;width:100px">
- <img src="IMG"style="height:100px;width:100px">
- <br>
- <img src="IMG"style="height:100px;width:100px">
- <img src="IMG"style="height:100px;width:100px">
- <br>
- <img src="IMG"style="height:100px;width:100px">
- <img src="IMG"style="height:100px;width:100px">
- <br>
- <img src="IMG"style="height:100px;width:100px">
- <img src="IMG"style="height:100px;width:100px">
- <br>
- <img src="IMG"style="height:100px;width:100px">
- <img src="IMG"style="height:100px;width:100px">
- </center>
- <br><br><br><br>
- </div></a>
- <!-- PAGE SIX -->
- <a name="6">
- <div style="width:280px;height:250px;padding:20px;font-size:12px;overflow:auto;scrollbar-width:0px;color:#000;margin-left:-10px">
- <!-- BEGIN RELATION -->
- <center>
- <div style="width:200px;padding:20px;border:1px solid #1A374D;text-align:left;">
- <p style="width:190px;">
- <b style="font-size:16px">Character Name</b><br>
- <b><i>Relation Type</i></b>
- <br><br>
- "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam interdum justo in lacinia dignissim. Phasellus ornare porttitor convallis. Vestibulum porta id orci eu vehicula."<br>
- <center><img src="https://pm1.narvii.com/6692/f6ac5582990ea5fdc0f73f162c31fa0f9c854ecc_hq.jpg"style="width:100px;height:100px;object-fit:cover;border-radius:50%;margin-top:25px;">
- </center>
- </p>
- </div>
- </center>
- <br><br><br><br>
- </div></a>
- <!-- PAGE SEVEN -->
- <a name="7">
- <div style="width:280px;height:250px;padding:20px;font-size:12px;overflow:auto;scrollbar-width:0px;color:#000;margin-left:-10px">
- <!--BEGIN SONG-->
- <div style="width:240px;border: solid 1px #1A374D;padding:15px;text-align:left;font-size:12px">
- <center><b style="color:#1A374D">Song Name</b><br>
- <i>artist</i></center>
- <br><br>
- lyrics can go here! Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam interdum justo in lacinia dignissim. Phasellus ornare porttitor convallis. Vestibulum porta id orci eu vehicula. Cura
- </div>
- <br><br><br>
- </div></a>
- </div>
- </div>
- </div>
- </a>
- </div>
- </div>
- </body>
- </html>
- <center style="width:100%"><a href="https://aprilcodes.tumblr.com/" style="color:#000;font-size:12px;">april codes</a></center>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement