2

after one hour of browsing I decided to ask this question here.

Is it possible to add css code to an url, for example to change the background color?

Someting kike this: http://yahoo.com (command)style=background-color:#000000;

or similar. Or is it possible to create an url where the site loads with a modified css without using a Chrome extension or similar?

Thanks for help!

1
  • 2
    Can you please explain why you think you need this so we can provide feasible solutions? There're many browser plug-ins to do it for yourself—do you want to redirect others to altered versions of popular sites? Commented Nov 12, 2013 at 10:25

4 Answers 4

2

No. You can't (using standard software) modify a document by adding anything to that document's URL (unless the server recognises the addition to the URL (e.g. if it was a query string) and returns a different document based on it).

If it was possible then browsers would be exposing every site to XSS attacks.

A browser extension would be the only way to do this client side (but would render users of that extension vulnerable to XSS attacks).

You could also use a bookmarklet in a two stage approach (1. Visit page. 2. Click to activate bookmarket.).

Sign up to request clarification or add additional context in comments.

Comments

1

it's possible in a way, but probably not how you imagined it (see Quentin's answer to understand why).

with javascript - note that this is not a 'native' feature so you will have to do a little walk-around. look at the following example:

function get_query_param(name) {
    name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
    var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
        results = regex.exec(location.search);
    return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}

window.onload = function() {
    var bgcolor = get_query_param('bgcolor');
    if (bgcolor.length) {
        document.getElementById("xyz").style["padding-top"] = "10px";
        document.body.style.backgroundColor = bgcolor;
    }
}

now try browsing your page with ?bgcolor=red at the end of the url.

of course that's a demonstration of the main idea, you will have to implement each css property you wish to modify using this approach.

hope that helps.

Comments

0

Yes it is possible. Follow this: <a href="http://yahoo.com" style="background: #777777; color: #F0AD4E;">Yahoo</a>

1 Comment

I think you misunderstood the question
0

is it possible to create an url where the site loads with a modified css

Solution:


Add something like this : ?v=1.1

<link rel="stylesheet" href="style.css?v=1.1"> 

When you change the css change the version like this: ?v=1.2 after then your browser will load newly updated css. Note that you can replace to any number each time you change the css.

This will have no effect on the CSS. It will only serve to make the browser think it’s a completely different file.

If you don’t change the value for a while, the browser will continue to cache (or preserve) the file, and won’t attempt to download it unless other factors force it to, or you end up updating the query string value.

1 Comment

I think you may be answering a different question.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.