Page Specific CSS

[stbuchok]

Ok, this is going to seem odd but I have a need for the following scenario:

You have 2 pages, let's assume that they both have a control on the page call txtTextBox. Let's also assume that they need different styling and that you must do the CSS based on the ID.

For Page 1
#txtTextBox
{
color: red;
}

For Page 2
#txtTextBox
{
color: green;
}

Is there syntax that can be used to say that one refers to page 1 and the other refers to page 2, I don't know, something like this:

%Page1.html #txtTextBox
{
color: red;
}

%Page2.html #txtTextBox
{
color: green;
}

This was one will style page 1 the way I want while the other will style page 2 the way I want.

I know I can do the following to make them distinct, but this is not possible for what I want:

#txtTextbox.class1
{
color: red;
}

#txtTextBox.class2
{
color: green;
}

There is a very good reason as to why I want to do it this way so please just respond as to whether there is a way to do this or not.

Thanks in advance.

[Dandello]

Create an ID or class for the bodies to differentiate the pages.
OR, place one of the #txtTextBox styles within a style element on the page itself.
OR, have two style pages and each page calls a different one.

[stbuchok]

Thanks for replying, but as I mentioned, I know all this already. I need to know if the scenario I am asking about is possible. If it is not then I need to look at something else, but I specifically need to know about the example I gave. If it is possible say yes and give me an example, if it is not possible just say it isn't possible so that I can move on.

Please, I just want a yes or no on my EXACT example.

[Dandello]

Without being able to give the browser a parameter to differentiate between the two pages to call the proper css, the answer is no. Javascript might give you a solution.

[stbuchok]

OK, so no then, thanks, that is all I needed to know.