[Newbee] Need syntax information (How to get to parents ? )

edited September 2007 in userstyles.org

I am somewhat a newbee to this and I would like to understand the DOM input syntax in stylish script.

I know this might be really trivial for a lot of you but I thought that the DOM could only be manipulated, after it had loaded, through javascript via Greasemonkey

Let say that I have an unnamed table with some images and some texts

<table> <tr> <td height="48"><img src="image1.jpg" height="300">text of image 1</td> <td><img src="image2.jpg" width="200">text of image 2</td> </tr> <tr style="height:124px;"> <td><img src="image3.jpg"><p class="text3">text3</p></td> <td style="width:100px;"><a href="big_image3.jpg"><img src="image3.jpg">text for big image 3</a></td> </tr> </table>
What is the difference in between
img[src$="image3.jpg"] and img[src*="image3.jpg"] ?

What does the >, : and + stand for ?
as in: TABLE>TR>TD:first-child+TD
or as in :TR[style="height: 124px;"]>td:first-child+td { background-position: 0 -93px; }

And finally say that through html coding with no CSS, I just have one element.
How can I asign a class name to the first tr just having an image to help locate it (as in here: image2.jpg) or a text (as in here: text of image2.jpg) ?

Well I know I am asking a lot but I would be very grateful to have a sympathetic answer rather than a "go learn DOM" with a link to W3C pages. ;o)


  • Well, W3C pages are still the best way to learn something. You need this one.
  • edited September 2007
    I dreaded that answer... ;o)
    Sorry but, it does not quite do it.

    Granted that I have the answer for my second question but my first and, the most important of all, my last question are not answered in anyway in these W3C pages and I did read them !... :o(

    (Edit: I found the answer to my first question at this adress: http://www.w3.org/TR/css3-selectors/)

    So maybe I should rephrase that last question:
    How can you attribute a style to an ascendant, a parent or the sibling of a parent of a known element ?
  • AFAIK, you can't do that. CSS selectors work only in natural direction.
  • [drama mode on]
    Aaaarghhh you are killing me ...
    [/drama mode off]


    Anybody that would know further than Mikado ?
    [imploring and trembling voice on]
    Please ....
    [/ imploring and trembling voice off]
  • you cant select a parent if you first select a child of that parent (or in other words you can go down not up)
  • Ok, for those who wondered if a solution could be found...

    In fact as I reported in this other post ther is a way to get to parents (and much more) in our userstyles through the use of XBL.

    Basically you need a server where you can put an xml file (xbl is a derivative from xml...), then in your css you call that xml file.
    It does the job by introducing javascript in style... ;o)
Sign In or Register to comment.