css script werkt niet.

Door Cees vdL op 14-09-2020 17:04 gewijzigd op 14-09-2020 17:05

8.506 views

Beste members, met het studie boek HTML&CSS probeer ik het CSS script onder de knie te krijgen.
Het wil maar niet lukken om dat werkend te krijgen.
Ik heb als eerste oefening een heel simpel script overgenomen voor het gebruik van extern CSS.
Het hele CSS script blijft na de uitvoering als tekst verschijnen, dus iets is er fout.
Ik zal het hele voorbeeld volgens het boekwerk hieronder laten zien, de tekst is natuurlijk niet relevant.

Ook begrijp ik niet de <link> tag, die zou de browser moeten vertellen waar het bestand te vinden is.
Misschien kan mij iemand daar mee helpen?


<DOCTYPE html>

<html>
	<head>
		<title>Externe CSS gebruiken 1</title>
		<link href="css/styles.css" type="text/css"
		rel="stylesheet"/>	
	</head>
	<body>
		<h1>aardappelen</h1>
		<p>veel verschillende</p>
</body>
</html>

body {
	font-family: arial;
	background-color: rgb(185,179,175);}
h1 {
	color: rgb (255,255,255);}

Heb ik een syntax foutje gemaakt of is de plaats van het CSS script verkeerd?
Alvast dank.
Cees

- Ariën -

18-09-2020 14:00

Klik de link/URL aan? Als het goed is verschijnt er in jouw browser een testpagina van XAMPP?

C Cees vdL

18-09-2020 14:07

http://localhost/dashboard/ venster dashboard verschijnt.

- Ariën -

18-09-2020 14:09 gewijzigd op 18-09-2020 14:18

Dan is het goed geïnstalleerd. In de directory /htdocs in je XAMPP-directory kan je jouw bestanden plaatsen. Net als bij een hosting. Omdat je lokaal werkt, is FTP niet nodig.

De huidige inhoud van die map kan je verhuizen naar een andere directory, bijv. 'demo'.

C Cees vdL

18-09-2020 14:29

Ah, dat wilde ik weten, hartstikke bedankt.

- Ariën -

18-09-2020 15:02

Graag gedaan :-)

C Cees vdL

19-09-2020 14:14

Hoi Arian,
toch nog problemen met de CSS toepassing. Nadat ik met de website zelf bezig was, heb ik in mijn URL even "Under Construction gezet.
Later heb ik nog eens met XAMPP Controle, Apache, MySQL modules geactiveerd, nog eens de vorige HTML/CSS oefening geprobeerd en weer werkt het niet. Ik zie wel de tekst in het Localhost venster, maar het CSS script werkt niet. Ik heb me suf gezocht en het hele HTML en CSS codes keer op keer gecontroleerd. Het ligt niet aan de Localhost, want via mijn eigen webserver zie ook alleen tekst. Hier nog eens de HTML code en de CSS code:

<!DOCTYPE html>

<html>
<head>
<title>CSS</title>
<link href="/css/styles.css" type="text/css" rel="stylesheet"/>
</head>
<body>
<h1>koptekst </h1>
<p>tekst</p>
</body>
</html>

CSS:

body {
font-family: arial;
background-color: rgb(185,179,175);
}

h1 {
color: rgb (255,255,255);
}

Mappen indeling:

C:\xampp\htdocs\www en de inhoud van www is: de map CSS en index.html
De inhoud van CSS is het bestandje styles.css

Onder Styles in het browser Inspectie veld staat onderstaande tekst, lijkt wel of het CSS niet gevonden kan worden?

element.style {
}
user agent stylesheet
html {
display: block;
}

Zie ik iets over het hoofd?

Cees

A Adoptive Solution

19-09-2020 16:14

Volgens de handleiding is htdocs de root van de webserver.

Als dit het pad is met de css map en het index.html bestand :

C:\xampp\htdocs\www

zal het css bestand niet geladen worden omdat in de webpagina wordt verwezen naar :

<link href="/css/styles.css" type="text/css" rel="stylesheet"/>

De map css moet buiten de www map staan.

Of je wijzigt de link in :

<link href="css/styles.css" type="text/css" rel="stylesheet"/>

Hier wat uitleg over relative and absolute urls.

https://stackoverflow.com/questions/2005079/absolute-vs-relative-urls

C Cees vdL

19-09-2020 18:23

XAMPP modules: Apache en MySQL actief

Ik heb de map samenstelling nu aan gepast: C:\xampp\htdocs\css. In "htdocs" staat ook de index.html
De link is: <link href="/css/styles.css" type="text/css" rel="stylesheet"/> , vanuit de root.
Je zou toch zeggen dat de css code nu aangesproken zal worden, jammer nee dus.

A Adoptive Solution

19-09-2020 19:08

Met de code is niets mis.
Zet de bestanden eens op je pa3cvi server zodat anderen er een blik op kunnen werpen.

[size=xsmall]Toevoeging op 19/09/2020 19:46:18:[/size]

Even tussendoor.
Als ik het begin van dit topic lees, krijg ik de indruk dat ik met een kind te maken heb dat uit een boek leert hoe je een webpagina maakt en verder nog niet zoveel weet.

Terwijl u al 15 jaar een webserver heeft.
En 10 jaar geleden maakte u al webpaginas mbv een WAMP server.
https://www.phphulp.nl/php/forum/topic/php-in-html/73353/

Je mag dus verwachten dat in die tijd toch wel vooruitgang is geboekt.

En gelieve niet het leeftijdargument gebruiken.(ja, op uw twitterbio staat dat u bent gepensioneerd)

- SanThe -

19-09-2020 20:04

Reageren

Inloggen om te reageren