|
|
---|---|
Posted by | FREE CSS TEMPLATE! (BEING REWRITTEN!) |
Hok-Z| π΄ππππ ππ (#41458) View Forum Posts Posted on 2022-05-25 21:39:30 |
Hok-Z's CSS TemplateFree CSS TemplateI've been meaning to do this for a while, and this lil page will be under construction as new info comes up. Here is a FREE CSS TEMPLATE that I made. You can use this for ANYTHING. Just please don't claim you made the template. The template has commented instructions within and small tips. I highly suggest using some of the resources I link below. The CSS has a lot of clashing elements because I wanted things to stand out! The idea is that you'll either replace everything or not need it based on your preferences. IF YOU HAVE QUESTIONS, I'LL DO MY BEST TO ANSWER THEM! I'm not just posting the template and dipping out. I'll do my best to answer questions. If I don't respond to this thread within 24 hours, DM me on Discord at Hokzii#7707. THIS THREAD WILL NOT COVER HOW TO DO EVERYTHING IN THE CSS! It's mostly a template. However, there are other templates around as well. It's just a matter of which you like to use best. Frequently Asked Questions and Problems [CLICK ME]HERE ARE OTHER TEMPLATES CREATED BY USERS! These are fabulously created templates as well. USE what sticks out to you! If this thread guides you to another template that you like better, so be it!! I just want to help :D Kraft's CSS Template Katie's CSS Template ---------------------- Intro + ResourcesWelcome to the world of HTML and CSS! For ease of understanding, I won't be using "official" terminology. I just want to make it easy to understand for you to get into. "But wait, Hok.. I'm here for CSS? What's HTML?" Yeah I was in the same boat. Think of it like this: HTML is the building blocks of a webpage or website. CSS is what you use to make it pretty. HTML gives the site structure. It assigns different Identifiers to different aspects of the site and each page you visit on Lioden. The CSS is all the images, colors, fonts, and spacing between those aspects. CSS Is used for your Dens, while HTML is used for Forum posts like this one. I cannot recommend enough checking out the links to W3Schools below. They will be SUCH an incredible resource for you and give you LOTS of insight! You will need: - Notepad (Windows 10) -OR- Notepad++ (Visual Studio Code is also an option) - Dropbox - W3Schools HTML Tutorial - W3Schools CSS Tutorial - How to Inspect Element (Chrome) - PATIENCE. - A boppin' music playlist. WILL NOT WORK: - Word - Google Docs Helpful Links Hok-Z's CSS FAQ, Help and Neat Things [+IMGs] Space's Guide to Creating Your Own CSS Tserin's Guide to Beginner CSS Athene's HTML and Coding Guide Feather's CSS Guide Pandora's CSS Guide [INCOMPLETE] - Offers GRADIENT assistance and how to find Cave IDs. Random's Guide on how to use CSS for the WHOLE SITE. [pog] ---------------------- 0 players like this post! Like? Edited on 03/02/23 @ 21:46:01 by Hok-Z|Ο΄ryx, G2 Haze Smilus (#41458) |
Hok-Z| π΄ππππ ππ (#41458) View Forum Posts Posted on 2022-05-28 21:42:37 |
I have updated the thread with some resources and other links that could be of help! 0 players like this post! Like? |
Teddy Bear (#179832)
Majestic View Forum Posts Posted on 2022-05-28 22:04:14 |
Thankyou :) itβs looking good :) Also, perhaps add Dropbox to the list of needed things too? :) 0 players like this post! Like? |
Hok-Z| π΄ππππ ππ (#41458) View Forum Posts Posted on 2022-05-28 22:09:32 |
I literally cant even believe i forgot to list it. smh Updating. Thank you β₯ 0 players like this post! Like? |
Teddy Bear (#179832)
Majestic View Forum Posts Posted on 2022-05-28 22:11:21 |
Coen (Interstellar withered) (#250872) Aztec Knight View Forum Posts Posted on 2022-06-09 16:50:12 |
Hi so im trying to make a CSS and the other tutorial doesn't explain the opacity of the forground and i was wandering if anyone here could help since its more recent. i was wanting to make this part more transparent .col-md-9.col-xs-12 { background: #6C533A !important; border: 4px double #91AFC2 !important; border-top: none !important; border-right: none !important; border-bottom :none !important; } div.container.main { background: #110B02 !important; border: 4px double #91AFC2 !important; border-left: none !important; } 0 players like this post! Like? |
Hok-Z| π΄ππππ ππ (#41458) View Forum Posts Posted on 2022-06-09 22:09:59 |
To make the any solid color more transparent, add the percentage of the opacity to the end of the six digit hex code. For example, if you want the color #6C533A to be 50% transparent, it would look like this: background: #6C533A50 !important; There's ways that you can get more precise after counting each ten decimal digits by using the letters A-F. For example, the natural progression of opacity in the 10 percentage range would look like this: #FFFFFF10 #FFFFFF11 #FFFFFF12 #FFFFFF13 #FFFFFF14 #FFFFFF15 #FFFFFF16 #FFFFFF17 #FFFFFF18 #FFFFFF19 #FFFFFF1a #FFFFFF1b #FFFFFF1c #FFFFFF1d #FFFFFF1e #FFFFFF1f If you'd rather not worry about the letters getting into the mix, that's fine - but they act as additional opacity options. Jumping from 19 opacity to 20 opacity would essentially be the same as removing 6% of opacity in between. 0 players like this post! Like? Edited on 09/06/22 @ 22:11:09 by Hok-Z|Ο΄ryx, TΡ§ΔΈα΄Ι΄ KiΙ΄G (#41458) |
Coen (Interstellar withered) (#250872) Aztec Knight View Forum Posts Posted on 2022-06-10 03:03:33 |
JaeBird (#291195)
King of the Jungle View Forum Posts Posted on 2022-07-02 18:39:07 |
Do you do html temples specifically a table with a image background? 0 players like this post! Like? |
Hok-Z| π΄ππππ ππ (#41458) View Forum Posts Posted on 2022-07-02 19:07:06 |
Html isn't something I've gotten a chance to create from scratch yet, but there's a lot of lovely templates out that that you can deconstruct and if you would like help troubleshooting those, you can ask about them here too <3 Some of my favorites are: Quake's HTML Katie's CSS (HTML at the bottom!) Betta Mom's HTML I use Quake's HTML as a template sometimes for my own threads. All of these users are fine with you editing their templates as long as credit stays intact. 0 players like this post! Like? |
JaeBird (#291195)
King of the Jungle View Forum Posts Posted on 2022-07-02 19:26:33 |
Psychotix (#312951)
Bone Collector View Forum Posts Posted on 2022-07-18 19:51:07 |
Is there a way where mobile users can see the CSS on accounts too? If so pleassee tell me how 0 players like this post! Like? |
Hok-Z| π΄ππππ ππ (#41458) View Forum Posts Posted on 2022-07-18 23:01:35 |
Yep! There was an issue I came across where my Den background would be grey when it was supposed to be an image for mobile. To fix this, here's the steps I went through in this thread. If the CSS doesn't appear at all, try checking your Account Settings to see if you have custom Den CSS enabled. 0 players like this post! Like? |
AL2022 (#273671)
Maneater View Forum Posts Posted on 2022-08-04 14:42:06 |
Hok-Z| π΄ππππ ππ (#41458) View Forum Posts Posted on 2022-08-04 14:56:48 |
AL2022 (#273671)
Maneater View Forum Posts Posted on 2022-08-04 15:20:24 |