WebArtz - The Web Design Forum
Welcome to WebArtz, Guest!

WebArtz is a nice place for discussions related to web designing and coding. We help our members to code their own website templates with HTML and CSS. We give them advice on various issues.

To know more about WebArtz Forum, visit the About Us page.

At the moment, you are viewing the forum as a guest. As a guest you can't make post and participate in discussions. You need to register and become a member of the forum. Click the register link below and become a part of this forum.

Thank You

WebArtz - The Web Design Forum
Welcome to WebArtz, Guest!

WebArtz is a nice place for discussions related to web designing and coding. We help our members to code their own website templates with HTML and CSS. We give them advice on various issues.

To know more about WebArtz Forum, visit the About Us page.

At the moment, you are viewing the forum as a guest. As a guest you can't make post and participate in discussions. You need to register and become a member of the forum. Click the register link below and become a part of this forum.

Thank You


You are not connected. Please login or register

WebArtz - The Web Design Forum » Web Designing & Coding » Tutorials » Start Learning CSS

View previous topic View next topic Go down  Message [Page 1 of 1]

1Accespted Start Learning CSS Sat May 15, 2010 8:54 pm

ankillien

ankillien
Administrator
Administrator
Start Learning CSS
CSS tutorial for absolute beginners

Hello Everyone Very Happy

This tutorial is for absolute beginners who want to start off learning CSS. Please note that it is required to have basic knowledge of HTML before you start learning CSS. If you don't have any idea about HTML, please read the HTML tutorials first.

  • Start Learning HTML
  • HTML Page Structure
  • HTML Tags Reference - 1
  • HTML Tags Reference - 2


What is CSS?

CSS stands for Cascading Style Sheets. CSS is a simple text file composed of lines of codes which tells the browser how to display the HTML page. It gives the web designers more control over the appearance of an HTML page by allowing them to define styles for different elements. CSS directly affects the display properties of a web page such as font, colors, background, position, layout etc.

What you need?

  • You will need to have a computer that is running. Most likely you have this already, since you are reading this page Razz
  • You will need a text editor of your choice. If you have windows,you can use Notepad. If you have a Mac, you can use BBEdit.
  • Now, you need to have a web browser which will display your stylized HTML pages. You can use Internet Explorer, Firefox, Opera, Safari etc. (Note : Firefox is the best browser as per experts opinions).
  • You'll need a place to save your HTML and CSS files. You can create a new folder for it.


The Basics :

  • An CSS file is a text file containing lines of codes.
  • Different CSS properties and values tell browser how to display the page.
  • A CSS file must have extension of .css.
  • CSS page can be created using a simple text editor


How it works :

A CSS code adds "style" to an HTML element, so obviously, there must be an HTML element to which we can apply some style and make it look the way we want. We need an HTML file to practice our CSS codes.

In CSS coding what we do is...
  • Select an element to which we want to apply styles. For example, a <p> tag.
  • Decide which property of the element we want to edit. For example, background color.
  • Select a valid and proper value for the property. For example, "yellow" as background color.


Thats pretty simple Smile


These are the basic things about CSS you should know before you start coding your own style sheets. In the next tutorial, we'll learn different ways to add style sheet to a web page.

Thank You Very Happy
Notice : This tutorial is copyrighted by WebArtz Forum. You may not publish it on anywhere without written permission from the administrators.

2Accespted Re: Start Learning CSS Sat May 15, 2010 9:51 pm

Fred100

Fred100
Registered Member
Registered Member
Wow , really nice tutorial , just a little short , but thanks Very Happy
So is it something like this?
Code:
 <p "yellow"> OR <p>"yellow"

http://www.art-castle.biz/forum.htm

3Accespted Re: Start Learning CSS Sat May 15, 2010 11:22 pm

ankillien

ankillien
Administrator
Administrator
Fred100 wrote:Wow , really nice tutorial , just a little short , but thanks Very Happy
So is it something like this?
Code:
 <p "yellow"> OR <p>"yellow"

Glad you liked it, Fred Smile

Adding style would look something like this...
Code:
<p style="color:yellow;">Text goes here</p>

In the next CSS tutorial you'll learn 3 basic ways to add CSS to your web pages.
There will be detailed explanation of how to add style to your HTML pages.

4Accespted Re: Start Learning CSS Sat May 15, 2010 11:47 pm

Fred100

Fred100
Registered Member
Registered Member
Oh alright , thanks for the current info Smile

http://www.art-castle.biz/forum.htm

5Accespted Re: Start Learning CSS Sun May 16, 2010 6:32 pm

Jophy

Jophy
Registered Member
Registered Member
Thanks for this tutorial ankillien Smile really nice Very Happy

http://www.socialtechforum.com/

6Accespted Re: Start Learning CSS Sat Jun 12, 2010 8:50 pm

50Cent


Registered Member
Registered Member
This is the newer version of code for this. Am i rite?

Code:
<p style="color:yellow;">TExt</p> 

7Accespted Re: Start Learning CSS Mon Jun 14, 2010 12:17 am

ankillien

ankillien
Administrator
Administrator
50Cent wrote:This is the newer version of code for this. Am i rite?

Code:
<p style="color:yellow;">TExt</p> 

Can't say this is newer. It is a standard method (inline style) to add CSS.

Sponsored content


View previous topic View next topic Back to top  Message [Page 1 of 1]

WebArtz - The Web Design Forum » Web Designing & Coding » Tutorials » Start Learning CSS

Permissions in this forum:
You cannot reply to topics in this forum