Have Geek Brain

CSS inheritance

Is there a way to completely ignore the CSS file from the header that is being imported into your html file?

I want one page to have its own independent CSS, not inheriting from any other CSS sources.

0


a source to share


6 answers


You can use! important declarations in your local stylesheet to override standard inheritance.



http://www.w3.org/TR/CSS2/cascade.html#important-rules

+3


a source


If you apply a unique id to <body>

your custom page , you can easily make that page specific ads in your global css. There is no point in serving another css file as your global / site css will be cached on the client anyway.

Personally, I think it's good practice to manage page specific styles. In php, you can achieve this dynamically in your view with

<body id="<?= basename($_SERVER['PHP_SELF'], ".php")?>">


in ASP.Net you can set the id using:

System.IO.Path.GetFileNameWithoutExtension(HttpContext.Current.Request.Url.AbsolutePath).ToLower
+3


a source


Not an obvious solution to not include this CSS file on this page?

+1


a source


You can use JavaScript to remove the associated CSS file, but then you only need to add that JavaScript on this page.

Alternatively, you can put the id in the body tag and set a completely different set of CSS rules for that page:

Standard Pages:

<body id="standard">

#standard h1 {
   color:blue;
}

Another page:

<body id="different">

#different h1 {
   color:red;
}

A little planning ahead is worth the effort

0


a source


actually. there are ways to remove the css (eg: http://www.javascriptkit.com/javatutors/loadjavascriptcss2.shtml ) but it doesn't work in IE

Under what circumstances do you want to do this? Don't have control over the page?

0


a source


Put the content you don't want to style in an iframe, then the title will still be displayed on the page, but the styles won't be inherited.

0


a source






More articles: