css snippet explanation RSS

• • Reply
  

  Mikeyyy

  Member

  12 Points

  24 Posts

  css snippet explanation

  Dec 22, 2012 07:06 PM|LINK

  h1, pre > b, #p > i
  {
  background: #FFFF99;
  box-shadow: 0 0 2px 2px #FFFF99;
  }

  #A > h1, #A > pre > b, #A > #p > i
  {
  background: #33CCFF;
  box-shadow: 0 0 2px 2px #33CCFF;
  }

  I understand the background and box shadow parts, but the header part with the > symbols is still confusing to me...

  I know what the <h1> <pre> <b> and <i> tags are...and the #p is all element IDs that equal "p"...can someone please offer their opinion on what's happening in these two css blocks?

  If someone can also give me a link that might explain the ">" better, I'll do my own homework.

  Thanks in advanced

  • Edited by Mikeyyy on Dec 22, 2012 07:13 PM
• • Reply
  

  Kulrom

  Contributor

  4834 Points

  893 Posts

  Re: css snippet explanation

  Dec 22, 2012 07:28 PM|LINK

  It's a child selector. For more you may want to check out the following links:

  http://css.maxdesign.com.au/selectutorial/selectors_child.htm

  http://www.456bereastreet.com/archive/200510/css_21_selectors_part_2/

  http://reference.sitepoint.com/css/childselector

  Remember to click Mark As Answer when you get a reply which answers your question.
  My Blog: ASP.NET Stuff
  
• • Reply
  

  Kulrom

  Contributor

  4834 Points

  893 Posts

  Re: css snippet explanation

  Dec 22, 2012 07:31 PM|LINK

  Ok it's a CHILD SELECTOR!

  For more you may want to check out the following links:

  http://www.w3.org/TR/CSS2/selector.html

  http://www.w3schools.com/cssref/sel_nth-child.asp

  http://css-tricks.com/child-and-sibling-selectors/

  Remember to click Mark As Answer when you get a reply which answers your question.
  My Blog: ASP.NET Stuff
  
  • Edited by Kulrom on Dec 22, 2012 07:33 PM
  • Marked as answer by Mikeyyy on Dec 22, 2012 07:34 PM