2012-01-29 27 views
2

Django WebアプリケーションにUbuntuフォントを使用する予定です。私はここにフォントをダウンロードした:http://font.ubuntu.com/。これまで私はGoogle APIにリンクを張ってフォントを有効にすることができました。このコードをHTMLファイルに貼り付けてください。<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Ubuntu:regular,bold&subset=Latin">Webアプリケーションでubuntuフォントを使用する

ただし、Webアプリケーションのサーバーはインターネットに接続されません。これは内部でのみ使用されるためです。上記の方法はまだこのように機能しますか?そうでない場合は、ダウンロードしたフォントをWebアプリケーションに埋め込むにはどうしたらいいですか?

+0

Nullableは良い点を示します。クライアントはinterentに接続していますか? – Joe

答えて

1

実際にフォントからどのフォントが必要ですか?

それは同じくらい簡単です: http://fonts.googleapis.com/css?family=Ubuntu:regular,bold,italic リターン:

@media screen { 
@font-face { 
    font-family: 'Ubuntu'; 
    font-style: italic; 
    font-weight: normal; 
    src: local('Ubuntu Italic'), local('Ubuntu-Italic'), url('http://themes.googleusercontent.com/static/fonts/ubuntu/v4/kbP_6ONYVgE-bLa9ZRbvvvesZW2xOQ-xsNqO47m55DA.woff') format('woff'); 
} 
} 
@media screen { 
@font-face { 
    font-family: 'Ubuntu'; 
    font-style: normal; 
    font-weight: normal; 
    src: local('Ubuntu'), url('http://themes.googleusercontent.com/static/fonts/ubuntu/v4/_xyN3apAT_yRRDeqB3sPRg.woff') format('woff'); 
} 
} 
@media screen { 
@font-face { 
    font-family: 'Ubuntu'; 
    font-style: normal; 
    font-weight: bold; 
    src: local('Ubuntu Bold'), local('Ubuntu-Bold'), url('http://themes.googleusercontent.com/static/fonts/ubuntu/v4/0ihfXUL2emPh0ROJezvraD8E0i7KZn-EPnyo3HZu7kw.woff') format('woff'); 
} 
} 

は「SRC」プロパティで見られるように、使用したいWOFFファイルのそれぞれをダウンロードして、あなたの静的なディレクトリにこれらを配置し、あなたのURLと一致するようにCSSの 'src' URLを変更してください。 http://themes.googleusercontent.com/static/fonts/ubuntu/v4/_xyN3apAT_yRRDeqB3sPRg.woff /static/ubuntu_normal.woff

で 場所にそれをして、次のCSS作成:

EGは、通常のフォントのために、あなたがダウンロードする必要があります

@media screen { 
@font-face { 
    font-family: 'Ubuntu'; 
    font-style: normal; 
    font-weight: normal; 
    src: local('Ubuntu'), url('/static/ubuntu_normal.woff') format('woff'); 
} 
} 

をあなたはをそれぞれ追加する必要があります太字、イタリックなどのフォントスタイルまたはフォントフェース。

1

CSSはクライアント側で実行されます。クライアントがインターネットに接続されている限り、動作します。

関連する問題