I never see Computer Modern font, the one shipped as default for LaTeX type setting system, on any webpage.
How to change the CSS so that font will actually work?
Computer Modern is a 'Didone', or modern serif font, a genre that emerged in the late 18th century as a contrast to the more organic designs that preceded them. Didone fonts have high contrast between thick and thin elements, and their axis of "stress" or thickening is perfectly vertical.
CSS lets you use custom fonts, downloadable fonts on your website. You can download the font of your preference, let's say myfont. ttf , and upload it to your remote server where your blog or website is hosted.
Yes it is! It's well-designed as a text font, and it has small caps and text figures.
Using the Computer Modern font in webpages has become very easy! Just paste the following lines of CSS code in the head section of your html code in order to activate the sans-serif version of that font.
<style type="text/css"> @font-face { font-family: "Computer Modern"; src: url('http://mirrors.ctan.org/fonts/cm-unicode/fonts/otf/cmunss.otf'); } @font-face { font-family: "Computer Modern"; src: url('http://mirrors.ctan.org/fonts/cm-unicode/fonts/otf/cmunsx.otf'); font-weight: bold; } @font-face { font-family: "Computer Modern"; src: url('http://mirrors.ctan.org/fonts/cm-unicode/fonts/otf/cmunsi.otf'); font-style: italic, oblique; } @font-face { font-family: "Computer Modern"; src: url('http://mirrors.ctan.org/fonts/cm-unicode/fonts/otf/cmunbxo.otf'); font-weight: bold; font-style: italic, oblique; } body { font-family: "Computer Modern", sans-serif; } </style>
Note that the solution here makes the browser load the current version of the fonts from a CTAN mirror, which can be very slow. This is okay for testing purposes, but in the long run I'd recommend you download these .otf files to your own webserver.
You can just insert the https://cdn.rawgit.com/dreampulse/computer-modern-web-font/master/fonts.css
css-stylesheet into your html header. Like this:
<head> <!-- ... --> <link rel="stylesheet" type="text/css" href="https://cdn.rawgit.com/dreampulse/computer-modern-web-font/master/fonts.css"> <style> body { font-family: "Computer Modern Sans", sans-serif; } </style> </head>
You can use the font for production websites with any amount of traffic. Files are served via MaxCDN's super fast global CDN. There is no traffic limits or throttling.
The README.md on Github
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With