web-dev-qa-db-ja.com

フォントファミリラトの使用方法

Font-family latoの使用方法

私はこのようなスタイルを使用していますが、動作していません。どのようにできるのか ？ありがとうございました。

font-family: Lato, Helvetica, sans-serif;

リンク： http://www.google.com/fonts/specimen/Lato

cssfont-familygoogle-font-api
46
user3274579

このコードをheadセクションに入れてください

<link href='http://fonts.googleapis.com/css?family=Lato:400,700' rel='stylesheet' type='text/css'>

cSSでfont-family: 'Lato', sans-serif;を使用します。例えば：

h1 {
    font-family: 'Lato', sans-serif;
    font-weight: 400;
}

または手動で使用することもできます

fontSquiralから.ttfフォントを生成します

このオプションを試すことができます

    @font-face {
        font-family: "Lato";
        src: url('698242188-Lato-Bla.eot');
        src: url('698242188-Lato-Bla.eot?#iefix') format('embedded-opentype'),
        url('698242188-Lato-Bla.svg#Lato Black') format('svg'),
        url('698242188-Lato-Bla.woff') format('woff'),
        url('698242188-Lato-Bla.ttf') format('truetype');
        font-weight: normal;
        font-style: normal;
}

このように呼ばれます

body {
  font-family: 'Lato', sans-serif;
}
69
Kumar

here からダウンロードしてLatoOFL.rarを抽出し、TTFに移動してこれを開きます font-face-generatorChoose Fileをクリックして、使用するフォントを選択します使用して生成時にクリックし、ダウンロードしてからhtmlファイルを開いて開くと、次のようなコードが表示されます

@font-face {
        font-family: "Lato Black";
        src: url('698242188-Lato-Bla.eot');
        src: url('698242188-Lato-Bla.eot?#iefix') format('embedded-opentype'),
        url('698242188-Lato-Bla.svg#Lato Black') format('svg'),
        url('698242188-Lato-Bla.woff') format('woff'),
        url('698242188-Lato-Bla.ttf') format('truetype');
        font-weight: normal;
        font-style: normal;
}
body{
    font-family: "Lato Black";
    direction: ltr;
}

srcコードを変更し、このフォントディレクトリが配置されているURLを指定すると、Webサイトで使用できるようになります...

ダウンロードしたくない場合は、これを使用してください

<link type='text/css' href='http://fonts.googleapis.com/css?family=Lato:400,700' />
13
user2727841