1
votes

Feuille de style Bootstrap non appliquée

sur certaines de mes pages, j'ai inclus bootstrap.

Maintenant sur une page, j'ai une alerte incluse, stylée par bootstrap.

C'est aussi simple que ça:

XXX

De plus, avant, le fichier css Bootstrap est inclus:

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

bootstrapcss est acheminé vers le bon fichier css .

Dans l'onglet réseau, vous pouvez voir que le chargement du bootstrap fonctionne correctement:

Screenshot

Mais aussi, vous pouvez voyez, que même s'il est en cours de chargement, aucune classe n'est appliquée.

Maintenant, si je change l'inclusion de bootstrap en CDN, cela fonctionne et les classes sont parfaitement appliquées.

Maintenant Je n'ai aucune idée du problème, car comme vous pouvez le voir, bootstrap est en cours de chargement et dans les deux cas, il se charge, mais uniquement lors du chargement à partir du CDN, les styles sont appliqués.

Toutes les idées pourquoi ?

Modifier: après avoir essayé, si je charge le CSS via le répertoire ect lien au lieu de sur le routeur, cela fonctionne. Dans un autre fichier, la même ligne fonctionne parfaitement bien cependant, donc le routage semble fonctionner correctement (ce que vous pouvez voir sur le fait que le fichier est également chargé)


7 commentaires

Je suppose que cela est dû à l'en-tête Content-type: text / css , comme cette question: CSS fichiers ignorés lors de l'utilisation du doctype HTML5


Vous avez raison, la console dit Ressource interprétée comme feuille de style mais transférée avec le type MIME text / html: "http: // localhost / bootstrapcss". .... comment puis-je définir manuellement le type de contenu alors?


@Kobi quand je supprime le DOCTYPE , alors le css semble être chargé correctement, même si l'avertissement dans la console reste


Vous devez ajouter l'en-tête HTTP dans le cadre de votre itinéraire, cela dépend de votre serveur. Il y a de fortes chances que cela fonctionne automatiquement si vous utilisez un hôte de fichier statique et un fichier .css et une URL.


Je ne trouve pas de moyen d'envoyer des en-têtes HTTP avec AltoRouter , qui est le plugin de routage que j'utilise ... Je vais probablement utiliser le chemin complet ou supprimer le DOCTYPE alors


Je ne supprimerais pas le doctype - il cassera probablement beaucoup de choses, et le bootstrap IIRC exige qu'il fonctionne correctement. Je vous suggère de publier une nouvelle question concernant l'en-tête et AltoRouter.


D'accord, merci, je vais faire ça :)


3 Réponses :


-2
votes

il vous manque l'extension de fichier en html

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


1 commentaires

Comme mentionné, le / bootstrapcss est acheminé vers le bon fichier css



0
votes

Vous avez oublié le point, vous devez aller avant la première barre oblique dans l'adresse du dossier:

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


3 commentaires

et encore une fois, comme mentionné, le / bootstrapcss est acheminé vers le fichier css correct


Pourriez-vous partager le fichier


La question est déjà résolue maintenant, je viens de publier la réponse d'un autre fil, le problème ne concernait pas le chemin, mais le routage, car le mauvais type MIME a été envoyé par le routeur.



0
votes

Comme suggéré et répondu dans un autre fil de discussion par Kobi, voici la réponse à la question:

En utilisant cet itinéraire:

$match = $router->match();


 if($match['name'] === 'bootstrapcss'){
    header("Content-Type: text/css");
    $fileName = $match['target'];
    echo file_get_contents($fileName);
    return; }

puis pendant la correspondance:

$router->map('GET','/bootstrapcss','example.css','bootstrapcss'); And

La réponse complète se trouve ici .

Merci encore pour l'aide!


0 commentaires