Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html>
- <head>
- <html lang="en">
- <meta charset="UTF-8">
- <!--
- /// "VIBES" template made by awhe @ https://awhe.neocities.org/
- /// NOTE: Feel free to delete the above credits included in the code. I do not require credit, and I encourage copying from me as much as you'd like. As always: The internet is made for sharing, and so I'm happy to be able to share this with you!
- /// I really liked the scanlines I used for my new gamelog page, so I thought I'd make a little template based off of them.
- /// I'm bad at spelling. If you see any spelling errors, no you don't! (I'm sorry, even after checking, I still usually miss something.)
- ==============================================================
- -USEFUL INFO-
- // margin: refers to the space AROUND an element.
- // padding: refers to the space INSIDE an element.
- // color: refers to TEXT COLOR.
- // background: refers to the BACKGROUND COLOR of an element.
- // favicon: refers to the tiny image that shows up on your website tab at the top.
- // body: refers to the main structure of the site. think of the plain white screen before adding all your code, that's the body.
- // https://www.w3schools.com/ (This site has all the help you need if you require more assistance.)
- // https://codepen.io/ (This site allows live previews of your code, which can be helpful when you're changing parts and still learning.)
- // https://awhe.neocities.org/links (Shameless self plug, but I've included many many links here regarding HTML (among other things!) that may prove useful.)
- // https://blog.hubspot.com/website/web-safe-html-css-fonts (Displays "web safe fonts" which are fonts that'll adapt to any browser on any device.)
- // https://www.w3schools.com/tags/ref_colornames.asp (Shows you the names of colors supported by all browsers!)
- ==============================================================
- /// Just a small reminder that:
- - You can and you should copy from me if you'd like. I don't care. My url is: https://awhe.neocities.org/
- - Credit is always optional, whatever you feel like.
- - For a cleaner look, I recommend removing my text additions whenever you feel comfortable to.
- - I recommend editing on a live preview, so you can see the immediate effects of any changes you make.
- - Have fun! Add, change, edit, etc, whatever you want! The net is yours.
- -->
- <title>VIBES</title>
- <!-- remove the text "VIBES" and replace it with whatever you want to title your site as! it shows up on the tab of your site. -->
- <meta name="viewport" content="width=device-width,initial-scale=1">
- <link rel="stylesheet" href="">
- <link rel="icon" type="image/x-icon" href="/">
- <!-- remove the "/" here with a url link to your image of choice that you'd like to use as your website "favicon". -->
- </head>
- <style>
- ::-webkit-scrollbar {
- width: 15px;
- height: 15px;
- }
- /* above is the custom scrollbar, you can delete it if you want to use the default or another custom scrollbar. */
- ::-webkit-scrollbar-thumb {
- border: 1px solid #000;
- }
- /* above is the custom scrollbar, you can delete it if you want to use the default or another custom scrollbar. */
- ::-webkit-scrollbar-button:start:decrement,
- ::-webkit-scrollbar-button:end:increment {
- height: 15px;
- width: 15px;cp
- display: block;
- background-repeat: no-repeat;
- border: 1px solid #000;
- }
- /* above is the custom scrollbar, you can delete it if you want to use the default or another custom scrollbar. */
- ::-webkit-scrollbar-button:vertical:decrement {s
- background-image: url(data:image/png;base64,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);
- }
- /* above is the custom scrollbar, you can delete it if you want to use the default or another custom scrollbar. */
- ::-webkit-scrollbar-button:vertical:increment {
- background-image: url(data:image/png;base64,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);
- }
- /* above is the custom scrollbar, you can delete it if you want to use the default or another custom scrollbar. */
- .crt::before {
- content: " ";
- display: block;
- position: absolute;
- top: 0;
- left: 0;
- bottom: 0;
- right: 0;
- background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%), linear-gradient(90deg, rgba(255, 0, 0, 0.06), rgba(0, 255, 0, 0.02), rgba(0, 0, 255, 0.06));
- z-index: 2;
- background-size: 100% 2px, 3px 100%;
- pointer-events: none;
- }
- /* this is the scanlines/CRT effect. delete if you don't want it, as well as in the <body> tags. */
- body {
- margin:0;
- font-family: ms gothic;
- background-image: url('https://files.catbox.moe/qp7d77.jpg');
- /* replace this line of code with a link to your background image. */
- /* or remove it entierly if you want to use a color or something. */
- background-size: fill;
- background-repeat:repeat;
- background-position:100%;
- text-align: justify;
- }
- p{
- text-align: center;
- font-size: 2vh;
- }
- a{
- color: #689dff;
- }
- /* this is the link color. */
- a:hover{
- color: #ec4b4b;
- }
- /* this is the link color when the cursor hovers it */
- @font-face {
- font-family:'synkopy';
- src: url(Synkopy-Regular.otf);
- }
- /* https://fontesk.com/synkopy-font/ - that's where i downloaded the above font! */
- /* delete this code if you don't want to use a custom font. */
- span {
- font-family:'synkopy';
- font-size: 6vh;
- }
- /* delete this code if you don't want to use a custom font. */
- hr {
- border: 0;
- height: 1px;
- background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
- }
- ul{
- list-style-type: none;
- }
- /* you can change the list style type to whatever you want, i just don't like bullet points. */
- .menu{
- margin-top:5%;
- margin-left:24%;
- border:1px solid #000000;
- height:800px;
- width:15%;
- background-color: white;
- float:left;
- font-size: 5vh;
- overflow:auto;
- }
- .cont{
- margin-top:5%;
- margin-right:20%;
- border:1px solid #000000;
- height:800px;
- width:40%;
- background-color: white;
- float:right;
- overflow:auto;
- }
- .center {
- display: block;
- margin-left: auto;
- margin-right: auto;
- }
- /* this is used to center images */
- /* just add class=center to the end of any image to center them. */
- /*below is styling for mobile users. you can tinker with this if you'd like! */
- @media only screen and (max-width: 640px) {
- .crt{
- position:relative;
- }
- .menu{
- position:relative;
- display:block;
- width:90%;
- right:20%;
- text-align:center;
- height:450px;
- overflow:auto;
- }
- .menu img{
- display:none;
- }
- .menu ul{
- margin-right:10%;
- }
- .cont{
- position:relative;
- display:block;
- width:90%;
- left:15%;
- height:500px;
- overflow:auto;
- margin-bottom:40px;
- }
- }
- </style>
- <body>
- <div class="crt">
- <div class="menu">
- <p><span>MENU</span></p>
- <hr>
- <ul>
- <li><a href="/">LINK 1</a></li>
- <li><a href="/">LINK 2</a></li>
- <li><a href="/">LINK 3</a></li>
- <li><a href="/">LINK 4</a></li>
- <li><a href="/">LINK 5</a></li>
- </ul>
- <hr>
- <p>maybe you can put some stamps here, or some extra info :D it really depends on what you're using this page for.</p>
- <p>personally, i added a huge pixel of a DS lol...</p>
- <p>more links would fit here too though if you'd rather! it's also scrollable, so don't worry about fitting everything inside. i'll show you the scrollbar.</p>
- <p>blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah</p>
- </div>
- <div class="cont">
- <p><span>CONTENT</span></p>
- <hr>
- <table>
- <tbody>
- <tr>
- <td style="padding-right:10px;">
- <img src="https://i.pinimg.com/564x/7f/85/a0/7f85a0a6f41f32b5227f80cc1e52927a.jpg" width="100%" style="display:block; margin-left:5%;">
- </td>
- <td>
- <p>Here is the main content :D You can remove the table if you don't want to use an image or anything, it's up to you!</p>
- <p>I'm writing this as if it's a home page/index screen, but really you can use it for anything.</p>
- <p>For an example of how I used it: <a href="https://awhe.neocities.org/loves/game" target="_blank">click here</a>!</p>
- <img src="https://files.catbox.moe/jjmbrq.gif" width="75%" class="center">
- <p>Some more writing to fill some space :D wahoo! <b>made in chrome 1920x1080</b></p>
- </td>
- </tr>
- </tbody>
- </table>
- <hr>
- <p>And... here's some more space! I dunno what to put here for the template, but stuff like a button wall or some pets or a cbox would be cool here I think!</p>
- <p>Or whatever information you want to add depending on what you're using this code for. I just like the retro feel of it which is why I used it for my gamelog B-)...</p>
- <p>This box is also scrollable! I'll spam something in big letters so you can see.</p>
- <p style="font-size: 6vh;">PLAY "THE SILVER CASE" PLAY "THE SILVER CASE" PLAY "THE SILVER CASE" PLAY "THE SILVER CASE" PLAY "THE SILVER CASE" PLAY "THE SILVER CASE" PLAY "THE SILVER CASE" PLAY "THE SILVER CASE" PLAY "THE SILVER CASE" </p>
- </p>
- </div>
- </div>
- </body>
- </html>
Add Comment
Please, Sign In to add comment