Comment introduire des feuilles de style CSS externes dans le framework CI ?

Comment utiliser des styles CSS externes dans le framework CI, des exemples de code spécifiques sont requis

Introduction :
CI (CodeIgniter) est un framework de développement PHP léger largement utilisé pour créer des applications Web. Lors du développement d'applications Web, les styles CSS externes jouent un rôle essentiel, nous aidant à embellir la page et à améliorer l'expérience utilisateur. Cet article explique comment utiliser les styles CSS externes dans le framework CI et fournit des exemples de code spécifiques.

1. Créer un fichier CSS :
   Tout d'abord, nous devons créer un fichier CSS qui définit les styles que nous souhaitons appliquer à la page Web. Dans le framework CI, nous pouvons stocker les fichiers CSS dans un dossier spécifié, par exemple, nous les stockons dans le dossier "assets/css". Créez un fichier CSS appelé "styles.css" et placez-le dans ce dossier.
2. Chargement de fichiers CSS :
   Dans le framework CI, nous pouvons utiliser des extraits de code pour charger des fichiers CSS dans les fichiers de vue. Dans le fichier de vue qui doit utiliser les styles CSS, utilisez le code suivant pour charger le fichier CSS :

<link rel="stylesheet" href="<?php echo base_url();?>assets/css/styles.css">

Dans le code ci-dessus, nous utilisons la fonction base_url() pour obtenir l'URL de base définie dans CI, puis référençons le Fichier CSS via cette URL.

Dans le framework CI, vous devez vous assurer d'avoir défini "base_url", qui peut être défini dans le fichier de configuration CI.

3. Application des styles CSS :
   Maintenant que nous avons chargé avec succès le fichier CSS, nous pouvons commencer à appliquer des styles. Sur l'élément HTML du fichier de vue, nous pouvons utiliser l'attribut class ou id pour sélectionner les styles CSS.

Par exemple, si nous voulons ajouter du style à un bouton, nous pouvons utiliser l'attribut class sur l'élément HTML et définir les règles de style correspondantes dans le fichier CSS. Supposons que nous ayons un élément bouton dans le fichier de vue, nous pouvons ajouter le code suivant :

<button class="btn">Click me</button>

Ensuite, dans le fichier CSS, nous pouvons ajouter le code suivant pour définir le style du bouton :

.btn {
  background-color: #f44336;
  color: white;
  padding: 10px 20px;
  border: none;
  border-radius: 5px;
  cursor: pointer;
}

Dans le code ci-dessus, nous utilisons le sélecteur de classe pour sélectionner un élément de bouton avec la classe "btn" et définir des règles de style pour celui-ci. Lorsqu'un utilisateur ouvre une page Web contenant le bouton, celui-ci apparaît avec un fond rouge, du texte blanc et une bordure arrondie.

En ajoutant plus de règles CSS, nous pouvons définir les styles de plus d'éléments et obtenir des effets de page plus riches et plus attrayants.

Résumé :
L'utilisation de styles CSS externes dans un framework CI est très simple. Tout d'abord, nous devons créer un fichier CSS et le placer dans le dossier spécifié. Ensuite, chargez le fichier CSS à l'aide de la balise Enfin, nous pouvons sélectionner le style correspondant en ajoutant des attributs class ou id aux éléments HTML et définir des règles de style dans le fichier CSS. De cette façon, nous pouvons facilement appliquer des styles CSS externes aux pages Web du framework CI pour obtenir des interfaces utilisateur belles et attrayantes.

J'espère que les exemples de code spécifiques fournis dans cet article vous aideront à utiliser des styles CSS externes dans votre framework CI. Je vous souhaite de meilleurs résultats dans le développement d'applications Web !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!