|
|
---|---|
Posted by | Free CSS Template + Tutorial 2.0 (2023) |
katie 🍃 (#106445)
Warrior View Forum Posts Posted on 2022-12-29 04:57:14 |
Welcome to the new and updated version of my CSS template + tutorial!
My original from 2019 is still usable, but a bit outdated and needed some polishing. > VIEW/DOWNLOAD THE TEMPLATE HERE < Rules: • This template may be used for anything and everything - free codes, pre-mades, commissions, you name it. • Please leave the credit in the template intact, unless your coding becomes unrecognizable from it. • This is a guide for CSS coding, not things like image hosting or photo editing. Please use Google if you need help with things like that. • Feel free to show me CSS you made using my template! It makes me happy. Resources: • W3Schools Always go here first. Anything and everything you need to know about CSS is here. • Live CSS Editor (Chrome) Allows you to see changes to your CSS instantly, great for when you're working on your code. • Unsplash & Pexels Great high quality, free to use backgrounds. • Google Fonts Fonts MUST be from here to work in the template. • Color Palette from Image & Gradient from Image Generates a color palette or gradient based on your background image. • Color Picker For hex or RGBA codes. Coding Things to Keep in Mind: • The background of an element controls the solid color behind it, the color of an element controls the text. • In RGBA codes, the decimal controls transparency of the element. For example, rgba(1, 1, 1, 0.5) = 50% transparency. 1 = opaque, 0 = invisible. • Aim for readability. Cursive fonts are great for headers, but are hard to read in description text. • Avoid creating eye-burning CSS or a page that may harm others. Be mindful of intensely bright colors, flashing images, etc. Other people have to see your den too! Tutorial 93 players like this post! Like? Edited on 15/05/23 @ 16:23:01 by katie 🌿 (#106445) |
B •[Mutie Eco Breeder] (#343773) View Forum Posts Posted on 2023-12-07 11:05:51 |
https://www.dropbox.com/scl/fi/1xzauhndgy4ysonl0c11y/css.css?rlkey=w3ook008t0825u9q8wmt8vc1a&dl=0 i've tried putting this in after the scl and it still wont work what i used: <**link rel=""stylesheet" type="text/css" href="https://dl.dropbox.com/st8vc1a&dl=0**" /> 0 players like this post! Like? Edited on 07/12/23 @ 11:07:29 by B •[G2 Svelte Dawn] (#343773) |
Lima (#349008)
Nice Guy View Forum Posts Posted on 2023-12-07 11:14:27 |
I think Katie's html code is a bit outdated. Always just put your whole link in the code, and change www. to dl. <**link rel=""stylesheet" type="text/css" href="URL HERE"**"/> Yours would be: <*link rel="stylesheet" type="text/css" href="https://dl.dropbox.com/scl/fi/1xzauhndgy4ysonl0c11y/css.css?rlkey=w3ook008t0825u9q8wmt8vc1a&dl=0"/*> 2 players like this post! Like? Edited on 07/12/23 @ 11:15:22 by Lima - HQ BO CIM (#349008) |
B •[Mutie Eco Breeder] (#343773) View Forum Posts Posted on 2023-12-07 13:24:38 |
Thank you! I am trying to solve why my mobile isnt centering, everything else looks good, and its centered on pc. 0 players like this post! Like? |
HOLY DISCIPLE M. (#441071)
Brutal View Forum Posts Posted on 2023-12-12 19:43:21 |
Cal (#434603)
Heavenly View Forum Posts Posted on 2023-12-12 22:13:52 |
So I've followed this directly and my css still isn't working. This is what I've used and it hasn't worked - <*link rel="stylesheet" type="text/css" href="https://dl.dropbox.com/scl/fi/him6e01wkbexqldsnhi14/Custom-LoZ.css?rlkey=nz2gblsbbfpyuy3vrnrex7qn0&dl=0"*/> I don't know if it's something wrong with the file itself, or something acting up with the dropbox link.... 0 players like this post! Like? Edited on 12/12/23 @ 22:14:08 by Cal (#434603) |
Anxiety Prime™ [CRESTED] (#191357) View Forum Posts Posted on 2023-12-12 22:17:31 |
B •[Mutie Eco Breeder] (#343773) View Forum Posts Posted on 2023-12-15 10:22:38 |
EDIT: fixed the coding, now im confused as to why my mobile is left shifted... https**://www.dropbox.com/scl/fi/rl7woidzq2dodzlvsoc0j/Jelly-Static-2.*css?rlkey=bxm5ran0x1xmo7ao2r0zn5glu&dl=0 0 players like this post! Like? Edited on 15/12/23 @ 10:32:25 by B •[G1 Water Hyacinth Splash] (#343773) |
karl [g5 ferus nsr] (#267219)
Sapphic View Forum Posts Posted on 2023-12-21 16:32:52 |
im a mac user, when i copy from textedit and paste on dropbox a bunch of random slashes and numbers appear how can i remove them easily and quickly? 0 players like this post! Like? |
Wyn| Elysian NRLC (#344111)
Heavenly View Forum Posts Posted on 2023-12-21 16:36:26 |
@karl - Sorry, I don't think I understand, why do you need to copy something from textedit and paste on dropbox? 0 players like this post! Like? |
karl [g5 ferus nsr] (#267219)
Sapphic View Forum Posts Posted on 2023-12-21 16:40:10 |
lol my bad i meany upload on dropbox. the symbols and stuff still show even after uploading it as a css file 0 players like this post! Like? |
Wyn| Elysian NRLC (#344111)
Heavenly View Forum Posts Posted on 2023-12-21 16:42:52 |
I still don't think I understand, I'm really tired atm sorry ^^" Is it possibly you could copy and paste it here? So I can see what you mean? :> 0 players like this post! Like? |
karl [g5 ferus nsr] (#267219)
Sapphic View Forum Posts Posted on 2023-12-21 16:47:58 |
/* BACKGROUND */\ \ body \{\ background: url('https://i.imgur.com/IgA9DKk.jpg') center center fixed;\ background-size: 100%;\ font-family: \'91Tinos\'92, serif;\ color: #2e2e33\ those slashes at the end of the are not supposed to be there, as well as the 91 and 92 0 players like this post! Like? |
Wyn| Elysian NRLC (#344111)
Heavenly View Forum Posts Posted on 2023-12-21 16:53:12 |
karl [g5 ferus nsr] (#267219)
Sapphic View Forum Posts Posted on 2023-12-21 17:46:32 |
my link looks like https://www.dropbox.com/scl/fi/c99qaytlfg9vqez9mynwm/star-css-3.css?rlkey=80my8cssbuz2n3i90bicq30i4&dl=0 i tried putting it on my profile with the code katie put, now it doesnt show up 0 players like this post! Like? |
HOLY DISCIPLE M. (#441071)
Brutal View Forum Posts Posted on 2023-12-21 18:08:32 |
try using "https://dl.dropbox.com/scl/fi/c99qaytlfg9vqez9mynwm/star-css-3.css?rlkey=80my8cssbuz2n3i90bicq30i4&dl=0" instead 0 players like this post! Like? |