I want to use Helvetica in a font-family list like
font-family: 'Helvetica', Arial, sans-serif;
Thing is that sometimes I notice that people put Helvetica in quotes and sometimes they don't.
Can anyone shed light on why ?
It really is just a matter of preference, as there are no spaces like in "Times New Roman" the quotes are completely optional, Just a matter of what they are used to...
Quotes are necessary only when font name contains whitespaces. Even W3C don't quote Helvetica.
Quotes enable multi word font names, like 'Sans Serif' or 'Times New Roman'.
Since Helvetica is a single word, quotes are not necessary.
Related
Originally my website uses two Google fonts, i.e., Montserrat and Lato. To reduce the load time for these fonts, I replace them with web safe fonts Georgia and Arial.
It is obviously that the English texts in the websites are changed.
However, I notice that the Chinese texts are also changed.
So I go back to Google fonts and check if their fonts have Chinese subset:
https://fonts.google.com/?query=Montserrat&subset=chinese-simplified
https://fonts.google.com/?query=Lato&subset=chinese-simplified
All returns empty.
So, how can know what will they be in Chinese characters?
And why the replacement of the fonts will also change the Chinese characters?
BTW: I find the way to specify the font for different languages: Can CSS choose a different default font and size depending on Language
Update:
The original font family(for headings and menu items):
font-family: Montserrat;
replaced with:
font-family: 'Georgia', 'Verdana', 'Arial', serif, sans-serif;
The original font family(for paragraph texts):
font-family: Lato;
replaced with:
font-family: 'Arial', 'Helvetica', 'Tahoma', 'Times New Roman', sans-serif, serif;
I found people wrote CSS like
h1 {font-family: "Helvetica Neue"}
h1 {font-family: 'Helvetica Neue'}
h1 {font-family: 'Roboto'}
h1 {font-family: Roboto}
I saw most of the people use ' more and 'Roboto' more than Roboto.
Is there even any tiny difference?
BTW, I asked this question because I saw this on Google Fonts:
If there's no difference, why does Google bother adding a ' in it?
You can always put a specific font family name in quotes, double or single, so Roboto, "Roboto", and 'Roboto' are equivalent. Only the CSS-defined generic font family names like sans-serif must be written without quotes.
Contrary to popular belief, a font name consisting of space-separated names such as Helvetica Neue need not be quoted. However, the spec recommends “to quote font family names that contain white space, digits, or punctuation characters other than hyphens”
How do I make the plus sign more bold? Bolding the "+" makes little to no difference compared to the text.
#plus_bold, #text_bold {
font-weight: bold;
}
http://jsfiddle.net/qe2em/
You can try "heavy Greek cross", http://www.fileformat.info/info/unicode/char/271a/index.htm
Or plus sign from FontAwesome: http://fortawesome.github.io/Font-Awesome/icon/plus/
Later one is more correct if you use it as an icon.
You can try to change the font-family
#plus_bold, #text_bold{
font-weight: 900;
font-family: "Lucida Grande", tahoma, arial, sans-serif;
}
here is how it looks JsFiddle
You can use a different font family. The design of glyphs in bold typefaces varies by font family. For example, in Times New Roman, the most common browser default font, the stroke width of bold “+” is almost identical with that of regular “+” (and typically the difference gets lost in rasterization) unless the font size is fairly large, 18pt or more. In Arial, there is a visible difference even in 11pt size.
The choice of fonts should of course be made after careful consideration of many aspects, and the boldness of a bold “+” is probably among the lesser details.
You can do font-weight:900; which is bolder than bold (700). 900 is the maximum; besides that, you'd have to actually change the font size.
I have a #font-face in use. It's a Hebrew font by definition. When I switch to English in mid sentence (which is sometimes necessary) I get something which is entirely unconnected to the original font I'm using.
It seems, as the browser recognizes the font, the rule stops there, i.e.
#font-face {
font-family: MySans, sans-serif;
}
It recognizes MySans, which is sans-serif, but for latin letters it would use a default, Times New Roman or something, which is serif, and not fall back to the sans-serif I gave him.
Is there a way to define this to work conveniently? <span>-ing every English insert is not convenient, by the way.
Would defining multiple fonts in the font-family property help at all? When the first font isn't available, it falls back on the next font, and so on until it either finds one that works or goes to the default.
Try something like:
font-family: MySans, Arial, Trebuchet MS, sans-serif;
and let me know if that works!
This question already has answers here:
Do I need to wrap quotes around font family names in CSS?
(3 answers)
Closed 9 years ago.
When should the value for CSS 'font-family' have quotes around it?
I've seen both font-family: arial and font-family: "arial".
As a specific example, I declare a font this way:
#font-face {
font-family: 'entypo';
font-style: normal;
font-weight: 400;
src: url('/css/fonts/entypo.woff') format('woff');
}
What would be the correct CSS to have an element use this font-family?
You only need quotes when the font itself has a space such as "Times New Roman".
Arial does not need quotes, but some people use quotes such as "Arial" to be more consistent. It is simply personal preference.
Seen in Justin's below comment: font-family: times new roman; works without quotes (JSFiddle).
You can call your new #font-face using font-family: 'entypo'; as you would normally expect. (link)
Just going to answer from this:
http://www.w3.org/TR/CSS2/fonts.html#font-family-prop
To avoid mistakes in escaping, it is recommended to quote font family names that contain white space, digits, or punctuation characters other than hyphens:
body { font-family: "New Century Schoolbook", serif }
Font family names that happen to be the same as a keyword value ('inherit', 'serif', 'sans-serif', 'monospace', 'fantasy', and 'cursive') must be quoted to prevent confusion with the keywords with the same names.
By the CSS 2.1 spec, a font name needs to be in quotes if it contains characters other than identifier characters (which is a broader concept than just “Ascii letters and digits”) and spaces. So font-family: foo bar is correct, and so is e.g. font-family: entypo of course.
Coding style is a different issue. It is always correct to quote a specific font family name (as opposite to generic names like sans-serif), so font-family: "entypo" is correct, too.
Very theoretically, a font name also needs to be quoted if a specific font family name coincides with a generic name (I don’t think anyone ever created such a font) or if its name contains leading or trailing spaces or consecutive spaces (but no one in his sense would name his font that way).