ローカルコンピュータのCSSで@ font-faceを呼び出す

私は自分のコンピュータにローカルフォントファイルフォルダを持っています。私はそれを私のCSSで呼び出そうとしています。私は@fontfaceを使用していますが、私はここで正しくすべてをやっているIMが私のCSSだと知りません。どんな助けでも大いに義務づけられます。ありがとう。ローカルコンピュータのCSSで@ font-faceを呼び出す

@font-face { 
 
    font-family: "CrimsonText-BoldItalic"; 
 
    src: local("C:\Users\joel.CDF\Desktop\depot square\Crimson_Text.ttf"); 
 

 
} 
 
@font-face { 
 
    font-family: "PT_Sans-Web-Bold"; 
 
    src: url("C:\Users\joel.CDF\Desktop\depot square\PT_Sans.ttf"); 
 
} 
 

 

 
#mainheadercontent { 
 
    margin-top: 8%; 
 
    text-shadow: 3px 4px 5px #000; 
 
     font-family: "CrimsonText-BoldItalic"; 
 
} 
 
#mainheaderbutton { 
 
    margin-top: 1%; 
 
    font-family: "PT_Sans-Web-Bold"; 
 

 
}

<body> 
 
    <div class="container-fluid main-content"> 
 
    <div class="row"> 
 
     <div class="col-md-12"> 
 
     <div id="carousel-example-generic" class="carousel slide" data-ride="carousel"> 
 
      <ol class="carousel-indicators"> 
 
      <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li> 
 
      <li data-target="#carousel-example-generic" data-slide-to="1"></li> 
 
      <li data-target="#carousel-example-generic" data-slide-to="2"></li> 
 
      </ol> 
 
      <div class="carousel-inner"> 
 
      <div class="item active"> 
 
       <img src="images/venue2.png" alt="First slide" class="img-responsive"> 
 
       <div class="carousel-caption"> 
 
       <h3></h3> 
 
       <p> 
 
       </p> 
 
       </div> 
 
      </div> 
 
      <div class="item"> 
 
       <img src="images/mainimg01.png" alt="Second slide"class="img-responsive"> 
 
       <div class="carousel-caption"> 
 
       <h3> 
 
           </h3> 
 
       <p> 
 
       </p> 
 
       </div> 
 
      </div> 
 
      <div class="item"> 
 
       <img src="images/mainimg01.png" alt="Third slide"class="img-responsive"> 
 
       <div class="carousel-caption"> 
 
       <h3> 
 
           </h3> 
 
       <p> 
 
       </p> 
 
       </div> 
 
      </div> 
 
      </div> 
 
      <a class="left carousel-control" href="#carousel-example-generic" data-slide="prev"> 
 
      <span class="glyphicon glyphicon-chevron-left"></span> 
 
      </a><a class="right carousel-control" href="#carousel-example-generic" data-slide="next"><span class="glyphicon glyphicon-chevron-right"> 
 
         </span></a> 
 
     </div> 
 
     <div class="main-text hidden-xs"> 
 
      <div class="col-md-12 text-center"> 
 
      <h1> 
 
         <img src="images/dslogo1.png" alt="depot square"></h1> 
 
      <h1 id="mainheadercontent"> 
 
         Your elegant and affordable destination<br>for family, business and community events. 
 
        </h1> 
 
      <div class="button" id="mainheaderbutton"> 
 
       <a class="btn btn-clear btn-sm btn-min-block" href="http://www.jquery2dotnet.com/">MORE ABOUT US</a><a class="btn btn-clear btn-sm btn-min-block" href="http://www.jquery2dotnet.com/">CHECK AVAILABILITY</a> 
 
      </div> 
 
      </div> 
 
     </div> 
 
     </div> 
 
    </div> 
 
    </div> 
 
    <div id="push"> 
 
    </div>

出典

2016-05-06 CDF Distributors

よく見えます。期待した結果が得られていませんか？ –

私はフォントスタイルと大胆さを得ています。イタリック体ではありません。クリムゾンのテキストのために私は傾けるptのサンズの太字のための何かを得るように思われる。 –

あなたのCSSの構文を使用すると、local()を使用する方法については間違っています。 local()を使用して、ユーザーのコンピュータにインストールされているフォントを呼び出します。

あなたはクリムゾンテキストを呼び出すと、それはこのようなものになります。これは、ちょうど（あなたの質問から仮定）ローカルで動作するはずですが、あなたはすべてのコンピュータ間で解決策を探しているならば、私は」

@font-face { 
    font-family: MyFont; 
    src: url(ExampleFont.ttf); 
    font-weight: bold; 
}

を私の質問を編集します。 Crimsonテキストではlocal()しか使用していないため、PT Sansは正しく読み込まれます。

local()機能の使用を強くお考えの場合は、hereをご覧ください。

出典

2016-05-06 21:00:52

ローカルコンピュータのCSSで@ font-faceを呼び出す

答えて

関連する問題