Wie führt man CSS-Stile in das CI-Framework ein?-CSS-Tutorial-php.cn

Wie führt man CSS-Stile in das CI-Framework ein?

王林

Freigeben： 2024-01-16 10:33:06

Original

659 Leute haben es durchsucht

Wie führt man CSS-Stile in das CI-Framework ein?

Die Einführungsmethode von CSS-Stilen im CI-Framework erfordert spezifische Codebeispiele

CI (CodeIgniter) ist ein leichtes PHP-Framework, das häufig bei der Entwicklung von Webanwendungen verwendet wird. Um der Webseite einen guten Stil und ein gutes Layout zu verleihen, müssen wir im CI-Framework CSS-Stile einführen. In diesem Artikel wird die Methode zur Einführung von CSS-Stilen im CI-Framework vorgestellt und spezifische Codebeispiele bereitgestellt.

1. CSS-Stile direkt in die Ansichtsdatei einführen

Im CI-Framework ist die Ansichtsdatei (Ansicht) für die Darstellung der HTML-Seite verantwortlich. Wir können CSS-Stile direkt in die Ansichtsdatei einfügen, um das Erscheinungsbild und Layout der Seite zu ändern. Im Folgenden sind die spezifischen Schritte aufgeführt:

Im CI-Framework werden Ansichtsdateien im Allgemeinen im Verzeichnis application/views gespeichert. Daher müssen wir in diesem Verzeichnis eine neue Ansichtsdatei erstellen und sie example_view.php nennen. application/views目录下。因此，我们需要在该目录下创建一个新的视图文件，并命名为example_view.php。
在example_view.php文件中，添加以下代码：

<!DOCTYPE html>
<html>
<head>
    <title>示例页面</title>
    <link rel="stylesheet" type="text/css" href="<?php echo base_url('css/styles.css'); ?>">
</head>
<body>
    <h1>这是一个示例页面</h1>
    <p>这是一段示例内容。</p>
</body>
</html>

Nach dem Login kopieren

在上述代码中，我们使用了<link>标签来引入CSS样式表。其中，href属性的值是通过base_url()函数动态生成的，指向css/styles.css文件。这里假设CSS样式文件存放在CI框架的根目录下的css文件夹中。

接下来，我们需要在CI框架的控制器文件中指定加载该视图文件。打开application/controllers目录下的对应控制器文件，例如Example.php，在该文件中添加以下代码：

class Example extends CI_Controller {
    public function index() {
        $this->load->view('example_view');
    }
}

Nach dem Login kopieren

在上述代码中，index()方法用于加载example_view.php视图文件。

最后，在浏览器中输入CI框架的URL，例如http://localhost/ci/index.php/example，即可看到具有CSS样式的示例页面。

二、使用CI框架的资源加载器

除了直接在视图文件中引入CSS样式外，CI框架还提供了一个资源加载器（Loader）的功能，用于加载CSS样式表、JavaScript文件等资源。以下是具体的步骤：

首先，在application/config/autoload.php文件中，找到以下代码并修改为：

$autoload['helper'] = array('url');

Nach dem Login kopieren

在上述代码中，我们将url助手库添加到自动加载的助手列表中，以便在视图文件中使用base_url()函数。

在控制器文件中，无需再手动调用资源加载器，只需将视图文件中的引入CSS样式的代码修改为以下形式：

<!DOCTYPE html>
<html>
<head>
    <title>示例页面</title>
    <?php echo link_tag('css/styles.css'); ?>
</head>
<body>
    <h1>这是一个示例页面</h1>
    <p>这是一段示例内容。</p>
</body>
</html>

Nach dem Login kopieren

在上述代码中，我们使用了link_tag()函数来动态生成<link>标签，并加载css/styles.css

Fügen Sie in der Datei example_view.php den folgenden Code hinzu:

rrreee

<link>

href

base_url()

css/styles.css

css

Als nächstes müssen wir die Ansichtsdatei angeben, die in die Controller-Datei des CI-Frameworks geladen werden soll. Öffnen Sie die entsprechende Controller-Datei im Verzeichnis application/controllers, z. B. Example.php, und fügen Sie der Datei den folgenden Code hinzu:

rrreee🎜Im obigen Code index() wird verwendet, um die Ansichtsdatei example_view.php zu laden. 🎜

http://localhost/ci/index.php/example

application/config/autoload.php

Die URL-Hilfsbibliothek

base_url()

link_tag()

<link>

css/styles.css

Das obige ist der detaillierte Inhalt vonWie führt man CSS-Stile in das CI-Framework ein?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!