Własna czcionka na stronę


(hatezit) #1

Witam,

Zanim założyłem ten temat, czytałem tu i na innych forach, stronach o tym ale chyba przykłady są niekompletne, bo nie działają. Chodzi mi aby dołączyć czcionkę którą ściagnąłem z jednej strony.

Mam trzy katalogi css, fonts i page. W katalogu page jest strona na której chce wyświetlać tekst.

dalej idąc, napisalem w css przykład jaki wyczytałem  z tych przykładów o to kod:

@font-face{
font-family: 'fontDigital';
src:local('../fonts/digital-7.ttf') format('truetype');
}
.test_font {
margin-top: 100px;
font-family: 'fontDigital';
font-size: 16px;
}

i wywołuję klasę

Tu przykładowy tekst

i nie działa. W katalogu css jest plik css.  W katalogu fonts, to czcionka którą pobrałem i narazie chce aby to lokalnie działało. nawet gdy zmienię z url na local też nic nie daje.

 

jak to powinno wyglądać?


(kostek135) #2

Możesz podać całą zawartość pliku *.html?


(Jim1961) #3

Nie napisałeś czy nie działa font, czy ogólnie style - czy "przykładowy tekst" jest wielkości 16px ??

local nie służy do podpinania plików, tylko do wpisania nazwy fonta (ewentualnie) zainstalowanego lokalnie na kompie.

Tak to ma wyglądać - zwróć uwagę gdzie przecinek, a gdzie średnik:

@font-face {
  font-family: Delicious;
  src: url(Delicious-Roman.eot);
  src: local('Delicious'),
    url('Delicious-Roman.otf') format('opentype'),
    url('Delicious-Roman.ttf') format('truetype'),
    url('Delicious-Roman.svg#Delicious-Roman') format('svg');
}

(hatezit) #4

Proszę bardzo, o to zawartośc pliku html

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 Strict//EN" "DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
<head>
  <meta http-equiv="Content-type" content="application/xhtml+xml; charset=utf-8" />
  <meta name="Author" content="RP" />
  <meta name="Description" content="Informacje na serio." />
  <meta name="Keywords" content="informacje, wiadomości," />
  <meta name="Robots" content="all" />
  <title>Strona </title>
  <link rel="stylesheet" href=" ../css/style.css " type="text/css" />

</head>
<body>
<div id="blok">
<div id="logo_dp"></div>

<div class="belka">
  <div class="bltyt">Ups! Nie ma! :(</div>
   <div class="naw">
   <a href="../index.html"><< Wstecz</a>
   </div>

<div class="test_font">To jest test w 2014 roku!</div>

</div>
<!-- blok stopki -->
 <div id="footer">
  <div id="block_ft">
   <div class="id_info">
    <div><a href="#">O stronie</a></div>
    <div><a href="#"> Kontakt</a></div>
   </div>
  </div>
 </div>

</div>
</body>
</html>

Zainstalowalem czcionkę w systemie i działa, ale nie działa jako czcionka w pliku. Musiałem dać do czcionek w panelu strerowania. A przecież chcę aby strona  miała swoją czcionkę.


(kostek135) #5

Odtworzyłem strukturę katalogów i plików, którą podałeś. Pobrałem jakiś font i dopasowałem mu nazwę by odpowiadał temu z pliku .css. Nie zgadniesz... wszystko działa.


(Jim1961) #6

A na jakiej przeglądarce to sprawdzasz ??


(hatezit) #7

Firefox, a kod w css do fontu jaki mam to wyżej w pierwszym poście dałem i nie działa.


(Jim1961) #8

Naciśnij  CTRL+SHIFT+K (Dla twórców witryn > Konsola WWW) i potem przełącz się do zakładki "Sieć". U dołu masz filtry odpowiedzialne za wszystkie Requesty. Sprawdź czy jakiś plik nie jest na czerwono.


(hatezit) #9

OK napisałem inaczej o tak:

@font-face {
font-family: "LetDigital";
src: url('../fonts/Let_s_go_Digital_Regular.ttf') format('truetype');
}

h1 {
text-align: center;
font: 74px "LetDigital";
}

I działa, Błąd jaki popełniłem to taki, że nie powinienem dawać spacji między format a ('truetype') czyli bez odstępu. I w powyższym też tak będzie i będzie działać o ile poprawię, bo jest bez spacji a klasę musze poprawić..