The jQuery Mobile framework uses Helvetica, Arial, and Sans Serif fonts by default. This recipe shows how to include and use other fonts in your app.
Copy the full code of this recipe from the code/10/custom-font
source folder. The Komika TrueType Font
used in this recipe is available in the code/resources/font
folder. The Syncopate Web Font
is used from the Google Web Fonts site. You can launch this code using the URL: http://localhost:8080/10/custom-font/main.html
.
Create
main.html
, and add the link to the Syncopate Google web font stylesheet, as follows:<link rel='stylesheet' href='http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.css' /> <link rel='stylesheet' href='http://fonts.googleapis.com/css?family=Syncopa te:400,700'/>
Define style classes to use the two custom fonts in the
<style>
tag:<style> h1 {font-family: 'Syncopate', sans-serif; } .divstyle {font-family: 'Syncopate'; font-weight: 400...