ホームページ > 記事 > ウェブフロントエンド > CI フレームワークで CSS スタイルを参照する手順の詳細な説明
チュートリアル: CSS スタイルを CI フレームワークに導入する詳細な手順。具体的なコード例が必要です。
Web アプリケーションの開発において、スタイルは非常に重要です。一部。 CSS (Cascading Style Sheets) を使用して Web ページを美しくし、より良いユーザー エクスペリエンスを提供します。 CodeIgniter (CI) フレームワークを使用して開発する場合、CSS スタイルを正しく導入する方法が特に重要です。この記事では、CI フレームワークに CSS スタイルを導入する詳細な手順を紹介し、具体的なコード例を示します。
まず、CI フレームワークのリソース フォルダーに新しい CSS ファイルを作成する必要があります。 CI フレームワークの「assets」ディレクトリに新しいフォルダーを作成して、CSS ファイルを保存できます。 CSS ファイルを「assets/css」ディレクトリに保存し、「style.css」という名前の CSS ファイルを作成すると仮定します。このファイルでは、背景色、テキスト サイズ、境界線などのさまざまなスタイルを定義できます。
/* style.css */ body { background-color: #f1f1f1; } h1 { color: #333; font-size: 24px; } .button { background-color: #d32f2f; color: #fff; padding: 10px 20px; border: none; cursor: pointer; }ステップ 2: CI のリソース パスを構成する
CI フレームワークは、デフォルトでリソース ファイルのパスを構成しています (通常は「applicationconfigconfig.php」ファイル内)。ファイルを開いて、次のコード行を見つけます。
$config['base_url'] = '';
これを次のように変更します。
$config['base_url'] = 'http://your-domain.com';
「your-domain.com」を Web アプリケーションの実際のドメイン名に置き換えます。 ステップ 3: CSS ファイルをビュー ファイルに導入する
次に、作成した CSS ファイルをビュー ファイルに導入する必要があります。 CI フレームワークでは、組み込みの base_url()
関数を使用してリソース ファイルを導入できます。ビュー ファイルが「application/views/welcome_message.php」であると仮定して、ファイルの
タグ内に次のコード行を追加します。
<link rel="stylesheet" type="text/css" href="<?php echo base_url('assets/css/style.css'); ?>">
このコード行先ほど作成した CSS ファイルにリンクします。 ステップ 4: CSS ファイルをロードする
最後に、CSS ファイルを CI フレームワークのコントローラー ファイルにロードする必要があります。コントローラー ファイルでは、CI フレームワークによって提供される $this->load->helper()
および
を使用できます。 CSSファイルを読み込み、ファイルを表示する機能。以下は、コントローラー ファイルの名前が「application/controllers/Welcome.php」であると仮定したサンプル コントローラー ファイルです: <pre class='brush:php;toolbar:false;'><?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Welcome extends CI_Controller {
public function index() {
$this->load->helper('url');
$this->load->view('welcome_message');
}
}</pre>
この例では、$this->load-> を渡します。 helper('url')
関数は、base_url()
関数を使用できるように、CI フレームワークの URL ヘルパーをロードします。次に、ビュー ファイル「welcome_message.php」が
関数を通じてロードされます。
以上がCI フレームワークで CSS スタイルを参照する手順の詳細な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。