2016-09-30 12 views
-3

hello geniusプログラマー。あなたは一つのファイル私は1つに、すべてのCSSファイルを結合したいすべてのcssファイルを1つのファイルにまとめます。

<link type='text/css' rel='stylesheet' href='css/header.css' /> 
    <link type='text/css' rel='stylesheet' href='css/body.css' /> 
    <link type='text/css' rel='stylesheet' href='css/sidebar.css' /> 
    <link type='text/css' rel='stylesheet' href='css/footer.css' /> 

にこれにすべてのCSSファイルを結合するために私を助けることができます。 例:

<link type='text/css' rel='stylesheet' href='css/all.css' /> 
+0

すべてをコピーして1つのファイルに貼り付けます。 –

+0

各cssファイルのすべてのテキストをコピーし、 'all.css'ファイルに貼り付けます。すべてが終わった。 –

+0

しかし、私は私のウェブサイトの各部分が異なるCSSファイルにあるようなフォーマットになりたい..上の私のコードのように.. – Ryan

答えて

0

あなたが一つにすべてのスタイルシートを組み合わせることができているラフ「n」の準備の方法は、以下のようなPHPスクリプトを作成し、stylehseetをロードする際にHTMLであることを使用することです。 HTMLで

<?php 

    /* all.php */ 

    header('Content-Type: text/css'); 

    $css=array('/css/header.css', '/css/body.css', '/css/sidebar.css', '/css/footer.css'); 
    $output=array(); 

    foreach($css as $file){ 
     $output[]=file_exists($file) ? file_get_contents($file) : '/* error: '.$file.' cannot be found */'; 
    } 
    echo implode(PHP_EOL, $output); 


?> 

PHPファイルではなく、の.cssファイルを含める
<link rel='stylesheet' href='/css/all.php' /> 
0

JavaScriptで自動的にタスクのこれらの種類を実行するためのいくつかのソリューションがあります。 Gulpまたはその他のtasks runnerをインストールできます。具体的には、これらのパッケージgulp-concat-cssをCSS連結にインストールすることができます。

インストール:

$ npm install --save-dev gulp-concat-css 

をあなたがあなたのgulpfile.jsにタスクを追加することができますインストールされると:実行

var gulp = require('gulp'), 
    concatCss = require('gulp-concat-css'); 

gulp.task('default', function() { 
    return gulp.src('css/**/*.css') 
     .pipe(concatCss('css/all.css')) 
     .pipe(gulp.dest('dist/')); 
}); 

これらのようになりますあなたのhtmlより
$ gulp 

<link type="text/css" rel="stylesheet" href="/dist/css/all.css" /> 
1

これはPHPで簡単に行うことができます。そして、それを行うことを含む、非常に正式な方法です。彼らのほとんどは、この方法だけをフォローアップしています。

styling.phpというPHPファイルを作成し、すべてのcssファイルをそのPHPファイルに含めることができます。その後、ファイルに含めることができます。次のコードを持つことができ、このファイルの下で

styling.php

<link type='text/css' rel='stylesheet' href='css/header.css' /> 
<link type='text/css' rel='stylesheet' href='css/body.css' /> 
<link type='text/css' rel='stylesheet' href='css/sidebar.css' /> 
<link type='text/css' rel='stylesheet' href='css/footer.css' /> 

そしてPHPファイルで、あなたはinclude()

include()の助けを借りて、このように呼び出すことができます - ザ・文は指定されたファイルが含まれており、評価しています。

ファイルは、指定されたファイルパスに基づいてインクルードされます。指定されていない場合、include_pathが指定されます。ファイルがインクルードパスに見つからない場合、インクルードは最後に呼び出し元のスクリプトのディレクトリと現在の作業ディレクトリをチェックしてから失敗します。インクルードコンストラクトは、ファイルが見つからない場合に警告を出します。これはrequireとは異なる動作であり、致命的なエラーが発生します。

パスが定義されている場合、絶対パス(ドライブ文字またはWindowsの場合は\、Unix/Linuxシステムの場合は/)か、カレントディレクトリ(。または..で始まる)一緒に無視される。たとえば、ファイル名が..で始まる場合/の場合、パーサは親ディレクトリ内で要求されたファイルを検索します。

include()は警告のみ(E_WARNING)を生成し、スクリプトが

<html> 
<head> 
<?php include('styling.php'); ?> 
</head> 
<body> 
</body> 
</html> 

を継続していきますそして、あなたはpagesourceを表示したとき、それは別に、すべてのリンクが表示されます。

include()

ソリューションの一つの明確な理解のためのいくつかの詳細:


vars.php

<?php 
$color = 'green'; 
$fruit = 'apple'; 
?> 

test.phpを

を中フッターファイルを含めるには

<?php 
echo "<p>Copyright &copy; 1999-" . date("Y") . " W3Schools.com</p>"; 
?> 

<?php 
echo "A $color $fruit"; // A 
include 'vars.php'; 
echo "A $color $fruit"; // A green apple 
?> 

ソリューション二つ


たちはこのようになります "footer.php" と呼ばれる標準のフッターファイルを、持っていると仮定しますページを使用するには、includeステートメントを使用します。

<html> 
<body> 

<h1>Welcome to my home page!</h1> 
<p>Some text.</p> 
<p>Some more text.</p> 
<?php include 'footer.php';?> 

</body> 
</html> 

私の説明でもっと理解できるように。

関連する問題