css script werkt niet.
Pagina: « vorige 1 2 3 volgende »
De huidige inhoud van die map kan je verhuizen naar een andere directory, bijv. 'demo'.
Gewijzigd op 18/09/2020 14:18:46 door - Ariën -
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
Als dit het pad is met de css map en het index.html bestand :
Code (php)
1
C:\xampp\htdocs\www
zal het css bestand niet geladen worden omdat in de webpagina wordt verwezen naar :
Code (php)
1
<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 :
Code (php)
1
<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
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.
Zet de bestanden eens op je pa3cvi server zodat anderen er een blik op kunnen werpen.
Toevoeging op 19/09/2020 19:46:18:
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)
Heb je de map css en het bestand styles.css wel beiden met kleine letters op de server staan?
Wat weet jij nu van mijn situatie om zo'n hard commentaar te geven. Als jij werkelijk wist van de "hoed en de rand", hier, zou jij je schamen voor zulk commentaar, tenminste als het woord schaamte in jouw woordenboek voorkomt. **Knip **
Toevoeging op 19/09/2020 20:14:49:
San The, jazeker, alles in kleine letters.
Gewijzigd op 19/09/2020 21:14:41 door - Ariën -
Edit:
Of je houdt je in, Cees, en legt eventueel het verhaal uit? Maar dit is niet de manier hoe wij hier op het forum met elkaar omgaan!
Gewijzigd op 19/09/2020 21:13:04 door - Ariën -
Dat gezegd hebbende, indien je voor het CSS-bestand een relatief pad gebruikt, dan moet je zorgen dat het CSS-bestand zich ook relatief bevindt ten opzichte van het bovenstaande HTML-document.
Een makkelijke check om beide in 1x te controleren is het volgende: druk, terwijl je op de betreffende HTML-pagina zit op Ctrl-U (de sneltoets voor het bekijken van de broncode). De meeste browsers hebben een redelijk geavanceerde broncode-viewer die je toelaat om op links te klikken. Klik in de broncode op /css/styles.css. Als het goed is krijg je nu de broncode van je CSS-bestand te zien. Indien je de nieuwe wijzigingen niet ziet druk je op (Ctrl-)F5, dit zorgt ervoor dat de broncode, en daarmee je CSS, wordt ververst. Indien je niet je CSS-bestand te zien krijgt, maar een standaard "pagina niet gevonden" pagina houdt dit in dat het CSS-bestand zich niet op deze positie bevond, of dat deze een andere naam heeft.
Cees
Toevoeging op 20/09/2020 00:41:07:
Dat laatste was het geval Thomas, ik zoek verder.
Bedankt, Cees
EDIT
Met die initiële slash geeft je aan dat het CSS-bestand zich direct onder de webroot bevindt, onder het mapje /css, dus bijvoorbeeld onder C:\htdocs\css\styles.css. Maar als je zowel het HTML-bestand alsook het CSS-bestand in een testmap zet (bijvoorbeeld C:\htdocs\test\index.htm en C:\htdocs\test\css\styles.css) dan klopt de verwijzing niet meer, want dit is geen relatieve verwijziging vanaf het HTML-document, maar een relatieve verwijziging vanaf de webroot. Wat je dus bij wijze van test nog zou kunnen proberen (indien het CSS-bestand tov het HTML-bestand in de submap css zit) is het verwijderen van de initiële slash van de href, dus css\styles.css in plaats van \css\styles.css. Vervolgens kun je de broncode van HTML+CSS inspecteren (en verversen) op de eerder beschreven wijze.
En anders zul je iets anders moeten proberen, bijvoorbeeld het instellen van een basisdirectory voor je documenten met behulp van de base-tag. Of ons wat meer uitleg moeten geven waar alles staat.
Gewijzigd op 20/09/2020 22:43:09 door Thomas van den Heuvel
Al eerder heb ik het eens geprobeerd met een interne CSS code en dat gaf wel het goede resultaat.
Met de externe css code zag ik al gauw in de broncode dat het css\styles.css bestand niet gevonden werd.
Jouw duidelijke informatie gaf de oplossing en bij mij ziet het er nu zo uit:
C:\HDMI_CSS\css_exp.html
C:\xampp\htdocs\css\"de css code"
HDMI:
<link href="css/styles.css" type="text/css" rel="stylesheet"/>
Fijn is het, te constateren, dat mijn editor, XAMPP, en eigen website de css code verwerken.
Bedankt Thomas, en alle andere members, voor de tijd die aan mij besteed is.
Cees.
Hoe roep je dit bestand aan in je browser? Waarschijnlijk niet met http://localhost/etc want via die weg is dat HTML-bestand waarschijnlijk niet vindbaar.
Waarom zet je beide bestanden niet gewoon onder C:\xampp\htdocs en roep je de webpagina aan via localhost zodat ook alles via je lokale webserver geserveerd wordt? Dat lijkt mij een stuk logischer en weerspiegelt ook beter de situatie wanneer je dit alles op een gegeven moment online zet.
Op die manier kun je ook alles beter testen, waar uiteindelijk deze webserver mede voor bedoeld was?
Beide bestanden stonden en staan in :
C:\xampp\htdocs\css\"css code"
C:\xampp\htdocs\css_exp02.html
Ik activeer het opgeslagen .html bestand om het resultaat te zien.
file:///C:/xampp/htdocs/css_exp02.html, maar dat is is niet correct.
Wil je mij nog even "leren" op hoe ik in de browser http://localhost/??? kan aanroepen.
Piece of cake!
Als je http://www.phphulp.nl kan invoeren dan lukt http://localhost ook. Enige verschil is dat 'localhost' lokaal is, en enkel op jouw eigen pc benaderbaar is.
En dat geldt ook voor je bestanden in /htdocs: http://localhost/bla.html. Maar zulke absolute URL's moet je altijd vermijden, tenzij je het in de base-tag definieert.
Gewijzigd op 21/09/2020 22:18:22 door - Ariën -
Deze is via configuratie gekoppeld aan (de externe URL) http://localhost/.
Indien je dus een HTML-document genaamd css_exp02.html direct onder deze publieke webdirectory hebt staan kun je deze via je webserver opvragen/laten serveren via http://localhost/css_exp02.html.
De begrippen "intern pad" en "extern pad" zul je waarschijnlijk wel vaker gaan tegenkomen.
Een intern pad (of directory) is het (vaak volledige) pad via welke bestanden en directories bereikbaar zijn voor de eigen interne/lokale programmatuur en configuratie.
Het externe pad is het pad via welke bestanden via de webserver toegankelijk/opvraagbaar zijn voor externe programma's zoals browsers.
Het "via de webserver" is hier van belang. Sommige bestanden, zoals een PHP-bestand, dienen aan de webserverkant nog verwerkt te worden zodat deze (meestal) omgezet worden naar (delen van) HTML-documenten. Maar wanneer je deze bestanden dus rechtstreeks opvraagt via het interne pad dan sla je de webserver over en ontvang je de rauwe PHP-documenten, en niet de verwerkte variant.
Om dit alles te stroomlijnen is het handig en vaak ook wenselijk om alles via de webserver te laten lopen. Zelfs als je platte HTML-documenten hebt die geen verdere verwerking aan de webserverkant nodig hebben, lijkt het mij toch verstandiger -als je toch al een webserver gebruikt- om deze via de webserver zelf (http://localhost) te serveren / op te vragen, en dit niet via file:// of wat dan ook te doen.
NB Normaal gesproken heb je vanaf een externe locatie sowieso geen rechtstreekse toegang tot de machine waarop de webserver actief is, dus op dat apparaat bestanden proberen te benaderen via een interne directory-aanroep is dan uberhaupt geen optie.
Gewijzigd op 22/09/2020 00:03:33 door Thomas van den Heuvel
Pagina: « vorige 1 2 3 volgende »