What Does '' Do in a CSS Link

What does '?' do in a Css link?

That is there to add some uniqueness to the filename, so that when they change the CSS file, they can change the extra bit to be totally sure that every client will reload the CSS rather than use a cached version.

The webserver will ignore the parameter and serve /Content/all.min.css normally

Note: While it's possible the CSS is dynamically generated, this is a common idiom for ensuring a reload, and given the parameter is a date, it seems quite likely.

Edit: Podcast 38 mentioned this...

We’ve been using the Expires or
Cache-Control Header since we
launched. This saves the browser
round-trips when getting infrequently
changing items, such as images,
javascript, or css. The downside is
that, when you do actually change
these files, you have to remember to
change the filenames. A part of our
build process now “tags” these files
with a version number so we no longer
have to remember to do this manually.

What does a[href^= ... ] do in CSS?

a[href^="http:"]

Selects an <a> element whose href attribute value begins with http:.

For example:

p[title^="para"] {background: green;}

Will match the following:

<p title="paragraph"> This paragraph should have a green background. </p>

Link CSS from another folder?

If your current folder is /current/folder/location/index.html, and your .css file is in /current/second/folder/style.css, then use this as an example:

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

or alternatively:

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

However, if the second file is in `/current/folder/second/style.css, then use:

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

What does link tag do besides including stylesheets?

I know two prominent common uses:

With rel="stylesheet" to reference external CSS style sheets
With rel="favicon" to reference browser favicons

Additionally, there are

Forward and reverse links (rel="next")
Links to alternative resources for search engines (rel="alternate")

Check the W3C Reference: Links in HTML documents for details on stylesheet, and the latter two.

what does link href= # do?

Probably some stylesheet that is to be loaded later on.

CSS: a:link vs just a (without the :link part)

:link selects unvisited links, that is: anchors with an href attribute which have not been visited by the browser (for whatever definition the browser vendor has for "visited").

If it has :link then it will never match <h1><a name="foo">A foo to be linked to</a></h1>

(Although you should be using <h1 id="foo">A foo to be linked to</h1> these days.)

Aside from that, it does make it clearer what it is for.

a         { color: orange }a:link    { color: blue }    a:visited { color: indigo }  a:hover   { color: green } a:active  { color: lime }

  <a>my anchor without href</a>  <br><br>  <a href="http://somelinkhere.com">my anchor without href</a>

What does appending ?v=1 to CSS and JavaScript URLs in link and script tags do?

These are usually to make sure that the browser gets a new version when the site gets updated with a new version, e.g. as part of our build process we'd have something like this:

/Resources/Combined.css?v=x.x.x.buildnumber

Since this changes with every new code push, the client's forced to grab a new version, just because of the querystring. Look at this page (at the time of this answer) for example:

<link ... href="http://sstatic.net/stackoverflow/all.css?v=c298c7f8233d">

I think instead of a revision number the SO team went with a file hash, which is an even better approach, even with a new release, the browsers only forced to grab a new version when the file actually changes.

Both of these approaches allow you to set the cache header to something ridiculously long, say 20 years...yet when it changes, you don't have to worry about that cache header, the browser sees a different querystring and treats it as a different, new file.

CSS Link Not Working or Something

You should should structure your folder like this:

folder
├──── index.html
├──── menu.css
└──── script.js

And then reference the css file like this:

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

If you simply write the name of the file, like href="menu.css", it will find a file in the same directory with the name menu.css.

If you add a slash before it, like href="/menu.css" it will go up as far as it can in the file tree and use the file there.

If you add ../ before it, like href="../menu.css" it will go up one folder and use the file there.

How to insert javascript function in css link tag

There is no similar syntax in javascript for dropping variables into the html like you can in PHP. In order to dynamically load a CSS file in javascript, you would need to create a link element and append it to the head. Something like this:

function loadCssFile(filename){
  var linkElement=document.createElement("link");
  linkElement.setAttribute("rel", "stylesheet");
  linkElement.setAttribute("type", "text/css");
  linkElement.setAttribute("href", filename);
  document.getElementsByTagName("head")[0].appendChild(linkElement);
}

var url = 'https://'+getServerIP()+'/path/to/cssFiles/file1.css';
loadCssFile(url);

What Does '' Do in a CSS Link