16

Could anyone clarify the difference between single and double quotation marks in HTML5 & CSS.

Here's Google's contradictory use of single quotes in HTML:

<link href='https://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'>

And CSS:

font-family: 'Roboto', sans-serif;

While Bootstrap's documentation practices demonstrate the use of double quoted marks in HTML:

<link rel="stylesheet" href="https://cdn.rawgit.com/twbs/bootstrap/v4-dev/dist/css/bootstrap.css">

And CSS:

font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;

Which practice is the best and why ?

EDIT: Is there any valid reason why Google Fonts decided to use single quotes ?

j08691
  • 204,283
  • 31
  • 260
  • 272
vorststoom
  • 179
  • 1
  • 1
  • 5

3 Answers3

30

Either are valid, but you probably should stick to a certain style guide. For example, Google's style guide suggest using double quotes for HTML and single quotes for CSS. (Although Google Fonts doesn't follow this exactly)

cocoa
  • 3,806
  • 7
  • 29
  • 56
9

There's no best practice, because neither has any affect at all on how the code is parsed. You can deliminate attributes and other strings using ' or " interchangeably.

Aeolingamenfel
  • 2,399
  • 1
  • 15
  • 22
3

Generally, no difference. They are interchangeable.

The only important note is not to use one inside itself.

For example in php:

echo '"hello world"';

Outputs - "hello world"

Or

echo "'hello world'";

Outputs 'hello world'

BUT

echo ""hello world"";

Will throw an error if the " is unescaped, as it's closing that parameter before the contents.

Doooder
  • 169
  • 1
  • 13