Academic Tutorials



English | French | Portugese | German | Italian
Google

Home Source Codes E-Books Downloads Contact Us About Us

CSS Tutorial
CSS Introduction
CSS Basic Syntax
CSS How to Insert
CSS Selector
CSS Internal
CSS External
CSS Inline
CSS Classes
CSS Background
CSS Text
CSS Font
CSS Border
CSS Margin
CSS Padding
CSS List
CSS Dimension
CSS Classification
CSS Positioning
CSS Pseudo-class
CSS Pseudo-element
CSS Media Types
CSS Mouse Cursor
CSS Properties
CSS Layers
CSS Float
CSS Summary

HTML Tutorials
HTML Tutorial
XHTML Tutorial
CSS Tutorial
TCP/IP Tutorial
XML Tutorials
XML Tutorial
XSL Tutorial
XSLT Tutorial
DTD Tutorial
Schema Tutorial
XForms Tutorial
XSL-FO Tutorial
XML DOM Tutorial
XLink Tutorial
XQuery Tutorial
XPath Tutorial
XPointer Tutorial
RDF Tutorial
SOAP Tutorial
WSDL Tutorial
RSS Tutorial
WAP Tutorial
Web Services Tutorial
Browser Scripting
JavaScript Tutorial
VBScript Tutorial
AJAX Tutorial
DHTML Tutorial
HTML DOM Tutorial
WMLScript Tutorial
E4X Tutorial
Server Scripting
ASP Tutorial
PHP Tutorial
PERL Tutorial
SQL Tutorial
ADO Tutorial
.NET (dotnet)
Microsoft.Net
XML Web Services
ASP.Net
.Net Mobile
C# : C Sharp
ADO.NET
VB.NET
Multimedia
SVG Tutorial
Flash Tutorial
Media Tutorial
SMIL Tutorial
Web Building
Web Browsers
Web Hosting
W3C Tutorial
Web Building
Web Quality
Web Semantic
Web Careers
Java Tutorials
Java Tutorial
JSP Tutorial
Servlets Tutorial
Struts Tutorial
EJB Tutorial
JMS Tutorial
JMX Tutorial
Programming Langauges
C Tutorial
C++ Tutorial
Visual Basic Tutorial
Data Structures Using C
Soft Skills
Communication Skills
Time Management
Project Management
Team Work
Leadership Skills
Corporate Communication
Negotiation Skills


Basic Syntax
Previous Next

The CSS syntax is categorized into three parts: a selector, a property and a value:




Rules
Syntax:
selector {property: value}

Any HTML tag is a possible CSS1 selector. You can linked to a particular style which is simply HTML element through selector. For example, the selector in

P { text-indent: 3em }
Class Selectors
Syntax of Class Selector:
.classname{property:value;}

Different classes can be defined in a single selector, thus allowing the same element to have different styles. For example, an author may wish to use different color to display code depending on its language:

code.html { color: #191970 }
code.css { color: #4b0082 }

For example, with class~="pastoral" we can assign style information to all elements as follows:

*.pastoral { color: green } /* all elements with class~=pastoral */

With class~="pastoral",the following code assigns style only to H1 elements :

H1.pastoral { color: green } /* H1 elements with class~=pastoral */
Given these rules, the first H1 instance below would not have green text, while the second would:
<H1>Not green</H1>
<H1 class="pastoral">Very green</H1>
Without an associated element,classes may also be declared :
.note { font-size: small }
ID Selectors
Syntax of ID Selector:
#idname{property:value;}

ID selectors are individually assigned for the purpose of defining on a per-element basis. Due to its inherent limitations,this selector type should only be used sparingly . By using the indicator "#"to precede a name,an ID selector is assigned . For example, an ID selector could be assigned as such:

#svp94O { text-indent: 4em }



Grouping

Grouping of selectors and declarations is allowed in order to decrease repetitious statements within style sheets,. For example,in a document , all of the headings could be given identical declarations through a grouping:

h1,h2,h3,h4,h5,h6
{
color: blue
font-family: sans-serif
}


CSS Comments

Comments are denoted within style sheets is same as Comments in C programming .

Comments may help you when you edit the source code at a later date and are used to explain your code. A comment will be ignored by browsers. A CSS comment begins with "/*", and ends with "*/", like this

/* COMMENTS CANNOT BE NESTED */


Share And Enjoy:These icons link to social bookmarking sites where readers can share and discover new web pages.
  • blinkbits
  • BlinkList
  • blogmarks
  • co.mments
  • connotea
  • del.icio.us
  • De.lirio.us
  • digg
  • Fark
  • feedmelinks
  • Furl
  • LinkaGoGo
  • Ma.gnolia
  • NewsVine
  • Netvouz
  • RawSugar
  • Reddit
  • scuttle
  • Shadows
  • Simpy
  • Smarking
  • Spurl
  • TailRank
  • Wists
  • YahooMyWeb

Previous Next

Keywords: css syntax html element, cascading style sheets, style sheets, css syntax attribute


HTML Quizes
HTML Quiz
XHTML Quiz
CSS Quiz
TCP/IP Quiz
XML Quizes
XML Quiz
XSL Quiz
XSLT Quiz
DTD Quiz
Schema Quiz
XForms Quiz
XSL-FO Quiz
XML DOM Quiz
XLink Quiz
XQuery Quiz
XPath Quiz
XPointer Quiz
RDF Quiz
SOAP Quiz
WSDL Quiz
RSS Quiz
WAP Quiz
Web Services Quiz
Browser Scripting Quizes
JavaScript Quiz
VBScript Quiz
AJAX Quiz
DHTML Quiz
HTML DOM Quiz
WMLScript Quiz
E4X Quiz
Server Scripting Quizes
ASP Quiz
PHP Quiz
PERL Quiz
SQL Quiz
ADO Quiz
.NET (dotnet) Quizes
Microsoft.Net Quiz
XML Web Services Quiz
ASP.Net Quiz
.Net Mobile Quiz
C# : C Sharp Quiz
ADO.NET Quiz
VB.NET Quiz
Multimedia Quizes
SVG Quiz
Flash Quiz
Media Quiz
SMIL Quiz
Web Building  Quizes
Web Browsers Quiz
Web Hosting Quiz
W3C Quiz
Web Building Quiz
Web Quality Quiz
Web Semantic Quiz
Web Careers Quiz
Java Quizes
Java Quiz
JSP Quiz
Servlets Quiz
Struts Quiz
EJB Quiz
JMS Quiz
JMX Quiz
Programming Langauges Quizes
C Quiz
C++ Quiz
Visual Basic Quiz
Data Structures Using C Quiz
Soft Skills Quizes
Communication Skills Quiz
Time Management Quiz
Project Management Quiz
Team Work Quiz
Leadership Skills Quiz
Corporate Communication Quiz
Negotiation Skills Quiz

Privacy Policy
Copyright © 2003-2008 Vyom Technosoft Pvt. Ltd., All Rights Reserved.