CODEWITHSUNDEEP
css
Alfred
Alfred

Reputation: 21406

Is it possible to load external Style Sheet after Internal styles?

Is it possible to load external Style Sheet after Internal (or embedded) styles get loaded. I mean, say I have a div with Yellow background color, set using embedded style in a page, like;

<style type="text/css">
div{
  background-color: yellow;
}
</style>

And can I change the background color to green using an external style sheet like;

<link rel="stylesheet" href="style.css" type="text/css" />

If this is possible, show me an example.

I know this is possible with inline style, but I don't want to use that.

Upvotes: 3

Views: 1080

Answers (4)

Nudier Mena
Nudier Mena

Reputation: 3274

offcourse you can just place the external style sheet after the internal style sheet in HTML head section to override the internal style sheet!

CSS ORDER

What style will be used when there is more than one style specified for an HTML element?

Generally speaking we can say that all the styles will "cascade" into a new "virtual" style sheet by the following rules, where number four has the highest priority:

1. Browser default

2. External style sheet

3. Internal style sheet (in the head section)

4. Inline style (inside an HTML element)

Upvotes: -2

Anil agrahari
Anil agrahari

Reputation: 340

if you want to overwrite a css with same class, you can use 'important' in that class. Study more about important in css.

Upvotes: -1

Paul Fleming
Paul Fleming

Reputation: 24526

To answer your question, yes you can. The styles will be applied in a specific order. See here for precedence rules in CSS.

Upvotes: 1

SLaks
SLaks

Reputation: 887857

Yes.

Just put the <link> tag after the <style> tag, or make the selector in the external stylesheet more specific.

Upvotes: 5

Related Questions