EchoEcho.Com Homepage
Web Hosting - As Reliable As It Gets!
   Home > Tutorials > CSS > Selectors


 Tutorials 
 D-Zine Articles 
 Online Tools 
 Free Resources 
 References 
 Quiz 
 Hosting 

















  CSS SELECTORS :
CONTEXT DEPENDANT SELECTORS








It is possible to make selectors that will only work in certain contexts.

For example, you can define a style for the <B> tag that is only triggered if the text is not only bold but also written in italics.

For example, the style should be in effect here:

<i><b>example</b></i>


but not here :

<b>example</b>.





THE SYNTAX
Simply adding a normal style to the <B> tag is done like this:

B {font-size:16px}


Adding a context dependent style, like the one described above is done like this:

I B {font-size:16px;}


We simply separated the contextual <I> tag from the <B> tag with a space.




USING GROUPED AND CONTEXT DEPENDENT SELECTORS AT THE SAME TIME:

It is possible to use context dependent and grouped selectors at the same time.

For example, like this:

I B, .headlines, B .sublines {font-size:16px;}


In the example the font-size of 16 pixels is in effect on:
1) All <B> tags enclosed by <I> tags
2) All headlines classes.
3) sublines classes enclosed by <B> tags.



 << PREVIOUS
READ MORE >>  
















DEVELOPER TIP!
FACT:
Internet Explorer let you customize the look of cursors on your pages.
TIP:
Our CSS Cursor Tutorial will teach you how extremely easy it is!





     "Better Than Books - As Easy As It Gets!"


On EchoEcho: D-Zine Articles | Tutorials | Online Tools | Free Resources | References | Quiz | HostingAbout EchoEcho