• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Kurs HTML odc. 3 Niewyświetlające się webfonty na localhost

VPS Starter Arubacloud
0 głosów
870 wizyt
pytanie zadane 3 września 2017 w HTML i CSS przez czlowiek.gnot Nowicjusz (200 p.)
edycja 4 września 2017 przez czlowiek.gnot

Mam problem z localhostem, po przerzuceniu folderu do htdocs i wpisaniu w pasku wyszukiwania adresu localhost/www strona wyświetla się bez webfontów, oprócz tego nie działają przyjazne linki zdefiniowane w pliku .htaccess.

Dodam, że webfonty działają jeśli odpalę plik index.html bezpośrednio z folderu htdocs. Jak rozwiązać ten problem? Pracuje na systemie operacyjnym mac OS Sierra, a XAMPP mam w wersji 7.1.8.0

E: przyjazne linki ogarnąłem, ale nadal mam problem z webfontami, wygląda to tak:

komentarz 3 września 2017 przez EdeX Mądrala (5,110 p.)
Przyjazne linki nie działają na localhost

1 odpowiedź

0 głosów
odpowiedź 3 września 2017 przez Jedras Maniak (54,860 p.)
Problem ze ścieżkami? Pokaż jak masz zdefiniowane.
komentarz 3 września 2017 przez czlowiek.gnot Nowicjusz (200 p.)
edycja 4 września 2017 przez czlowiek.gnot


 <!DOCTYPE HTML>
<html lang="pl">
<head>
	<meta charset="utf-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
	<title>Bartosz Łuczak - Portfolio</title>
	<meta name="description" content="Stworzę dla Ciebie wyjątkową stronę www. Zatrudnij programistę webowego: PHP, javaScript, HTML, CSS, MySQL, WordPress, Joomia, Drupal" />
	<meta name="keywords" content="zamów, stronę, www, tworzenie, programista, portfolio, php, javasrcipt, html, css, mysql, wordpress, joomia, drupal" />
	<link rel="stylesheet" href="style.css" type="text/css" />
	<link rel="stylesheet" href="css/fontello.css" type="text/css" />
	<link href="https://fonts.googleapis.com/css?family=Josefin+Sans|Lato&amp;subset=latin-ext" rel="stylesheet">
</head>

<body>
	<div id="container"> 

		<div class="rectangle">
			<a href="zatrudnij-programiste-webowego" class="tilelinkhtml5"><div id="logo">Bartosz Łuczak</div></a>
			<div id="zegar">12:00:00</div>
			<div style="clear: both;"></div> 
		</div>

		<div class="square">
			<div class="tile1">
				<a href="kim-jestem" class="tilelink"><i class="icon-user"></i><br />Kim jestem?</a>
			</div>	
			<a href="oferta-tworzenie-stron-www" class="tilelinkhtml5">
				<div class="tile1">
					<i class="icon-laptop"></i><br />Co oferuję?
				</div>
			</a>
			<div style="clear: both;"></div>
			
			<div class="tile2">
				<a href="cv-programista-php-javascript" class="tilelink"><i class="icon-graduation-cap"></i><br />Curriculum Vitae</a>
			</div>
			
			<div class="tile3">
				<a href="kontakt-programista-php" class="tilelink"><i class="icon-mail"></i><br />Kontakt ze mną</a>
			</div>
			
			<div style="clear: both;"></div>
			
			<div class="tile4">
				<i>Talk is cheap. Show me the code!</i><br />- Linus Torvalds, twórca Linuxa
			</div>
		</div>  
		
		<div class="square">
			<div class="tile5">
				Tytuł podstrony<br /><br />
				Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, nisl eu rutrum congue, enim neque convallis dolor, et interdum sem tortor at dolor. Duis ullamcorper aliquet augue quis bibendum. Integer sodales blandit turpis non malesuada. Nam sodales molestie diam. Lorem ipsum dolor sit amet, consectetur adipiscing elit. 	
			</div>
			<div class="yt">
				<a href="http://youtube.com" target="_blank" class="sociallink"><i class="icon-youtube"></i></a> 
			</div>
			<div class="fb">
				<a href="http://facebook.com" target="_blank" class="sociallink"><i class="icon-facebook"></i></a>
			</div>
			
			<div class="gplus">
				<a href="http://plus.google.com" target="_blank" class="sociallink"><i class="icon-gplus"></i></a>
			</div>
			<div class="tw">
				<a href="http://twitter.com" target="_blank" class="sociallink"><i class="icon-twitter"></i></a>
			</div>
			<div style="clear: both;"></div>
		</div>
		
		<div style="clear: both;"></div>
		<div class="rectangle">2017 &copy; Bartosz Łuczak - programista webowy zaprasza do współpracy! <i class="icon-mail-alt"></i> bartosz.luczak@adres.com</div>	
	</div>
</body>
</html>
body
{
	background-color: #404040;
	color: #ffffff;
	font-family: 'Lato', sans-serif;
	font-size: 20px; 
}

#container
{
	width: 1000px;
	margin-left: auto;
	margin-right: auto;
}

.rectangle
{
	width: 960px;
	margin: 20px;
	text-align: center; 
}

.square
{
	width: 50%;
	float: left;	 
}

#logo
{
	float: left;
	font-family: 'Josefin Sans', sans-serif;
	font-size: 70px; 
	width: 600px;
	text-align: left;
}

#zegar
{
	float: left;
	font-family: 'Josefin Sans', sans-serif;
	font-size: 70px;
	text-align: left;
}

.tile1
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #3095d3;
	float: left;
	text-align: center;
}

.tile1:hover
{
	background-color: #2085c2;
}

.tile2
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #666666;
	float: left;
	text-align: center;
}

.tile2:hover
{
	background-color: #555555;
}

.tile3
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #93c748;
	float: left;
	text-align: center;
}

.tile3:hover
{
	background-color: #82b637;
}

.tile4
{
	margin: 10px;
	width: 420px;
	height: 82px;
	background-color: #ee5a32;
	text-align: center;
	font-sive: 26px;
	padding: 30px;
	line-height: 150%;
}

.tile5
{
	margin: 10px;
	width: 420px;
	height: 244px;
	background-color: #666666; 
	text-align: justify;
	padding: 30px;
}

.yt
{
	margin: 10px;
	width: 105px;
	height: 142px;
	background-color: #d94348;
	float: left;
}

.yt:hover
{
	background-color: #c83237;
}

.fb
{
	margin: 10px;
	width: 105px;
	height: 142px;
	background-color: #4668b3 ;
	float: left;
}

.fb:hover
{
	background-color: #3557a2;
}

.gplus
{
	margin: 10px;
	width: 105px;
	height: 142px;
	background-color: #d95333;
	float: left;
}

.gplus:hover
{
	background-color: #b84222;
}

.tw
{
	margin: 10px;
	width: 105px;
	height: 142px;
	background-color: #3095d3;
	float: left;
}

.tw:hover
{
	background-color: #2084b2;
}

a.tilelink
{
	color: #ffffff;
	text-decoration: none;
	display: block;
	width: 230px;
	height: 142px;
}

a.tilelinkhtml5 
{
	color: #ffffff;
	text-decoration: none;
}

a.sociallink
{
	color: #ffffff;
	text-decoration: none;
	display: block;
	width: 105px;
	height: 142px;
}

 

Podobne pytania

0 głosów
2 odpowiedzi 539 wizyt
pytanie zadane 4 kwietnia 2017 w HTML i CSS przez Agata Kolber Nowicjusz (220 p.)
0 głosów
6 odpowiedzi 1,614 wizyt
0 głosów
2 odpowiedzi 1,091 wizyt

92,453 zapytań

141,262 odpowiedzi

319,086 komentarzy

61,854 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...