Hi all, just learning CSS now and was wondering how much if any using an external CSS sheet slows down your site? Does it just load once and its done, or is it referred to as your navigating the page? For like hovering etc?

Thanks,
BD

Part of the reason that CSS is so efficient is that it is cached (saved in memory) by your browser. This means that if one external stylesheet is shared throughout the site, it won't have to be constantly referred to throughout the browsing process.

This also comes in handy when changing things dynamically with JavaScript. Often, in JavaScript, we are changing CSS properties in one of two ways: either by modifying the inline styles or simply changing the class name. Changing the class name is always going to be faster, since those particular styles are already being held in memory.

edit: looks like wayfarer07 beat me to it

Browsers store the stylesheet in their cache so it is only called up once which means the more design/decoration you store in your stylesheet, the less information would be called upon everytime someone goes through your website resulting in a fast loading website

Definitely go with an external stylesheet.

Inline styles and internal stylesheets are fine for abnormal pages that don't fit within the consistency of your website. For example; you decide that your blue navigation is gonna be red just for one page; then in this case, an internal or inline style would be appropriate.

I've only got into CSS myself and already see how superior it is to the convential way of designing a website.

Inline styles and internal stylesheets are fine for abnormal pages that don't fit within the consistency of your website. For example; you decide that your blue navigation is gonna be red just for one page; then in this case, an internal or inline style would be appropriate.

It's not always wrong to use an inline style, but I still use external styles, even for an instance like this. I do it by defining a unique class on the body tag, to identify each page. Then, if I wanted the navigation to be blue for that page, I would do something like this:

CSS

.unique_page #navigation {
background-color: red;
}

Thanks for the replies guys, appreciate the info.