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

Kurs HTML odc 3 - strona nie obsługuje niczego

VPS Starter Arubacloud
0 głosów
275 wizyt
pytanie zadane 8 października 2018 w HTML i CSS przez Paweł Szewczyk Obywatel (1,410 p.)
edycja 8 października 2018 przez Paweł Szewczyk

Mam problem z kodem z odcinka 3 kursu HTML. Nie wiem czemu ale plik HTML nie możne odczytać mi treści znajdującej się w CSS stad na stronie ma tylko treść HTML bez CSS. Wszystkie pliki są zapisane w odpowiednich formatach. Czy jest to błąd z mojej strony?  (Oczywiście wstawienie pliku z CSS do <style> działa ale nie jest to najwygodniejsze i najbardziej estetyczne)

 

//Html
<!DOCTYPE HTML>
<html lang="pl">
<head>
	<meta charset="utf-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
	
	<title>Jan Kowalski - Portfolio</title>
	
	<meta name="description" content="Stworzę dla Ciebie wyjątkową stronę www! Zatrudnij programistę webowego: PHP, JavaScript, HTML, CSS, MySQL, WordPress, Joomla, Drupal." />
	<meta name="keywords" content="zamów, stronę, tworzenie, www, programista, portfolio, php, javascript, html, css, WordPress, Joomla, Drupal" />
	
	<link rel="stylesheet" href="style.css" type="text/css" />
	<link rel="stylesheet" href="css/fontello.css" type="text/css" />
	<link href='http://fonts.googleapis.com/css?family=Lato|Josefin+Sans&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
	
</head>
<body>
	<div id="container">
	
		<div class="rectangle">
			<div id="logo">Jan Kowalski</div>
			<div id= "zegar">12:00:00</div>
			<div style="clear:both;"></div>
		</div>
	
		<div class="square">
			<div class="tile1">1</div>
			<div class="tile1">1</div>
			<div style="clear:both;"></div>
			
			<div class="tile2">2</div>
			<div class="tile3">3</div>
			<div style="clear:both;"></div>
			
			<div class="tile4">4</div>
			
		</div>	
		<div class="square">
			<div class="tile5">5</div>
			<div class="yt">yt</div>
			<div class="fb">fb</div>
			<div class="gplus">gplus</div>
			<div class="tw>tw</div>
		</div>
		
		<div style ="clear:both;"></div>
		
		<div class="rectangle">2015 &copy; Jan Kowalkis zaprasza do współpracy</div>
		
	</div>

</body>

</html>
// Css
body
{
	background-color: #303030;
	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;
}
.squer
{
	width: 50%;
	float: lef;
}
#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;
}
.tile1
{
	margin:10px;
	width: 230px;
	height: 142px;
	background-color: #3095d3;
	float: left;
}
.tile2
{
	margin:10px;
	width: 230px;
	height: 142px;
	background-color: #666666;
	float: left;
}
.tile3
{
	margin:10px;
	width: 230px;
	height: 142px;
	background-color: #93c748;
	float: left;
}
.tile4
{
	margin:10px;
	width: 480px;
	height: 142px;
	background-color: #ee5a32;
	
}
.tile5
{
	margin:10px;
	width: 480px;
	height: 304px;
	background-color: #666666;
	
}
.yt
{
	margin:10px;
	width: 105px;
	height: 142px;
	background-color: #d94348;
	float: left;
}.fb
{
	margin:10px;
	width: 105px;
	height: 142px;
	background-color: #7668b3;
	float: left;
}.gplus
{
	margin:10px;
	width: 105px;
	height: 142px;
	background-color: #d95333;
	float: left;
}.tw
{
	margin:10px;
	width: 105px;
	height: 142px;
	background-color: #3095d3;
	float: left;
}

 

komentarz 8 października 2018 przez Milesq Nałogowiec (32,020 p.)
Sprawdź w konsoli czy nie ma błędów ;)
komentarz 8 października 2018 przez Paweł Szewczyk Obywatel (1,410 p.)
jestem dość nowy o jakiej konsoli mówisz ?
komentarz 8 października 2018 przez imklau Nałogowiec (42,090 p.)

chodzi o konsolę przeglądarkową. Jak sobie klikniesz "zbadaj element" to wtedy otwiera się ta konsola. Ewentualnie możesz to zrobić skrótem, np w Firefoxie Ctrl + Shift + C  (chyba) :).

komentarz 8 października 2018 przez niezalogowany
Włącz wyśietlanie rozszeżeń i sprawdź czy nie zapisałeś jako style.css.txt
komentarz 8 października 2018 przez Milesq Nałogowiec (32,020 p.)

@Paweł Szewczyk,  no coż html,css to technologie webowe, prawda? więc informacje o błedach typu nie znalezienia pliku - wyświetlają się w konsoli js (w chrome Ctrl + Shift + i). Podstawowe narzędzie do debugowania ;-)

3 odpowiedzi

0 głosów
odpowiedź 8 października 2018 przez pablop76 VIP (123,060 p.)
Są różne możliwości. Albo ścieżka do pliku niepoprawna albo nazwa pliku, lub obydwie. Może błąd składni. Pokaz strukturę plików.

Do css też jest odpowiedni bloczek, więc wstaw analogicznie jak html
0 głosów
odpowiedź 8 października 2018 przez Szycha Gaduła (4,650 p.)
Sprawdź w jakim folderze znajduję się plik css
komentarz 8 października 2018 przez Paweł Szewczyk Obywatel (1,410 p.)
w tym samym co plik .html
0 głosów
odpowiedź 8 października 2018 przez Domeltr Początkujący (440 p.)
Kiedy odpalisz swoją stronę, możesz kliknąć prawym przyciskiem myszy i wybrać "Pokaż źródło", lub coś w tym stylu zależnie od przeglądarki. Wtedy kliknij na link do stylów i zobacz czy wyświetli się on w przeglądarce. Jeżeli nie, to znaczy że jest błędnie wpisałeś nazwę, lub lokalizację pliku :) Zajmie to parę sekund, a zawsze zyskasz pewność czy to nie jakiś prosty błąd. Sprawdź też czy pliku style.css, nie ma ukrytego rozszerzenia .txt

Podobne pytania

0 głosów
1 odpowiedź 236 wizyt
pytanie zadane 6 stycznia 2020 w Nasze projekty przez Gościnnie Nowicjusz (150 p.)
0 głosów
1 odpowiedź 211 wizyt
pytanie zadane 27 września 2018 w Nasze poradniki przez Nikodem Lipinski Nowicjusz (200 p.)
0 głosów
1 odpowiedź 430 wizyt
pytanie zadane 25 sierpnia 2018 w HTML i CSS przez FiQu Nowicjusz (150 p.)

92,452 zapytań

141,262 odpowiedzi

319,080 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!

...