• Home
• Graphics
• Layouts
• Tutorials
• Comics
• Interact
• Site

Updates

-4 New Avatars
-Renovated Glitters
-New Mini-Blog
-New songs on Playlist
-New Site Layout

Quick Links

Tagboard
Playlist
Articles
Verses

Affiliates

Anime Trinity
Blessed Chette
Dark Jest
Forgiven Moments
Janel
Krisna
Kriz
Make Believe
NReluctant
nTellect
Paper Moon
Radiant Hope
Reflect Graphics
Relentless
Strange Flavor
Tenshiyuki
The Daily Mika
Vanquished

apply?

Etc

-Extras!!
-Link Me
-Rotations

Coding CSS Backgrounds:

Click to see Karate Kitty

Karate Kitty: If you wish to pet my magic fur and learn how to code backgrounds, please read on.

PET!!!!!

I leaned this from: HTML.net

"CSS? Why not HTML?" you ask.

Karate Kitty says, "HTML? I've never heard of it! Hmph."

"There's a lot of things you haven't heard of," I point out. "You don't get out much."

"Yes I do!" Karate Kitty meows desperately, "I go outside one to two times a day. Unlike some people, who sit around the computer all day!!!"

"At least I don't sit on the computer!" I say defensively. Then suddenly remembering, I look over at you.

"Heheh... Sorry about that. The reason I'm giving a tutorial on CSS backgrounds rather than HTML is because I feel that you can do so much more with CSS than HTML.

For instance:

CSS can position backgrounds, stop them from repeating, and fix them so that they stay where they are when you scroll down the page. The beginning of the CSS code is this:

<style> </style>

To start off, a background color would be thus:

<style> body {background-color: #000000;} </style>

To place a background image, the coding would be:

<style> body {background-image: url("IMAGE URL HERE");} </style>

If want your image to repeat, just leave it alone. But if you don't want it too, then:

<style> body {background-image: url("IMAGE URL HERE"); background-repeat: no-repeat;} </style>

If you want your image to be fixed (stay in the same place when page is scrolled), then:

<style> body {background-image: url("IMAGE URL HERE"); background-attachment: fixed;} </style>

To postition your image, you would type:

<style> body {background-image: url("IMAGE URL HERE"); background-position: bottom right;} </style>

And all of that combined together equals:

<style> body {background-image: url("IMAGE URL HERE"); background-attachment: fixed; background-position: bottom right; background-repeat: no-repeat; background-color: #000000;} </style>

"Hey, it's me again," Karate Kitty says casually. He had been sleeping the whole entire tutorial! "I must be a constant theme or something. Maybe I should get my own fan club."

"..." I dot dot dot in silence.

MEOW MEOW!