Jump to content
xisto Community
Sign in to follow this  
KansukeKojima

Css Basics Just for those who know nothing about css yet.

Recommended Posts

A tutorial on some of the basics of css.... I wrote if for my site, may as well post it here too :P

 

CSS Basics

 

Description

For those of you that don't know, CSS stands for Cascading Style Sheets. The whole point of it is to easily edit all of the pages on your website, so you don't have to edit each on individually. In this tutorial, you will learn some of the basics.

 

Try It Out

Css Syntax has three parts to it. The object (where you want to edit), the property (what part of the object to edit), and finally the value (what you want to edit).

 

Example

body { color: #3B3B3B;}

In the above case body is the object, color is the property, and #3b3b3b is the value. (This would cause all the font in your body to be the color #3b3b3b).

 

As shown above, you state the object first, and then state the property, finally, you state the value. Note: As shown above, all properties must be in the "{" brackets and the values must end with a semi-colon ( ; ).

Now for something more complex.

 

Example

body, td { font-size: 8pt; color: #3B3B3B;}

This time, we have two objects! The objects are body and td are both edited by separating them with the comma ( , ). (Note: you can have three, four, etc. objects as long as they are separated by commas.)

 

When you have a property with more than one word, you must place a dash ( - ) in between each word. In this case font size is our property, so we will place a dash in between the words: font-size.

 

Those are some of the basic rules to CSS, I will cover more later.

Share this post


Link to post
Share on other sites

hi KansukeKojima
can u plz help me out I have actually some problem with css ...I uploaded style.css a template which I got from freewebtemplates.com ...to my public_html folder and I also uploaded images to images folder but when i open my site the images aren't displayed and the setting of the template is also not good

Please check my site out ..here and then suggest me the possible causes for it....

greetz

Share this post


Link to post
Share on other sites

Just from a quick look myself musicmaza, it looks like your style sheets are in the wrong file. In the source code for the page, I see that it is calling for two style sheets:

<!-- **** layout stylesheet **** --><link rel="stylesheet" type="text/css" href="style/style.css" /><!-- **** colour stylesheet **** --><link rel="stylesheet" type="text/css" href="style/colour.css" />

Therefore there should be a file named style.css and another named colour.css inside a folder named style to have them display properly. Right now, I've found your style.css in the public_html folder like you've said, but for the page to be able to find it, you'll have to put it into a folder with the path public_html/style/style.css

Does that make sense? Hopefully that helps!
Edited by midnightvamp (see edit history)

Share this post


Link to post
Share on other sites

yes thanks for that I did the same step which you instructed now almost everthing is getting displayed but the images aren't displayed....please check it out can you please help me with the images also...like the top header images is not being displayed...so where do I have to uplaod the images

Share this post


Link to post
Share on other sites

It would appear you fixed it while I was figuring out what was wrong.... good job...

Share this post


Link to post
Share on other sites

yes thanksBut I didn't did that myself ...I am still new to the world of making websites and know very little about css templatesWithout the help of other members it wouldn't have been possible for me........:P

Share this post


Link to post
Share on other sites

Thanks for your CSS tutorial... I'm currently in the process of learning HTML and CSS. If you'd like to post more, you've certainly got an audience. If you know of any other good online tutorials, I'd love to hear about them. Thanks.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

×
×
  • Create New...

Important Information

Terms of Use | Privacy Policy | Guidelines | We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.