css script werkt niet.
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?
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<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);}
<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
Gewijzigd op 14/09/2020 17:05:56 door - Ariën -
En zet die } eens netjes op een volgende regel zodat ze boven elkaar staan?
Gewijzigd op 14/09/2020 17:09:25 door - Ariën -
Staat die code allemaal in 1 bestand? Dat is namelijk niet de bedoeling.
Je css moet in een apart bestand genaamd "styles.css" en dat bestand plaats je dan in een mapje "css".
Code (php)
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
body {
font-family: arial;
background-color: rgb(185,179,175);
}
h1 {
color: rgb (255,255,255);
}
font-family: arial;
background-color: rgb(185,179,175);
}
h1 {
color: rgb (255,255,255);
}
Ik begrijp nu ook de betekenis van link href commando.
Ariel: De accolade staat nu netjes overzichtelijk op zijn plaats.
bedankt beiden voor de informatie.
Cees.
Code (php)
1
<!doCtYpE htML >
Zie: https://html.spec.whatwg.org/multipage/syntax.html#the-doctype
Gewijzigd op 15/09/2020 09:30:53 door Ad Fundum
<!DOCTYPE html>
<html>
<head>
<title>Externe CSS gebruiken 1</title>
<link href="css/styles.css" type="text/css"
rel="stylesheet"/>
</head>
<body>
</body>
</html>
De code, styles.css,staat nu in een aparte map, met de naam: css.
De hoofdmap ik ik: les genoemd
Map structuur van mij is: les/css.
Ook geprobeerd les/www/css
Het lijkt erop dat de CSS code in de: <link href="css/styles.css" type="text/css" niet wordt gevonden,
want het resultaat is, dat de tekst er wel staat maar de kleuren ontbreken.
hier het styles.css code in de css map:
body {
font-family: arial;
background-color: rgb(185,179,175);
}
h1 {
color: rgb (255,255,255);
}
In je index.html zet je:
<link href="/css/styles.css" type="text/css" rel="stylesheet"/>
(er staat een extra slash voor css)
Ik activeer het index.html bestand en zie in de browser het volgende adres: file:///G:/html/index.html.
Doe ik daar iets verkeerd? De bestanden staan op mijn G-schijf in de map HTML.
Werkt het misschien dan pas als ik de bestanden met FTP naar mijn website stuur, zou dat het zijn?
Toevoeging op 16/09/2020 23:21:08:
Ik heb het geheel met FTP naar mijn website url overgezet, en ook dan zie ook alleen de tekst verschijnen.
Ik gok sterk dat je het lokaal via file: in de browser aanroept, en dat is geen hosting.
Wel zie ik dat http://www.pa3cvi.nl/css/styles.css niet bestaat.
Edit: nu wel
Gewijzigd op 16/09/2020 23:45:24 door - Ariën -
Heb dat gecorrigeerd en nu werkt het wel.
Toch jammer dat je alleen via je eigen website kunt kijken of de code werkt. Binnen de editor kan ik dat niet zien.
XAMPP, lijkt me wel wat complex om deze te gebruiken, zou wel ideaal zijn.
Nou tot zover erg bedankt voor allen die mij geholpen hebben.
Cees
Een kwestie van installeren, Apache in het Control Panel aanzetten en via http://localhost kan je jouw pagina's en PHP-scripts uitvoeren. Deze plaats je in /htdocs.
Idealiter lijkt jouw (lokale) ontwikkelwebserver zoveel mogelijk op de live webserver zodat je niet voor de onaangename verrassing komt te staan dat je alles lokaal succesvol hebt getest, en dan blijkt nadat je alles live hebt gezet dat er een heleboel dingen niet kloppen.
Zou jij wat gedetailleerder kunnen beschrijven hoe ik de local webserver aan de praat krijg. Ik zie het Controle Panel inmiddels voor mij, met de diverse modules als opties. Hoe nu verder?
- Ariën - op 17/09/2020 00:05:56:
...en via http://localhost kan je jouw pagina's en PHP-scripts uitvoeren. Deze plaats je in /htdocs.
Gewijzigd op 18/09/2020 12:56:09 door - Ariën -
Cees vdL op 14/09/2020 22:04:23:
Ariel: De accolade staat nu netjes overzichtelijk op zijn plaats.
Cees vdL op 18/09/2020 12:15:04:
Ik heb toch nog een vraag aan Arian.
Hij heet Ariën.